/**
 * File: navigation.css
 * MODUL: TOTAL FIXED SYMMETRIC ENGINE - KUNCI MATI (FINAL REPAIR)
 * Deskripsi: Header terkunci di atas, konten meluncur di bawahnya tanpa celah.
 */

/* 1. WRAPPER KUNCI MATI (Fixed Position) */
.site-header-fixed-wrapper {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    /* Kunci z-index tinggi agar tidak tenggelam di bawah slider */
    z-index: 999999 !important; 
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
}

/* 2. TOP BAR - SYMMETRIC POSITIONING */
#page .top-bar {
    background-color: #002244 !important; /* Biru Gelap UNTAD */
    height: 48px !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    border: none !important;
}

#page .top-bar .container {
    display: flex !important;
    justify-content: space-between !important; /* Portal di kanan, Info di kiri */
    align-items: center !important;
    width: 100% !important;
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 40px;
}

/* Info Kontak (Email, Telp, WA) */
.top-info { 
    display: flex !important; 
    gap: 25px; 
    align-items: center !important; 
}

.top-info span {
    display: flex !important;
    align-items: center !important;
    color: #ffffff !important;
    font-size: 11px !important;
    font-weight: 500;
}

.top-info i, .top-info .dashicons {
    color: #ffcc00 !important;
    margin-right: 8px !important;
    font-size: 14px !important;
    display: flex !important;
    align-items: center;
}

.top-info span a {
    color: #ffffff !important;
    text-decoration: none;
}

/* TOMBOL PORTAL SIGA-8 (Luxury Gold Metallic) */
#page .top-links {
    display: flex !important;
    align-items: center !important;
}

#page .top-links .btn-portal {
    background: linear-gradient(180deg, #ffeaa7 0%, #facd1d 50%, #b8860b 100%) !important;
    color: #002244 !important;
    padding: 6px 18px !important;
    font-size: 11px !important;
    font-weight: 900 !important;
    text-transform: uppercase;
    border-radius: 6px !important;
    border: 1px solid #fff2cc !important;
    box-shadow: 0 2px 4px rgba(0,0,0,0.3) !important;
    text-decoration: none;
    display: inline-flex !important;
    align-items: center !important;
    line-height: 1;
}

/* 3. MAIN HEADER - RAPAT KE TOP BAR */
header#masthead.site-header {
    background: linear-gradient(180deg, #001a35 0%, #002d5a 50%, #001a35 100%) !important;
    height: 178px !important;
    display: flex !important;
    align-items: center !important;
    border-bottom: 5px solid #ffcc00 !important;
    border-top: none !important; /* Hapus gap atas agar rapat ke top bar */
    margin: 0 !important; 
    padding: 0 !important;
    width: 100% !important;
    position: relative !important;
}

header#masthead .container {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    height: 100% !important;
    max-width: 1400px !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 40px !important;
}

/* 4. BRANDING & LOGO (SIMETRIS) */
.site-branding a {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
    text-decoration: none !important;
}

.logo-img-main {
    height: 95px !important;
    width: auto !important;
}

.logo-text {
    display: flex !important;
    flex-direction: column !important;
    line-height: 1.1 !important;
}

.initial-title {
    color: #ffffff !important;
    font-size: 28px !important;
    font-weight: 800 !important;
    margin: 0 !important;
    text-transform: uppercase !important;
}

.full-title {
    color: #ffcc00 !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    margin: 0 !important;
}

.site-tagline {
    color: rgba(255,255,255,0.7) !important;
    font-size: 10px !important;
    font-style: italic !important;
}

/* 5. NAVIGASI & TOOLS */
.nav-action-wrapper {
    display: flex !important;
    align-items: center !important;
    gap: 30px !important;
}

.main-navigation ul {
    display: flex !important;
    list-style: none !important;
    gap: 25px !important;
    margin: 0 !important;
    padding: 0 !important;
}

.main-navigation ul li a {
    color: #ffffff !important;
    font-weight: 700 !important;
    font-size: 14px !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    transition: 0.3s;
}

.main-navigation ul li a:hover { 
    color: #ffcc00 !important; 
}

.nav-tools {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
}

