/* Theme tokens — shared across the hub and every sub-tab.
   Each sub-tab links to this file via ../themes.css after the build copies
   widgets into apps/hub/public/<name>/. */

:root {
  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", system-ui, "Segoe UI", Roboto, sans-serif;
  --font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", system-ui, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --fs-xs: 0.72rem;
  --fs-sm: 0.875rem;
  --fs-base: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: 1.375rem;
  --fs-2xl: 1.85rem;
  --fs-3xl: 2.5rem;

  --tracking-tight: -0.02em;
  --tracking-tighter: -0.04em;
  --tracking-wide: 0.12em;

  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 0.75rem;
  --s-4: 1rem;
  --s-5: 1.5rem;
  --s-6: 2rem;
  --s-7: 3rem;
  --s-8: 4.5rem;

  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 18px;
  --r-xl: 26px;
  --r-2xl: 32px;
  --r-pill: 999px;

  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --t-fast: 140ms;
  --t-base: 240ms;
  --t-slow: 420ms;
}

/* Piedmont — default (warm Atlanta clay) */
:root,
[data-theme="piedmont"][data-mode="light"] {
  --bg: #faf6ee;
  --bg-elev: #fdf9f1;
  --surface: rgba(255, 255, 255, 0.78);
  --surface-solid: #ffffff;
  --surface-hover: #fbfaf5;
  --border: rgba(60, 40, 20, 0.08);
  --border-strong: rgba(60, 40, 20, 0.16);
  --fg: #1f1a14;
  --fg-dim: #463d31;
  --muted: #756959;
  --accent: #c54d2b;
  --accent-glow: rgba(197, 77, 43, 0.22);
  --accent-gold: #c19238;
  --success: #1d8a5e;
  --warn: #b87f1f;
  --tod-base: 197, 77, 43;
}

[data-theme="piedmont"][data-mode="dark"] {
  --bg: #14100c;
  --bg-elev: #1d1814;
  --surface: rgba(36, 28, 22, 0.72);
  --surface-solid: #1d1814;
  --surface-hover: #251e18;
  --border: rgba(232, 200, 160, 0.10);
  --border-strong: rgba(232, 200, 160, 0.20);
  --fg: #f4eee2;
  --fg-dim: #c7bca8;
  --muted: #8a7e6c;
  --accent: #ed8a5f;
  --accent-glow: rgba(237, 138, 95, 0.25);
  --accent-gold: #d4a23a;
  --success: #6fcf97;
  --warn: #f2c94c;
  --tod-base: 237, 138, 95;
}

/* Midnight — cool blue */
[data-theme="midnight"][data-mode="light"] {
  --bg: #f4f6fb;
  --bg-elev: #ffffff;
  --surface: rgba(255, 255, 255, 0.82);
  --surface-solid: #ffffff;
  --surface-hover: #f8f9fd;
  --border: rgba(20, 30, 60, 0.08);
  --border-strong: rgba(20, 30, 60, 0.18);
  --fg: #0b1230;
  --fg-dim: #2c3552;
  --muted: #5b6480;
  --accent: #4a5dde;
  --accent-glow: rgba(74, 93, 222, 0.22);
  --accent-gold: #b07f1c;
  --success: #1d8a5e;
  --warn: #b87f1f;
  --tod-base: 74, 93, 222;
}

[data-theme="midnight"][data-mode="dark"] {
  --bg: #06091a;
  --bg-elev: #0d1230;
  --surface: rgba(22, 30, 64, 0.72);
  --surface-solid: #0d1230;
  --surface-hover: #141a3a;
  --border: rgba(150, 170, 240, 0.10);
  --border-strong: rgba(150, 170, 240, 0.22);
  --fg: #ecedf6;
  --fg-dim: #b4bbd6;
  --muted: #7882a3;
  --accent: #7d8ff3;
  --accent-glow: rgba(125, 143, 243, 0.28);
  --accent-gold: #d4a23a;
  --success: #6fcf97;
  --warn: #f2c94c;
  --tod-base: 125, 143, 243;
}

/* Forest — green */
[data-theme="forest"][data-mode="light"] {
  --bg: #f3f8ed;
  --bg-elev: #fafce6;
  --surface: rgba(255, 255, 255, 0.82);
  --surface-solid: #ffffff;
  --surface-hover: #f7faf0;
  --border: rgba(40, 60, 30, 0.08);
  --border-strong: rgba(40, 60, 30, 0.18);
  --fg: #1a2614;
  --fg-dim: #354528;
  --muted: #5e6f4b;
  --accent: #3d8a4d;
  --accent-glow: rgba(61, 138, 77, 0.22);
  --accent-gold: #b58a2c;
  --success: #1d8a5e;
  --warn: #b87f1f;
  --tod-base: 61, 138, 77;
}

[data-theme="forest"][data-mode="dark"] {
  --bg: #0a120c;
  --bg-elev: #131c14;
  --surface: rgba(26, 38, 28, 0.72);
  --surface-solid: #131c14;
  --surface-hover: #1a2620;
  --border: rgba(170, 220, 180, 0.10);
  --border-strong: rgba(170, 220, 180, 0.22);
  --fg: #ebf0e6;
  --fg-dim: #b8c3ad;
  --muted: #7c8a72;
  --accent: #5cb46c;
  --accent-glow: rgba(92, 180, 108, 0.28);
  --accent-gold: #d4a23a;
  --success: #6fcf97;
  --warn: #f2c94c;
  --tod-base: 92, 180, 108;
}

/* Ocean — blue */
[data-theme="ocean"][data-mode="light"] {
  --bg: #edf4f8;
  --bg-elev: #f7fbfd;
  --surface: rgba(255, 255, 255, 0.82);
  --surface-solid: #ffffff;
  --surface-hover: #f4f9fc;
  --border: rgba(20, 50, 80, 0.08);
  --border-strong: rgba(20, 50, 80, 0.18);
  --fg: #0e2030;
  --fg-dim: #2a4256;
  --muted: #557083;
  --accent: #2980b9;
  --accent-glow: rgba(41, 128, 185, 0.22);
  --accent-gold: #b58a2c;
  --success: #1d8a5e;
  --warn: #b87f1f;
  --tod-base: 41, 128, 185;
}

[data-theme="ocean"][data-mode="dark"] {
  --bg: #04101c;
  --bg-elev: #0b1c2c;
  --surface: rgba(18, 38, 58, 0.72);
  --surface-solid: #0b1c2c;
  --surface-hover: #142a3e;
  --border: rgba(140, 200, 240, 0.10);
  --border-strong: rgba(140, 200, 240, 0.22);
  --fg: #e6eef5;
  --fg-dim: #adbed0;
  --muted: #6e859d;
  --accent: #5ab4e6;
  --accent-glow: rgba(90, 180, 230, 0.28);
  --accent-gold: #d4a23a;
  --success: #6fcf97;
  --warn: #f2c94c;
  --tod-base: 90, 180, 230;
}