/* Timo design tokens — direction A, "Chambers" (TIMO-172).
 *
 * THE single source of the brand's values. Two consumers, so they cannot drift:
 *   - frontend/ imports this file directly (frontend/src/index.css), and maps
 *     each value onto a Tailwind utility in its `@theme` block.
 *   - sites/landing/ is plain static files with no build step, so it serves a
 *     synced COPY at public/brand/tokens.css. `make brand-sync` writes it;
 *     `make brand-check` fails when the copy drifts from this file.
 *
 * Fonts are named here, not shipped here: each consumer self-hosts the files
 * (the SPA via @fontsource, the landing from public/fonts/). No Google Fonts
 * request from either surface.
 *
 * Light only for now. Every colour is a role, never a hue name, so a dark set
 * is one more `:root[data-theme="dark"]` block later, with no component edits.
 *
 * ⭐ ONE accent. Chambers is ivory paper, ink and a single bordeaux, used
 * sparingly. There is no second "gold" accent: approval / seal moments use the
 * accent too (the landing's old --gold folds into --accent in TIMO-171).
 */

:root {
  /* ── Type ─────────────────────────────────────────────────────────── */
  /* Display + reading: headings, document names, anything that "is" text
     from a legal document. UI: everything the platform says itself. */
  --type-display: "Frank Ruhl Libre Variable", "Frank Ruhl Libre", "Times New Roman", serif;
  --type-ui: "Assistant Variable", "Assistant", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --type-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* ── Surfaces ─────────────────────────────────────────────────────── */
  --paper: #f7f3ea;        /* page background: warm ivory */
  --paper-deep: #efe9dc;   /* sidebar, quiet panels */
  --card: #fffdf8;         /* the "sheet": cards, dialogs, inputs */

  /* ── Ink (text) — contrast on --paper in brackets, WCAG ───────────── */
  --ink: #1e1b17;          /* primary text, primary button fill (15.5) */
  --ink-soft: #4a443b;     /* body copy, secondary nav (8.7) */
  --muted: #6a6257;        /* labels, meta, timestamps (5.4) */
  --faint: #8a8274;        /* placeholders, disabled; NOT for body text (3.4) */
  --on-ink: #f7f3ea;       /* text on an --ink fill */

  /* ── Lines ────────────────────────────────────────────────────────── */
  --hairline: rgba(30, 27, 23, 0.12);         /* row dividers */
  --hairline-strong: rgba(30, 27, 23, 0.35);  /* input + secondary button borders */
  --rule: #1e1b17;                            /* the 1px ink rule over a table / list */

  /* ── Primary action (the one button a view exists for) ───────────── */
  --action: var(--ink);
  --action-hover: var(--ink-soft);
  --on-action: var(--on-ink);

  /* ── Accent (Timo's own brand) ────────────────────────────────────── */
  --accent: #6b1e2a;       /* bordeaux (10.3 on paper) */
  --accent-ink: #561722;   /* hover / pressed */
  --accent-soft: rgba(107, 30, 42, 0.07);  /* filled-value highlight, selection */
  --on-accent: #fffdf8;

  /* ── Firm-brand slot ──────────────────────────────────────────────── */
  /* The office's own colour, on the surfaces the FIRM fronts (client link,
     access code, consent, form, bot) and the lawyer header. Defaults to the
     Timo accent; at runtime `firmBrandStyle()` (frontend/src/lib/firmBrand.ts)
     overrides all five from the one colour a firm picks, keeping the fill as
     picked and guaranteeing every text and edge stays readable around it. Never style a firm
     surface with --accent directly: use these. */
  --firm: var(--accent);            /* fills: buttons, exactly as the firm picked */
  --firm-edge: var(--accent);       /* a fill's border, visible on paper even when the fill is pale */
  --firm-text: var(--accent);       /* the firm colour used AS text on --paper/--card */
  --on-firm: var(--on-accent);      /* text on a --firm fill */
  --firm-soft: var(--accent-soft);  /* tints */

  /* ── Status (muted, so they never compete with the accent) ────────── */
  --danger: #9a2f22;       /* refusals, errors (6.8) */
  --danger-soft: rgba(154, 47, 34, 0.08);
  --warning: #7a4e0e;      /* needs attention (6.5) */
  --warning-soft: rgba(122, 78, 14, 0.09);
  --success: #2f5d3a;      /* produced, ready (6.9) */
  --success-soft: rgba(47, 93, 58, 0.09);
  --info: #2d4a6b;         /* in progress (8.2) */
  --info-soft: rgba(45, 74, 107, 0.08);

  /* ── Shape ────────────────────────────────────────────────────────── */
  /* Letterhead-sharp. Nothing in Chambers is pill-round except a status dot. */
  --corner-sm: 2px;        /* buttons, inputs */
  --corner: 4px;           /* cards, dialogs */
  --elev-sheet: 0 0 0 1px rgba(30, 27, 23, 0.08), 0 30px 60px -20px rgba(30, 27, 23, 0.18);
  --elev-card: 0 0 0 1px rgba(30, 27, 23, 0.1);

  /* ── Space ────────────────────────────────────────────────────────── */
  /* Component spacing uses the consumer's own 4px scale (Tailwind in the
     SPA); these are the few page-level measures the two surfaces share. */
  --page-gutter: clamp(16px, 4vw, 56px);
  --sidebar-width: 240px;
  --measure: 68ch;         /* max line length for reading text */
}