.search-trigger {
    background: #ffcc00 !important;
    color: #001a35 !important;
    width: 45px !important;
    height: 45px !important;
    border-radius: 12px !important;
    border: none !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* 6. SEARCH OVERLAY (FIXED & SYNC) */
/**
 * File: navigation.css
 * MODUL: SEARCH OVERLAY PRO UPGRADE
 */
.search-overlay {
    position: fixed !important;
    /* Mulai dari atas layar agar saat turun menutup sempurna */
    top: -235px; 
    left: 0;
    width: 100%;
    /* Tinggi disamakan dengan total tinggi header (48+178+5) agar tertutup semua */
    height: 231px !important; 
    /* Gunakan warna solid tanpa transparansi agar teks logo di belakang tidak membayang */
    background: #001a35 !important; 
    /* Pastikan di atas segalanya */
    z-index: 1000000 !important; 
    display: flex !important;
    align-items: center !important;
    transition: all 0.5s cubic-bezier(0.77, 0, 0.175, 1) !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.8);
    border-bottom: 5px solid #ffcc00; /* Konsisten dengan garis kuning header */
}

/* Saat Search Aktif */
.search-overlay.active {
    top: 0 !important;
}

/* Merapikan form di dalam overlay agar tetap simetris */
.search-form-overlay {
    width: 100%;
    max-width: 1400px; /* Samakan dengan container header */
    margin: 0 auto;
    padding: 0 40px;
    display: flex !important;
    align-items: center !important;
    gap: 30px !important;
}

.search-input {
    flex-grow: 1;
    background: transparent !important;
    border: none !important;
    border-bottom: 2px solid #ffcc00 !important;
    color: #ffffff !important;
    font-size: 22px !important;
    outline: none !important;
}

.close-search {
    background: transparent !important;
    border: none !important;
    color: #ffcc00 !important;
    font-size: 35px !important;
    cursor: pointer !important;
}

/* 7. CLEANUP & RESET */
.menu-toggle { display: none !important; }
#page, .site-header, .top-bar { transform: none !important; filter: none !important; }

/**
 * MODUL: DROPDOWN FINAL ALIGNMENT - 76% LEFT & 70% TOP
 */

/* 1. Level 2: Rapat ke atas (70%) dan Rata Kiri Huruf A (76%) */
.main-navigation ul li ul {
    position: absolute !important;
    top: 70% !important; 
    left: 76% !important; 
    /* Gunakan TranslateX(-50%) agar posisi 76% itu menjadi titik tengah dropdown */
    transform: translateX(-50%) translateY(10px) !important;
    width: 250px !important;
    background: #001a35 !important;
    display: flex !important;
    flex-direction: column !important;
    visibility: hidden;
    opacity: 0;
    padding: 10px 0 !important;
    border-top: 3px solid #ffcc00 !important;
    z-index: 999999 !important;
    box-shadow: 0 10px 40px rgba(0,0,0,0.6) !important;
    transition: all 0.3s ease;
}

/* 2. Kunci Baris Menu: Patokan untuk Level 3 */
.main-navigation ul ul li {
    position: relative !important; 
    width: 100% !important;
    display: block !important;
}

/* 3. Level 3 (Beasiswa): Lurus sejajar Kemahasiswaan */
.main-navigation ul ul li ul {
    /* Top -10px untuk mengimbangi padding dropdown agar lurus teks */
    top: -10px !important; 
    left: 100% !important; 
    transform: translateX(0) !important; 
    border-top: none !important;
    border-left: 3px solid #ffcc00 !important;
}

/* 4. Hover State */
.main-navigation ul li:hover > ul {
    visibility: visible !important;
    opacity: 1 !important;
    transform: translateX(-50%) translateY(0) !important;
}

/* Hover Level 3: Tetap di samping kanan */
.main-navigation ul ul li:hover > ul {
    visibility: visible !important;
    opacity: 1 !important;
    transform: translateX(0) translateY(0) !important;
}

/* 4. RESET STYLE LINK */
.main-navigation ul ul li a {
    padding: 12px 20px !important;
    font-size: 13px !important;
    text-transform: none !important;
    color: #ffffff !important;
    display: flex !important;
    justify-content: space-between !important;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

.main-navigation ul ul li a:hover {
    background: #002d5a !important;
    color: #ffcc00 !important;
}

/* 5. Indikator Panah */
.menu-item-has-children > a::after {
    content: " \25BE"; 
    font-size: 10px;
    margin-left: 5px;
}

.main-navigation ul ul .menu-item-has-children > a::after {
    content: " \25B8"; 
}