/* ============================================
   TaxCoin - Theme Variables
   ============================================ */

/* --- Dark Theme (Default) --- */
[data-theme="dark"] {
  --color-bg: #0b0f1a;
  --color-surface: #131928;
  --color-surface-hover: #1a2236;
  --color-border: #1e2a42;

  --color-text: #e8ecf4;
  --color-text-secondary: #a0aec0;
  --color-text-muted: #5a6a85;

  --color-primary: #3b82f6;
  --color-primary-hover: #2563eb;

  --color-danger: #ef4444;
  --color-success: #22c55e;
  --color-warning: #f59e0b;

  --color-gain: #22c55e;
  --color-loss: #ef4444;

  --color-sidebar-bg: #0e1322;
  --color-sidebar-active: #1a2540;

  --color-input-bg: #131928;
  --color-input-border: #1e2a42;

  --color-overlay: rgba(0, 0, 0, 0.7);

  --color-chart-1: #3b82f6;
  --color-chart-2: #22c55e;
  --color-chart-3: #f59e0b;
  --color-chart-4: #ef4444;
  --color-chart-5: #8b5cf6;
  --color-chart-6: #06b6d4;
  --color-chart-7: #f97316;
  --color-chart-8: #ec4899;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.5);
  --shadow-glow: 0 0 20px rgba(59, 130, 246, 0.15);
}

/* --- Light Theme --- */
[data-theme="light"] {
  --color-bg: #f1f5f9;
  --color-surface: #ffffff;
  --color-surface-hover: #f8fafc;
  --color-border: #e2e8f0;

  --color-text: #1e293b;
  --color-text-secondary: #475569;
  --color-text-muted: #94a3b8;

  --color-primary: #3b82f6;
  --color-primary-hover: #2563eb;

  --color-danger: #ef4444;
  --color-success: #16a34a;
  --color-warning: #d97706;

  --color-gain: #16a34a;
  --color-loss: #dc2626;

  --color-sidebar-bg: #f8fafc;
  --color-sidebar-active: #e2e8f0;

  --color-input-bg: #ffffff;
  --color-input-border: #cbd5e1;

  --color-overlay: rgba(0, 0, 0, 0.4);

  --color-chart-1: #3b82f6;
  --color-chart-2: #16a34a;
  --color-chart-3: #d97706;
  --color-chart-4: #dc2626;
  --color-chart-5: #7c3aed;
  --color-chart-6: #0891b2;
  --color-chart-7: #ea580c;
  --color-chart-8: #db2777;

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);
  --shadow-glow: 0 0 20px rgba(59, 130, 246, 0.1);
}