/* variables.css — Choozin Design Tokens & Themes */
:root {
  /* Choozin Brand Theme variables (Dark Mode default) */
  --bg-primary: #020617;
  --bg-card: #0f172a;
  --bg-card-hover: #1e293b;
  --border: #334155;
  --text-primary: #f8fafc;
  --text-bright: #ffffff;
  --text-secondary: #94a3b8;
  --text-muted: #64748b;
  --accent: #E8A820;
  --accent-text: #0f172a;
  --bg-header: #0f172a;
  --bg-header-2: #1e293b;
  --text-on-dark: #f8fafc;
  --bg-input: #1e293b;
  --bg-hover-row: #1e293b;
  --bg-blur: rgba(15, 23, 42, 0.85);
  --shadow-base: rgba(0, 0, 0, 0.35);
  --badge-bg: rgba(255, 255, 255, 0.06);
  --badge-text: #94a3b8;
  --tab-text: #94a3b8;
  --tab-hover-bg: rgba(255, 255, 255, 0.08);
  --tab-hover-text: #f8fafc;

  --font: 'Fira Sans', 'Sarabun', system-ui, -apple-system, sans-serif;
  --mono: 'Fira Code', 'Sarabun', monospace;

  /* Data Visualization & Metric Palettes */
  --color-1: #4C72B0;
  --color-2: #DD8452;
  --color-3: #55A868;
  --color-4: #C44E52;
  --color-5: #8172B3;
  --color-6: #937860;

  --positive: #1a9e5c;
  --negative: #d64545;
  --neutral: #6c757d;
  --watch: #e8a33d;
  --atrisk: #e0692f;
  --critical: #d64545;

  --gap: 16px;
  --radius: 10px;
}

[data-theme="light"] {
  /* Choozin Brand Light Mode variables */
  --bg-primary: #f8fafc;
  --bg-card: #f1f5f9;
  --bg-card-hover: #e2e8f0;
  --border: #cbd5e1;
  --text-primary: #0f172a;
  --text-bright: #000000;
  --text-secondary: #334155;
  --text-muted: #475569;
  --accent: #E8A820;
  --accent-text: #0f172a;
  --bg-header: #f1f5f9;
  --bg-header-2: #e2e8f0;
  --text-on-dark: #0f172a;
  --bg-input: #ffffff;
  --bg-hover-row: #e2e8f0;
  --bg-blur: rgba(241, 245, 249, 0.85);
  --shadow-base: rgba(0, 0, 0, 0.08);
  --badge-bg: rgba(0, 0, 0, 0.04);
  --badge-text: #475569;
  --tab-text: #475569;
  --tab-hover-bg: rgba(0, 0, 0, 0.06);
  --tab-hover-text: #0f172a;
}