/* ═══════════════════════════════════════════════════════════════
   LAVA RETAIL — THEME ENGINE
   All dashboard themes in one place. Set data-theme attribute on
   documentElement to switch themes instantly with zero flash.
   ═══════════════════════════════════════════════════════════════ */

/* ─── DEFAULT (no data-theme) ─────────────────────────────────── */
:root {
  --t-bg: #09090b;
  --t-surface: #111114;
  --t-surface-alt: #18181c;
  --t-card-bg: #111114;
  --t-border: #27272a;
  --t-text: #e4e4e7;
  --t-text-muted: #a1a1aa;
  --t-text-dim: #52525b;
  --t-accent: #3b82f6;
  --t-green: #22c55e;
  --t-red: #ef4444;
}

/* ─── ESSENTIALS ────────────────────────────────────────────── */
html[data-theme='dark'] {
  --t-bg: #09090b;
  --t-surface: #111114;
  --t-surface-alt: #18181c;
  --t-card-bg: #111114;
  --t-border: #27272a;
  --t-text: #e4e4e7;
  --t-text-muted: #a1a1aa;
  --t-text-dim: #52525b;
  --t-accent: #3b82f6;
  --t-green: #22c55e;
  --t-red: #ef4444;
}

html[data-theme='light'] {
  --t-bg: #f8fafc;
  --t-surface: #ffffff;
  --t-surface-alt: #f1f5f9;
  --t-card-bg: #ffffff;
  --t-border: #e2e8f0;
  --t-text: #0f172a;
  --t-text-muted: #64748b;
  --t-text-dim: #94a3b8;
  --t-accent: #3b82f6;
  --t-green: #16a34a;
  --t-red: #dc2626;
}

/* ─── VIBES ──────────────────────────────────────────────────── */
html[data-theme='neonPurple'] {
  --t-bg: #0d0221;
  --t-surface: #130a35;
  --t-surface-alt: #1a1145;
  --t-card-bg: #130a35;
  --t-border: #2d1b69;
  --t-text: #e0d4fc;
  --t-text-muted: #9b8ec4;
  --t-text-dim: #5c4d8a;
  --t-accent: #a855f7;
  --t-green: #4ade80;
  --t-red: #f87171;
}

html[data-theme='cyberTeal'] {
  --t-bg: #021b1a;
  --t-surface: #042f2e;
  --t-surface-alt: #0a3d3c;
  --t-card-bg: #042f2e;
  --t-border: #115e5a;
  --t-text: #ccfbf1;
  --t-text-muted: #5eead4;
  --t-text-dim: #2dd4bf;
  --t-accent: #14b8a6;
  --t-green: #34d399;
  --t-red: #fb7185;
}

html[data-theme='roseGold'] {
  --t-bg: #fdf2f4;
  --t-surface: #ffffff;
  --t-surface-alt: #fce7eb;
  --t-card-bg: #ffffff;
  --t-border: #fecdd3;
  --t-text: #1c1917;
  --t-text-muted: #78716c;
  --t-text-dim: #a8a29e;
  --t-accent: #e11d48;
  --t-green: #16a34a;
  --t-red: #dc2626;
}

html[data-theme='slate'] {
  --t-bg: #0c0f17;
  --t-surface: #141928;
  --t-surface-alt: #1c2237;
  --t-card-bg: #141928;
  --t-border: #2a3150;
  --t-text: #e2e8f0;
  --t-text-muted: #94a3b8;
  --t-text-dim: #475569;
  --t-accent: #6366f1;
  --t-green: #22c55e;
  --t-red: #ef4444;
}

html[data-theme='sunset'] {
  --t-bg: #120c06;
  --t-surface: #1c1208;
  --t-surface-alt: #261a0c;
  --t-card-bg: #1c1208;
  --t-border: #4a3018;
  --t-text: #fde9cc;
  --t-text-muted: #c49a6c;
  --t-text-dim: #7a5c38;
  --t-accent: #f97316;
  --t-green: #4ade80;
  --t-red: #f87171;
}

html[data-theme='ocean'] {
  --t-bg: #020617;
  --t-surface: #0f172a;
  --t-surface-alt: #1e293b;
  --t-card-bg: #0f172a;
  --t-border: #1e3a5f;
  --t-text: #e0f2fe;
  --t-text-muted: #7dd3fc;
  --t-text-dim: #38bdf8;
  --t-accent: #0ea5e9;
  --t-green: #34d399;
  --t-red: #fb7185;
}

/* ─── BRAND (defaults to blue; supplier colors override via JS) ── */
html[data-theme='brandDark'] {
  --t-bg: #050608;
  --t-surface: #0a0d10;
  --t-surface-alt: #0f1318;
  --t-card-bg: #0a0d10;
  --t-border: #1a2030;
  --t-text: #e8eaed;
  --t-text-muted: #8a8f98;
  --t-text-dim: #5a5f68;
  --t-accent: #3b82f6;
  --t-green: #22c55e;
  --t-red: #ef4444;
}

