/* Design tokens. Single source of truth for color/spacing/shape across themes.
   Light is the default; dark applies via prefers-color-scheme unless the user
   forced a theme (html[data-theme], set pre-paint from localStorage). */

:root {
  /* shape & elevation */
  --radius: 8px;
  --radius-pill: 999px;
  --shadow: 0 1px 2px rgba(9, 30, 66, 0.15);
  --shadow-raised: 0 8px 24px rgba(9, 30, 66, 0.2);

  /* base palette — light */
  --bg: #f4f5f7;
  --surface: #ffffff;
  --surface-2: #ebecf0;
  --surface-hover: #fafbfc;
  --text: #172b4d;
  --text-muted: #5e6c84;
  --border: #dfe1e6;
  --accent: #6d4aff;
  --accent-hover: #5a39e0;
  --on-accent: #ffffff;
  --danger: #c9372c;

  /* semantic surfaces */
  --success-bg: #e3fcef;
  --success-fg: #006644;
  --danger-bg: #ffebe6;
  --danger-fg: #bf2600;
  --warn-bg: #ffedd5;
  --warn-fg: #c2410c;

  /* lifecycle kind ramps (Column::KINDS) */
  --kind-backlog-bg: #e2e8f0;
  --kind-backlog-fg: #475569;
  --kind-ready-bg: #dbeafe;
  --kind-ready-fg: #1d4ed8;
  --kind-in_progress-bg: #fef3c7;
  --kind-in_progress-fg: #b45309;
  --kind-in_review-bg: #ede9fe;
  --kind-in_review-fg: #6d28d9;
  --kind-awaiting_input-bg: #fce7f3;
  --kind-awaiting_input-fg: #be185d;
  --kind-needs_human-bg: #fee2e2;
  --kind-needs_human-fg: #b91c1c;
  --kind-done-bg: #dcfce7;
  --kind-done-fg: #15803d;
}

/* Dark palette, twice: system preference (unless forced light) and forced dark. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
    --shadow-raised: 0 8px 24px rgba(0, 0, 0, 0.55);

    --bg: #0f1117;
    --surface: #1a1d24;
    --surface-2: #232730;
    --surface-hover: #20242d;
    --text: #e7e9ee;
    --text-muted: #9aa3b2;
    --border: #313641;
    --accent: #8b71ff;
    --accent-hover: #9d87ff;
    --on-accent: #ffffff;
    --danger: #ff6b5e;

    --success-bg: #11362a;
    --success-fg: #5ce0a5;
    --danger-bg: #3d1a14;
    --danger-fg: #ff9c8a;
    --warn-bg: #3a2410;
    --warn-fg: #ffab70;

    --kind-backlog-bg: #262b36;
    --kind-backlog-fg: #a3aebf;
    --kind-ready-bg: #16294a;
    --kind-ready-fg: #7aa7ff;
    --kind-in_progress-bg: #3a2b12;
    --kind-in_progress-fg: #ffc566;
    --kind-in_review-bg: #2a2247;
    --kind-in_review-fg: #b79bff;
    --kind-awaiting_input-bg: #3a1830;
    --kind-awaiting_input-fg: #ff8fc5;
    --kind-needs_human-bg: #3b1715;
    --kind-needs_human-fg: #ff8a80;
    --kind-done-bg: #143323;
    --kind-done-fg: #6fd99a;
  }
}

:root[data-theme="dark"] {
  --shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-raised: 0 8px 24px rgba(0, 0, 0, 0.55);

  --bg: #0f1117;
  --surface: #1a1d24;
  --surface-2: #232730;
  --surface-hover: #20242d;
  --text: #e7e9ee;
  --text-muted: #9aa3b2;
  --border: #313641;
  --accent: #8b71ff;
  --accent-hover: #9d87ff;
  --on-accent: #ffffff;
  --danger: #ff6b5e;

  --success-bg: #11362a;
  --success-fg: #5ce0a5;
  --danger-bg: #3d1a14;
  --danger-fg: #ff9c8a;
  --warn-bg: #3a2410;
  --warn-fg: #ffab70;

  --kind-backlog-bg: #262b36;
  --kind-backlog-fg: #a3aebf;
  --kind-ready-bg: #16294a;
  --kind-ready-fg: #7aa7ff;
  --kind-in_progress-bg: #3a2b12;
  --kind-in_progress-fg: #ffc566;
  --kind-in_review-bg: #2a2247;
  --kind-in_review-fg: #b79bff;
  --kind-awaiting_input-bg: #3a1830;
  --kind-awaiting_input-fg: #ff8fc5;
  --kind-needs_human-bg: #3b1715;
  --kind-needs_human-fg: #ff8a80;
  --kind-done-bg: #143323;
  --kind-done-fg: #6fd99a;
}

/* Hint native form controls/scrollbars to match the active theme. */
:root { color-scheme: light; }
:root[data-theme="dark"] { color-scheme: dark; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) { color-scheme: dark; }
}