/* Design tokens — dark/light themes */
:root {
  /* Dark (default) */
  --color-bg: #09090B;
  --color-surface: #111113;
  --color-surface-hover: #18181B;
  --color-border: #27272A;
  --color-border-hover: #3F3F46;
  --color-text: #FAFAFA;
  --color-text-muted: #A1A1AA;
  --color-text-subtle: #52525B;
  --color-accent: #FB923C;
  --color-accent-hover: #F97316;
  --color-accent-light: #C2410C;
  --color-destructive: #DC2626;
  --color-ring: #FB923C;

  /* Light */
  --color-bg-light: #FAFAFA;
  --color-surface-light: #FFFFFF;
  --color-surface-hover-light: #F3F4F6;
  --color-border-light: #E4E4E7;
  --color-border-hover-light: #D4D4D8;
  --color-text-light: #18181B;
  --color-text-muted-light: #52525B;
  --color-text-subtle-light: #737373;
  --color-accent-light: #C2410C;
  --color-accent-hover-light: #EA580C;
  --color-accent-light-light: #EA580C;
  --color-destructive-light: #DC2626;
  --color-ring-light: #EA580C;
}

/* Dark theme overrides (already defined in :root) */

[data-theme="light"] {
  --color-bg: var(--color-bg-light);
  --color-surface: var(--color-surface-light);
  --color-surface-hover: var(--color-surface-hover-light);
  --color-border: var(--color-border-light);
  --color-border-hover: var(--color-border-hover-light);
  --color-text: var(--color-text-light);
  --color-text-muted: var(--color-text-muted-light);
  --color-text-subtle: var(--color-text-subtle-light);
  --color-accent: var(--color-accent-light);
  --color-accent-hover: var(--color-accent-hover-light);
  --color-accent-light: var(--color-accent-light-light);
  --color-destructive: var(--color-destructive-light);
  --color-ring: var(--color-ring-light);
}