/* Shared design tokens — PUBLIC SURFACE ONLY (UX Wave 3, batch B).

   Every value below is copied VERBATIM from src/web/cabinet/static/cabinet.css
   :root (the project's source of truth per DESIGN.md — do not invent values
   here; if cabinet.css's :root changes, port the change here by hand).

   Why this file exists: master.css used to re-declare the same design system
   under DIFFERENT custom-property names (--card/--muted/--brand/... instead
   of --surface/--ink-2/--rose/...) and mirrored only a handful of colours —
   zero type scale, zero spacing scale. That let `var(--space-3)` silently
   resolve to nothing on public pages (booking_page.html gap regression) and
   let the two colour systems drift. This file is the fix: ONE canonical
   :root, loaded before master.css, which now ALIASES its historic names onto
   these tokens instead of re-declaring values (see master.css's own :root).

   Scope decision (owner, UX Wave 3 batch B): this file serves the PUBLIC
   surface (/m/{slug}, booking/reschedule/my-bookings/not-found) only.
   cabinet.css KEEPS its own separate :root — migrating the cabinet onto this
   file is deliberately out of scope for this batch (too risky to fold a
   large, already-working stylesheet into a token-unification pass) and is
   left as documented future work. Until that migration happens the two
   :root blocks must be kept in sync by hand; tests/test_ux_wave3_tokens.py
   pins a sample of values (--rose, --fs-sm, --space-3, --r) so drift fails
   CI instead of silently reappearing. */
:root {
  /* Background plane (the page itself) */
  --bg: #efe9e3;

  /* Surfaces */
  --surface: #ffffff;
  --surface-soft: #faf5f0;
  --surface-sunken: #f3ece5;

  /* Ink */
  --ink: #2a2226;
  --ink-2: #6e5d62;
  --ink-3: #776f78;  /* WCAG AA: 4.85:1 on white, 4.55:1 on cream surface */
  --ink-faint: #c9bdc1;

  /* Primary — dusty mauve / rose */
  --rose: #9d5a6c;
  --rose-hi: #b97a8c;
  --rose-soft: #e6d2d8;
  --rose-softer: #f3e4e8;

  /* Warm cream / beige (secondary accent for bookings) */
  --cream: #ecd7b8;
  --cream-soft: #f7ead4;
  --beige: #d8c0a3;

  /* Lines / dividers */
  --line: #ece5dd;
  --line-2: #e2d8cf;

  /* Status */
  --good: #6b8a6d;
  --good-soft: #d8e2d4;
  --warn: #b88753;
  --warn-soft: #f1e3cd;
  --bad: #bb3a2a;
  --bad-soft: #f2dad5;

  /* Radii / shadows */
  --r-lg: 22px;
  --r: 16px;
  --r-sm: 10px;
  --r-pill: 999px;
  --shadow-card: 0 2px 16px rgba(40, 25, 30, 0.04);
  --shadow-detail: 0 6px 28px rgba(40, 25, 30, 0.06);
  --shadow-lift: 0 8px 32px rgba(40, 25, 30, 0.08);

  --font: "Manrope", "Helvetica Neue", system-ui, sans-serif;
  --font-display: "Fraunces"; /* not used — we stay sans for strictness */

  /* Type scale (visual-design) — converge the sheet's ad-hoc 8.5–56px sizes
     onto these eight steps; --fs-sm is the body workhorse. Additive: nothing
     references them yet, adoption is incremental. */
  --fs-2xs: 11px;
  --fs-xs:  12px;
  --fs-sm:  13px;
  --fs-md:  15px;
  --fs-lg:  17px;
  --fs-xl:  20px;
  --fs-2xl: 24px;
  --fs-3xl: 30px;

  /* Spacing scale (4px base) — use instead of magic px in margin/padding/gap. */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-8: 48px;

  /* Extra brand tints (currently hardcoded as literals across the sheet). */
  --rose-deep: #84485b;  /* darker rose used in gradients / active borders */
  --on-rose: #ffffff;    /* text/icons on rose or ink fills */

  /* Motion tokens (redesign port 2026-06-21). Ported redesign components
     reference these; they were undeclared, so var() fell back to nothing.
     Additive — existing rules keep their literal durations until migrated. */
  --dur: 0.2s;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);  /* ease-out, no overshoot */
}
