/* ISO-Chroma 18-Theme Engine (Oklch Color Space) */

:root {
  color-scheme: dark;

  /* Base Colors - Dark Mode (Default)
     Card family darkened but softened 12% back up - midpoint between
     the original brightness and the full 30% drop: cards 28->22,
     sidebar 23->18 (also drives table headers), inputs/zebra 20->15.7.
     --bg-main stays 18 so cards still read as elevated surfaces */
  --bg-main: oklch(18% 0 0);
  --bg-sidebar: oklch(18% 0 0);
  --bg-card: oklch(22% 0 0);
  --bg-input: oklch(15.7% 0 0);
  /* Diagonal hairline texture - white, barely-there on dark
     (sidebar/drawers only; page background stays clean).
     Sidebar runs at half strength - larger unbroken surface, so the
     same alpha reads twice as loud there */
  --diag-line: oklch(100% 0 0 / 0.018);
  --diag-line-side: oklch(100% 0 0 / 0.009);
  --text-primary: oklch(95% 0 0);
  --text-secondary: oklch(70% 0 0);
  --border-color: oklch(35% 0 0);

  /* Theme Chroma Settings */
  --theme-chroma: 0.14;
  --theme-lightness-dark: 0.65;
  --theme-lightness-light: 0.55;

  /* Accent Colors (Hue values, rainbow order) */
  --hue-red: 25;
  --hue-coral: 40;
  --hue-orange: 55;
  --hue-amber: 75;
  --hue-yellow: 95;
  --hue-lime: 120;
  --hue-green: 145;
  --hue-emerald: 170;
  --hue-teal: 195;
  --hue-cyan: 220;
  --hue-blue: 250;
  --hue-indigo: 275;
  --hue-purple: 300;
  --hue-magenta: 320;
  --hue-pink: 340;
  --hue-rose: 355;
  --hue-grey: 0;

  /* Default Theme: Blue */
  --theme-hue: var(--hue-blue);
  --on-accent: oklch(97% 0 0);
  --theme-primary: oklch(var(--theme-lightness-dark) var(--theme-chroma) var(--theme-hue));
  --theme-primary-light: oklch(75% var(--theme-chroma) var(--theme-hue));
  --theme-primary-dark: oklch(55% var(--theme-chroma) var(--theme-hue));
  --theme-gradient: linear-gradient(135deg, oklch(72% var(--theme-chroma) var(--theme-hue)), oklch(50% var(--theme-chroma) var(--theme-hue)));
  --theme-glow: oklch(var(--theme-lightness-dark) var(--theme-chroma) var(--theme-hue) / 0.35);

  /* Text shadow - subtle depth, tuned per mode below */
  --text-shadow: 0 0 3px oklch(0% 0 0 / 0.35);
}

/* Light Mode gradient uses the darker lightness */
[data-theme-mode="light"] {
  --theme-gradient: linear-gradient(135deg, oklch(62% var(--theme-chroma) var(--theme-hue)), oklch(40% var(--theme-chroma) var(--theme-hue)));
}

/* Light Mode */
[data-theme-mode="light"] {
  color-scheme: light;
  --bg-main: oklch(96% 0 0);
  --bg-sidebar: oklch(91% 0 0);
  --bg-card: oklch(100% 0 0);
  /* Diagonal hairline texture - black, barely-there on light */
  --diag-line: oklch(0% 0 0 / 0.022);
  --diag-line-side: oklch(0% 0 0 / 0.011);
  --bg-input: oklch(95% 0 0);
  --text-primary: oklch(15% 0 0);
  --text-secondary: oklch(40% 0 0);
  --border-color: oklch(85% 0 0);
  --theme-primary: oklch(var(--theme-lightness-light) var(--theme-chroma) var(--theme-hue));
  --theme-primary-light: oklch(65% var(--theme-chroma) var(--theme-hue));
  --theme-primary-dark: oklch(45% var(--theme-chroma) var(--theme-hue));
  --text-shadow: 0 0 2px oklch(0% 0 0 / 0.10);
}

/* Theme Color Variants (rainbow order, with readable text-on-accent) */
[data-theme-color="red"] { --theme-hue: var(--hue-red); }
[data-theme-color="coral"] { --theme-hue: var(--hue-coral); --on-accent: oklch(18% 0 0); }
[data-theme-color="orange"] { --theme-hue: var(--hue-orange); --on-accent: oklch(18% 0 0); }
[data-theme-color="amber"] { --theme-hue: var(--hue-amber); --on-accent: oklch(18% 0 0); }
[data-theme-color="yellow"] { --theme-hue: var(--hue-yellow); --on-accent: oklch(18% 0 0); }
[data-theme-color="lime"] { --theme-hue: var(--hue-lime); --on-accent: oklch(18% 0 0); }
[data-theme-color="green"] { --theme-hue: var(--hue-green); --on-accent: oklch(15% 0 0); }
[data-theme-color="emerald"] { --theme-hue: var(--hue-emerald); --on-accent: oklch(15% 0 0); }
[data-theme-color="teal"] { --theme-hue: var(--hue-teal); --on-accent: oklch(15% 0 0); }
[data-theme-color="cyan"] { --theme-hue: var(--hue-cyan); --on-accent: oklch(18% 0 0); }
[data-theme-color="blue"] { --theme-hue: var(--hue-blue); }
[data-theme-color="indigo"] { --theme-hue: var(--hue-indigo); }
[data-theme-color="purple"] { --theme-hue: var(--hue-purple); }
[data-theme-color="magenta"] { --theme-hue: var(--hue-magenta); }
[data-theme-color="pink"] { --theme-hue: var(--hue-pink); }
[data-theme-color="rose"] { --theme-hue: var(--hue-rose); }
[data-theme-color="grey"] { --theme-hue: var(--hue-grey); --theme-chroma: 0.02; --on-accent: oklch(18% 0 0); }