/* ═══════════════════════════════════════════════════════════
   NWD PUBLIC (Technician) — THEME SYSTEM
   Logo colors: cyan #00B8D4 / teal #0097A7 / green #4CAF50
   Dark default · Light toggle via [data-theme="light"]
═══════════════════════════════════════════════════════════ */

/* ── DARK (default) ── */
:root {
    --nwd-primary:      #00B8D4;
    --nwd-primary-dark: #0097A7;
    --nwd-primary-dim:  rgba(0,184,212,0.15);
    --nwd-green:        #4CAF50;

    --bg:       #03101a;
    --bg2:      #071d2b;
    --surface:  rgba(255,255,255,0.05);
    --surface2: rgba(255,255,255,0.08);
    --border:   rgba(255,255,255,0.09);
    --border2:  rgba(255,255,255,0.14);

    --text:     #d0e8f0;
    --text2:    #8fb8c9;
    --text3:    #3d5a72;

    --header-bg:     linear-gradient(135deg,#0d2d42,#08202f);
    --header-border: rgba(34,211,238,0.13);

    --card-bg:     rgba(255,255,255,0.04);
    --card-border: rgba(255,255,255,0.09);
    --card-hover:  0 8px 32px rgba(0,0,0,0.5);

    --modal-bg:      #071d2b;
    --modal-border:  rgba(34,211,238,0.15);
    --modal-shadow:  0 25px 70px rgba(0,0,0,0.7);
    --modal-header:  linear-gradient(135deg,#0d2d42,#0c3348);

    --input-bg:     rgba(255,255,255,0.07);
    --input-border: rgba(255,255,255,0.15);
    --input-txt:    #d0e8f0;
    --input-ph:     #3d5a72;

    --nav-bg:         #03101a;
    --nav-border:     rgba(255,255,255,0.07);
    --nav-tab-txt:    #2e5068;
    --nav-tab-hover:  rgba(255,255,255,0.04);
    --nav-mo-active:  linear-gradient(135deg,#7c3aed,#6d28d9);
    --nav-sr-active:  linear-gradient(135deg,#0e7490,#0891b2);
    --nav-ov-active:  linear-gradient(135deg,#991b1b,#dc2626);

    --tc-bg:      rgba(7,29,43,0.9);
    --tc-border:  rgba(255,255,255,0.08);
    --tc-head-bg: rgba(255,255,255,0.04);
    --tc-sep:     rgba(255,255,255,0.07);
    --tc-lbl-c:   #3d5a72;
    --tc-val-c:   #d0e8f0;
    --tc-mo-c:    #d0e8f0;

    --month-h3:          #d0e8f0;
    --month-total-lbl:   #3d5a72;
    --month-msp-lbl:     #3d5a72;
    --month-footer-txt:  rgba(255,255,255,0.5);

    --td-number-c:      #eaf4f8;
    --td-card-bg:       linear-gradient(160deg,#0c2638,#081e2b);
    --td-card-border:   rgba(255,255,255,0.09);
    --td-hdr-bg:        linear-gradient(135deg,#0b2336,#071a27);
    --td-hdr-border:    rgba(34,211,238,0.08);
    --td-hdr-h3:        #1e4d66;
    --td-label-c:       #1a6a8a;
    --td-value-bg:      rgba(0,0,0,0.28);
    --td-value-border:  rgba(255,255,255,0.06);
    --td-value-c:       #6a8da5;
    --td-highlight-bg:  rgba(14,116,144,0.07);
    --td-highlight-brd: rgba(34,211,238,0.14);
    --td-highlight-c:   #7dd3fc;
    --td-note-bg:       rgba(0,0,0,0.25);
    --td-note-border:   #1a6a8a;
    --td-note-author:   #38bdf8;
    --td-note-txt:      #6a8da5;
    --td-input-bg:      rgba(0,0,0,0.28);
    --td-input-border:  rgba(255,255,255,0.09);
    --td-input-txt:     #dde6f0;
    --td-body-c:        #94a3b8;

    --overlay-content-bg:     #03101a;
    --overlay-content-border: rgba(34,211,238,0.13);
    --overlay-hdr-bg:   linear-gradient(135deg,#0b2336,#071a27);
    --overlay-hdr-brd:  rgba(34,211,238,0.1);
    --btn-back-bg:      rgba(255,255,255,0.05);
    --btn-back-border:  rgba(255,255,255,0.1);

    --month-modal-overlay: rgba(0,0,0,0.7);
    --month-modal-bg:    #071d2b;
    --month-modal-hdr:   linear-gradient(135deg,#0d2d42,#0c3348);
    --month-modal-hdr-txt:#d0e8f0;
    --month-modal-sub:   #3d5a72;
    --month-search-bg:   rgba(0,0,0,0.3);
    --month-search-c:    #94a3b8;
    --month-filter-bg:   rgba(0,0,0,0.3);
    --month-filter-c:    #94a3b8;
    --month-empty-c:     rgba(255,255,255,0.4);
    --month-empty-h3:    rgba(255,255,255,0.6);

    --overdue-card-bg:    linear-gradient(160deg,#0c2638,#081e2b);
    --overdue-card-brd:   rgba(127,29,29,0.5);
    --overdue-title-c:    #d0e8f0;
    --overdue-meta-lbl:   #1e4d66;
    --overdue-value-c:    #8fb8c9;
    --overdue-deadline-c: #f87171;

    --drawer-bg:           #030d14;
    --drawer-hdr-bg:       #04111b;
    --drawer-hdr-border:   rgba(255,255,255,0.06);
    --drawer-h2-c:         #eaf4f8;
    --drawer-sub-c:        #1a6a8a;
    --drawer-nav-c:        #1e4d66;
    --drawer-nav-hover-bg: rgba(255,255,255,0.02);
    --drawer-nav-hover-c:  #5a8a9f;
    --drawer-nav-active-bg:#22d3ee;
    --drawer-nav-active-c: #22d3ee;
    --drawer-user-bg:      rgba(255,255,255,0.02);
    --drawer-user-brd:     rgba(255,255,255,0.06);
    --drawer-user-name:    #eaf4f8;
    --drawer-logo-border:  rgba(255,255,255,0.08);

    --badge-pending-bg:  rgba(245,158,11,0.10);  --badge-pending-brd: rgba(245,158,11,0.27);  --badge-pending-c:   #fbbf24;
    --badge-done-bg:     rgba(16,185,129,0.10);  --badge-done-brd:    rgba(16,185,129,0.25);  --badge-done-c:      #34d399;
    --badge-cd-bg:       rgba(168,85,247,0.10);  --badge-cd-brd:      rgba(168,85,247,0.25);  --badge-cd-c:        #c084fc;
    --badge-overdue-bg:  rgba(239,68,68,0.10);   --badge-overdue-brd: rgba(239,68,68,0.27);   --badge-overdue-c:   #f87171;

    --on-hold-modal-bg:   #1a4d66;
    --on-hold-textarea-bg:rgba(0,0,0,0.3);
    --on-hold-textarea-c: #94a3b8;
    --on-hold-txt:        rgba(255,255,255,0.18);

    --refresh-bg:   rgba(0,0,0,0.35);
    --refresh-c:    #38bdf8;
    --offline-bg:   rgba(127,29,29,0.9);
    --offline-c:    #fca5a5;

    --scrollbar-track: rgba(0,150,180,0.05);
    --scrollbar-thumb: rgba(0,150,180,0.28);

    --toggle-bg:     rgba(34,211,238,0.07);
    --toggle-border: rgba(34,211,238,0.20);
    --toggle-txt:    #7dd3fc;
}

/* ── LIGHT ── */
[data-theme="light"] {
    --bg:       #eaf5f8;
    --bg2:      #daeef5;
    --surface:  #ffffff;
    --surface2: #f0f9fc;
    --border:   rgba(0,150,180,0.18);
    --border2:  rgba(0,150,180,0.28);

    --text:     #0d2838;
    --text2:    #1e4a5e;
    --text3:    #7a9baa;

    --header-bg:     linear-gradient(135deg,#0097A7,#00B8D4);
    --header-border: rgba(0,150,180,0.3);

    --card-bg:     #ffffff;
    --card-border: rgba(0,150,180,0.18);
    --card-hover:  0 8px 32px rgba(0,120,160,0.15);

    --modal-bg:     #ffffff;
    --modal-border: rgba(0,150,180,0.20);
    --modal-shadow: 0 25px 70px rgba(0,80,110,0.20);
    --modal-header: linear-gradient(135deg,#0097A7,#00B8D4);

    --input-bg:     #f0f9fc;
    --input-border: rgba(0,184,212,0.35);
    --input-txt:    #0d2838;
    --input-ph:     #7a9baa;

    --nav-bg:         #ffffff;
    --nav-border:     rgba(0,150,180,0.18);
    --nav-tab-txt:    #4a7585;
    --nav-tab-hover:  rgba(0,184,212,0.08);
    --nav-mo-active:  linear-gradient(135deg,#6d28d9,#7c3aed);
    --nav-sr-active:  linear-gradient(135deg,#0097A7,#00B8D4);
    --nav-ov-active:  linear-gradient(135deg,#b91c1c,#dc2626);

    --tc-bg:      #ffffff;
    --tc-border:  rgba(0,150,180,0.18);
    --tc-head-bg: rgba(0,184,212,0.06);
    --tc-sep:     rgba(0,150,180,0.12);
    --tc-lbl-c:   #4a7585;
    --tc-val-c:   #0d2838;
    --tc-mo-c:    #0d2838;

    --month-h3:          #0d2838;
    --month-total-lbl:   #4a7585;
    --month-msp-lbl:     #4a7585;
    --month-footer-txt:  #0097A7;

    --td-number-c:      #0d2838;
    --td-card-bg:       #ffffff;
    --td-card-border:   rgba(0,150,180,0.18);
    --td-hdr-bg:        rgba(0,184,212,0.08);
    --td-hdr-border:    rgba(0,150,180,0.15);
    --td-hdr-h3:        #005f6e;
    --td-label-c:       #4a7585;
    --td-value-bg:      #f0f9fc;
    --td-value-border:  rgba(0,150,180,0.18);
    --td-value-c:       #0d2838;
    --td-highlight-bg:  rgba(0,184,212,0.07);
    --td-highlight-brd: rgba(0,184,212,0.25);
    --td-highlight-c:   #005f6e;
    --td-note-bg:       #f0f9fc;
    --td-note-border:   #0097A7;
    --td-note-author:   #0097A7;
    --td-note-txt:      #0d2838;
    --td-input-bg:      #f0f9fc;
    --td-input-border:  rgba(0,184,212,0.35);
    --td-input-txt:     #0d2838;
    --td-body-c:        #1e4a5e;

    --overlay-content-bg:     #ffffff;
    --overlay-content-border: rgba(0,150,180,0.22);
    --overlay-hdr-bg:   linear-gradient(135deg,#0097A7,#00B8D4);
    --overlay-hdr-brd:  rgba(0,150,180,0.20);
    --btn-back-bg:      rgba(255,255,255,0.22);
    --btn-back-border:  rgba(255,255,255,0.40);

    --month-modal-overlay: rgba(0,60,80,0.52);
    --month-modal-bg:    #ffffff;
    --month-modal-hdr:   linear-gradient(135deg,#0097A7,#00B8D4);
    --month-modal-hdr-txt:#ffffff;
    --month-modal-sub:   rgba(255,255,255,0.8);
    --month-search-bg:   #f0f9fc;
    --month-search-c:    #0d2838;
    --month-filter-bg:   #f0f9fc;
    --month-filter-c:    #0d2838;
    --month-empty-c:     #4a7585;
    --month-empty-h3:    #0d2838;

    --overdue-card-bg:    #ffffff;
    --overdue-card-brd:   rgba(185,28,28,0.30);
    --overdue-title-c:    #0d2838;
    --overdue-meta-lbl:   #4a7585;
    --overdue-value-c:    #1e4a5e;
    --overdue-deadline-c: #b91c1c;

    --drawer-bg:           #005f6e;
    --drawer-hdr-bg:       #004d5a;
    --drawer-hdr-border:   rgba(255,255,255,0.15);
    --drawer-h2-c:         #ffffff;
    --drawer-sub-c:        rgba(255,255,255,0.65);
    --drawer-nav-c:        rgba(255,255,255,0.65);
    --drawer-nav-hover-bg: rgba(255,255,255,0.10);
    --drawer-nav-hover-c:  #ffffff;
    --drawer-nav-active-bg:rgba(255,255,255,0.18);
    --drawer-nav-active-c: #ffffff;
    --drawer-user-bg:      rgba(255,255,255,0.12);
    --drawer-user-brd:     rgba(255,255,255,0.20);
    --drawer-user-name:    #ffffff;
    --drawer-logo-border:  rgba(255,255,255,0.20);

    --badge-pending-bg:  rgba(180,83,9,0.10);   --badge-pending-brd: rgba(180,83,9,0.30);   --badge-pending-c:   #92400e;
    --badge-done-bg:     rgba(22,163,74,0.10);  --badge-done-brd:    rgba(22,163,74,0.28);  --badge-done-c:      #14532d;
    --badge-cd-bg:       rgba(126,34,206,0.10); --badge-cd-brd:      rgba(126,34,206,0.28); --badge-cd-c:        #6b21a8;
    --badge-overdue-bg:  rgba(185,28,28,0.10);  --badge-overdue-brd: rgba(185,28,28,0.30);  --badge-overdue-c:   #b91c1c;

    --on-hold-modal-bg:   #e0f5f8;
    --on-hold-textarea-bg:#f0f9fc;
    --on-hold-textarea-c: #0d2838;
    --on-hold-txt:        rgba(0,80,100,0.35);

    --refresh-bg:   rgba(0,184,212,0.12);
    --refresh-c:    #005f6e;
    --offline-bg:   rgba(185,28,28,0.95);
    --offline-c:    #fee2e2;

    --scrollbar-track: rgba(0,150,180,0.06);
    --scrollbar-thumb: rgba(0,150,180,0.28);

    --toggle-bg:     rgba(0,0,0,0.15);
    --toggle-border: rgba(255,255,255,0.35);
    --toggle-txt:    #ffffff;
}

/* ═══════════════════════════════════════════════════════════
   APPLY VARIABLES
═══════════════════════════════════════════════════════════ */

body { background: var(--bg) !important; color: var(--text) !important; transition: background 0.3s, color 0.3s; }

/* Header */
header { background: var(--header-bg) !important; border-color: var(--header-border) !important; transition: background 0.3s; }
.header-title h1 { color: #fff !important; }
.header-title p  { color: rgba(255,255,255,0.85) !important; }
.tech-info {
    background: rgba(255,255,255,0.18) !important;
    border-color: rgba(255,255,255,0.30) !important;
    color: #ffffff !important;
}
[data-theme="light"] #techName { color: #ffffff !important; }
.hamburger-btn { background: rgba(0,0,0,0.15) !important; border-color: rgba(255,255,255,0.25) !important; }
.hamburger-btn span { background: #ffffff !important; }

/* Nav tabs */
.nav-tabs-bar { background: var(--nav-bg) !important; border-color: var(--nav-border) !important; }
.nav-tab { color: var(--nav-tab-txt) !important; }
.nav-tab:hover { background: var(--nav-tab-hover) !important; color: var(--nwd-primary) !important; }
.nav-tab[data-view="mo"].active      { background: var(--nav-mo-active) !important; color: #fff !important; }
.nav-tab[data-view="sr"].active      { background: var(--nav-sr-active) !important; color: #fff !important; }
.nav-tab[data-view="overdue"].active { background: var(--nav-ov-active) !important; color: #fff !important; }

/* Month grid cards */
.month-card { background: var(--card-bg) !important; border-color: var(--card-border) !important; transition: background 0.3s, border-color 0.3s; }
.month-card:hover { box-shadow: var(--card-hover) !important; border-color: rgba(0,184,212,0.40) !important; }
.month-card h3 { color: var(--month-h3) !important; }
.month-card-total-lbl { color: var(--month-total-lbl) !important; }
.msp-lbl { color: var(--month-msp-lbl) !important; }
.month-card-footer { color: var(--month-footer-txt) !important; }

/* Task cards (tc) */
.tc { background: var(--tc-bg) !important; border-color: var(--tc-border) !important; }
.tc__head { background: var(--tc-head-bg) !important; }
.tc__sep  { background: var(--tc-sep) !important; }
.tc__mo   { color: var(--tc-mo-c) !important; }
.tc__lbl  { color: var(--tc-lbl-c) !important; }
.tc__val  { color: var(--tc-val-c) !important; }
.tc__colon { color: var(--tc-lbl-c) !important; }

/* Month modal backdrop */
#monthModal { background: var(--month-modal-overlay) !important; }

/* Month modal content */
.month-modal-content { background: var(--month-modal-bg) !important; border-color: var(--modal-border) !important; box-shadow: var(--modal-shadow) !important; }
.month-modal-header  { background: var(--month-modal-hdr) !important; }
.month-modal-header h2,
.month-modal-title    { color: var(--month-modal-hdr-txt) !important; }
.month-modal-subtitle { color: var(--month-modal-sub) !important; }
[data-theme="light"] .month-modal-close { color: #fff !important; background: rgba(255,255,255,0.20) !important; }

/* Month modal filters */
#monthSearchInput, #monthFilterStatus, #monthFilterReport, #monthSortSelect {
    background: var(--month-search-bg) !important;
    border-color: var(--input-border) !important;
    color: var(--month-search-c) !important;
}
#monthSearchInput::placeholder { color: var(--input-ph) !important; }
[data-theme="light"] #monthSearchInput ~ * { color: var(--text) !important; }
[data-theme="light"] #monthFilterStatus option,
[data-theme="light"] #monthSortSelect option { background: #fff !important; color: #0d2838 !important; }

/* Month modal empty state */
[data-theme="light"] .month-tasks-empty p { color: var(--month-empty-c) !important; }
[data-theme="light"] .month-tasks-empty h3 { color: var(--month-empty-h3) !important; }

/* Task Detail Overlay (month → task) */
#taskDetailOverlay { background: rgba(0,0,0,0.78) !important; }
[data-theme="light"] #taskDetailOverlay { background: var(--month-modal-overlay) !important; }
.task-detail-overlay-content {
    background: var(--overlay-content-bg) !important;
    border-color: var(--overlay-content-border) !important;
}
.task-detail-overlay-header {
    background: var(--overlay-hdr-bg) !important;
    border-bottom-color: var(--overlay-hdr-brd) !important;
}
.task-detail-overlay-body { color: var(--td-body-c) !important; }
.btn-back-overlay {
    background: var(--btn-back-bg) !important;
    border-color: var(--btn-back-border) !important;
    color: #fff !important;
}

/* Task modal (from quick search / overdue) */
#taskModal .modal-content { background: var(--overlay-content-bg) !important; border-color: var(--overlay-content-border) !important; }
#taskModal .modal-body { color: var(--td-body-c) !important; }

/* td- detail components */
.td-header-banner { background: linear-gradient(135deg,#00B8D4,#0097A7) !important; }
.td-number { color: var(--td-number-c) !important; }
[data-theme="light"] .td-number { color: #ffffff !important; } /* on gradient banner */

.td-info-card {
    background: var(--td-card-bg) !important;
    border-color: var(--td-card-border) !important;
}
.td-card-header {
    background: var(--td-hdr-bg) !important;
    border-bottom-color: var(--td-hdr-border) !important;
}
.td-card-header h3 { color: var(--td-hdr-h3) !important; }
.td-info-label { color: var(--td-label-c) !important; }
.td-info-value {
    background: var(--td-value-bg) !important;
    border-color: var(--td-value-border) !important;
    color: var(--td-value-c) !important;
}
.td-info-value.td-highlight {
    background: var(--td-highlight-bg) !important;
    border-color: var(--td-highlight-brd) !important;
    color: var(--td-highlight-c) !important;
}
.td-note-item {
    background: var(--td-note-bg) !important;
    border-left-color: var(--td-note-border) !important;
}
.td-note-header strong { color: var(--td-note-author) !important; }
.td-note-content { color: var(--td-note-txt) !important; }
.td-note-time { color: var(--text3) !important; }
.td-modern-input {
    background: var(--td-input-bg) !important;
    border-color: var(--td-input-border) !important;
    color: var(--td-input-txt) !important;
}
.td-modern-input::placeholder { color: var(--input-ph) !important; }
.td-modern-input:focus { border-color: var(--nwd-primary) !important; }

/* Light: action buttons inside task detail stay legible */
[data-theme="light"] .task-detail-overlay-body p[style],
[data-theme="light"] .task-detail-overlay-body .add-note-modern p { color: var(--text2) !important; }
[data-theme="light"] .td-overdue-text { color: #b91c1c !important; }

/* Badges */
.badge.pending  { background: var(--badge-pending-bg) !important; border-color: var(--badge-pending-brd) !important; color: var(--badge-pending-c) !important; }
.badge.completed{ background: var(--badge-done-bg) !important;    border-color: var(--badge-done-brd) !important;    color: var(--badge-done-c) !important; }
.badge.completed-delayed { background: var(--badge-cd-bg) !important; border-color: var(--badge-cd-brd) !important; color: var(--badge-cd-c) !important; }
.badge.overdue  { background: var(--badge-overdue-bg) !important; border-color: var(--badge-overdue-brd) !important; color: var(--badge-overdue-c) !important; }

/* Overdue panel cards */
.overdue-task-card {
    background: var(--overdue-card-bg) !important;
    border-color: var(--overdue-card-brd) !important;
}
.overdue-task-title { color: var(--overdue-title-c) !important; }
.overdue-meta-label { color: var(--overdue-meta-lbl) !important; }
[data-theme="light"] .overdue-task-card span:not(.overdue-badge *) { color: var(--overdue-value-c) !important; }
[data-theme="light"] .overdue-deadline { color: var(--overdue-deadline-c) !important; }
[data-theme="light"] .overdue-days { color: #ffffff !important; } /* on red badge, stays white */

/* Side drawer */
.side-drawer { background: var(--drawer-bg) !important; }
.drawer-header { background: var(--drawer-hdr-bg) !important; border-bottom-color: var(--drawer-hdr-border) !important; }
.drawer-header-text h2 { color: var(--drawer-h2-c) !important; }
.drawer-header-text p  { color: var(--drawer-sub-c) !important; }
.drawer-nav-item { color: var(--drawer-nav-c) !important; }
.drawer-nav-item:hover { background: var(--drawer-nav-hover-bg) !important; color: var(--drawer-nav-hover-c) !important; }
.drawer-nav-item.active { background: var(--drawer-nav-active-bg) !important; color: var(--drawer-nav-active-c) !important; border-left-color: var(--drawer-nav-active-c) !important; }
.drawer-user-box { background: var(--drawer-user-bg) !important; border-color: var(--drawer-user-brd) !important; }
.drawer-user-name { color: var(--drawer-user-name) !important; }
[data-theme="light"] .drawer-logo { border-color: var(--drawer-logo-border) !important; }
[data-theme="light"] .btn-drawer-logout { border-color: rgba(255,255,255,0.35) !important; color: rgba(255,255,255,0.85) !important; }
[data-theme="light"] .btn-drawer-logout:hover { background: rgba(255,255,255,0.18) !important; color: #fff !important; }

/* Quick search */
.quick-search-bar {
    background: var(--input-bg) !important;
    border-color: var(--border2) !important;
}
[data-theme="light"] .quick-search-bar { box-shadow: 0 2px 8px rgba(0,150,180,0.10) !important; }
.quick-search-bar input { background: transparent !important; color: var(--input-txt) !important; }
.quick-search-bar input::placeholder { color: var(--input-ph) !important; }
[data-theme="light"] .search-icon { color: var(--nwd-primary) !important; }
#quickSearchResults { background: var(--modal-bg) !important; border-color: var(--modal-border) !important; }
.quick-search-item { color: var(--text) !important; border-bottom-color: var(--border) !important; }
.quick-search-item:hover { background: var(--nwd-primary-dim) !important; }
.search-item-title { color: var(--text) !important; }
.search-item-meta { color: var(--text3) !important; }

/* On-Hold modal */
[data-theme="light"] #onHoldModal .modal-content,
[data-theme="light"] .on-hold-modal-content { background: var(--on-hold-modal-bg) !important; }
[data-theme="light"] #onHoldReason {
    background: var(--on-hold-textarea-bg) !important;
    border-color: var(--input-border) !important;
    color: var(--on-hold-textarea-c) !important;
}
[data-theme="light"] .on-hold-note { color: var(--on-hold-txt) !important; }

/* Refresh indicator */
#refreshIndicator { background: var(--refresh-bg) !important; color: var(--refresh-c) !important; }

/* Offline banner */
#offlineBanner { background: var(--offline-bg) !important; color: var(--offline-c) !important; }

/* Empty states */
[data-theme="light"] .empty-state h3 { color: var(--text) !important; }
[data-theme="light"] .empty-state p  { color: var(--text3) !important; }

/* General light text cleanup */
[data-theme="light"] h1, [data-theme="light"] h2,
[data-theme="light"] h3, [data-theme="light"] h4 { color: var(--text) !important; }

/* Scrollbars */
::-webkit-scrollbar-track { background: var(--scrollbar-track) !important; }
::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb) !important; }

/* ═══════════════════════════════════════════════════════════
   THEME TOGGLE BUTTON
═══════════════════════════════════════════════════════════ */

#themeToggleBtn {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 7px 13px;
    background: var(--toggle-bg);
    border: 1.5px solid var(--toggle-border);
    border-radius: 20px;
    color: var(--toggle-txt);
    font-size: 0.79rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.25s ease;
    font-family: inherit;
    white-space: nowrap;
    user-select: none;
    flex-shrink: 0;
}
#themeToggleBtn:hover {
    background: rgba(255,255,255,0.25);
    border-color: rgba(255,255,255,0.55);
    color: #fff;
    transform: scale(1.05);
}
.theme-toggle-icon { font-size: 0.95rem; line-height: 1; transition: transform 0.4s ease; }
#themeToggleBtn:hover .theme-toggle-icon { transform: rotate(20deg); }
.theme-toggle-label { font-size: 0.78rem; letter-spacing: 0.3px; }