/* public_html/assets/css/eye-care.css */

/* =========================================
   TEMA TERANG (default)
   ========================================= */
:root {
    --ec-bg: transparent;
    --ec-filter: none;
    --ec-brightness: 1;
}

/* =========================================
   DARK MODE
   ========================================= */
html.dark-mode {
    color-scheme: dark;
}

/* =========================================
   EYE CARE MODE — Filter hangat anti blue-light
   Mengurangi pancaran cahaya biru yang berbahaya
   untuk mata anak-anak
   ========================================= */
html.eye-care {
    filter: sepia(30%) brightness(0.92) saturate(0.85);
    transition: filter 0.4s ease;
}

/* Saat keduanya aktif (dark + eye care) */
html.dark-mode.eye-care {
    filter: sepia(40%) brightness(0.80) saturate(0.75);
}

/* Transisi halus saat toggle */
html {
    transition: filter 0.4s ease, background-color 0.4s ease;
}

/* Tombol Eye Care aktif (glow kuning hangat) */
.eye-care-btn.active {
    background: rgba(234, 179, 8, 0.25) !important;
    border-color: rgba(234, 179, 8, 0.7) !important;
    color: #fde68a !important;
    box-shadow: 0 0 12px rgba(234, 179, 8, 0.4);
}

/* Tombol Dark Mode aktif */
.theme-btn.dark-active {
    background: rgba(139, 92, 246, 0.25) !important;
    border-color: rgba(139, 92, 246, 0.7) !important;
    color: #ddd6fe !important;
}
.theme-btn.light-active {
    background: rgba(251, 191, 36, 0.25) !important;
    border-color: rgba(251, 191, 36, 0.7) !important;
    color: #fde68a !important;
}