/* ================== NAVBAR (ใช้ร่วมกันทุกหน้าบ้าน) ==================
   ต้องประกาศ :root ที่มี --primary, --primary-light, --text, --text-muted, --border ไว้ก่อน (ในหน้าที่ include ไฟล์นี้)
*/
.navbar-scac{
    position:sticky;
    top:0;
    z-index:1030;
    background:#fff;
    border-bottom:1px solid var(--border);
    padding:12px 0;
    box-shadow:0 2px 10px rgba(30,58,138,0.04);
}

.navbar-scac .brand-group{
    display:flex;
    align-items:center;
    gap:16px;
    min-width:0;
    max-width:78%;
}

.navbar-scac .brand{
    font-weight:700;
    color:var(--primary);
    text-decoration:none;
    font-size:16px;
    display:flex;
    align-items:center;
    gap:10px;
    min-width:0;
}

.navbar-scac .brand-icon{
    height:46px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
}

.navbar-scac .brand-icon img.logo-partners{
    height:36px;
    width:auto;
    object-fit:contain;
}

.navbar-scac .brand-divider{
    width:1px;
    height:30px;
    background:var(--border);
    flex-shrink:0;
}

.navbar-scac .brand-text{ display:flex; flex-direction:column; line-height:1.3; min-width:0; }
.navbar-scac .brand-text .brand-title{
    font-size:15px; font-weight:700; color:var(--primary); letter-spacing:.2px;
}

.navbar-scac .nav-links{
    display:flex;
    align-items:center;
    gap:4px;
}

.navbar-scac .nav-links a{
    text-decoration:none;
    color:var(--text-muted);
    font-size:13.5px;
    font-weight:500;
    padding:9px 14px;
    border-radius:999px;
    transition:.2s;
    white-space:nowrap;
    display:inline-flex;
    align-items:center;
    gap:6px;
}

.navbar-scac .nav-links a i{ font-size:14px; }

.navbar-scac .nav-links a:hover{
    background:#eef2ff;
    color:var(--primary-light);
}

.navbar-scac .nav-links a.active{
    background:var(--primary);
    color:#fff;
}

.navbar-scac .nav-dropdown{ position:relative; }

.navbar-scac .nav-dropdown-toggle{
    display:flex;
    align-items:center;
    gap:4px;
    cursor:pointer;
}

.navbar-scac .nav-dropdown-toggle i{ font-size:11px; transition:.2s; }

.navbar-scac .nav-dropdown.open .nav-dropdown-toggle i{ transform:rotate(180deg); }

.navbar-scac .nav-dropdown-menu{
    display:none;
    position:absolute;
    top:100%;
    left:0;
    min-width:230px;
    background:#fff;
    border:1px solid var(--border);
    border-radius:10px;
    box-shadow:0 12px 24px rgba(0,0,0,0.08);
    padding:6px;
    margin-top:6px;
    z-index:1040;
}

.navbar-scac .nav-dropdown.open .nav-dropdown-menu{ display:block; }

.navbar-scac .nav-dropdown-menu a{
    display:block;
    padding:7px 12px;
    border-radius:8px;
    font-size:13px;
    color:var(--text-muted);
    white-space:nowrap;
}

.navbar-scac .nav-dropdown-menu a:hover{
    background:#eef2ff;
    color:var(--primary-light);
}

.navbar-scac .nav-user-toggle{
    padding:4px 10px 4px 4px;
    border-radius:999px;
    border:1px solid var(--border);
}

.navbar-scac .nav-login-btn{
    background:var(--primary) !important;
    color:#fff !important;
    padding:10px 20px !important;
    border-radius:12px !important;
    font-weight:600 !important;
    box-shadow:0 6px 16px rgba(13,99,214,.25);
}
.navbar-scac .nav-login-btn:hover{ background:var(--primary-light) !important; }
.navbar-scac .nav-login-btn i.bi-chevron-down{ display:none; }

.navbar-scac .nav-user-avatar{
    width:30px;
    height:30px;
    border-radius:50%;
    object-fit:cover;
}

.navbar-scac .nav-user-name{
    font-weight:600;
    max-width:140px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}

.navbar-scac .nav-user-dropdown .nav-dropdown-menu{
    right:0;
    left:auto;
    min-width:220px;
}

.navbar-scac .nav-dropdown-header{
    display:block;
    padding:8px 12px;
    font-size:14px;
    font-weight:700;
    color:var(--text);
    border-bottom:1px solid var(--border);
    margin-bottom:4px;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.navbar-scac .nav-dropdown-divider{
    height:1px;
    background:var(--border);
    margin:6px 4px;
}

@media (max-width:991.98px){
    .navbar-scac .nav-user-dropdown .nav-dropdown-menu{ right:auto; }
    .navbar-scac .nav-user-name{ max-width:none; }
}

.nav-toggle-btn{
    border:1px solid var(--border);
    background:#fff;
    border-radius:10px;
    width:40px;
    height:40px;
    display:none;
    align-items:center;
    justify-content:center;
    color:var(--primary);
}

@media (max-width:991.98px){
    .navbar-scac .brand-group{ max-width:82%; gap:10px; }
    .navbar-scac .brand{ font-size:14px; }
    .navbar-scac .brand-icon img.logo-partners{ height:28px; }
    .navbar-scac .brand-divider{ height:24px; }
    .navbar-scac .nav-links{
        display:none;
        position:absolute;
        top:100%;
        left:0;
        right:0;
        flex-direction:column;
        align-items:stretch;
        background:#fff;
        border-bottom:1px solid var(--border);
        padding:10px 16px 16px;
        gap:4px;
        box-shadow:0 12px 20px rgba(0,0,0,0.06);
    }
    .navbar-scac .nav-links.show{ display:flex; }
    .navbar-scac .nav-links a{ padding:10px 14px; }
    .navbar-scac .nav-dropdown-menu{
        position:static;
        box-shadow:none;
        border:none;
        margin-top:0;
        padding-left:14px;
        width:100%;
    }
    .nav-toggle-btn{ display:flex; }
}

@media (max-width:480px){
    .navbar-scac .brand-group{ max-width:88%; gap:8px; }
    .navbar-scac .brand-icon img.logo-partners{ height:24px; }
    .navbar-scac .brand-divider{ height:20px; }
}