/* SB AI Hub - Modern Theme Engine
   Default: SBC Cyan. Optional: Light, Midnight, Dawn, Ocean, Aurora, SB Gold, Gov Luxe
   WCAG AA compliant (4.5:1 contrast ratios)
   ====================================== */

/* Default theme (SBC Cyan) — applied when no data-theme is set */
:root {
    --sidebar-bg: #0a1628;
    --sidebar-border: rgba(212,171,67,0.1);
    --sidebar-text: #8a9bb8;
    --sidebar-text-muted: #4a5e7a;
    --sidebar-heading: #5a7098;
    --sidebar-hover-bg: rgba(212,171,67,0.06);
    --sidebar-active-bg: rgba(212,171,67,0.12);
    --sidebar-active-text: #f5e6c8;
    --sidebar-logo-bg: linear-gradient(135deg, #d4ab43, #b8922a);
    --sidebar-logo-text: #0a1628;
    --sidebar-user-bg: rgba(212,171,67,0.04);
    --sidebar-user-border: rgba(212,171,67,0.08);
    --sidebar-user-text: #d0dae8;
    --sidebar-user-sub: #4a5e7a;
    --sidebar-chat-active-bg: rgba(212,171,67,0.1);
    --sidebar-chat-active-text: #f5e6c8;
    --main-bg: #0e1b30;
    --header-bg: #0c1726;
    --header-border: rgba(212,171,67,0.08);
    --accent: #d4ab43;
    --accent-hover: #b8922a;
    --accent-light: rgba(212,171,67,0.08);
    --accent-gradient: linear-gradient(135deg, #d4ab43, #f5d76e);
    --accent-glow: rgba(212,171,67,0.2);
    --accent-text-on: #0a1628;
    --card-bg: #0f1e36;
    --card-border: rgba(212,171,67,0.1);
    --card-shadow: 0 1px 3px rgba(0,0,0,0.4);
    --card-hover-border: rgba(212,171,67,0.35);
    --card-hover-shadow: 0 8px 30px rgba(212,171,67,0.1), 0 0 1px rgba(245,230,200,0.15);
    --hero-bg: linear-gradient(135deg, #080f1e 0%, #0e1b30 40%, #0b1525 60%, #080f1e 100%);
    --hero-gradient-orb1: radial-gradient(ellipse at 15% 50%, rgba(212,171,67,0.14) 0%, transparent 60%);
    --hero-gradient-orb2: radial-gradient(ellipse at 85% 50%, rgba(245,215,110,0.1) 0%, transparent 55%);
    --hero-text: #f5e6c8;
    --hero-text-muted: #7a8da8;
    --hero-badge-bg: rgba(212,171,67,0.06);
    --hero-badge-border: rgba(212,171,67,0.15);
    --hero-badge-text: #8a9bb8;
    --hero-badge-dot: #d4ab43;
    --hero-orb1: rgba(212,171,67,0.12);
    --hero-orb2: rgba(30,58,95,0.2);
    --hero-orb3: rgba(184,146,42,0.08);
    --hero-ring: rgba(212,171,67,0.06);
    --hero-sweep: rgba(212,171,67,0.04);
    --hero-input-bg: rgba(212,171,67,0.04);
    --hero-input-border: rgba(212,171,67,0.12);
    --hero-input-text: #f5e6c8;
    --hero-input-placeholder: #4a5e7a;
    --hero-input-focus-border: rgba(212,171,67,0.4);
    --hero-input-focus-glow: rgba(212,171,67,0.1);
    --hero-btn-bg: #d4ab43;
    --hero-btn-text: #0a1628;
    --hero-btn-hover: #b8922a;
    --hero-action-bg: rgba(212,171,67,0.04);
    --hero-action-border: rgba(212,171,67,0.1);
    --hero-action-text: #8a9bb8;
    --hero-action-hover-border: rgba(212,171,67,0.35);
    --hero-action-hover-text: #f5e6c8;
    --hero-disclaimer: #4a5e7a;
    --hero-title-gradient: linear-gradient(90deg, #f5e6c8 0%, #d4ab43 25%, #f5d76e 50%, #d4ab43 75%, #f5e6c8 100%);
    --hero-particle-color: #f5e6c8;
    --chat-bg: #0e1b30;
    --chat-user-bg: linear-gradient(135deg, #d4ab43, #b8922a);
    --chat-user-text: #0a1628;
    --chat-input-bg: #0f1e36;
    --chat-input-border: rgba(212,171,67,0.1);
    --chat-input-focus-border: rgba(212,171,67,0.35);
    --chat-input-focus-glow: rgba(212,171,67,0.08);
    --chat-starter-bg: #0f1e36;
    --chat-starter-border: rgba(212,171,67,0.1);
    --chat-starter-hover: #132440;
    --chat-heading-gradient: linear-gradient(135deg, #f5e6c8, #d4ab43);
    --text-primary: #e8dcc8;
    --text-secondary: #8a9bb8;
    --text-muted: #5a7098;
    --switcher-bg: rgba(212,171,67,0.04);
    --switcher-border: rgba(212,171,67,0.1);
    --switcher-text: #5a7098;
    --switcher-hover: rgba(212,171,67,0.08);
    --badge-bg: rgba(212,171,67,0.06);
    --badge-border: rgba(212,171,67,0.15);
    --badge-text: #8a9bb8;
}

/* =======================================
   THEME 0: LIGHT
   Clean, bright, professional — ideal for
   everyday government productivity
   ======================================= */
[data-theme="light"] {
    /* Sidebar */
    --sidebar-bg: #ffffff;
    --sidebar-border: #e5e7eb;
    --sidebar-text: #374151;
    --sidebar-text-muted: #9ca3af;
    --sidebar-heading: #9ca3af;
    --sidebar-hover-bg: #f3f4f6;
    --sidebar-active-bg: #eff6ff;
    --sidebar-active-text: #2563eb;
    --sidebar-logo-bg: #2563eb;
    --sidebar-logo-text: #ffffff;
    --sidebar-user-bg: #f9fafb;
    --sidebar-user-border: #e5e7eb;
    --sidebar-user-text: #111827;
    --sidebar-user-sub: #9ca3af;
    --sidebar-chat-active-bg: #eff6ff;
    --sidebar-chat-active-text: #1d4ed8;

    /* Main layout */
    --main-bg: #f9fafb;
    --header-bg: #ffffff;
    --header-border: #e5e7eb;

    /* Accent */
    --accent: #2563eb;
    --accent-hover: #1d4ed8;
    --accent-light: #eff6ff;
    --accent-gradient: linear-gradient(135deg, #2563eb, #3b82f6);
    --accent-glow: rgba(37, 99, 235, 0.12);
    --accent-text-on: #ffffff;

    /* Cards */
    --card-bg: #ffffff;
    --card-border: #e5e7eb;
    --card-shadow: 0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.03);
    --card-hover-border: #93c5fd;
    --card-hover-shadow: 0 8px 25px rgba(37,99,235,0.08), 0 2px 6px rgba(0,0,0,0.04);

    /* Hero — light gradient with soft blue tones */
    --hero-bg: linear-gradient(135deg, #1e3a5f 0%, #1e40af 40%, #1e3a8a 60%, #1e3a5f 100%);
    --hero-gradient-orb1: radial-gradient(ellipse at 15% 50%, rgba(59,130,246,0.35) 0%, transparent 60%);
    --hero-gradient-orb2: radial-gradient(ellipse at 85% 50%, rgba(99,102,241,0.3) 0%, transparent 55%);
    --hero-text: #f0f6ff;
    --hero-text-muted: #93c5fd;
    --hero-badge-bg: rgba(255,255,255,0.08);
    --hero-badge-border: rgba(255,255,255,0.15);
    --hero-badge-text: #93c5fd;
    --hero-badge-dot: #60a5fa;
    --hero-orb1: rgba(255,255,255,0.15);
    --hero-orb2: rgba(147,197,253,0.2);
    --hero-orb3: rgba(255,255,255,0.12);
    --hero-ring: rgba(255,255,255,0.1);
    --hero-sweep: rgba(255,255,255,0.06);
    --hero-input-bg: rgba(255,255,255,0.08);
    --hero-input-border: rgba(255,255,255,0.18);
    --hero-input-text: #f0f6ff;
    --hero-input-placeholder: #7da8d4;
    --hero-input-focus-border: rgba(96,165,250,0.5);
    --hero-input-focus-glow: rgba(59,130,246,0.15);
    --hero-btn-bg: #3b82f6;
    --hero-btn-text: #ffffff;
    --hero-btn-hover: #2563eb;
    --hero-action-bg: rgba(255,255,255,0.06);
    --hero-action-border: rgba(255,255,255,0.14);
    --hero-action-text: #93c5fd;
    --hero-action-hover-border: rgba(96,165,250,0.5);
    --hero-action-hover-text: #bfdbfe;
    --hero-disclaimer: #7da8d4;
    --hero-title-gradient: linear-gradient(90deg, #ffffff 0%, #e0eaff 25%, #ffffff 50%, #e0eaff 75%, #ffffff 100%);
    --hero-particle-color: #ffffff;

    /* Chat */
    --chat-bg: #ffffff;
    --chat-user-bg: #2563eb;
    --chat-user-text: #ffffff;
    --chat-input-bg: #f9fafb;
    --chat-input-border: #e5e7eb;
    --chat-input-focus-border: #93c5fd;
    --chat-input-focus-glow: rgba(37,99,235,0.08);
    --chat-starter-bg: #ffffff;
    --chat-starter-border: #e5e7eb;
    --chat-starter-hover: #f0f6ff;
    --chat-heading-gradient: linear-gradient(135deg, #111827, #2563eb);

    /* Text */
    --text-primary: #111827;
    --text-secondary: #4b5563;
    --text-muted: #9ca3af;

    /* Theme switcher */
    --switcher-bg: #f3f4f6;
    --switcher-border: #e5e7eb;
    --switcher-text: #6b7280;
    --switcher-hover: #e5e7eb;

    /* App card badges */
    --badge-bg: #f3f4f6;
    --badge-border: #e5e7eb;
    --badge-text: #6b7280;
}

/* =======================================
   THEME 1: MIDNIGHT
   Dark sidebar, warm off-white main
   ======================================= */
[data-theme="midnight"] {
    /* Sidebar */
    --sidebar-bg: #0f1117;
    --sidebar-border: rgba(255,255,255,0.08);
    --sidebar-text: #c8cad0;
    --sidebar-text-muted: #6b7085;
    --sidebar-heading: #8b8fa3;
    --sidebar-hover-bg: rgba(255,255,255,0.06);
    --sidebar-active-bg: rgba(99,102,241,0.12);
    --sidebar-active-text: #a5b4fc;
    --sidebar-logo-bg: #4f46e5;
    --sidebar-logo-text: #ffffff;
    --sidebar-user-bg: rgba(255,255,255,0.04);
    --sidebar-user-border: rgba(255,255,255,0.06);
    --sidebar-user-text: #e5e7eb;
    --sidebar-user-sub: #6b7085;
    --sidebar-chat-active-bg: rgba(99,102,241,0.15);
    --sidebar-chat-active-text: #c7d2fe;

    /* Main layout */
    --main-bg: #f8f8f7;
    --header-bg: #ffffff;
    --header-border: #ebebeb;

    /* Accent */
    --accent: #4f46e5;
    --accent-hover: #4338ca;
    --accent-light: #eef2ff;
    --accent-gradient: linear-gradient(135deg, #4f46e5, #7c3aed);
    --accent-glow: rgba(79, 70, 229, 0.15);
    --accent-text-on: #ffffff;

    /* Cards */
    --card-bg: #ffffff;
    --card-border: #ebebeb;
    --card-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 1px 2px rgba(0,0,0,0.02);
    --card-hover-border: #c7d2fe;
    --card-hover-shadow: 0 8px 25px rgba(79,70,229,0.08), 0 2px 6px rgba(0,0,0,0.04);

    /* Hero */
    --hero-bg: linear-gradient(135deg, #0f1117 0%, #1a1a2e 40%, #16132b 60%, #0f1117 100%);
    --hero-gradient-orb1: radial-gradient(ellipse at 15% 50%, rgba(99,102,241,0.18) 0%, transparent 60%);
    --hero-gradient-orb2: radial-gradient(ellipse at 85% 50%, rgba(124,58,237,0.15) 0%, transparent 55%);
    --hero-text: #f1f1f3;
    --hero-text-muted: #9ca0b0;
    --hero-badge-bg: rgba(255,255,255,0.06);
    --hero-badge-border: rgba(255,255,255,0.1);
    --hero-badge-text: #9ca0b0;
    --hero-badge-dot: #818cf8;
    --hero-orb1: rgba(99,102,241,0.15);
    --hero-orb2: rgba(124,58,237,0.12);
    --hero-orb3: rgba(79,70,229,0.1);
    --hero-ring: rgba(99,102,241,0.08);
    --hero-sweep: rgba(255,255,255,0.06);
    --hero-input-bg: rgba(255,255,255,0.06);
    --hero-input-border: rgba(255,255,255,0.12);
    --hero-input-text: #f1f1f3;
    --hero-input-placeholder: #6b7085;
    --hero-input-focus-border: rgba(99,102,241,0.4);
    --hero-input-focus-glow: rgba(99,102,241,0.12);
    --hero-btn-bg: #4f46e5;
    --hero-btn-text: #ffffff;
    --hero-btn-hover: #4338ca;
    --hero-action-bg: rgba(255,255,255,0.05);
    --hero-action-border: rgba(255,255,255,0.1);
    --hero-action-text: #c8cad0;
    --hero-action-hover-border: rgba(99,102,241,0.4);
    --hero-action-hover-text: #a5b4fc;
    --hero-disclaimer: #6b7085;
    --hero-title-gradient: linear-gradient(90deg, #c7d2fe 0%, #6366f1 35%, #818cf8 50%, #6366f1 70%, #c7d2fe 100%);
    --hero-particle-color: #c7d2fe;

    /* Chat */
    --chat-bg: #ffffff;
    --chat-user-bg: #4f46e5;
    --chat-user-text: #ffffff;
    --chat-input-bg: #f5f5f4;
    --chat-input-border: #e5e5e4;
    --chat-input-focus-border: #c7d2fe;
    --chat-input-focus-glow: rgba(79,70,229,0.08);
    --chat-starter-bg: #ffffff;
    --chat-starter-border: #ebebeb;
    --chat-starter-hover: #faf9f7;
    --chat-heading-gradient: linear-gradient(135deg, #111827, #4f46e5);

    /* Text */
    --text-primary: #111827;
    --text-secondary: #4b5563;
    --text-muted: #9ca3af;

    /* Theme switcher */
    --switcher-bg: rgba(255,255,255,0.06);
    --switcher-border: rgba(255,255,255,0.1);
    --switcher-text: #9ca0b0;
    --switcher-hover: rgba(255,255,255,0.1);

    /* App card badges */
    --badge-bg: rgba(0,0,0,0.04);
    --badge-border: #e5e7eb;
    --badge-text: #6b7280;
}

/* =======================================
   THEME 2: DAWN (Warm Light)
   Warm sidebar, soft peach accent
   ======================================= */
[data-theme="dawn"] {
    --sidebar-bg: #faf7f5;
    --sidebar-border: #ede5df;
    --sidebar-text: #57534e;
    --sidebar-text-muted: #a8a29e;
    --sidebar-heading: #a8a29e;
    --sidebar-hover-bg: #f5eeea;
    --sidebar-active-bg: #fce8db;
    --sidebar-active-text: #b34e20;
    --sidebar-logo-bg: #c2410c;
    --sidebar-logo-text: #ffffff;
    --sidebar-user-bg: #f5eeea;
    --sidebar-user-border: #ede5df;
    --sidebar-user-text: #292524;
    --sidebar-user-sub: #a8a29e;
    --sidebar-chat-active-bg: #fce8db;
    --sidebar-chat-active-text: #9a3412;

    --main-bg: #fefcfa;
    --header-bg: #ffffff;
    --header-border: #ede5df;

    --accent: #c2410c;
    --accent-hover: #9a3412;
    --accent-light: #fff7ed;
    --accent-gradient: linear-gradient(135deg, #c2410c, #dc6843);
    --accent-glow: rgba(194, 65, 12, 0.12);
    --accent-text-on: #ffffff;

    --card-bg: #ffffff;
    --card-border: #ede5df;
    --card-shadow: 0 1px 3px rgba(120,80,40,0.04), 0 1px 2px rgba(120,80,40,0.02);
    --card-hover-border: #fdba74;
    --card-hover-shadow: 0 8px 25px rgba(194,65,12,0.06), 0 2px 6px rgba(120,80,40,0.04);

    --hero-bg: linear-gradient(135deg, #1c1210 0%, #2a1c15 40%, #231710 60%, #1c1210 100%);
    --hero-gradient-orb1: radial-gradient(ellipse at 15% 50%, rgba(251,146,60,0.15) 0%, transparent 60%);
    --hero-gradient-orb2: radial-gradient(ellipse at 85% 50%, rgba(194,65,12,0.12) 0%, transparent 55%);
    --hero-text: #fef3ec;
    --hero-text-muted: #c4a78f;
    --hero-badge-bg: rgba(255,255,255,0.06);
    --hero-badge-border: rgba(255,255,255,0.1);
    --hero-badge-text: #c4a78f;
    --hero-badge-dot: #fb923c;
    --hero-orb1: rgba(251,146,60,0.15);
    --hero-orb2: rgba(194,65,12,0.12);
    --hero-orb3: rgba(234,88,12,0.1);
    --hero-ring: rgba(251,146,60,0.08);
    --hero-sweep: rgba(255,255,255,0.06);
    --hero-input-bg: rgba(255,255,255,0.06);
    --hero-input-border: rgba(255,255,255,0.12);
    --hero-input-text: #fef3ec;
    --hero-input-placeholder: #8b7565;
    --hero-input-focus-border: rgba(251,146,60,0.4);
    --hero-input-focus-glow: rgba(251,146,60,0.12);
    --hero-btn-bg: #c2410c;
    --hero-btn-text: #ffffff;
    --hero-btn-hover: #9a3412;
    --hero-action-bg: rgba(255,255,255,0.05);
    --hero-action-border: rgba(255,255,255,0.1);
    --hero-action-text: #c4a78f;
    --hero-action-hover-border: rgba(251,146,60,0.4);
    --hero-action-hover-text: #fdba74;
    --hero-disclaimer: #8b7565;
    --hero-title-gradient: linear-gradient(90deg, #f97316 0%, #ea580c 35%, #fb923c 50%, #ea580c 70%, #f97316 100%);
    --hero-particle-color: #fde68a;

    --chat-bg: #ffffff;
    --chat-user-bg: #c2410c;
    --chat-user-text: #ffffff;
    --chat-input-bg: #faf7f5;
    --chat-input-border: #ede5df;
    --chat-input-focus-border: #fdba74;
    --chat-input-focus-glow: rgba(194,65,12,0.06);
    --chat-starter-bg: #ffffff;
    --chat-starter-border: #ede5df;
    --chat-starter-hover: #fef9f6;
    --chat-heading-gradient: linear-gradient(135deg, #292524, #c2410c);

    --text-primary: #1c1917;
    --text-secondary: #57534e;
    --text-muted: #a8a29e;

    --switcher-bg: #f5eeea;
    --switcher-border: #ede5df;
    --switcher-text: #a8a29e;
    --switcher-hover: #ede5df;

    --badge-bg: rgba(0,0,0,0.03);
    --badge-border: #ede5df;
    --badge-text: #78716c;
}

/* =======================================
   THEME 3: OCEAN (Deep Navy/Teal)
   Navy sidebar, teal accent
   ======================================= */
[data-theme="ocean"] {
    --sidebar-bg: #0c1222;
    --sidebar-border: rgba(148,194,220,0.1);
    --sidebar-text: #94a3b8;
    --sidebar-text-muted: #475569;
    --sidebar-heading: #64748b;
    --sidebar-hover-bg: rgba(148,194,220,0.06);
    --sidebar-active-bg: rgba(20,184,166,0.12);
    --sidebar-active-text: #5eead4;
    --sidebar-logo-bg: #0d9488;
    --sidebar-logo-text: #ffffff;
    --sidebar-user-bg: rgba(148,194,220,0.04);
    --sidebar-user-border: rgba(148,194,220,0.08);
    --sidebar-user-text: #e2e8f0;
    --sidebar-user-sub: #475569;
    --sidebar-chat-active-bg: rgba(20,184,166,0.12);
    --sidebar-chat-active-text: #99f6e4;

    --main-bg: #f1f5f9;
    --header-bg: #ffffff;
    --header-border: #e2e8f0;

    --accent: #0d9488;
    --accent-hover: #0f766e;
    --accent-light: #f0fdfa;
    --accent-gradient: linear-gradient(135deg, #0d9488, #14b8a6);
    --accent-glow: rgba(13, 148, 136, 0.12);
    --accent-text-on: #ffffff;

    --card-bg: #ffffff;
    --card-border: #e2e8f0;
    --card-shadow: 0 1px 3px rgba(15,23,42,0.04), 0 1px 2px rgba(15,23,42,0.02);
    --card-hover-border: #99f6e4;
    --card-hover-shadow: 0 8px 25px rgba(13,148,136,0.06), 0 2px 6px rgba(15,23,42,0.04);

    --hero-bg: linear-gradient(135deg, #0c1222 0%, #0f1a2e 40%, #0d1628 60%, #0c1222 100%);
    --hero-gradient-orb1: radial-gradient(ellipse at 15% 50%, rgba(20,184,166,0.14) 0%, transparent 60%);
    --hero-gradient-orb2: radial-gradient(ellipse at 85% 50%, rgba(13,148,136,0.12) 0%, transparent 55%);
    --hero-text: #e2e8f0;
    --hero-text-muted: #94a3b8;
    --hero-badge-bg: rgba(148,194,220,0.06);
    --hero-badge-border: rgba(148,194,220,0.12);
    --hero-badge-text: #94a3b8;
    --hero-badge-dot: #2dd4bf;
    --hero-orb1: rgba(20,184,166,0.12);
    --hero-orb2: rgba(13,148,136,0.1);
    --hero-orb3: rgba(94,234,212,0.08);
    --hero-ring: rgba(20,184,166,0.06);
    --hero-sweep: rgba(255,255,255,0.04);
    --hero-input-bg: rgba(255,255,255,0.05);
    --hero-input-border: rgba(148,194,220,0.12);
    --hero-input-text: #e2e8f0;
    --hero-input-placeholder: #475569;
    --hero-input-focus-border: rgba(20,184,166,0.4);
    --hero-input-focus-glow: rgba(20,184,166,0.1);
    --hero-btn-bg: #0d9488;
    --hero-btn-text: #ffffff;
    --hero-btn-hover: #0f766e;
    --hero-action-bg: rgba(148,194,220,0.04);
    --hero-action-border: rgba(148,194,220,0.1);
    --hero-action-text: #94a3b8;
    --hero-action-hover-border: rgba(20,184,166,0.4);
    --hero-action-hover-text: #5eead4;
    --hero-disclaimer: #475569;
    --hero-title-gradient: linear-gradient(90deg, #5eead4 0%, #14b8a6 35%, #2dd4bf 50%, #14b8a6 70%, #5eead4 100%);
    --hero-particle-color: #99f6e4;

    --chat-bg: #ffffff;
    --chat-user-bg: #0d9488;
    --chat-user-text: #ffffff;
    --chat-input-bg: #f1f5f9;
    --chat-input-border: #e2e8f0;
    --chat-input-focus-border: #99f6e4;
    --chat-input-focus-glow: rgba(13,148,136,0.06);
    --chat-starter-bg: #ffffff;
    --chat-starter-border: #e2e8f0;
    --chat-starter-hover: #f8fafc;
    --chat-heading-gradient: linear-gradient(135deg, #0f172a, #0d9488);

    --text-primary: #0f172a;
    --text-secondary: #475569;
    --text-muted: #94a3b8;

    --switcher-bg: rgba(148,194,220,0.06);
    --switcher-border: rgba(148,194,220,0.1);
    --switcher-text: #475569;
    --switcher-hover: rgba(148,194,220,0.1);

    --badge-bg: rgba(0,0,0,0.03);
    --badge-border: #e2e8f0;
    --badge-text: #64748b;
}

/* =======================================
   THEME 4: AURORA (Northern Lights)
   Deep space with purple-teal gradient
   ======================================= */
[data-theme="aurora"] {
    --sidebar-bg: #0b0a1a;
    --sidebar-border: rgba(139,92,246,0.1);
    --sidebar-text: #a5a0c8;
    --sidebar-text-muted: #5a5680;
    --sidebar-heading: #6b65a0;
    --sidebar-hover-bg: rgba(139,92,246,0.06);
    --sidebar-active-bg: rgba(139,92,246,0.12);
    --sidebar-active-text: #c4b5fd;
    --sidebar-logo-bg: linear-gradient(135deg, #8b5cf6, #06b6d4);
    --sidebar-logo-text: #ffffff;
    --sidebar-user-bg: rgba(139,92,246,0.04);
    --sidebar-user-border: rgba(139,92,246,0.08);
    --sidebar-user-text: #e0daf0;
    --sidebar-user-sub: #5a5680;
    --sidebar-chat-active-bg: rgba(139,92,246,0.1);
    --sidebar-chat-active-text: #ddd6fe;

    --main-bg: #0f0e1a;
    --header-bg: #0a0918;
    --header-border: rgba(139,92,246,0.08);

    --accent: #8b5cf6;
    --accent-hover: #7c3aed;
    --accent-light: rgba(139,92,246,0.08);
    --accent-gradient: linear-gradient(135deg, #8b5cf6, #06b6d4);
    --accent-glow: rgba(139,92,246,0.2);
    --accent-text-on: #ffffff;

    --card-bg: #100f1f;
    --card-border: rgba(139,92,246,0.1);
    --card-shadow: 0 1px 3px rgba(0,0,0,0.4);
    --card-hover-border: rgba(139,92,246,0.3);
    --card-hover-shadow: 0 8px 30px rgba(139,92,246,0.1), 0 0 1px rgba(6,182,212,0.2);

    --hero-bg: linear-gradient(135deg, #080718 0%, #12102a 40%, #0e0c22 60%, #080718 100%);
    --hero-gradient-orb1: radial-gradient(ellipse at 15% 50%, rgba(139,92,246,0.16) 0%, transparent 60%);
    --hero-gradient-orb2: radial-gradient(ellipse at 85% 50%, rgba(6,182,212,0.12) 0%, transparent 55%);
    --hero-text: #e8e0ff;
    --hero-text-muted: #8a82b0;
    --hero-badge-bg: rgba(139,92,246,0.06);
    --hero-badge-border: rgba(139,92,246,0.15);
    --hero-badge-text: #8a82b0;
    --hero-badge-dot: #a78bfa;
    --hero-orb1: rgba(139,92,246,0.12);
    --hero-orb2: rgba(6,182,212,0.08);
    --hero-orb3: rgba(168,85,247,0.06);
    --hero-ring: rgba(139,92,246,0.05);
    --hero-sweep: rgba(139,92,246,0.04);
    --hero-input-bg: rgba(139,92,246,0.04);
    --hero-input-border: rgba(139,92,246,0.12);
    --hero-input-text: #e8e0ff;
    --hero-input-placeholder: #5a5680;
    --hero-input-focus-border: rgba(139,92,246,0.4);
    --hero-input-focus-glow: rgba(139,92,246,0.1);
    --hero-btn-bg: #8b5cf6;
    --hero-btn-text: #ffffff;
    --hero-btn-hover: #7c3aed;
    --hero-action-bg: rgba(139,92,246,0.04);
    --hero-action-border: rgba(139,92,246,0.1);
    --hero-action-text: #8a82b0;
    --hero-action-hover-border: rgba(139,92,246,0.35);
    --hero-action-hover-text: #c4b5fd;
    --hero-disclaimer: #5a5680;
    --hero-title-gradient: linear-gradient(90deg, #a78bfa 0%, #8b5cf6 25%, #06b6d4 50%, #8b5cf6 75%, #a78bfa 100%);
    --hero-particle-color: #c4b5fd;

    --chat-bg: #0f0e1a;
    --chat-user-bg: linear-gradient(135deg, #8b5cf6, #06b6d4);
    --chat-user-text: #ffffff;
    --chat-input-bg: #100f1f;
    --chat-input-border: rgba(139,92,246,0.1);
    --chat-input-focus-border: rgba(139,92,246,0.35);
    --chat-input-focus-glow: rgba(139,92,246,0.08);
    --chat-starter-bg: #100f1f;
    --chat-starter-border: rgba(139,92,246,0.1);
    --chat-starter-hover: #151428;
    --chat-heading-gradient: linear-gradient(135deg, #c4b5fd, #06b6d4);

    --text-primary: #e8e0ff;
    --text-secondary: #a5a0c8;
    --text-muted: #6b65a0;

    --switcher-bg: rgba(139,92,246,0.04);
    --switcher-border: rgba(139,92,246,0.1);
    --switcher-text: #6b65a0;
    --switcher-hover: rgba(139,92,246,0.08);

    --badge-bg: rgba(139,92,246,0.06);
    --badge-border: rgba(139,92,246,0.15);
    --badge-text: #8a82b0;
}


/* =======================================
   THEME 5: SB GOLD
   San Bernardino County SBC — deep navy
   blue + county seal gold + clean white.
   Inspired by sbcountyatc.gov
   ======================================= */
[data-theme="gold"] {
    /* Sidebar — deep navy like the SBC website header */
    --sidebar-bg: #002855;
    --sidebar-border: rgba(200,169,81,0.12);
    --sidebar-text: #a8bdd4;
    --sidebar-text-muted: #5a7a9e;
    --sidebar-heading: #6b8db5;
    --sidebar-hover-bg: rgba(200,169,81,0.08);
    --sidebar-active-bg: rgba(200,169,81,0.14);
    --sidebar-active-text: #f5e6c0;
    --sidebar-logo-bg: linear-gradient(135deg, #c8a951, #d4b868);
    --sidebar-logo-text: #002855;
    --sidebar-user-bg: rgba(200,169,81,0.05);
    --sidebar-user-border: rgba(200,169,81,0.1);
    --sidebar-user-text: #dce6f0;
    --sidebar-user-sub: #5a7a9e;
    --sidebar-chat-active-bg: rgba(200,169,81,0.12);
    --sidebar-chat-active-text: #f5e6c0;

    /* Main layout — clean white like the SBC website content areas */
    --main-bg: #f7f9fc;
    --header-bg: #ffffff;
    --header-border: #dde4ed;

    /* Accent — county seal gold */
    --accent: #b8952e;
    --accent-hover: #9e7e22;
    --accent-light: #fdf8ec;
    --accent-gradient: linear-gradient(135deg, #b8952e, #d4b868);
    --accent-glow: rgba(184,149,46,0.15);
    --accent-text-on: #ffffff;

    /* Cards */
    --card-bg: #ffffff;
    --card-border: #dde4ed;
    --card-shadow: 0 1px 3px rgba(0,40,85,0.05), 0 1px 2px rgba(0,40,85,0.03);
    --card-hover-border: #c8a951;
    --card-hover-shadow: 0 8px 25px rgba(0,40,85,0.08), 0 0 1px rgba(200,169,81,0.2);

    /* Hero — deep navy gradient matching SBC website hero */
    --hero-bg: linear-gradient(135deg, #001a3a 0%, #002855 40%, #003366 60%, #001a3a 100%);
    --hero-gradient-orb1: radial-gradient(ellipse at 15% 50%, rgba(200,169,81,0.16) 0%, transparent 60%);
    --hero-gradient-orb2: radial-gradient(ellipse at 85% 50%, rgba(212,184,104,0.12) 0%, transparent 55%);
    --hero-text: #f0f4fa;
    --hero-text-muted: #8aa4c0;
    --hero-badge-bg: rgba(200,169,81,0.08);
    --hero-badge-border: rgba(200,169,81,0.18);
    --hero-badge-text: #8aa4c0;
    --hero-badge-dot: #d4b868;
    --hero-orb1: rgba(200,169,81,0.14);
    --hero-orb2: rgba(0,51,102,0.2);
    --hero-orb3: rgba(184,149,46,0.08);
    --hero-ring: rgba(200,169,81,0.06);
    --hero-sweep: rgba(200,169,81,0.04);
    --hero-input-bg: rgba(255,255,255,0.07);
    --hero-input-border: rgba(200,169,81,0.15);
    --hero-input-text: #f0f4fa;
    --hero-input-placeholder: #5a7a9e;
    --hero-input-focus-border: rgba(200,169,81,0.45);
    --hero-input-focus-glow: rgba(200,169,81,0.12);
    --hero-btn-bg: #c8a951;
    --hero-btn-text: #002855;
    --hero-btn-hover: #b8952e;
    --hero-action-bg: rgba(255,255,255,0.05);
    --hero-action-border: rgba(200,169,81,0.12);
    --hero-action-text: #8aa4c0;
    --hero-action-hover-border: rgba(200,169,81,0.4);
    --hero-action-hover-text: #f5e6c0;
    --hero-disclaimer: #5a7a9e;
    --hero-title-gradient: linear-gradient(90deg, #f5e6c0 0%, #c8a951 25%, #d4b868 50%, #c8a951 75%, #f5e6c0 100%);
    --hero-particle-color: #d4b868;

    /* Chat — clean white with navy+gold accents */
    --chat-bg: #ffffff;
    --chat-user-bg: linear-gradient(135deg, #002855, #003d7a);
    --chat-user-text: #ffffff;
    --chat-input-bg: #f7f9fc;
    --chat-input-border: #dde4ed;
    --chat-input-focus-border: #c8a951;
    --chat-input-focus-glow: rgba(200,169,81,0.1);
    --chat-starter-bg: #ffffff;
    --chat-starter-border: #dde4ed;
    --chat-starter-hover: #f0f4fa;
    --chat-heading-gradient: linear-gradient(135deg, #002855, #b8952e);

    /* Text — dark navy for readability on white */
    --text-primary: #0a1f38;
    --text-secondary: #3d5a7a;
    --text-muted: #8a9bb5;

    /* Theme switcher (inside dark sidebar) */
    --switcher-bg: rgba(200,169,81,0.05);
    --switcher-border: rgba(200,169,81,0.1);
    --switcher-text: #6b8db5;
    --switcher-hover: rgba(200,169,81,0.1);

    /* App card badges */
    --badge-bg: #f0f4fa;
    --badge-border: #dde4ed;
    --badge-text: #3d5a7a;
}


/* =======================================
   THEME 6: GOVERNMENT LUXE
   Deep navy + gold accents — authority,
   trust, and premium government feel
   ======================================= */
[data-theme="luxe"] {
    --sidebar-bg: #0a1628;
    --sidebar-border: rgba(212,171,67,0.1);
    --sidebar-text: #8a9bb8;
    --sidebar-text-muted: #4a5e7a;
    --sidebar-heading: #5a7098;
    --sidebar-hover-bg: rgba(212,171,67,0.06);
    --sidebar-active-bg: rgba(212,171,67,0.12);
    --sidebar-active-text: #f5e6c8;
    --sidebar-logo-bg: linear-gradient(135deg, #d4ab43, #b8922a);
    --sidebar-logo-text: #0a1628;
    --sidebar-user-bg: rgba(212,171,67,0.04);
    --sidebar-user-border: rgba(212,171,67,0.08);
    --sidebar-user-text: #d0dae8;
    --sidebar-user-sub: #4a5e7a;
    --sidebar-chat-active-bg: rgba(212,171,67,0.1);
    --sidebar-chat-active-text: #f5e6c8;

    --main-bg: #0e1b30;
    --header-bg: #0c1726;
    --header-border: rgba(212,171,67,0.08);

    --accent: #d4ab43;
    --accent-hover: #b8922a;
    --accent-light: rgba(212,171,67,0.08);
    --accent-gradient: linear-gradient(135deg, #d4ab43, #f5d76e);
    --accent-glow: rgba(212,171,67,0.2);
    --accent-text-on: #0a1628;

    --card-bg: #0f1e36;
    --card-border: rgba(212,171,67,0.1);
    --card-shadow: 0 1px 3px rgba(0,0,0,0.4);
    --card-hover-border: rgba(212,171,67,0.35);
    --card-hover-shadow: 0 8px 30px rgba(212,171,67,0.1), 0 0 1px rgba(245,230,200,0.15);

    --hero-bg: linear-gradient(135deg, #080f1e 0%, #0e1b30 40%, #0b1525 60%, #080f1e 100%);
    --hero-gradient-orb1: radial-gradient(ellipse at 15% 50%, rgba(212,171,67,0.14) 0%, transparent 60%);
    --hero-gradient-orb2: radial-gradient(ellipse at 85% 50%, rgba(245,215,110,0.1) 0%, transparent 55%);
    --hero-text: #f5e6c8;
    --hero-text-muted: #7a8da8;
    --hero-badge-bg: rgba(212,171,67,0.06);
    --hero-badge-border: rgba(212,171,67,0.15);
    --hero-badge-text: #8a9bb8;
    --hero-badge-dot: #d4ab43;
    --hero-orb1: rgba(212,171,67,0.12);
    --hero-orb2: rgba(30,58,95,0.2);
    --hero-orb3: rgba(184,146,42,0.08);
    --hero-ring: rgba(212,171,67,0.06);
    --hero-sweep: rgba(212,171,67,0.04);
    --hero-input-bg: rgba(212,171,67,0.04);
    --hero-input-border: rgba(212,171,67,0.12);
    --hero-input-text: #f5e6c8;
    --hero-input-placeholder: #4a5e7a;
    --hero-input-focus-border: rgba(212,171,67,0.4);
    --hero-input-focus-glow: rgba(212,171,67,0.1);
    --hero-btn-bg: #d4ab43;
    --hero-btn-text: #0a1628;
    --hero-btn-hover: #b8922a;
    --hero-action-bg: rgba(212,171,67,0.04);
    --hero-action-border: rgba(212,171,67,0.1);
    --hero-action-text: #8a9bb8;
    --hero-action-hover-border: rgba(212,171,67,0.35);
    --hero-action-hover-text: #f5e6c8;
    --hero-disclaimer: #4a5e7a;
    --hero-title-gradient: linear-gradient(90deg, #f5e6c8 0%, #d4ab43 25%, #f5d76e 50%, #d4ab43 75%, #f5e6c8 100%);
    --hero-particle-color: #f5e6c8;

    --chat-bg: #0e1b30;
    --chat-user-bg: linear-gradient(135deg, #d4ab43, #b8922a);
    --chat-user-text: #0a1628;
    --chat-input-bg: #0f1e36;
    --chat-input-border: rgba(212,171,67,0.1);
    --chat-input-focus-border: rgba(212,171,67,0.35);
    --chat-input-focus-glow: rgba(212,171,67,0.08);
    --chat-starter-bg: #0f1e36;
    --chat-starter-border: rgba(212,171,67,0.1);
    --chat-starter-hover: #132440;
    --chat-heading-gradient: linear-gradient(135deg, #f5e6c8, #d4ab43);

    --text-primary: #e8dcc8;
    --text-secondary: #8a9bb8;
    --text-muted: #5a7098;

    --switcher-bg: rgba(212,171,67,0.04);
    --switcher-border: rgba(212,171,67,0.1);
    --switcher-text: #5a7098;
    --switcher-hover: rgba(212,171,67,0.08);

    --badge-bg: rgba(212,171,67,0.06);
    --badge-border: rgba(212,171,67,0.15);
    --badge-text: #8a9bb8;
}


/* =======================================
   PRESERVED: Admin & Utility Styles
   ======================================= */

/* Original color variables (kept for admin panel compatibility) */
:root {
    --sb-primary: #1e40af;
    --sb-primary-dark: #1d4ed8;
    --sb-primary-light: #2563eb;
    --sb-accent: #404040;
    --sb-gray-100: #f4f4f5;
    --sb-gray-200: #e4e4e7;
    --sb-gray-300: #d4d4d8;
    --sb-gray-400: #a1a1aa;
    --sb-gray-500: #71717a;
    --sb-gray-600: #52525b;
    --sb-gray-700: #3f3f46;
    --sb-gray-800: #27272a;
    --sb-gray-900: #18181b;
    --sb-white: #FFFFFF;
    --sb-black: #09090b;
    --sb-blue: #2563eb;
    --sb-blue-light: #eff6ff;
    --sb-blue-muted: #3b82f6;
    --sb-indigo: #4f46e5;
    --sb-indigo-light: #eef2ff;
    --sb-violet: #7c3aed;
    --sb-violet-light: #f5f3ff;
    --sb-emerald: #059669;
    --sb-emerald-light: #ecfdf5;
    --sb-teal: #0d9488;
    --sb-teal-light: #f0fdfa;
    --sb-amber: #d97706;
    --sb-amber-light: #fffbeb;
    --sb-rose: #e11d48;
    --sb-rose-light: #fff1f2;
    --chart-1: #2563eb;
    --chart-2: #7c3aed;
    --chart-3: #059669;
    --chart-4: #d97706;
    --chart-5: #e11d48;
    --chart-6: #0d9488;
    --chart-7: #4f46e5;
    --chart-8: #09090b;
    --sb-success: #059669;
    --sb-success-light: #ecfdf5;
    --sb-warning: #d97706;
    --sb-warning-light: #fffbeb;
    --sb-error: #e11d48;
    --sb-error-light: #fff1f2;
    --sb-info: #2563eb;
    --sb-info-light: #eff6ff;
    --card: 0 0% 100%;
    --card-foreground: 0 0% 3.9%;
    --border: 0 0% 89.8%;
}

.card {
    background-color: #ffffff;
    border-color: #e4e4e7;
}

.stat-card-gradient {
    background: linear-gradient(135deg, #1e3a5f 0%, #1e293b 100%);
    color: white;
}
.stat-card-blue {
    background: linear-gradient(135deg, #1e40af 0%, #1d4ed8 100%);
    color: white;
}
.stat-card-emerald {
    background: linear-gradient(135deg, #065f46 0%, #047857 100%);
    color: white;
}
.stat-card-violet {
    background: linear-gradient(135deg, #4c1d95 0%, #5b21b6 100%);
    color: white;
}
.stat-card-amber {
    background: linear-gradient(135deg, #92400e 0%, #b45309 100%);
    color: white;
}

.accent-blue { color: var(--sb-blue); }
.accent-emerald { color: var(--sb-emerald); }
.accent-amber { color: var(--sb-amber); }
.accent-rose { color: var(--sb-rose); }
.accent-violet { color: var(--sb-violet); }

.bg-accent-blue { background-color: var(--sb-blue-light); }
.bg-accent-emerald { background-color: var(--sb-emerald-light); }
.bg-accent-amber { background-color: var(--sb-amber-light); }
.bg-accent-rose { background-color: var(--sb-rose-light); }
.bg-accent-violet { background-color: var(--sb-violet-light); }

.border-l-accent-blue { border-left: 4px solid var(--sb-blue); }
.border-l-accent-emerald { border-left: 4px solid var(--sb-emerald); }
.border-l-accent-amber { border-left: 4px solid var(--sb-amber); }
.border-l-accent-rose { border-left: 4px solid var(--sb-rose); }
.border-l-accent-violet { border-left: 4px solid var(--sb-violet); }
.border-l-accent-teal { border-left: 4px solid var(--sb-teal); }

.icon-circle-blue { background-color: var(--sb-blue-light); color: var(--sb-blue); }
.icon-circle-emerald { background-color: var(--sb-emerald-light); color: var(--sb-emerald); }
.icon-circle-amber { background-color: var(--sb-amber-light); color: var(--sb-amber); }
.icon-circle-rose { background-color: var(--sb-rose-light); color: var(--sb-rose); }
.icon-circle-violet { background-color: var(--sb-violet-light); color: var(--sb-violet); }
.icon-circle-teal { background-color: var(--sb-teal-light); color: var(--sb-teal); }

.btn-primary-sb { background-color: #1e40af; color: white; transition: all 0.2s ease; }
.btn-primary-sb:hover { background-color: #1d4ed8; box-shadow: 0 2px 8px rgba(30, 64, 175, 0.25); }
.btn-success-sb { background-color: #047857; color: white; transition: all 0.2s ease; }
.btn-success-sb:hover { background-color: #059669; box-shadow: 0 2px 8px rgba(4, 120, 87, 0.25); }
.btn-danger-sb { background-color: #be123c; color: white; transition: all 0.2s ease; }
.btn-danger-sb:hover { background-color: #e11d48; box-shadow: 0 2px 8px rgba(190, 18, 60, 0.25); }
.btn-outline-primary { background-color: white; color: #1e40af; border: 1.5px solid #1e40af; transition: all 0.2s ease; }
.btn-outline-primary:hover { background-color: #eff6ff; box-shadow: 0 2px 8px rgba(30, 64, 175, 0.12); }
.btn-outline-secondary { background-color: white; color: #374151; border: 1.5px solid #d1d5db; transition: all 0.2s ease; }
.btn-outline-secondary:hover { background-color: #f9fafb; border-color: #9ca3af; }

.modal { display: none; position: fixed; inset: 0; background: rgba(0, 0, 0, 0.5); z-index: 50; align-items: center; justify-content: center; padding: 1rem; }
.modal.active { display: flex; }

.trend-up { color: #059669; }
.trend-down { color: #e11d48; }
.trend-stable { color: #71717a; }

.status-dot-success { background: #059669; }
.status-dot-warning { background: #d97706; }
.status-dot-error { background: #e11d48; }

.progress-fill-blue { background: var(--sb-blue); }
.progress-fill-emerald { background: var(--sb-emerald); }
.progress-fill-amber { background: var(--sb-amber); }
.progress-fill-violet { background: var(--sb-violet); }


/* =======================================
   THEME SWITCHER UI
   ======================================= */
.theme-switcher-panel {
    position: absolute;
    bottom: calc(100% + 0.5rem);
    left: 0.25rem;
    right: 0.25rem;
    background: var(--sidebar-bg);
    border: 1px solid var(--sidebar-border);
    border-radius: 0.75rem;
    padding: 0.5rem;
    z-index: 60;
    box-shadow: 0 8px 25px rgba(0,0,0,0.3);
}

.theme-switcher-panel.hidden {
    display: none;
}

.theme-option {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    width: 100%;
    padding: 0.5rem 0.625rem;
    border-radius: 0.5rem;
    border: none;
    background: transparent;
    color: var(--sidebar-text);
    font-size: 0.8125rem;
    cursor: pointer;
    transition: background 0.15s ease;
    text-align: left;
}

.theme-option:hover {
    background: var(--sidebar-hover-bg);
}

.theme-option.active {
    background: var(--sidebar-active-bg);
    color: var(--sidebar-active-text);
}

.theme-swatch {
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 50%;
    border: 2px solid var(--sidebar-border);
    flex-shrink: 0;
}

.theme-swatch-light {
    background: linear-gradient(135deg, #ffffff, #2563eb);
}

.theme-swatch-midnight {
    background: linear-gradient(135deg, #0f1117, #4f46e5);
}

.theme-swatch-dawn {
    background: linear-gradient(135deg, #faf7f5, #c2410c);
}

.theme-swatch-ocean {
    background: linear-gradient(135deg, #0c1222, #0d9488);
}

.theme-swatch-aurora {
    background: linear-gradient(135deg, #0b0a1a, #8b5cf6, #06b6d4);
}

.theme-swatch-gold {
    background: linear-gradient(135deg, #002855, #c8a951);
}

.theme-swatch-luxe {
    background: linear-gradient(135deg, #0a1628, #d4ab43);
}