/* ═══════════════════════════════════════════════════════════
   CSI Theme System — Premium Dashboard Themes
   Inspired by: Halo Lab, awsmd, Zajno, Shakuro
   ═══════════════════════════════════════════════════════════ */

/* ── Halo Lab — Futuristic / Glassmorphism ────────────── */
[data-theme="dark"] {
    --bg-body: #0B0D19;
    --bg-navbar: rgba(15, 17, 30, 0.85);
    --bg-container: rgba(255, 255, 255, 0.04);
    --bg-form: rgba(255, 255, 255, 0.06);
    --bg-dropdown: rgba(20, 22, 40, 0.95);
    --bg-card: rgba(255, 255, 255, 0.04);
    --bg-select2: rgba(255, 255, 255, 0.06);
    --bg-select2-dropdown: rgba(20, 22, 40, 0.95);
    --bg-select2-search: rgba(255, 255, 255, 0.08);
    --bg-toolbar: linear-gradient(180deg, rgba(11,13,25,0.95) 0%, rgba(11,13,25,0.85) 100%);
    --bg-bottombar: rgba(11, 13, 25, 0.9);
    --bg-popover: rgba(20, 22, 40, 0.95);
    --bg-table: rgba(255, 255, 255, 0.02);
    --bg-table-header: rgba(255, 255, 255, 0.04);
    --bg-table-stripe: rgba(255, 255, 255, 0.015);
    --bg-table-hover: rgba(108, 92, 231, 0.15);
    --bg-card-config: rgba(255, 255, 255, 0.05);
    --text-primary: #EAEDF3;
    --text-secondary: #9CA3B8;
    --text-muted: #6B7088;
    --text-link: #818CF8;
    --text-on-navbar: rgba(255,255,255,0.7);
    --text-navbar-brand: #EAEDF3;
    --border-color: rgba(255, 255, 255, 0.06);
    --border-light: rgba(255, 255, 255, 0.08);
    --border-toolbar: rgba(255, 255, 255, 0.04);
    --border-bottombar: rgba(255, 255, 255, 0.06);
    --accent-color: #6C5CE7;
    --accent-hover: #5B4BD5;
    --btn-primary-bg: #6C5CE7;
    --btn-primary-hover: #5B4BD5;
    --toast-bg: #10B981;
    --toast-header-bg: #059669;
    --shadow-container: 0 4px 24px rgba(0, 0, 0, 0.3);
    --shadow-btn: rgba(108, 92, 231, 0.25);
    --select2-highlight: #6C5CE7;
    --select2-selected: #5B4BD5;
    --form-option-bg: #141628;
    --nav-hover-bg: rgba(255, 255, 255, 0.05);
    --dropdown-hover: rgba(108, 92, 231, 0.15);
    --focus-glow: rgba(108, 92, 231, 0.3);
    --navbar-toggler-filter: none;
    --bg-badge-soft: rgba(108, 92, 231, 0.15);
    --text-badge-soft: #A5B4FC;
    --card-radius: 20px;
    --card-border: 1px solid rgba(255, 255, 255, 0.06);
    --card-backdrop: blur(20px);
    --gradient-accent: linear-gradient(135deg, #6C5CE7, #00B4D8);
}

/* ── awsmd — Clean / Professional ─────────────────────── */
[data-theme="light"] {
    --bg-body: #F5F6FA;
    --bg-navbar: #FFFFFF;
    --bg-container: #FFFFFF;
    --bg-form: #FFFFFF;
    --bg-dropdown: #FFFFFF;
    --bg-card: #FFFFFF;
    --bg-select2: #FFFFFF;
    --bg-select2-dropdown: #FFFFFF;
    --bg-select2-search: #F9FAFB;
    --bg-toolbar: linear-gradient(180deg, #FFFFFF 0%, rgba(255,255,255,0.97) 100%);
    --bg-bottombar: #FFFFFF;
    --bg-popover: #FFFFFF;
    --bg-table: #FFFFFF;
    --bg-table-header: #F9FAFB;
    --bg-table-stripe: rgba(0, 0, 0, 0.015);
    --bg-table-hover: rgba(79, 70, 229, 0.04);
    --bg-card-config: #F9FAFB;
    --text-primary: #111827;
    --text-secondary: #4B5563;
    --text-muted: #9CA3AF;
    --text-link: #4F46E5;
    --text-on-navbar: #4B5563;
    --text-navbar-brand: #111827;
    --border-color: #E5E7EB;
    --border-light: rgba(0, 0, 0, 0.08);
    --border-toolbar: rgba(0, 0, 0, 0.04);
    --border-bottombar: #E5E7EB;
    --accent-color: #4F46E5;
    --accent-hover: #4338CA;
    --btn-primary-bg: #4F46E5;
    --btn-primary-hover: #4338CA;
    --toast-bg: #10B981;
    --toast-header-bg: #059669;
    --shadow-container: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
    --shadow-btn: rgba(0, 0, 0, 0.08);
    --select2-highlight: #4F46E5;
    --select2-selected: #4338CA;
    --form-option-bg: #FFFFFF;
    --nav-hover-bg: rgba(79, 70, 229, 0.04);
    --dropdown-hover: #F5F6FA;
    --focus-glow: rgba(79, 70, 229, 0.2);
    --navbar-toggler-filter: none;
    --bg-badge-soft: rgba(79, 70, 229, 0.08);
    --text-badge-soft: #4F46E5;
    --card-radius: 14px;
    --card-border: none;
    --card-backdrop: none;
    --gradient-accent: linear-gradient(135deg, #4F46E5, #7C3AED);
}

/* ── Zajno — Premium / Cinematic ──────────────────────── */
[data-theme="midnight"] {
    --bg-body: #08080C;
    --bg-navbar: #101014;
    --bg-container: #141419;
    --bg-form: #1C1C24;
    --bg-dropdown: #141419;
    --bg-card: #141419;
    --bg-select2: #1C1C24;
    --bg-select2-dropdown: #141419;
    --bg-select2-search: #1C1C24;
    --bg-toolbar: linear-gradient(180deg, #08080C 0%, rgba(8,8,12,0.97) 100%);
    --bg-bottombar: #101014;
    --bg-popover: #141419;
    --bg-table: #101014;
    --bg-table-header: #18181F;
    --bg-table-stripe: rgba(255, 255, 255, 0.01);
    --bg-table-hover: rgba(124, 58, 237, 0.12);
    --bg-card-config: #18181F;
    --text-primary: rgba(255, 255, 255, 0.92);
    --text-secondary: rgba(255, 255, 255, 0.55);
    --text-muted: rgba(255, 255, 255, 0.3);
    --text-link: #A78BFA;
    --text-on-navbar: rgba(255, 255, 255, 0.5);
    --text-navbar-brand: rgba(255, 255, 255, 0.9);
    --border-color: rgba(255, 255, 255, 0.04);
    --border-light: rgba(255, 255, 255, 0.06);
    --border-toolbar: rgba(255, 255, 255, 0.03);
    --border-bottombar: rgba(255, 255, 255, 0.04);
    --accent-color: #7C3AED;
    --accent-hover: #6D28D9;
    --btn-primary-bg: #7C3AED;
    --btn-primary-hover: #6D28D9;
    --toast-bg: #D4A853;
    --toast-header-bg: #B8923F;
    --shadow-container: 0 8px 32px rgba(0, 0, 0, 0.5);
    --shadow-btn: rgba(124, 58, 237, 0.3);
    --select2-highlight: #7C3AED;
    --select2-selected: #6D28D9;
    --form-option-bg: #141419;
    --nav-hover-bg: rgba(255, 255, 255, 0.03);
    --dropdown-hover: rgba(124, 58, 237, 0.1);
    --focus-glow: rgba(124, 58, 237, 0.25);
    --navbar-toggler-filter: none;
    --bg-badge-soft: rgba(124, 58, 237, 0.12);
    --text-badge-soft: #C4B5FD;
    --card-radius: 12px;
    --card-border: 1px solid rgba(255, 255, 255, 0.04);
    --card-backdrop: none;
    --gradient-accent: linear-gradient(135deg, #7C3AED, #D4A853);
}

/* ── Shakuro — Vibrant / Friendly ─────────────────────── */
[data-theme="forest"] {
    --bg-body: #0A1628;
    --bg-navbar: #0F1D35;
    --bg-container: #111D35;
    --bg-form: #162544;
    --bg-dropdown: #111D35;
    --bg-card: #111D35;
    --bg-select2: #162544;
    --bg-select2-dropdown: #111D35;
    --bg-select2-search: #162544;
    --bg-toolbar: linear-gradient(180deg, #0A1628 0%, rgba(10,22,40,0.97) 100%);
    --bg-bottombar: #0F1D35;
    --bg-popover: #111D35;
    --bg-table: #0F1D35;
    --bg-table-header: #142240;
    --bg-table-stripe: rgba(255, 255, 255, 0.015);
    --bg-table-hover: rgba(59, 130, 246, 0.12);
    --bg-card-config: #162544;
    --text-primary: #F1F5F9;
    --text-secondary: #94A3B8;
    --text-muted: #64748B;
    --text-link: #60A5FA;
    --text-on-navbar: #94A3B8;
    --text-navbar-brand: #F1F5F9;
    --border-color: rgba(255, 255, 255, 0.06);
    --border-light: rgba(255, 255, 255, 0.08);
    --border-toolbar: rgba(255, 255, 255, 0.04);
    --border-bottombar: rgba(59, 130, 246, 0.15);
    --accent-color: #3B82F6;
    --accent-hover: #2563EB;
    --btn-primary-bg: #3B82F6;
    --btn-primary-hover: #2563EB;
    --toast-bg: #22C55E;
    --toast-header-bg: #16A34A;
    --shadow-container: 0 4px 16px rgba(0, 0, 0, 0.3);
    --shadow-btn: rgba(59, 130, 246, 0.25);
    --select2-highlight: #3B82F6;
    --select2-selected: #2563EB;
    --form-option-bg: #111D35;
    --nav-hover-bg: rgba(59, 130, 246, 0.08);
    --dropdown-hover: rgba(59, 130, 246, 0.1);
    --focus-glow: rgba(59, 130, 246, 0.25);
    --navbar-toggler-filter: none;
    --bg-badge-soft: rgba(59, 130, 246, 0.12);
    --text-badge-soft: #93C5FD;
    --card-radius: 18px;
    --card-border: 1px solid rgba(255, 255, 255, 0.06);
    --card-backdrop: none;
    --gradient-accent: linear-gradient(135deg, #3B82F6, #8B5CF6);
}

/* ═══════════════════════════════════════════════════════════
   Apply to ALL themes
   ═══════════════════════════════════════════════════════════ */

body { background-color: var(--bg-body) !important; color: var(--text-primary) !important; }
.navbar { background-color: var(--bg-navbar) !important; }
.navbar-brand { color: var(--text-navbar-brand) !important; }
.navbar-nav .nav-link { color: var(--text-on-navbar) !important; }
.navbar-nav .nav-link:hover { background-color: var(--nav-hover-bg) !important; color: var(--text-primary) !important; }
.navbar-toggler-icon { filter: var(--navbar-toggler-filter); }
#navbarDropdown { color: var(--text-on-navbar) !important; }

.container {
    background-color: var(--bg-container) !important;
    box-shadow: var(--shadow-container) !important;
    border-radius: var(--card-radius, 14px) !important;
    border: var(--card-border, none) !important;
}

/* Forms */
.form-control, .form-select, .form-themed { background-color: var(--bg-form) !important; color: var(--text-primary) !important; border-color: var(--border-color) !important; border-radius: 10px; }
.form-control::placeholder { color: var(--text-muted) !important; }
.form-select option { background-color: var(--form-option-bg) !important; color: var(--text-primary) !important; }
.form-control:focus, .form-select:focus { box-shadow: 0 0 0 3px var(--focus-glow) !important; border-color: var(--accent-color) !important; }
.form-text { color: var(--text-muted) !important; }
.form-label { color: var(--text-secondary) !important; }
.form-check-input { background-color: var(--bg-form) !important; border-color: var(--border-color) !important; }
.form-check-input:checked { background-color: var(--accent-color) !important; border-color: var(--accent-color) !important; }
.form-check-label { color: var(--text-primary) !important; }
.input-group-text { background-color: var(--bg-form) !important; color: var(--text-secondary) !important; border-color: var(--border-color) !important; }

/* Buttons — primary */
.btn-primary { background: var(--gradient-accent, var(--btn-primary-bg)) !important; border: none !important; border-radius: 10px; color: #fff !important; }
.btn-primary:hover { filter: brightness(1.1); box-shadow: 0 4px 12px var(--shadow-btn) !important; color: #fff !important; }

/* Buttons — secondary (theme-aware) */
.btn-secondary { background-color: var(--bg-form) !important; color: var(--text-primary) !important; border: 1px solid var(--border-color) !important; }
.btn-secondary:hover { background-color: var(--nav-hover-bg) !important; color: var(--text-primary) !important; }

/* Buttons — outline variants (theme-aware text) */
.btn-outline-light { color: var(--text-primary) !important; border-color: var(--border-light) !important; }
.btn-outline-light:hover { background-color: var(--nav-hover-bg) !important; color: var(--text-primary) !important; }
.btn-outline-secondary { color: var(--text-secondary) !important; border-color: var(--border-color) !important; }
.btn-outline-secondary:hover { background-color: var(--nav-hover-bg) !important; color: var(--text-primary) !important; }

/* Buttons — close (modal/alert close btn) */
.btn-close { filter: var(--btn-close-filter, invert(1) grayscale(100%) brightness(200%)); opacity: 0.7; }
.btn-close:hover { opacity: 1; }

/* Cards */
.card { background-color: var(--bg-card) !important; border: var(--card-border, none) !important; border-radius: var(--card-radius, 14px) !important; }
.card-header { color: var(--text-primary) !important; border-radius: var(--card-radius, 14px) var(--card-radius, 14px) 0 0 !important; }
.card-body { color: var(--text-primary) !important; }
.bg-dark { background-color: var(--bg-card) !important; }

/* Tables */
.table-dark, .table { --bs-table-bg: var(--bg-table); --bs-table-color: var(--text-primary); --bs-table-border-color: var(--border-color); --bs-table-striped-bg: var(--bg-table-stripe); --bs-table-striped-color: var(--text-primary); --bs-table-hover-bg: var(--bg-table-hover); --bs-table-hover-color: var(--text-primary); }
.table-dark th, .table th { background-color: var(--bg-table-header) !important; color: var(--text-primary) !important; font-weight: 600; text-transform: uppercase; font-size: 0.7rem; letter-spacing: 0.5px; }
.table-dark td, .table td { color: var(--text-primary) !important; }

/* Dropdowns */
.dropdown-menu, .dropdown-menu-dark { background-color: var(--bg-dropdown) !important; border: var(--card-border, 1px solid var(--border-color)) !important; border-radius: 12px !important; }
.dropdown-menu .dropdown-item, .dropdown-menu-dark .dropdown-item { color: var(--text-primary) !important; border-radius: 8px; margin: 2px 4px; }
.dropdown-menu .dropdown-item:hover, .dropdown-menu-dark .dropdown-item:hover { background-color: var(--dropdown-hover) !important; color: var(--text-primary) !important; }
.dropdown-header { color: var(--text-muted) !important; }
/* Dropdown toggle chevron — consistent color */
.dropdown-toggle::after { border-top-color: var(--text-on-navbar) !important; }
.dropdown-toggle:hover::after { border-top-color: var(--text-primary) !important; }

/* Select2 */
.select2-container .select2-selection--single { background-color: var(--bg-select2) !important; color: var(--text-primary) !important; border-color: var(--border-color) !important; border-radius: 10px !important; }
.select2-container .select2-selection--single .select2-selection__rendered { color: var(--text-primary) !important; }
.select2-container .select2-selection--single .select2-selection__placeholder { color: var(--text-muted) !important; }
.select2-container .select2-selection--single .select2-selection__arrow b { border-color: var(--text-secondary) transparent transparent transparent !important; }
.select2-dropdown { background-color: var(--bg-select2-dropdown) !important; border-color: var(--border-color) !important; border-radius: 12px !important; }
.select2-search--dropdown .select2-search__field { background-color: var(--bg-select2-search) !important; color: var(--text-primary) !important; border-color: var(--border-color) !important; border-radius: 8px; }
.select2-results__option { color: var(--text-primary) !important; border-radius: 6px; margin: 2px; }
.select2-results__option--highlighted[aria-selected] { background-color: var(--select2-highlight) !important; color: #fff !important; }
.select2-results__option[aria-selected="true"] { background-color: var(--select2-selected) !important; color: #fff !important; }
.select2-container--default .select2-selection--multiple { background-color: var(--bg-select2) !important; border-color: var(--border-color) !important; border-radius: 10px !important; }

/* Toolbar & bottom bar */
.page-toolbar { background: var(--bg-toolbar) !important; border-bottom-color: var(--border-toolbar) !important; }
.sticky-bottom-bar { background-color: var(--bg-bottombar) !important; border-top-color: var(--border-bottombar) !important; }
.bottom-bar-item { color: var(--text-primary) !important; }
.bottom-bar-item i { color: var(--text-secondary) !important; }

/* Popovers */
.taxpayer-popover { --bs-popover-bg: var(--bg-popover); --bs-popover-border-color: var(--border-color); --bs-popover-body-color: var(--text-primary); }
.taxpayer-popover .popover-body { background-color: var(--bg-popover) !important; color: var(--text-primary) !important; border-radius: 12px; }
.taxpayer-popover .popover-body a { color: var(--text-link) !important; }

/* Toast */
.custom-toast { background-color: var(--toast-bg) !important; border-radius: 12px; }
.custom-toast .toast-header { background-color: var(--toast-header-bg) !important; border-radius: 12px 12px 0 0; color: #fff !important; }
.custom-toast .toast-body { color: #fff !important; }
/* Toast sits on a colored background in every theme — close icon stays white (single source of truth, moved from app.css) */
.custom-toast .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }

/* Button groups — action buttons in tables */
.btn-group-sm > .btn, .btn-group-sm > a.btn { border: 1px solid var(--border-light) !important; border-radius: 8px !important; background-color: transparent !important; }
.btn-group-sm > .btn:hover { background-color: var(--nav-hover-bg) !important; border-color: var(--accent-color) !important; }
/* Icon colors for button groups — use CSS variables for theme consistency */
.btn-group-sm > .btn i { color: var(--text-secondary) !important; transition: color 0.15s; }
.btn-group-sm > .btn:hover i { color: var(--text-primary) !important; }
.btn-group-sm > .btn-info:hover i,
.btn-group-sm > .btn-outline-info:hover i { color: #06b6d4 !important; }
.btn-group-sm > .btn-success:hover i,
.btn-group-sm > .btn-outline-success:hover i { color: #22c55e !important; }
.btn-group-sm > .btn-warning:hover i,
.btn-group-sm > .btn-outline-warning:hover i { color: #eab308 !important; }
.btn-group-sm > .btn-danger:hover i,
.btn-group-sm > .btn-outline-danger:hover i { color: #ef4444 !important; }
.btn-group-sm > .btn-primary:hover i,
.btn-group-sm > .btn-outline-primary:hover i { color: var(--accent-color) !important; }

/* Text utilities — only override .text-white on non-gradient backgrounds */
.text-white { color: var(--text-primary) !important; }
.text-white-50 { color: var(--text-muted) !important; }
/* Gradient cards must keep white text */
.bg-gradient-primary .text-white,
.bg-gradient-info .text-white,
.bg-gradient-success .text-white,
.bg-gradient-warning .text-white,
.bg-gradient-danger .text-white { color: #fff !important; }
.bg-gradient-primary, .bg-gradient-info, .bg-gradient-success,
.bg-gradient-warning, .bg-gradient-danger { color: #fff !important; }
.text-muted { color: var(--text-muted) !important; }
.text-light { color: var(--text-primary) !important; }
.navbar-text { color: var(--text-secondary) !important; }
/* Toasts on colored backgrounds (bg-success/bg-danger) must keep white text */
.toast.text-white, .toast .text-white { color: #fff !important; }

/* Modals */
.modal-content { background-color: var(--bg-card) !important; color: var(--text-primary) !important; border: var(--card-border) !important; border-radius: var(--card-radius, 14px) !important; }
.modal-header { border-color: var(--border-color) !important; }
.modal-header .modal-title { color: var(--text-primary) !important; }
.modal-footer { border-color: var(--border-color) !important; }

/* Alerts */
.alert { border-radius: 12px; }
/* Dark themes: translucent backgrounds + light text (Bootstrap defaults stay for light theme) */
[data-theme="dark"] .alert-success, [data-theme="midnight"] .alert-success, [data-theme="forest"] .alert-success { background-color: rgba(16, 185, 129, 0.15); border-color: rgba(16, 185, 129, 0.35); color: #6EE7B7; }
[data-theme="dark"] .alert-danger, [data-theme="midnight"] .alert-danger, [data-theme="forest"] .alert-danger { background-color: rgba(239, 68, 68, 0.15); border-color: rgba(239, 68, 68, 0.35); color: #FCA5A5; }
[data-theme="dark"] .alert-warning, [data-theme="midnight"] .alert-warning, [data-theme="forest"] .alert-warning { background-color: rgba(245, 158, 11, 0.15); border-color: rgba(245, 158, 11, 0.35); color: #FCD34D; }
[data-theme="dark"] .alert-info, [data-theme="midnight"] .alert-info, [data-theme="forest"] .alert-info { background-color: rgba(14, 165, 233, 0.15); border-color: rgba(14, 165, 233, 0.35); color: #7DD3FC; }
[data-theme="dark"] .alert-primary, [data-theme="midnight"] .alert-primary, [data-theme="forest"] .alert-primary { background-color: rgba(99, 102, 241, 0.15); border-color: rgba(99, 102, 241, 0.35); color: #A5B4FC; }
[data-theme="dark"] .alert-secondary, [data-theme="midnight"] .alert-secondary, [data-theme="forest"] .alert-secondary { background-color: rgba(148, 163, 184, 0.15); border-color: rgba(148, 163, 184, 0.35); color: #CBD5E1; }

/* Links */
a:not(.btn):not(.nav-link):not(.dropdown-item) { color: var(--text-link); }

/* List groups */
.list-group-item { background-color: var(--bg-card) !important; color: var(--text-primary) !important; border-color: var(--border-color) !important; }

/* Badges */
.badge.bg-dark { background-color: var(--bg-badge-soft) !important; color: var(--text-badge-soft) !important; }
.badge { border-radius: 8px; }

/* Code */
code { color: var(--accent-color); }

/* Pagination */
.page-link { background-color: var(--bg-form) !important; color: var(--text-primary) !important; border-color: var(--border-color) !important; }
.page-link:hover { background-color: var(--nav-hover-bg) !important; color: var(--text-primary) !important; }
.page-item.active .page-link { background-color: var(--accent-color) !important; border-color: var(--accent-color) !important; color: #fff !important; }
.page-item.disabled .page-link { background-color: var(--bg-card) !important; color: var(--text-muted) !important; }

/* Nav tabs — all themes */
.nav-tabs { border-bottom-color: var(--border-color) !important; }
.nav-tabs .nav-link { color: var(--text-secondary) !important; }
.nav-tabs .nav-link.active { color: var(--text-primary) !important; background-color: var(--bg-card) !important; border-color: var(--border-color) var(--border-color) var(--bg-card) !important; }
.nav-tabs .nav-link:hover:not(.active) { border-color: var(--border-color) !important; }

/* Accordion — all themes */
.accordion-button { background-color: var(--bg-form) !important; color: var(--text-primary) !important; }
.accordion-button:not(.collapsed) { background-color: var(--bg-badge-soft) !important; color: var(--accent-color) !important; }
.accordion-button::after { filter: var(--accordion-arrow-filter, invert(1)); }
.accordion-body { background-color: var(--bg-card) !important; color: var(--text-primary) !important; }
.accordion-item { border-color: var(--border-color) !important; }

/* Progress bars */
.progress { background-color: var(--bg-form) !important; }

/* ── awsmd Light — specific overrides ─────────────────── */
[data-theme="light"] {
    --btn-close-filter: none;
    --accordion-arrow-filter: none;
}
[data-theme="light"] .navbar { border-bottom: 1px solid var(--border-color); box-shadow: 0 1px 3px rgba(0,0,0,0.04); }
[data-theme="light"] .navbar-toggler-icon { filter: invert(1) grayscale(100%); }
[data-theme="light"] .dropdown-menu { box-shadow: 0 10px 40px rgba(0,0,0,0.08); }
[data-theme="light"] .dropdown-toggle::after { border-top-color: #4B5563 !important; }
[data-theme="light"] .dropdown-toggle:hover::after { border-top-color: #111827 !important; }
[data-theme="light"] .card-header { background-color: #F9FAFB !important; border-color: var(--border-color) !important; }
[data-theme="light"] .bg-gradient-success { background: linear-gradient(135deg, #059669, #10B981) !important; color: #fff !important; }
[data-theme="light"] .border-secondary { border-color: var(--border-color) !important; }

/* Light: outline button colors — darker for readability */
[data-theme="light"] .btn-outline-info { color: #0E7490 !important; border-color: #0E7490 !important; }
[data-theme="light"] .btn-outline-success { color: #15803D !important; border-color: #15803D !important; }
[data-theme="light"] .btn-outline-warning { color: #A16207 !important; border-color: #A16207 !important; }
[data-theme="light"] .btn-outline-danger { color: #B91C1C !important; border-color: #B91C1C !important; }
[data-theme="light"] .text-info { color: #0E7490 !important; }
[data-theme="light"] .text-success { color: #15803D !important; }
[data-theme="light"] .text-warning { color: #A16207 !important; }
[data-theme="light"] .text-danger { color: #B91C1C !important; }

/* Light: action button group — darker icon hover colors */
[data-theme="light"] .btn-group-sm > .btn i { color: #6B7280 !important; }
[data-theme="light"] .btn-group-sm > .btn:hover i { color: #111827 !important; }
[data-theme="light"] .btn-group-sm > .btn-info:hover i,
[data-theme="light"] .btn-group-sm > .btn-outline-info:hover i { color: #0E7490 !important; }
[data-theme="light"] .btn-group-sm > .btn-success:hover i,
[data-theme="light"] .btn-group-sm > .btn-outline-success:hover i { color: #15803D !important; }
[data-theme="light"] .btn-group-sm > .btn-warning:hover i,
[data-theme="light"] .btn-group-sm > .btn-outline-warning:hover i { color: #A16207 !important; }
[data-theme="light"] .btn-group-sm > .btn-danger:hover i,
[data-theme="light"] .btn-group-sm > .btn-outline-danger:hover i { color: #B91C1C !important; }
[data-theme="light"] .btn-group-sm > .btn-primary:hover i,
[data-theme="light"] .btn-group-sm > .btn-outline-primary:hover i { color: #4338CA !important; }

/* Light: bottom bar */
[data-theme="light"] .sticky-bottom-bar { box-shadow: 0 -1px 3px rgba(0,0,0,0.06); }

/* Light: floating theme panel */
[data-theme="light"] #theme-panel { background: #fff !important; border-color: #E5E7EB !important; box-shadow: 0 8px 24px rgba(0,0,0,0.12) !important; }
[data-theme="light"] #theme-panel .design-switch { background: #F9FAFB !important; color: #111827 !important; }

/* ═══════════════════════════════════════════════════════════
   Mobile Responsiveness
   ═══════════════════════════════════════════════════════════ */

@media (max-width: 991px) {
    .navbar-toggler { border: 1px solid var(--border-color) !important; padding: 0.4rem 0.6rem !important; z-index: 1050; }
    .navbar-collapse { background-color: var(--bg-navbar); border-top: 1px solid var(--border-color); max-height: 85vh; overflow-y: auto; padding: 0.5rem 0;  }
    .navbar-nav .dropdown-menu { position: static !important; float: none; margin: 0 !important; padding-left: 1.5rem; background: transparent !important; border: none !important; box-shadow: none !important; }
    .navbar-nav .nav-link { padding: 0.6rem 1rem !important; font-size: 0.95rem; border-bottom: 1px solid rgba(128,128,128,0.08); }
    .navbar-nav .dropdown-item { padding: 0.5rem 1rem !important; font-size: 0.9rem; }
    .nav-item.dropdown.ms-3 { margin-left: 0 !important; padding: 0 !important; }
}

@media (max-width: 768px) {
    .container { padding: 12px !important; margin-top: 8px !important; max-width: 100% !important; }
    .form-control, .form-select, .form-check-input { font-size: 16px !important; min-height: 44px; }
    .table-responsive { -webkit-overflow-scrolling: touch; margin: 0 -12px; padding: 0 12px; }
    .table th, .table td { font-size: 0.78rem; padding: 0.4rem 0.5rem !important; white-space: nowrap; }
    .btn-group-sm { flex-wrap: nowrap; }
    .btn-group-sm > .btn { padding: 0.25rem 0.4rem !important; font-size: 0.75rem; }
    .page-toolbar { top: 46px !important; padding: 0.4rem 8px !important; }
    .page-toolbar h5 { font-size: 0.9rem; }
    .card { margin-bottom: 0.5rem; }
    .card-body { padding: 0.75rem !important; }
    body { padding-bottom: 45px !important; }
    .sticky-bottom-bar { padding: 2px 0 !important; }
    .bottom-bar-item { font-size: 0.6rem; }
    #weather-desc, #weather-city { display: none !important; }
    .date-display { display: none; }
    .navbar { min-height: 44px !important; max-height: 44px !important; }
    .navbar-brand { font-size: 0.85rem !important; }
    .modal-dialog { margin: 0.5rem; max-width: calc(100% - 1rem); }
}

@media (max-width: 576px) {
    .container { padding: 8px !important; margin-top: 2px !important; border-radius: 0 !important; }
    .table th, .table td { font-size: 0.7rem; padding: 0.3rem 0.35rem !important; }
    .table .d-none-xs { display: none !important; }
    .bottom-bar-item { font-size: 0.55rem; }
}