/* === Dark Theme (default) === */
:root,
[data-theme="dark"] {
  --bg-primary: #0a0a0a;
  --bg-secondary: #111118;
  --bg-card: #1a1a2e;
  --bg-card-hover: #1f1f35;
  --bg-input: #0d1117;
  --bg-overlay: rgba(0, 0, 0, 0.7);

  --text-primary: #e0e0e0;
  --text-secondary: #888;
  --text-muted: #555;

  --accent: #00ff88;
  --accent-dim: #00ff8822;
  --accent-hover: #00cc6a;

  --blue: #3b82f6;
  --blue-dim: #3b82f622;
  --yellow: #f59e0b;
  --yellow-dim: #f59e0b22;
  --red: #ff0055;
  --red-dim: #ff005522;
  --orange: #ff8c00;

  --border: #333;
  --border-light: #1a1a2e;

  --shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.4);

  --gauge-track: #1a1a2e;
  --progress-bg: #333;

  --chart-cpu: #4ade80;
  --chart-ram: #60a5fa;
  --chart-disk: #fbbf24;
  --chart-swap: #fb923c;
  --chart-rx: #22d3ee;
  --chart-tx: #f472b6;
  --chart-threshold: #f59e0b;
  --chart-incident: #fb7185;
  --chart-grid: rgba(148, 163, 184, 0.14);
  --chart-text: #a7adbf;
  --chart-fill: rgba(74, 222, 128, 0.14);
  --chart-panel: #141424;
  --chart-panel-raised: #1d1d33;
  --chart-panel-border: #34344c;
  --chart-atmosphere: rgba(74, 222, 128, 0.08);
}

/* === Light Theme === */
[data-theme="light"] {
  --bg-primary: #f5f5f7;
  --bg-secondary: #e8e8ed;
  --bg-card: #ffffff;
  --bg-card-hover: #f8f8fa;
  --bg-input: #f0f0f2;
  --bg-overlay: rgba(0, 0, 0, 0.3);

  --text-primary: #1a1a1a;
  --text-secondary: #666;
  --text-muted: #999;

  --accent: #00aa55;
  --accent-dim: #00aa5522;
  --accent-hover: #008844;

  --blue: #2563eb;
  --blue-dim: #2563eb22;
  --yellow: #d97706;
  --yellow-dim: #d9770622;
  --red: #dc2626;
  --red-dim: #dc262622;
  --orange: #ea580c;

  --border: #d1d5db;
  --border-light: #e5e7eb;

  --shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.12);

  --gauge-track: #e5e7eb;
  --progress-bg: #d1d5db;

  --chart-cpu: #15803d;
  --chart-ram: #1d4ed8;
  --chart-disk: #a16207;
  --chart-swap: #c2410c;
  --chart-rx: #0e7490;
  --chart-tx: #be185d;
  --chart-threshold: #b45309;
  --chart-incident: #be123c;
  --chart-grid: rgba(71, 85, 105, 0.16);
  --chart-text: #5b6475;
  --chart-fill: rgba(21, 128, 61, 0.12);
  --chart-panel: #ffffff;
  --chart-panel-raised: #f8fafc;
  --chart-panel-border: #d7dce5;
  --chart-atmosphere: rgba(21, 128, 61, 0.07);
}