/* tech/ — shell แบบ server-assembly.php */

/* Logo Corecasys — ขนาดให้พอดี header 74px (เหมือน server-assembly.php / index.php) */
.inner-brand img.brand-dark,
.inner-brand img.brand-light {
    width: auto;
    height: 36px;
    max-width: 160px;
}

.page-loader .double-bounce1,
.page-loader .double-bounce2 {
    background-color: #e65100;
}

/* Header ส้ม — ไม่มี hero/VDO */
.header.tech-header-orange {
    background: #e65100;
    background: linear-gradient(to left, #ffcc80, #e65100);
    border-bottom: none;
}

.header.tech-header-orange .inner-brand .brand-dark {
    display: none;
}

.header.tech-header-orange .inner-brand .brand-light {
    display: inline-block;
}

.header + .wrapper section.module.tech-content {
    padding-top: 94px;
}

section.module.tech-content {
    padding-bottom: 20px;
}

section.module.tech-content .post {
    padding-bottom: 15px;
    margin-bottom: 0;
    border-bottom: none;
}

.tech-sidebar { margin-bottom: 24px; }

.tech-sidebar-panel {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    margin-bottom: 16px;
    overflow: hidden;
}

.tech-sidebar-panel h3 {
    margin: 0;
    padding: 10px 14px;
    font-family: Kanit, Sarabun, sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    background: linear-gradient(to left, #ff9800, #e65100);
}

.tech-sidebar-panel h3 a {
    color: #fff;
    text-decoration: none;
}

.tech-sidebar-nav {
    list-style: none;
    margin: 0;
    padding: 8px 0;
}

.tech-sidebar-nav li {
    padding: 4px 14px;
}

.tech-sidebar-nav a {
    font-size: 14px;
    color: #333;
    text-decoration: none;
}

.tech-sidebar-nav a:hover { color: #e65100; }

.tech-page-bar,
.tech-main table tr td[bgcolor="#0000FF"],
.tech-main table tr td[bgcolor="#0000ff"] {
    background: linear-gradient(to left, #ff9800, #e65100) !important;
    color: #fff !important;
    padding: 10px 14px !important;
    border-radius: 4px;
    margin-bottom: 12px;
    font-family: Kanit, Sarabun, sans-serif;
    font-size: 14px;
    font-weight: 700;
    height: auto !important;
}

.tech-main table tr td[bgcolor="#0000FF"] font,
.tech-main table tr td[bgcolor="#0000ff"] font,
.tech-main table tr td[bgcolor="#0000FF"] b,
.tech-main table tr td[bgcolor="#0000ff"] b {
    color: #fff !important;
}

.tech-list-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 8px;
}

.tech-list-table th,
.tech-list-table td {
    padding: 10px 12px;
    border: 1px solid #eee;
    font-size: 14px;
    vertical-align: middle;
}

.tech-list-table th {
    background: #f5f5f5;
    font-weight: 600;
}

.tech-list-table tr:nth-child(even) td { background: #fafafa; }
.tech-list-table tr:hover td { background: #fff3e0; }

.tech-list-table .tech-no {
    color: #e65100;
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
}

.tech-list-table .tech-cat {
    text-align: center;
}

.tech-list-table a { color: #1565c0; text-decoration: none; }
.tech-list-table a:hover { text-decoration: underline; }

.tech-pagination {
    text-align: center;
    margin: 20px 0 8px;
    font-size: 14px;
}

.tech-pagination a {
    color: #e65100;
    text-decoration: none;
    margin: 0 2px;
}

.tech-pagination a:hover { text-decoration: underline; }

.tech-empty {
    color: #c62828;
    text-align: center;
    padding: 24px;
}

.tech-main form table {
    width: 100%;
    border-collapse: collapse;
}

.tech-main form input[type="text"],
.tech-main form input[type="password"],
.tech-main form textarea,
.tech-main form select {
    max-width: 100%;
    font-family: Kanit, Sarabun, sans-serif;
    font-size: 14px;
}

.tech-main input.button,
.tech-main input[type="submit"],
.tech-main input[type="reset"] {
    background: #e65100;
    color: #fff;
    border: none;
    padding: 8px 20px;
    border-radius: 3px;
    cursor: pointer;
    margin: 4px;
}

.tech-main input.button:hover,
.tech-main input[type="submit"]:hover { background: #bf360c; }

.tech-search-hint {
    text-align: center;
    font-family: Kanit, Sarabun, sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: #666;
    margin: 0 0 16px;
}

.tech-search-heading {
    font-family: Kanit, Sarabun, sans-serif;
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin: 0 0 10px;
}

.tech-search-heading img {
    vertical-align: middle;
    margin-right: 4px;
}

.tech-search-table {
    border-collapse: collapse;
}

.tech-search-form .tech-form-label {
    background: linear-gradient(to left, #ff9800, #e65100) !important;
    color: #fff !important;
    font-family: Kanit, Sarabun, sans-serif;
    font-size: 14px;
    font-weight: 700;
    text-align: right;
    padding: 8px 12px;
    white-space: nowrap;
    vertical-align: middle;
}

.tech-search-actions {
    text-align: center;
    margin-top: 16px;
}

.tech-search-form .tech-search-field {
    padding: 8px 0;
    vertical-align: middle;
}

.tech-search-form .tech-search-input,
.tech-search-form .tech-search-select {
    display: block;
    width: 80%;
    margin: 0 auto;
    box-sizing: border-box;
    height: 32px;
    font-family: Kanit, Sarabun, sans-serif;
    font-size: 14px;
}

.tech-search-form .tech-search-input {
    padding: 0 10px;
}

.tech-search-form .tech-search-select {
    padding: 0 10px;
    line-height: normal;
}

.footer.footer-orange-tone {
    background: #e65100;
    background: linear-gradient(to left, #ffcc80, #e65100);
}

.footer.footer-orange-tone .footer-bar,
.footer.footer-orange-tone .copyright p { color: #fff; }

.footer.footer-orange-tone .footer-social-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.footer.footer-orange-tone .footer-social-left,
.footer.footer-orange-tone .footer-social-right { flex: 0 0 75px; }

.footer.footer-orange-tone .footer-social-left { text-align: left; }
.footer.footer-orange-tone .footer-social-right { text-align: right; }
.footer.footer-orange-tone .copyright { flex: 1; text-align: center; }

.server-assembly-prefooter { background: #fff; text-align: center; }

.server-assembly-quick-links {
    background: #666;
    text-align: center;
    padding: 8px 15px;
    font-size: 13px;
    font-weight: bold;
    line-height: 1.6;
}

.server-assembly-quick-links a {
    color: #ff9900;
    text-decoration: none;
    font-weight: bold;
}

.server-assembly-quick-links a:hover { color: #ffcc00; }
.server-assembly-quick-links .sep { color: #fff; margin: 0 6px; }

/* read.asp — popup article */
body.tech-read-body {
    background: #f5f5f5;
    margin: 0;
    padding: 16px;
    font-family: Kanit, Sarabun, sans-serif;
}

.tech-read-wrap {
    max-width: 960px;
    margin: 0 auto;
    background: #fff;
    border-radius: 6px;
    box-shadow: 0 2px 12px rgba(0,0,0,.08);
    overflow: hidden;
}

.tech-read-meta {
    padding: 12px 20px;
    background: #fff3e0;
    border-bottom: 1px solid #ffe0b2;
    font-size: 14px;
}

.tech-read-topic {
    padding: 20px;
    background: linear-gradient(to left, #ff9800, #e65100);
    color: #fff;
}

.tech-read-topic h1 {
    margin: 0 0 12px;
    font-size: 22px;
    line-height: 1.35;
}

.tech-read-body-text {
    font-size: 16px;
    line-height: 1.65;
}

.tech-read-author {
    padding: 12px 20px;
    background: #fafafa;
    border-top: 1px solid #eee;
    font-size: 14px;
    color: #555;
}

.tech-answer-block {
    margin: 16px 20px;
    border: 1px solid #bbdefb;
    border-radius: 4px;
    overflow: hidden;
}

.tech-answer-block .tech-answer-head {
    background: #e3f2fd;
    padding: 10px 14px;
    font-weight: 600;
    font-size: 15px;
}

.tech-answer-block .tech-answer-body {
    padding: 14px;
    font-size: 15px;
    line-height: 1.6;
}

@media (max-width: 991px) {
    .header + .wrapper section.module.tech-content {
        padding-top: 84px;
    }
}
