/* ==========================================================================
   DARK MODE INVERSIONS (Aura Gelap Premium)
   ========================================================================== */

/* --------------------------------------------------------------------------
   PERMINTAAN KHUSUS: Header Tier 1 (Logo, Kotak Pencarian, Toggle Mode Gelap)
   SELALU tampil terang/putih, walaupun pengguna mengaktifkan Mode Gelap.
   Hanya Tier 2 (Navigasi) & Ticker yang tetap ikut menggelap seperti semula.
   -------------------------------------------------------------------------- */
[data-theme="dark"] .header-tier-top {
    background-color: #FFFFFF !important;
    border-bottom: 1px solid #E5E5E5 !important;
}

[data-theme="dark"] .desktop-search-form {
    background-color: #F1F3F4 !important;
    border-color: #E5E5E5 !important;
}

[data-theme="dark"] .desktop-search-form:focus-within {
    background-color: #FFFFFF !important;
}

[data-theme="dark"] .desktop-search-input {
    color: #111111 !important;
}

[data-theme="dark"] .desktop-search-submit,
[data-theme="dark"] .desktop-actions-wrap .theme-toggle-btn {
    color: #111111 !important;
}

[data-theme="dark"] .header-tier-nav {
    background-color: #121212;
}

[data-theme="dark"] .headline-ticker-bar {
    background-color: #0A0A0A !important;
    border-bottom: 1px solid #1c1c1c !important;
}

/* ==========================================================================
   PREMIUM DARK MODE TOGGLE (Pill Switch Matahari/Bulan dengan Aksen Emas)
   ========================================================================== */
.premium-toggle {
    background: none !important;
    border: none !important;
    padding: 0 !important;
    cursor: pointer;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}

.premium-toggle .toggle-track {
    position: relative;
    display: inline-flex;
    align-items: center;
    width: 46px;
    height: 24px;
    border-radius: 999px;
    padding: 3px;
    box-sizing: border-box;
    background: linear-gradient(135deg, #FDE9B0 0%, #F3C969 55%, #E0A83A 100%);
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08), 0 1px 3px rgba(224, 168, 58, 0.35);
    transition: background var(--duration-standard, 0.3s) var(--ease-standard, ease), box-shadow var(--duration-standard, 0.3s) var(--ease-standard, ease);
}

/* PERMINTAAN KHUSUS: Warna pill switch tetap terang/emas walau Mode Gelap aktif.
   Posisi knob & ikon bulan/matahari tetap bergeser agar status tetap terlihat jelas. */
[data-theme="dark"] .premium-toggle .toggle-track {
    background: linear-gradient(135deg, #FDE9B0 0%, #F3C969 55%, #E0A83A 100%);
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08), 0 1px 3px rgba(224, 168, 58, 0.35);
}

.premium-toggle .toggle-knob {
    position: relative;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #FFFFFF;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transform: translateX(0);
    transition: transform var(--duration-standard, 0.3s) cubic-bezier(0.34, 1.56, 0.64, 1), background var(--duration-standard, 0.3s) ease;
}

[data-theme="dark"] .premium-toggle .toggle-knob {
    transform: translateX(22px);
    background: #FFFFFF;
}

.premium-toggle .toggle-knob .knob-icon {
    position: absolute;
    width: 12px !important;
    height: 12px !important;
    color: #E0A83A;
    opacity: 1;
    transform: scale(1) rotate(0deg);
    transition: opacity 0.25s ease, transform 0.35s ease;
}

.premium-toggle .toggle-knob .knob-icon--moon {
    color: #1c1f2e;
    opacity: 0;
    transform: scale(0.4) rotate(-60deg);
}

[data-theme="dark"] .premium-toggle .toggle-knob .knob-icon--sun {
    opacity: 0;
    transform: scale(0.4) rotate(60deg);
}

[data-theme="dark"] .premium-toggle .toggle-knob .knob-icon--moon {
    opacity: 1;
    transform: scale(1) rotate(0deg);
}

/* Bintang kecil berkelip, hanya terlihat di mode gelap */
.premium-toggle .toggle-stars {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.3s ease;
}

[data-theme="dark"] .premium-toggle .toggle-stars {
    opacity: 0;
}

.premium-toggle .star {
    position: absolute;
    width: 2px;
    height: 2px;
    border-radius: 50%;
    background: #F3C969;
    animation: gentaraStarTwinkle 1.8s ease-in-out infinite;
}

.premium-toggle .star-1 { top: 5px; left: 7px; animation-delay: 0s; }
.premium-toggle .star-2 { top: 14px; left: 10px; animation-delay: 0.5s; }
.premium-toggle .star-3 { top: 8px; left: 15px; animation-delay: 1s; }

@keyframes gentaraStarTwinkle {
    0%, 100% { opacity: 0.2; transform: scale(0.8); }
    50% { opacity: 1; transform: scale(1.3); }
}

.premium-toggle:hover .toggle-track {
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08), 0 0 10px rgba(224, 168, 58, 0.55);
}

[data-theme="dark"] .premium-toggle:hover .toggle-track {
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08), 0 0 10px rgba(224, 168, 58, 0.55);
}

/* Menonaktifkan gaya lama (ikon polos) agar tidak bentrok dengan pill switch baru */
.desktop-actions-wrap .premium-toggle,
.mobile-header-actions .premium-toggle {
    color: initial !important;
}