html[data-theme='brandLight'] {
  --t-bg: #f5f7fa;
  --t-surface: #ffffff;
  --t-surface-alt: #f0f3f8;
  --t-card-bg: #ffffff;
  --t-border: #d0d8e8;
  --t-text: #1a1a2e;
  --t-text-muted: #6b7280;
  --t-text-dim: #9ca3af;
  --t-accent: #3b82f6;
  --t-green: #16a34a;
  --t-red: #dc2626;
}

/* ─── EXECUTIVE ───────────────────────────────────────────────── */
html[data-theme='executiveLight'] {
  --t-bg: #f0f4f8;
  --t-surface: #ffffff;
  --t-surface-alt: #e8eef4;
  --t-card-bg: #ffffff;
  --t-border: #c5d4e3;
  --t-text: #0f172a;
  --t-text-muted: #475569;
  --t-text-dim: #64748b;
  --t-accent: #0f766e;
  --t-green: #059669;
  --t-red: #dc2626;
}

/* ─── AI LAB ───────────────────────────────────────────────────── */
html[data-theme='aiNeural'] {
  --t-bg: #0a0e14;
  --t-surface: #111820;
  --t-surface-alt: #1a2332;
  --t-card-bg: #111820;
  --t-border: #1e3a5f;
  --t-text: #e2e8f0;
  --t-text-muted: #94a3b8;
  --t-text-dim: #64748b;
  --t-accent: #06b6d4;
  --t-green: #10b981;
  --t-red: #f43f5e;
}

html[data-theme='aiFrost'] {
  --t-bg: #f0f9ff;
  --t-surface: #ffffff;
  --t-surface-alt: #e0f2fe;
  --t-card-bg: #ffffff;
  --t-border: #bae6fd;
  --t-text: #0c4a6e;
  --t-text-muted: #0369a1;
  --t-text-dim: #0ea5e9;
  --t-accent: #0891b2;
  --t-green: #0d9488;
  --t-red: #e11d48;
}

html[data-theme='aiGlass'] {
  --t-bg: #faf5ff;
  --t-surface: rgba(255,255,255,0.9);
  --t-surface-alt: rgba(243,232,255,0.8);
  --t-card-bg: rgba(255,255,255,0.95);
  --t-border: rgba(192,132,252,0.4);
  --t-text: #3b0764;
  --t-text-muted: #6b21a8;
  --t-text-dim: #7c3aed;
  --t-accent: #7c3aed;
  --t-green: #059669;
  --t-red: #be123c;
}

html[data-theme='arcticFlow'] {
  --t-bg: #f0f7ff;
  --t-surface: #ffffff;
  --t-surface-alt: #e8f1fb;
  --t-card-bg: #ffffff;
  --t-border: #cbd5e1;
  --t-text: #0c3865;
  --t-text-muted: #4a6fa5;
  --t-text-dim: #6b8ac7;
  --t-accent: #2563eb;
  --t-green: #059669;
  --t-red: #dc2626;
}

/* ─── GRADIENTS ────────────────────────────────────────────────── */
html[data-theme='deepIntelligence'] {
  --t-bg: #0d0b1e;
  --t-surface: #141230;
  --t-surface-alt: #1a1640;
  --t-card-bg: #141230;
  --t-border: #2a2555;
  --t-text: #e2deff;
  --t-text-muted: #9b93c4;
  --t-text-dim: #5e568a;
  --t-accent: #00d4ff;
  --t-green: #22c55e;
  --t-red: #ff2d55;
}

html[data-theme='neonMirage'] {
  --t-bg: #0a0515;
  --t-surface: #12082a;
  --t-surface-alt: #1a0e3a;
  --t-card-bg: #12082a;
  --t-border: #35186a;
  --t-text: #f0e0ff;
  --t-text-muted: #c090e8;
  --t-text-dim: #7050a0;
  --t-accent: #e040fb;
  --t-green: #4ade80;
  --t-red: #ff6b8a;
}

html[data-theme='auroraProtocol'] {
  --t-bg: #04080e;
  --t-surface: #081420;
  --t-surface-alt: #0c1e30;
  --t-card-bg: #081420;
  --t-border: #143040;
  --t-text: #d0f5f0;
  --t-text-muted: #5eead4;
  --t-text-dim: #2aac92;
  --t-accent: #00e5c8;
  --t-green: #4ade80;
  --t-red: #ff6b8a;
}

html[data-theme='holoGlass'] {
  --t-bg: #f5f0ff;
  --t-surface: #ffffff;
  --t-surface-alt: #ede5ff;
  --t-card-bg: #ffffff;
  --t-border: rgba(139,92,246,0.25);
  --t-text: #1a0f40;
  --t-text-muted: #6b4faa;
  --t-text-dim: #8b7cc4;
  --t-accent: #7c3aed;
  --t-green: #059669;
  --t-red: #dc2626;
}