/* ── Style "private_bank" (direction B, Private Bank) ─────────────────────
 * A firm-selectable platform style (הגדרות המשרד → סגנון). The firm's choice
 * sets `data-style="private_bank"` on <html> for its lawyer app and its
 * clients' links; the settings preview sets it on one element, which is why
 * the selector is `[data-style=…]` and not `:root[…]`. Same roles as the
 * default (Chambers), different values: near-white, graphite, forest green,
 * IBM Plex Sans Hebrew, soft corners, bordered cards instead of ink rules.
 *
 * To add a style: a block like this one, a key in template-service
 * `schemas/firm.py` BRAND_STYLES, and a label in the SPA `lib/brandStyle.ts`.
 * A block must re-declare every token that is derived with var() at :root
 * (the firm slot, --action): a var() resolves where it is DECLARED, so on a
 * nested element the :root value would keep the default style's colour. */
[data-style="private_bank"] {
  --type-display: "IBM Plex Sans Hebrew", "Assistant Variable", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --type-ui: "IBM Plex Sans Hebrew", "Assistant Variable", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;

  --paper: #fafaf8;
  --paper-deep: #f3f5f2;
  --card: #ffffff;

  --ink: #1b1d1f;          /* (16.2 on paper) */
  --ink-soft: #3e4347;     /* (9.6) */
  --muted: #5e6368;        /* (5.8) */
  --faint: #8a8f94;        /* (3.1) placeholders only */
  --on-ink: #ffffff;

  --hairline: #e3e5e1;
  --hairline-strong: #d5d8d4;
  --rule: #e3e5e1;         /* B frames lists with a light line, not an ink rule */

  --accent: #1e4a38;       /* deep forest green (9.6) */
  --accent-ink: #163829;
  --accent-soft: #edf2ee;
  --on-accent: #ffffff;

  --action: var(--accent);         /* B's primary button is the green, not ink */
  --action-hover: var(--accent-ink);
  --on-action: var(--on-accent);

  /* Re-declared so they resolve against THIS block's accent (see above). */
  --firm: var(--accent);
  --firm-edge: var(--accent);
  --firm-text: var(--accent);
  --on-firm: var(--on-accent);
  --firm-soft: var(--accent-soft);

  --corner-sm: 6px;
  --corner: 10px;
  --elev-sheet: 0 1px 2px rgba(0, 0, 0, 0.04), 0 0 0 1px #e3e5e1;
  --elev-card: 0 0 0 1px #e3e5e1;
}
