/* Just Us — design tokens (docs/ui-spec.md §2, §11.8). Every text/background pair is checked by tests/unit/contrast.test.js.
   Accent tokens come in a light (-l) and a dark (-d) value; the theme blocks pick one. The App colour setting replaces the
   -l/-d values at run time with style.setProperty (ADR-037); the defaults here are the baby-blue preset (ADR-036). */
:root {
  color-scheme: light;
  --bg: #f6f8fa;
  --surface: #ffffff;
  --surface-2: #eceff3;
  --border: #dde2e8;
  --control-border: #7a828c;
  --text: #1a1d21;
  --text-muted: #5b636d;

  --accent-l: #89cff0;
  --on-accent-l: #0d2633;
  --on-accent-muted-l: #24485a;
  --accent-fg-l: #1f6a8f;
  --accent-soft-l: #e9f5fc;
  --accent-d: #2f6f8f;
  --on-accent-d: #ffffff;
  --on-accent-muted-d: #e3eff5;
  --accent-fg-d: #89cff0;
  --accent-soft-d: #1f2b33;

  --accent: var(--accent-l);
  --on-accent: var(--on-accent-l);
  --on-accent-muted: var(--on-accent-muted-l);
  --accent-fg: var(--accent-fg-l);
  --accent-soft: var(--accent-soft-l);
  --focus: var(--accent-fg);
  --focus-on-accent: var(--on-accent);
  --heart: #d6224a;

  --success: #1f7a4d;
  --warning: #8a5300;
  --danger: #b3261e;
  --on-success: #ffffff;
  --on-danger: #ffffff;
  --success-bg: #e9f2ed;
  --warning-bg: #f1eae0;
  --danger-bg: #f7e9e9;
  --info-bg: #edf2fc;
  --scrim: rgb(17 19 22 / 0.48);
  --shadow-1: 0 1px 2px rgb(26 29 33 / 0.08), 0 1px 1px rgb(26 29 33 / 0.04);
  --shadow-2: 0 8px 28px rgb(26 29 33 / 0.16), 0 2px 6px rgb(26 29 33 / 0.08);
  --call-bg: #0f1113;
  --call-text: #eef1f4;
  --call-muted: #a7afb9;
  --call-control: #262a30;

  --font: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", "Noto Sans Arabic", sans-serif;
  --emoji-font: "Noto Color Emoji", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;
  --mono: ui-monospace, "SF Mono", Consolas, monospace;
  --fs-xs: 0.75rem;
  --fs-sm: 0.875rem;
  --fs-md: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: 1.375rem;
  --fs-2xl: 1.75rem;
  --lh: 1.45;

  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 24px;
  --s-6: 32px;
  --s-7: 48px;

  --r-bubble: 18px;
  --r-bubble-tail: 6px;
  --r-control: 12px;
  --r-sheet: 20px;
  --r-pill: 999px;

  --dur-1: 150ms;
  --dur-2: 200ms;
  --dur-3: 250ms;
  --ease: cubic-bezier(0.2, 0, 0, 1);

  --header-h: 56px;
  --col-max: 760px;
  --panel-w: 380px;
  --tap: 44px;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #111316;
    --surface: #1a1d21;
    --surface-2: #262a30;
    --border: #343a42;
    --control-border: #80888f;
    --text: #eef1f4;
    --text-muted: #a7afb9;
    --accent: var(--accent-d);
    --on-accent: var(--on-accent-d);
    --on-accent-muted: var(--on-accent-muted-d);
    --accent-fg: var(--accent-fg-d);
    --accent-soft: var(--accent-soft-d);
    --heart: #ff6b88;
    --success: #6fd3a0;
    --warning: #f2b55c;
    --danger: #f2827a;
    --on-success: #111316;
    --on-danger: #111316;
    --success-bg: #27322d;
    --warning-bg: #3d3125;
    --danger-bg: #3d2929;
    --info-bg: #2b2e39;
    --scrim: rgb(0 0 0 / 0.6);
    --shadow-1: none;
    --shadow-2: 0 8px 28px rgb(0 0 0 / 0.5);
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #111316;
  --surface: #1a1d21;
  --surface-2: #262a30;
  --border: #343a42;
  --control-border: #80888f;
  --text: #eef1f4;
  --text-muted: #a7afb9;
  --accent: var(--accent-d);
  --on-accent: var(--on-accent-d);
  --on-accent-muted: var(--on-accent-muted-d);
  --accent-fg: var(--accent-fg-d);
  --accent-soft: var(--accent-soft-d);
  --heart: #ff6b88;
  --success: #6fd3a0;
  --warning: #f2b55c;
  --danger: #f2827a;
  --on-success: #111316;
  --on-danger: #111316;
  --success-bg: #27322d;
  --warning-bg: #3d3125;
  --danger-bg: #3d2929;
  --info-bg: #2b2e39;
  --scrim: rgb(0 0 0 / 0.6);
  --shadow-1: none;
  --shadow-2: 0 8px 28px rgb(0 0 0 / 0.5);
}

@media (prefers-contrast: more) {
  :root {
    --border: var(--control-border);
    --text-muted: var(--text);
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --dur-1: 0ms;
    --dur-2: 0ms;
    --dur-3: 0ms;
  }
}