html[data-theme='plasmaCore'] {
  --t-bg: #080404;
  --t-surface: #140c0a;
  --t-surface-alt: #1e1210;
  --t-card-bg: #140c0a;
  --t-border: #3a1a10;
  --t-text: #ffe8d0;
  --t-text-muted: #e08050;
  --t-text-dim: #8a4a28;
  --t-accent: #ff6b00;
  --t-green: #4ade80;
  --t-red: #ff4444;
}

html[data-theme='cyberNoir'] {
  --t-bg: #0b0d1a;
  --t-surface: #101328;
  --t-surface-alt: #161a38;
  --t-card-bg: #101328;
  --t-border: #1e2450;
  --t-text: #e8ecff;
  --t-text-muted: #8b92c4;
  --t-text-dim: #505882;
  --t-accent: #00e5ff;
  --t-green: #00e676;
  --t-red: #ff2d6f;
}

html[data-theme='synthwave'] {
  --t-bg: #0f0720;
  --t-surface: #150e30;
  --t-surface-alt: #1c1440;
  --t-card-bg: #150e30;
  --t-border: #2d1e60;
  --t-text: #ece4ff;
  --t-text-muted: #b08aef;
  --t-text-dim: #6a4aaf;
  --t-accent: #ff2d95;
  --t-green: #00ffaa;
  --t-red: #ff2d55;
}

/* ─── SEASONAL (date-based themes) ─────────────────────────────── */
html[data-theme='champagne'] {
  --t-bg: #0a0804;
  --t-surface: #18140c;
  --t-surface-alt: #221c10;
  --t-card-bg: #18140c;
  --t-border: #4a3d1a;
  --t-text: #fef3c7;
  --t-text-muted: #fbbf24;
  --t-text-dim: #a37a1e;
  --t-accent: #f59e0b;
  --t-green: #4ade80;
  --t-red: #fbbf24;
}

html[data-theme='valentine'] {
  --t-bg: #fff5f5;
  --t-surface: #ffffff;
  --t-surface-alt: #fef2f2;
  --t-card-bg: #ffffff;
  --t-border: #fecaca;
  --t-text: #1a1a2e;
  --t-text-muted: #64748b;
  --t-text-dim: #94a3b8;
  --t-accent: #dc2626;
  --t-green: #16a34a;
  --t-red: #dc2626;
}

html[data-theme='stpatricks'] {
  --t-bg: #041a0a;
  --t-surface: #082810;
  --t-surface-alt: #0c3616;
  --t-card-bg: #082810;
  --t-border: #1a5a2a;
  --t-text: #d4edda;
  --t-text-muted: #4caf50;
  --t-text-dim: #2e7d32;
  --t-accent: #4caf50;
  --t-green: #66bb6a;
  --t-red: #ef5350;
}

html[data-theme='starSpangled'] {
  --t-bg: #0a0a1a;
  --t-surface: #12122a;
  --t-surface-alt: #1a1a3a;
  --t-card-bg: #12122a;
  --t-border: #2a2a5a;
  --t-text: #e8e8ff;
  --t-text-muted: #9090ff;
  --t-text-dim: #6060aa;
  --t-accent: #3b82f6;
  --t-green: #22c55e;
  --t-red: #ef4444;
}

html[data-theme='spooky'] {
  --t-bg: #0a0508;
  --t-surface: #180c14;
  --t-surface-alt: #22101c;
  --t-card-bg: #180c14;
  --t-border: #4a2038;
  --t-text: #fde8d0;
  --t-text-muted: #f97316;
  --t-text-dim: #9a4a10;
  --t-accent: #f97316;
  --t-green: #4ade80;
  --t-red: #ef4444;
}

html[data-theme='christmas'] {
  --t-bg: #0a0e08;
  --t-surface: #121a10;
  --t-surface-alt: #1a2418;
  --t-card-bg: #121a10;
  --t-border: #2a4a28;
  --t-text: #e8f0e6;
  --t-text-muted: #81c784;
  --t-text-dim: #4a8a4c;
  --t-accent: #c62828;
  --t-green: #4caf50;
  --t-red: #c62828;
}

/* ─── CLEAN BLUE ─────────────────────────────────────────────────── */
html[data-theme='cleanBlue'] {
  --t-bg: #f4f7fa;
  --t-surface: #ffffff;
  --t-surface-alt: #eef3f8;
  --t-card-bg: #ffffff;
  --t-border: #dce4ed;
  --t-text: #1e293b;
  --t-text-muted: #5a7192;
  --t-text-dim: #94a3b8;
  --t-accent: #0d9488;
  --t-green: #0d9488;
  --t-red: #e11d48;
}

/* ─── APPLY TO BODY AND ELEMENTS ─────────────────────────────────── */
body {
  background: var(--t-bg);
  color: var(--t-text);
  /* No transition — it caused a visible 200ms flash on every page load
     because body animated from the initial dark :root values to the
     correct theme values. Theme changes are now instant. */
}

#page-root, #root {
  background: var(--t-bg);
}
