/*
AFCMall v1.1.2 — Frontend Runtime Fix
- Header benar-benar fixed di atas pada semua halaman.
- Body diberi ruang sesuai tinggi header agar konten tidak tertutup.
- Mode solid/transparan tetap mengikuti pengaturan backoffice.
- Premium icon line dibuat block agar terlihat jelas.
*/

:root {
    --afc-header-height: 78px;
}

html,
body {
    width: 100%;
    max-width: 100%;
}

body {
    padding-top: var(--afc-header-height) !important;
}

/* Lebih kuat daripada sticky: header selalu berada di viewport. */
.site-header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 9999 !important;
    transform: translateZ(0);
    will-change: background-color, box-shadow;
}

/* Solid selalu memakai warna pilihan. */
body.header-mode-solid .site-header,
body.header-scrolled .site-header {
    background-color: var(--header-solid-bg) !important;
    box-shadow: 0 10px 30px rgba(8, 17, 31, .12) !important;
    border-bottom: 1px solid rgba(0, 0, 0, .08) !important;
    backdrop-filter: blur(14px);
}

/* Transparan hanya saat benar-benar di posisi paling atas. */
body.header-mode-transparent:not(.header-scrolled) .site-header {
    background-color: transparent !important;
    box-shadow: none !important;
    border-bottom-color: transparent !important;
}

/* Premium icon harus berada di baris tersendiri dan tidak tenggelam di teks. */
.premium-icon-line {
    display: flex !important;
    align-items: flex-start !important;
    width: 100%;
    margin: .28em 0;
    line-height: 1.55;
}

.premium-icon-symbol {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    font-size: var(--premium-icon-size, 18px) !important;
    margin-right: var(--premium-icon-gap, 8px) !important;
    line-height: 1.35;
    font-weight: 900;
}

.premium-icon-text {
    min-width: 0;
    flex: 1 1 auto;
}

/* Warna global */
.premium-icon-star .premium-icon-symbol {
    color: var(--premium-star-color, #D5AD43) !important;
}

.premium-icon-diamond .premium-icon-symbol {
    color: var(--premium-diamond-color, #1FA6A0) !important;
}

.premium-icon-sparkle .premium-icon-symbol {
    color: var(--premium-sparkle-color, #8D6FE8) !important;
}

@media (max-width: 980px) {
    :root {
        --afc-header-height: 68px;
    }

    /* Pada mobile, transparan diberi sedikit lapisan agar menu tetap terbaca. */
    body.header-mode-transparent:not(.header-scrolled) .site-header {
        background-color: rgba(255, 255, 255, .88) !important;
        backdrop-filter: blur(14px);
    }
}