/* LOOVIE-DARKMODE-ICON-CONTRAST-V10
   Memperjelas icon dark mode saat mode night aktif dan halaman sudah scroll ke bawah.
   Masalah sebelumnya: tombol abu-abu + icon gold terlalu tipis.
*/

.loovie-darkmode-single-icon-v10,
.loovie-darkmode-single-icon-v9,
.loovie-darkmode-single-icon-v8,
.loovie-darkmode-single-icon-v7 {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    padding: 0 !important;
    line-height: 1 !important;
    gap: 0 !important;
    flex: 0 0 48px !important;
    color: #2B1722 !important;
    border-color: rgba(43,23,34,.18) !important;
    background: rgba(255,255,255,.82) !important;
    backdrop-filter: blur(8px) !important;
}

.loovie-darkmode-single-icon-v10::before,
.loovie-darkmode-single-icon-v10::after,
.loovie-darkmode-single-icon-v9::before,
.loovie-darkmode-single-icon-v9::after,
.loovie-darkmode-single-icon-v8::before,
.loovie-darkmode-single-icon-v8::after,
.loovie-darkmode-single-icon-v7::before,
.loovie-darkmode-single-icon-v7::after {
    content: none !important;
    display: none !important;
}

/* Bersihkan icon lama agar tidak double */
.loovie-darkmode-single-icon-v10 [data-loovie-darkmode-old-icon-v10="1"],
.loovie-darkmode-single-icon-v10 [data-loovie-darkmode-old-icon-v9="1"],
.loovie-darkmode-single-icon-v10 [data-loovie-darkmode-old-icon-v8="1"],
.loovie-darkmode-single-icon-v10 [data-loovie-darkmode-old-icon-v7="1"],
.loovie-darkmode-single-icon-v10 [data-loovie-original-darkmode-icon-v6="1"],
.loovie-darkmode-icon-wrap-v6,
.loovie-darkmode-icon-wrap-v7,
.loovie-darkmode-icon-wrap-v8,
.loovie-darkmode-icon-wrap-v9 {
    display: none !important;
    visibility: hidden !important;
}

.loovie-darkmode-icon-wrap-v10 {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
    flex: 0 0 24px !important;
    line-height: 0 !important;
    pointer-events: none !important;
    color: currentColor !important;
}

.loovie-darkmode-icon-wrap-v10 .loovie-darkmode-icon-v10 {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
    line-height: 0 !important;
    color: currentColor !important;
}

.loovie-darkmode-icon-wrap-v10 svg {
    width: 24px !important;
    height: 24px !important;
    display: block !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2.25 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;
}

/* Light mode: moon */
.loovie-darkmode-single-icon-v10 .loovie-darkmode-icon-sun-v10 {
    display: none !important;
}

.loovie-darkmode-single-icon-v10 .loovie-darkmode-icon-moon-v10 {
    display: inline-flex !important;
}

/* Dark mode: sun */
html.dark .loovie-darkmode-single-icon-v10 .loovie-darkmode-icon-moon-v10,
html[data-bs-theme="dark"] .loovie-darkmode-single-icon-v10 .loovie-darkmode-icon-moon-v10,
html.lv5d-dark .loovie-darkmode-single-icon-v10 .loovie-darkmode-icon-moon-v10,
body.dark .loovie-darkmode-single-icon-v10 .loovie-darkmode-icon-moon-v10,
body[data-bs-theme="dark"] .loovie-darkmode-single-icon-v10 .loovie-darkmode-icon-moon-v10,
body.lv5d-dark .loovie-darkmode-single-icon-v10 .loovie-darkmode-icon-moon-v10,
.loovie-darkmode-single-icon-v10.loovie-darkmode-is-dark-v10 .loovie-darkmode-icon-moon-v10 {
    display: none !important;
}

html.dark .loovie-darkmode-single-icon-v10 .loovie-darkmode-icon-sun-v10,
html[data-bs-theme="dark"] .loovie-darkmode-single-icon-v10 .loovie-darkmode-icon-sun-v10,
html.lv5d-dark .loovie-darkmode-single-icon-v10 .loovie-darkmode-icon-sun-v10,
body.dark .loovie-darkmode-single-icon-v10 .loovie-darkmode-icon-sun-v10,
body[data-bs-theme="dark"] .loovie-darkmode-single-icon-v10 .loovie-darkmode-icon-sun-v10,
body.lv5d-dark .loovie-darkmode-single-icon-v10 .loovie-darkmode-icon-sun-v10,
.loovie-darkmode-single-icon-v10.loovie-darkmode-is-dark-v10 .loovie-darkmode-icon-sun-v10 {
    display: inline-flex !important;
}

/* Saat posisi paling atas/hero: tetap terang */
.loovie-darkmode-single-icon-v10.loovie-darkmode-at-top-v10 {
    color: #F7E7B2 !important;
    border-color: rgba(247,231,178,.34) !important;
    background: rgba(255,255,255,.10) !important;
    box-shadow: inset 0 0 0 1px rgba(247,231,178,.12), 0 10px 26px rgba(0,0,0,.14) !important;
}

/* PENTING: Saat mode night aktif dan sudah scroll ke bawah,
   gunakan tombol dark navy agar sun gold terlihat jelas. */
html.dark .loovie-darkmode-single-icon-v10,
html[data-bs-theme="dark"] .loovie-darkmode-single-icon-v10,
html.lv5d-dark .loovie-darkmode-single-icon-v10,
body.dark .loovie-darkmode-single-icon-v10,
body[data-bs-theme="dark"] .loovie-darkmode-single-icon-v10,
body.lv5d-dark .loovie-darkmode-single-icon-v10,
.loovie-darkmode-single-icon-v10.loovie-darkmode-is-dark-v10 {
    color: #F4D46D !important;
    background: #122037 !important;
    border-color: rgba(244,212,109,.55) !important;
    box-shadow:
        inset 0 0 0 1px rgba(244,212,109,.18),
        0 10px 26px rgba(0,0,0,.18) !important;
}

/* Dark mode + top: tetap jelas, jangan abu-abu */
html.dark .loovie-darkmode-single-icon-v10.loovie-darkmode-at-top-v10,
html[data-bs-theme="dark"] .loovie-darkmode-single-icon-v10.loovie-darkmode-at-top-v10,
html.lv5d-dark .loovie-darkmode-single-icon-v10.loovie-darkmode-at-top-v10,
body.dark .loovie-darkmode-single-icon-v10.loovie-darkmode-at-top-v10,
body[data-bs-theme="dark"] .loovie-darkmode-single-icon-v10.loovie-darkmode-at-top-v10,
body.lv5d-dark .loovie-darkmode-single-icon-v10.loovie-darkmode-at-top-v10,
.loovie-darkmode-single-icon-v10.loovie-darkmode-is-dark-v10.loovie-darkmode-at-top-v10 {
    color: #F4D46D !important;
    background: rgba(18,32,55,.88) !important;
    border-color: rgba(244,212,109,.55) !important;
}

.loovie-darkmode-single-icon-v10:hover {
    color: #FFE08A !important;
    border-color: rgba(255,224,138,.68) !important;
}