/* ==========================================================================
   TEMA GELAP / TERANG  —  KasimB2 Exam
   Dimuat SETELAH <style> halaman. Semua aturan gelap memakai prefix
   html[data-bs-theme="dark"] sehingga mode terang tidak berubah sama sekali.

   Aturan kontras (WCAG): teks biasa ≥ 7:1 (AAA) untuk teks utama & sekunder,
   ≥ 7:1 juga untuk teks redup (hint/placeholder/label tabel). Tidak ada teks
   yang memakai opacity/alpha sehingga tidak ada yang tampak buram.
   ========================================================================== */

/* ── Tombol toggle (terang & gelap) ─────────────────────────────────────── */
.theme-toggle {
    width: 40px; height: 40px; flex: none; padding: 0;
    display: inline-grid; place-items: center;
    border: 1px solid var(--line-2, #c9dacb); border-radius: 8px;
    background: var(--surface, #fff); color: var(--ink-2, #435a48);
    cursor: pointer; line-height: 1;
    transition: background-color .15s, color .15s, border-color .15s;
}
.theme-toggle:hover { background: var(--brand-50, #e8f4ea); color: var(--ink, #0e2214); }
.theme-toggle:focus-visible { outline: 0; box-shadow: 0 0 0 4px var(--ring, rgba(10,92,28,.16)); }
.theme-toggle i { font-size: 1rem; }
.theme-toggle .icon-sun { display: none; }                          /* terang: tampil bulan */
html[data-bs-theme="dark"] .theme-toggle .icon-moon { display: none; }
html[data-bs-theme="dark"] .theme-toggle .icon-sun  { display: inline-block; }   /* gelap: tampil matahari */
/* di atas latar biru (header ujian) */
.theme-toggle--onbrand { background: rgba(255,255,255,.16); border-color: rgba(255,255,255,.35); color: #fff; }
.theme-toggle--onbrand:hover { background: rgba(255,255,255,.28); color: #fff; }
/* melayang di pojok kanan atas (halaman login) */
.theme-toggle--float { position: absolute; top: 20px; right: 20px; z-index: 5; }

/* Kolom tanggal (flatpickr) – readonly tapi harus tampak seperti isian biasa */
.form-control.js-datetime[readonly] { background-color: var(--surface, #fff); color: var(--ink, #0e2214); border-color: var(--line-2, #c9dacb); cursor: pointer; }
.form-control.js-datetime[readonly]:focus { border-color: var(--brand-600, #0f7a28); }
.flatpickr-calendar { font-family: inherit; }

/* ==========================================================================
   MODE GELAP
   ========================================================================== */
html[data-bs-theme="dark"] {
    color-scheme: dark;

    /* token aplikasi (dipakai layout utama, login, dan halaman lain) */
    --ink:        #eef7f0;   /* teks utama      – 15:1 di atas permukaan */
    --ink-2:      #cfe0d3;   /* teks sekunder   – 11:1 */
    --ink-3:      #a5bfab;   /* hint/placeholder – 8:1 */
    --brand:      #0f8a2c;   /* latar tombol utama (putih di atasnya 5.9:1) */
    --brand-600:  #14a038;
    --brand-50:   #12301a;   /* latar item aktif/hover */
    --accent:     #f5d142;
    --accent-600: #f8dc6e;
    --ok:         #5dd39e;
    --err:        #ff8a98;
    --warn:       #f5c451;
    --bg:         #07120a;
    --surface:    #0e1c12;
    --line:       #1d3324;
    --line-2:     #2f4a37;
    --ring:       rgba(134,226,156,.30);
    --shadow-1:   0 1px 2px rgba(0,0,0,.45);
    --shadow-2:   0 8px 24px rgba(0,0,0,.55);

    --surface-2:  #14281a;   /* dropdown, tooltip, panel terangkat */
    --field:      #0a160d;   /* latar kolom isian */
    --head:       #112218;   /* header tabel, footer kartu, input-group */
    --hover:      #16301f;   /* hover baris / menu */
    --link:       #86e29c;   /* teks biru terang untuk latar gelap */

    /* token Bootstrap 5.3 */
    --bs-body-color:           #eef7f0;
    --bs-body-color-rgb:       238,243,251;
    --bs-body-bg:              #07120a;
    --bs-body-bg-rgb:          11,18,32;
    --bs-emphasis-color:       #ffffff;
    --bs-secondary-color:      #a5bfab;   /* solid, bukan rgba → tidak buram */
    --bs-tertiary-color:       #a5bfab;
    --bs-secondary-bg:         #14281a;
    --bs-tertiary-bg:          #0e1c12;
    --bs-border-color:         #1d3324;
    --bs-link-color:           #86e29c;
    --bs-link-color-rgb:       143,184,255;
    --bs-link-hover-color:     #a9ecbb;
    --bs-link-hover-color-rgb: 184,210,255;
    --bs-heading-color:        #eef7f0;
    --bs-code-color:           #ff9ccb;
}

/* ── Dasar ──────────────────────────────────────────────────────────────── */
html[data-bs-theme="dark"] body { background: var(--bg); color: var(--ink); }
html[data-bs-theme="dark"] a:not(.btn):not(.nav-link):not(.dropdown-item):not(.navbar-brand) { color: var(--link); }
html[data-bs-theme="dark"] a:not(.btn):not(.nav-link):not(.dropdown-item):not(.navbar-brand):hover { color: #a9ecbb; }
html[data-bs-theme="dark"] ::selection { background: #14a038; color: #fff; }

/* Teks bantu Bootstrap – semuanya solid & terang */
html[data-bs-theme="dark"] .text-muted,
html[data-bs-theme="dark"] .text-secondary,
html[data-bs-theme="dark"] .text-body-secondary,
html[data-bs-theme="dark"] .form-text { color: var(--ink-3) !important; }
html[data-bs-theme="dark"] .text-primary { color: var(--link) !important; }
html[data-bs-theme="dark"] .text-success { color: #5dd39e !important; }
html[data-bs-theme="dark"] .text-danger  { color: #ff8a98 !important; }
html[data-bs-theme="dark"] .text-warning { color: #f5c451 !important; }
html[data-bs-theme="dark"] .text-info    { color: #6fd8ef !important; }
html[data-bs-theme="dark"] .opacity-75   { opacity: 1 !important; }

/* ── Navbar & dropdown ──────────────────────────────────────────────────── */
html[data-bs-theme="dark"] .navbar { background: var(--surface); border-bottom-color: var(--line); }
html[data-bs-theme="dark"] .navbar-brand .brand-sub { color: var(--ink-3); border-left-color: var(--line-2); }
html[data-bs-theme="dark"] .user-dropdown .btn { background: var(--surface); border-color: var(--line-2); color: var(--ink); }
html[data-bs-theme="dark"] .user-dropdown .btn:hover,
html[data-bs-theme="dark"] .user-dropdown .btn.show { background: var(--hover); border-color: #5c7562; color: var(--ink); }
html[data-bs-theme="dark"] .dropdown-menu {
    --bs-dropdown-bg: var(--surface-2);
    --bs-dropdown-color: var(--ink);
    --bs-dropdown-link-color: var(--ink);
    --bs-dropdown-link-hover-color: #fff;
    --bs-dropdown-link-hover-bg: #1a3d25;
    --bs-dropdown-link-active-bg: #0f8a2c;
    --bs-dropdown-border-color: var(--line-2);
    --bs-dropdown-divider-bg: var(--line-2);
    background: var(--surface-2); border-color: var(--line-2);
}
html[data-bs-theme="dark"] .dropdown-item { color: var(--ink); }
html[data-bs-theme="dark"] .dropdown-item:hover,
html[data-bs-theme="dark"] .dropdown-item:focus { background: #1a3d25; color: #fff; }
html[data-bs-theme="dark"] .dropdown-item i { color: var(--ink-3); }
html[data-bs-theme="dark"] .dropdown-item:hover i { color: #fff; }
html[data-bs-theme="dark"] .dropdown-item.text-danger:hover { color: #ffc2ca !important; }
html[data-bs-theme="dark"] .dropdown-item-text { color: var(--ink-3); }
html[data-bs-theme="dark"] .sb-toggle { color: var(--ink-2); }
html[data-bs-theme="dark"] .sb-toggle:hover { background: var(--hover); color: var(--ink); }

/* ── Sidebar ────────────────────────────────────────────────────────────── */
html[data-bs-theme="dark"] .sidebar { background: var(--surface); border-right-color: var(--line); }
html[data-bs-theme="dark"] .sidebar .nav-link { color: var(--ink-2); }
html[data-bs-theme="dark"] .sidebar .nav-link i { color: var(--ink-3); }
html[data-bs-theme="dark"] .sidebar .nav-link:hover { background: var(--hover); color: var(--ink); }
html[data-bs-theme="dark"] .sidebar .nav-link:hover i { color: var(--link); }
html[data-bs-theme="dark"] .sidebar .nav-link.active { background: var(--brand-50); color: #c6f3d2; }
html[data-bs-theme="dark"] .sidebar .nav-link.active i { color: #c6f3d2; }
/* tooltip label saat sidebar diciutkan: latar terang → teks harus gelap */
html[data-bs-theme="dark"].sb-collapsed .sidebar .nav-label { background: var(--ink); color: #07120a; }

/* ── Kartu ──────────────────────────────────────────────────────────────── */
html[data-bs-theme="dark"] .card { background: var(--surface); border-color: var(--line); color: var(--ink); }
html[data-bs-theme="dark"] .card-header { border-bottom-color: var(--line); color: var(--ink); }
html[data-bs-theme="dark"] .card-footer { background: var(--head); border-top-color: var(--line); }
html[data-bs-theme="dark"] .stat-card .stat-label { opacity: 1; color: #e6eefb; }
/* kartu bergradasi dengan warna inline (hijau/kuning/merah/ungu): gelapkan sedikit
   agar teks putih tetap tajam (≥ 5.9:1) tanpa mengubah warna dasarnya */
html[data-bs-theme="dark"] .card[style*="linear-gradient"] { position: relative; isolation: isolate; }
html[data-bs-theme="dark"] .card[style*="linear-gradient"]::before {
    content: ""; position: absolute; inset: 0; z-index: -1;
    border-radius: inherit; background: rgba(0,0,0,.40); pointer-events: none;
}
html[data-bs-theme="dark"] .card[style*="linear-gradient"] .text-muted { color: #fff !important; }
/* .bg-light bawaan Bootstrap tetap putih di mode gelap → ganti jadi panel gelap */
html[data-bs-theme="dark"] .bg-light { background-color: var(--surface-2) !important; color: var(--ink) !important; }
html[data-bs-theme="dark"] .bg-light .text-dark,
html[data-bs-theme="dark"] .bg-light.text-dark { color: var(--ink) !important; }
html[data-bs-theme="dark"] .border,
html[data-bs-theme="dark"] .border-top,
html[data-bs-theme="dark"] .border-bottom { border-color: var(--line) !important; }
html[data-bs-theme="dark"] hr { border-color: var(--line-2); opacity: 1; }

/* ── Form ───────────────────────────────────────────────────────────────── */
html[data-bs-theme="dark"] .form-label,
html[data-bs-theme="dark"] .col-form-label { color: var(--ink); }
html[data-bs-theme="dark"] .form-control,
html[data-bs-theme="dark"] .form-select {
    background-color: var(--field); color: var(--ink); border-color: var(--line-2);
}
html[data-bs-theme="dark"] .form-control:hover:not(:disabled):not([readonly]),
html[data-bs-theme="dark"] .form-select:hover:not(:disabled) { border-color: #5c7562; }
html[data-bs-theme="dark"] .form-control:focus,
html[data-bs-theme="dark"] .form-select:focus { background-color: var(--field); color: var(--ink); border-color: var(--link); }
html[data-bs-theme="dark"] .form-control::placeholder { color: #9aaac3; opacity: 1; }
html[data-bs-theme="dark"] .form-control[readonly],
html[data-bs-theme="dark"] .form-control:disabled,
html[data-bs-theme="dark"] .form-select:disabled { background-color: var(--head); color: var(--ink-2); border-color: var(--line); opacity: 1; }
html[data-bs-theme="dark"] .form-select option { background: var(--surface-2); color: var(--ink); }
html[data-bs-theme="dark"] .input-group-text { background: var(--head); color: var(--ink-2); border-color: var(--line-2); }
html[data-bs-theme="dark"] .input-group:focus-within > .input-group-text,
html[data-bs-theme="dark"] .input-group:focus-within > .form-control { border-color: var(--link); }
html[data-bs-theme="dark"] .form-check-input { background-color: var(--field); border-color: #5c7562; }
html[data-bs-theme="dark"] .form-check-input:checked { background-color: var(--brand); border-color: var(--brand-600); }
html[data-bs-theme="dark"] .form-check-label { color: var(--ink-2); }
/* isian yang diisi otomatis oleh browser */
html[data-bs-theme="dark"] input:-webkit-autofill,
html[data-bs-theme="dark"] input:-webkit-autofill:focus,
html[data-bs-theme="dark"] textarea:-webkit-autofill,
html[data-bs-theme="dark"] select:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px var(--field) inset !important;
    -webkit-text-fill-color: var(--ink) !important;
    caret-color: var(--ink);
}

/* ── Tombol ─────────────────────────────────────────────────────────────── */
html[data-bs-theme="dark"] .btn-primary { background: var(--brand); border-color: var(--brand); color: #fff; }
html[data-bs-theme="dark"] .btn-primary:hover,
html[data-bs-theme="dark"] .btn-primary:focus { background: var(--brand-600); border-color: var(--brand-600); color: #fff; }
html[data-bs-theme="dark"] .btn-accent { background: var(--accent); border-color: var(--accent); color: #1a1200; }
html[data-bs-theme="dark"] .btn-accent:hover { background: var(--accent-600); border-color: var(--accent-600); color: #1a1200; }
html[data-bs-theme="dark"] .btn-outline-secondary {
    background: var(--surface); color: var(--ink-2); border-color: var(--line-2);
    --bs-btn-color: #cfe0d3; --bs-btn-border-color: #2f4a37;
    --bs-btn-hover-bg: #1a2e21; --bs-btn-hover-color: #fff; --bs-btn-hover-border-color: #5c7562;
    --bs-btn-active-bg: #1a3d25; --bs-btn-active-color: #fff; --bs-btn-active-border-color: #5c7562;
    --bs-btn-disabled-color: #a5bfab; --bs-btn-disabled-border-color: #2f4a37;
}
html[data-bs-theme="dark"] .btn-outline-secondary:hover,
html[data-bs-theme="dark"] .btn-outline-secondary:active { background: #1a2e21; color: #fff; border-color: #5c7562; }
html[data-bs-theme="dark"] .btn-outline-primary {
    background: transparent; color: var(--link); border-color: #5b87c9;
    --bs-btn-color: #86e29c; --bs-btn-border-color: #5b87c9;
    --bs-btn-hover-bg: #0f8a2c; --bs-btn-hover-color: #fff; --bs-btn-hover-border-color: #0f8a2c;
    --bs-btn-active-bg: #14a038; --bs-btn-active-color: #fff; --bs-btn-active-border-color: #14a038;
    --bs-btn-disabled-color: #a5bfab; --bs-btn-disabled-border-color: #2f4a37;
}
html[data-bs-theme="dark"] .btn-outline-primary:hover,
html[data-bs-theme="dark"] .btn-outline-primary:active { background: #0f8a2c; color: #fff; border-color: #0f8a2c; }
html[data-bs-theme="dark"] .btn-outline-danger { background: transparent; color: #ff8a98; border-color: #7a3340; }
html[data-bs-theme="dark"] .btn-outline-danger:hover,
html[data-bs-theme="dark"] .btn-outline-danger:active { background: #b32d40; border-color: #b32d40; color: #fff; }
html[data-bs-theme="dark"] .btn-outline-success { color: #5dd39e; border-color: #2f7d5b; }
html[data-bs-theme="dark"] .btn-outline-success:hover { background: #17794f; border-color: #17794f; color: #fff; }
html[data-bs-theme="dark"] .btn-warning { color: #1a1200; }
html[data-bs-theme="dark"] .btn-close { filter: invert(1) grayscale(100%) brightness(200%); opacity: .9; }

/* ── Tabel ──────────────────────────────────────────────────────────────── */
html[data-bs-theme="dark"] .table {
    --bs-table-color: var(--ink);
    --bs-table-border-color: var(--line);
    --bs-table-striped-bg: rgba(255,255,255,.03);
    --bs-table-hover-bg: #16301f;
    --bs-table-hover-color: var(--ink);
    color: var(--ink);
}
html[data-bs-theme="dark"] .table > :not(caption) > * > * { color: inherit; border-bottom-color: var(--line); }
html[data-bs-theme="dark"] .table thead th { background: var(--head); color: var(--ink-3); border-bottom-color: var(--line); }
html[data-bs-theme="dark"] .table-hover > tbody > tr:hover > * { background: var(--hover); color: var(--ink); }
html[data-bs-theme="dark"] .table-danger {
    --bs-table-bg: #3a1822; --bs-table-color: #ffc2ca; --bs-table-border-color: #5a2633;
    --bs-table-hover-bg: #45202b; --bs-table-hover-color: #ffc2ca; color: #ffc2ca;
}
html[data-bs-theme="dark"] .table-danger > * > * { color: #ffc2ca; }

/* ── Badge & progress ───────────────────────────────────────────────────── */
html[data-bs-theme="dark"] .badge.bg-primary   { background-color: #0f8a2c !important; color: #fff; }
html[data-bs-theme="dark"] .badge.bg-warning,
html[data-bs-theme="dark"] .badge.bg-info,
html[data-bs-theme="dark"] .badge.bg-light     { color: #111827 !important; }
html[data-bs-theme="dark"] .badge.bg-light     { background-color: #dbe4f3 !important; }
html[data-bs-theme="dark"] .progress { --bs-progress-bg: #1d3324; }
html[data-bs-theme="dark"] .progress-bar.bg-primary { background-color: #14a038 !important; }

/* ── Alert ──────────────────────────────────────────────────────────────── */
html[data-bs-theme="dark"] .alert { color: var(--ink); }
html[data-bs-theme="dark"] .alert-danger  { background: #3a1822; border-color: #6b2a38; color: #ffc2ca; }
html[data-bs-theme="dark"] .alert-success { background: #12301f; border-color: #25573a; color: #b4f0d2; }
html[data-bs-theme="dark"] .alert-warning { background: #35290a; border-color: #6b5314; color: #fbe3a1; }
html[data-bs-theme="dark"] .alert-info    { background: #0f2c38; border-color: #1f5568; color: #b9ecf8; }

/* ── Footer ─────────────────────────────────────────────────────────────── */
html[data-bs-theme="dark"] .footer { background: var(--surface); border-top-color: var(--line); color: var(--ink-3); }

/* ── Halaman Pengaturan (admin/settings) ───────────────────────────────── */
html[data-bs-theme="dark"] .logo-preview { background: var(--field); border-color: var(--line-2); color: var(--ink-3); }
html[data-bs-theme="dark"] .set-title { color: var(--ink); }
html[data-bs-theme="dark"] .set-desc,
html[data-bs-theme="dark"] .group-title { color: var(--ink-3); }

/* ==========================================================================
   HALAMAN LOGIN (berdiri sendiri, tanpa Bootstrap)
   Panel merek di kiri sudah gelap, jadi hanya panel form yang disesuaikan.
   ========================================================================== */
html[data-bs-theme="dark"] .form-panel { background: var(--bg); }
html[data-bs-theme="dark"] .control input[type="text"],
html[data-bs-theme="dark"] .control input[type="password"] { background: var(--field); color: var(--ink); border-color: var(--line-2); }
html[data-bs-theme="dark"] .control input:hover { border-color: #5c7562; }
html[data-bs-theme="dark"] .control input:focus { border-color: var(--link); }
html[data-bs-theme="dark"] .control input::placeholder { color: #9aaac3; opacity: 1; }
html[data-bs-theme="dark"] .control:focus-within > .lead { color: var(--link); }
html[data-bs-theme="dark"] .toggle { color: var(--ink-3); }
html[data-bs-theme="dark"] .toggle:hover { background: #1a2e21; color: var(--ink); }
html[data-bs-theme="dark"] .check input { background: var(--field); border-color: #5c7562; }
html[data-bs-theme="dark"] .check input:checked { background: var(--brand); border-color: var(--brand-600); }
html[data-bs-theme="dark"] .notice.error   { background: #3a1822; border-color: #6b2a38; color: #ffc2ca; }
html[data-bs-theme="dark"] .notice.success { background: #12301f; border-color: #25573a; color: #b4f0d2; }
html[data-bs-theme="dark"] .hint { background: var(--surface); border-color: var(--line-2); color: var(--ink-2); }
html[data-bs-theme="dark"] .hint strong { color: var(--ink-3); }
html[data-bs-theme="dark"] .hint code { color: var(--ink); }
html[data-bs-theme="dark"] .legal { color: var(--ink-3); }

/* ==========================================================================
   HALAMAN UJIAN SISWA (exam_page, memakai warna sendiri)
   ========================================================================== */
html[data-bs-theme="dark"] .exam-container { color: var(--ink); }
html[data-bs-theme="dark"] .exam-header .opacity-75 { color: #dbe6f7; }
html[data-bs-theme="dark"] .question-card,
html[data-bs-theme="dark"] .question-nav { background: var(--surface); color: var(--ink); box-shadow: 0 2px 8px rgba(0,0,0,.45); }
html[data-bs-theme="dark"] .question-text { color: var(--ink); }
html[data-bs-theme="dark"] .question-number,
html[data-bs-theme="dark"] .option-letter { background: #0f8a2c; color: #fff; }
html[data-bs-theme="dark"] .option-item { border-color: var(--line-2); color: var(--ink); background: transparent; }
html[data-bs-theme="dark"] .option-item:hover { border-color: var(--link); background: var(--hover); }
html[data-bs-theme="dark"] .option-item.selected { border-color: var(--link); background: #1c3358; color: #fff; }
html[data-bs-theme="dark"] .option-item.selected .option-letter { background: #f5d142; color: #1a1200; }
html[data-bs-theme="dark"] .q-nav-btn { background: var(--field); border-color: var(--line-2); color: var(--ink); }
html[data-bs-theme="dark"] .q-nav-btn:hover { border-color: var(--link); }
html[data-bs-theme="dark"] .q-nav-btn.answered { background: #17794f; border-color: #17794f; color: #fff; }
html[data-bs-theme="dark"] .q-nav-btn.current { border-color: var(--link); box-shadow: 0 0 0 3px rgba(134,226,156,.35); }
html[data-bs-theme="dark"] .progress-bar-custom { background: #1d3324; }
html[data-bs-theme="dark"] .progress-fill { background: #5dd39e; }
html[data-bs-theme="dark"] .warning-toast { background: #c0303a; color: #fff; }

/* ── Kalender flatpickr ─────────────────────────────────────────────────── */
html[data-bs-theme="dark"] .form-control.js-datetime[readonly] { background-color: var(--field); color: var(--ink); border-color: var(--line-2); }
html[data-bs-theme="dark"] .flatpickr-calendar { background: var(--surface-2); border: 1px solid var(--line-2); box-shadow: var(--shadow-2); color: var(--ink); }
html[data-bs-theme="dark"] .flatpickr-calendar.arrowTop::before,
html[data-bs-theme="dark"] .flatpickr-calendar.arrowTop::after { border-bottom-color: var(--surface-2); }
html[data-bs-theme="dark"] .flatpickr-calendar.arrowBottom::before,
html[data-bs-theme="dark"] .flatpickr-calendar.arrowBottom::after { border-top-color: var(--surface-2); }
html[data-bs-theme="dark"] .flatpickr-months .flatpickr-month,
html[data-bs-theme="dark"] .flatpickr-current-month .flatpickr-monthDropdown-months,
html[data-bs-theme="dark"] .flatpickr-current-month input.cur-year { color: var(--ink); fill: var(--ink); background: transparent; }
html[data-bs-theme="dark"] .flatpickr-current-month .flatpickr-monthDropdown-months .flatpickr-monthDropdown-month { background: var(--surface-2); color: var(--ink); }
html[data-bs-theme="dark"] .flatpickr-months .flatpickr-prev-month,
html[data-bs-theme="dark"] .flatpickr-months .flatpickr-next-month { color: var(--ink); fill: var(--ink); }
html[data-bs-theme="dark"] .flatpickr-months .flatpickr-prev-month svg,
html[data-bs-theme="dark"] .flatpickr-months .flatpickr-next-month svg { fill: var(--ink); }
html[data-bs-theme="dark"] .flatpickr-months .flatpickr-prev-month:hover svg,
html[data-bs-theme="dark"] .flatpickr-months .flatpickr-next-month:hover svg { fill: var(--link); }
html[data-bs-theme="dark"] span.flatpickr-weekday { background: transparent; color: var(--ink-3); font-weight: 600; }
html[data-bs-theme="dark"] .flatpickr-day { color: var(--ink); }
html[data-bs-theme="dark"] .flatpickr-day.prevMonthDay,
html[data-bs-theme="dark"] .flatpickr-day.nextMonthDay { color: #94a3bb; }
html[data-bs-theme="dark"] .flatpickr-day:hover,
html[data-bs-theme="dark"] .flatpickr-day:focus { background: #1a3d25; border-color: #1a3d25; color: #fff; }
html[data-bs-theme="dark"] .flatpickr-day.today { border-color: var(--link); }
html[data-bs-theme="dark"] .flatpickr-day.selected,
html[data-bs-theme="dark"] .flatpickr-day.selected:hover { background: #0f8a2c; border-color: #0f8a2c; color: #fff; }
html[data-bs-theme="dark"] .flatpickr-day.flatpickr-disabled { color: #6f7f99; }
html[data-bs-theme="dark"] .flatpickr-time { border-top-color: var(--line-2); }
html[data-bs-theme="dark"] .flatpickr-time input,
html[data-bs-theme="dark"] .flatpickr-time .flatpickr-time-separator,
html[data-bs-theme="dark"] .flatpickr-time .flatpickr-am-pm { color: var(--ink); background: transparent; }
html[data-bs-theme="dark"] .flatpickr-time input:hover,
html[data-bs-theme="dark"] .flatpickr-time input:focus { background: #1a3d25; }
html[data-bs-theme="dark"] .numInputWrapper span { border-color: var(--line-2); }
html[data-bs-theme="dark"] .numInputWrapper span:hover { background: #1a3d25; }
html[data-bs-theme="dark"] .numInputWrapper span.arrowUp::after { border-bottom-color: var(--ink-2); }
html[data-bs-theme="dark"] .numInputWrapper span.arrowDown::after { border-top-color: var(--ink-2); }

/* Hormati preferensi gerak-kurang */
@media (prefers-reduced-motion: reduce) { .theme-toggle { transition: none; } }