/* ============== THEME VARIABLES ============== */

:root,
[data-theme="light"] {
  --bg: #f6f7fb;
  --bg-elev: #ffffff;
  --bg-card: #ffffff;
  --text: #1a1a2e;
  --text-mute: #6b7080;
  --border: #e3e6ef;
  --primary: #4f46e5;
  --primary-text: #ffffff;
  --accent: #06b6d4;
  --ok: #16a34a;
  --bad: #dc2626;
  --warn: #f59e0b;
  --shadow: 0 8px 24px rgba(20, 30, 70, 0.08);
  --radius: 14px;
  --radius-lg: 20px;
  --font: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --topbar-bg: #ffffff;
  --topbar-text: #1a1a2e;
}

[data-theme="dark"] {
  --bg: #0f1115;
  --bg-elev: #1a1d24;
  --bg-card: #1f2330;
  --text: #ecedf2;
  --text-mute: #9aa0b0;
  --border: #2a2f3d;
  --primary: #818cf8;
  --primary-text: #0f1115;
  --accent: #22d3ee;
  --ok: #4ade80;
  --bad: #f87171;
  --warn: #fbbf24;
  --shadow: 0 8px 24px rgba(0, 0, 0, 0.5);
  --topbar-bg: #1a1d24;
  --topbar-text: #ecedf2;
}

[data-theme="ocean"] {
  --bg: #e0f7ff;
  --bg-elev: #ffffff;
  --bg-card: linear-gradient(160deg, #ffffff, #d8f0ff);
  --text: #02384a;
  --text-mute: #4a7a8a;
  --border: #a8d8ed;
  --primary: #0284c7;
  --primary-text: #ffffff;
  --accent: #14b8a6;
  --ok: #059669;
  --bad: #ef4444;
  --warn: #f59e0b;
  --shadow: 0 8px 24px rgba(2, 132, 199, 0.18);
  --topbar-bg: linear-gradient(135deg, #0284c7, #14b8a6);
  --topbar-text: #ffffff;
}

[data-theme="forest"] {
  --bg: #ecf6e8;
  --bg-elev: #ffffff;
  --bg-card: linear-gradient(160deg, #ffffff, #e0f0d8);
  --text: #1f3a1a;
  --text-mute: #5a7050;
  --border: #b8d8a8;
  --primary: #16a34a;
  --primary-text: #ffffff;
  --accent: #84cc16;
  --ok: #15803d;
  --bad: #dc2626;
  --warn: #d97706;
  --shadow: 0 8px 24px rgba(22, 163, 74, 0.18);
  --topbar-bg: linear-gradient(135deg, #16a34a, #84cc16);
  --topbar-text: #ffffff;
}

[data-theme="space"] {
  --bg: radial-gradient(ellipse at top, #1e1b4b 0%, #0a0717 100%);
  --bg-elev: #1e1b4b;
  --bg-card: linear-gradient(160deg, #312e81, #1e1b4b);
  --text: #f0e7ff;
  --text-mute: #b8a8d8;
  --border: #4338ca;
  --primary: #a78bfa;
  --primary-text: #1e1b4b;
  --accent: #f0abfc;
  --ok: #4ade80;
  --bad: #fb7185;
  --warn: #fbbf24;
  --shadow: 0 8px 32px rgba(167, 139, 250, 0.3);
  --topbar-bg: linear-gradient(135deg, #4338ca, #7c3aed);
  --topbar-text: #ffffff;
}

[data-theme="unicorn"] {
  --bg: linear-gradient(180deg, #fef0fa 0%, #f0e8ff 100%);
  --bg-elev: #ffffff;
  --bg-card: linear-gradient(160deg, #ffffff, #fde7f8);
  --text: #4a1a4a;
  --text-mute: #8a5a8a;
  --border: #f0c8e8;
  --primary: #ec4899;
  --primary-text: #ffffff;
  --accent: #a855f7;
  --ok: #10b981;
  --bad: #ef4444;
  --warn: #f59e0b;
  --shadow: 0 8px 28px rgba(236, 72, 153, 0.22);
  --topbar-bg: linear-gradient(135deg, #ec4899, #a855f7, #6366f1);
  --topbar-text: #ffffff;
}

[data-theme="candy"] {
  --bg: linear-gradient(180deg, #fff8e8 0%, #ffe8d8 100%);
  --bg-elev: #ffffff;
  --bg-card: linear-gradient(160deg, #ffffff, #fff0d8);
  --text: #4a2818;
  --text-mute: #8a6850;
  --border: #f8d8a8;
  --primary: #f97316;
  --primary-text: #ffffff;
  --accent: #facc15;
  --ok: #16a34a;
  --bad: #dc2626;
  --warn: #d97706;
  --shadow: 0 8px 24px rgba(249, 115, 22, 0.2);
  --topbar-bg: linear-gradient(135deg, #f97316, #facc15);
  --topbar-text: #ffffff;
}

[data-theme="neon"] {
  --bg: #050810;
  --bg-elev: #0a0f1f;
  --bg-card: linear-gradient(160deg, #0f1530, #050810);
  --text: #d8f8ff;
  --text-mute: #6890b0;
  --border: #1a2a4a;
  --primary: #00ffd5;
  --primary-text: #050810;
  --accent: #ff00aa;
  --ok: #00ff88;
  --bad: #ff3366;
  --warn: #ffcc00;
  --shadow: 0 0 24px rgba(0, 255, 213, 0.3);
  --topbar-bg: linear-gradient(135deg, #00ffd5, #ff00aa);
  --topbar-text: #050810;
}