/* Shared design tokens for every webapp on the platform.
 *
 * Served at /static/platform-assets/css/tokens.css — public, unauthenticated,
 * same origin as both the portal root and /webapp/{ref}/, so any app (and any
 * /pub/* public page) can link it. The static handler serves it no-cache, so
 * clients revalidate and an edit here lands on their next load.
 *
 * ONE accent, owned by the theme. An app writes no hex of its own and picks
 * nothing: a webapp has no colour identity, it wears the skin's.
 *
 * --on-accent / --on-accent-strong are the text drawn ON those grounds, and they
 * are NOT derivable: this palette needs white on --accent-strong but dark on
 * --accent. The wrong pairing fails WCAG AA outright, so every pair below is
 * measured and >= 4.5 (AA for normal text).
 *
 * --on-accent equals --bg here. It stays its own token: its job is "the readable
 * text on this accent", and a paler skin must change it while --bg stays put.
 */
:root {
  color-scheme: dark;

  /* Surfaces, back to front */
  --bg: #0f172a;
  --surface: #1e293b;
  --surface-2: #273449;
  --surface-3: #334155;
  --border: #334155;

  /* Text, by descending emphasis */
  --text: #e2e8f0;
  --text-dim: #94a3b8;
  --text-muted: #64748b;

  /* Type. Family only — sizes stay in the apps: they are set in rem against the
   * root, tuned per app, and a shared base would resize five UIs at once for no
   * skin-related gain. */
  --font-ui: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* Status. Every ground that carries text has an --on-* companion: the pair is
   * what lets a skin move a hue without stranding the text on top of it.
   *
   * Both inks are dark, and that is the rule this palette follows throughout:
   * these are LIGHT grounds — a dark theme lightens its status hues so they read
   * on dark surfaces — so the text on them goes dark, exactly as --on-accent
   * does. A light skin inverts both halves and its inks turn white. */
  --danger: #f87171;
  --success: #4ade80;
  --warn: #fbbf24;
  --info: #38bdf8; /* a marker hue deliberately apart from the accent — "not mine", "shared" */
  --on-danger: #0f172a; /* 6.45 on --danger */
  --on-warn: #0f172a; /* 10.69 on --warn */

  /* Scrim — the ground of every overlay/backdrop. Always used through
   * color-mix at the alpha each overlay wants, so a skin sets the hue once. */
  --scrim: #000000;

  /* Elevation. In a dark theme depth comes mostly from the surface ladder
   * (--surface → --surface-2 → --surface-3) and the shadow barely registers; a
   * light theme has no ladder to lean on and needs the shadow to do the work.
   * That is why a skin must be able to restate all three — and why an app must
   * never compose its own out of --scrim, which no skin can soften. */
  --shadow-sm: 0 2px 6px color-mix(in srgb, var(--scrim) 40%, transparent);
  --shadow-md: 0 8px 24px color-mix(in srgb, var(--scrim) 35%, transparent);
  --shadow-lg: 0 10px 40px color-mix(in srgb, var(--scrim) 45%, transparent);

  /* Focus ring — accent ink, so it inherits whatever reads on a surface. An
   * element sitting ON the accent still has to override it with --on-accent, or
   * the ring vanishes into its own ground. */
  --focus: var(--accent-ink);

  /* Shape */
  --radius: 12px;
  --radius-sm: 8px;

  /* Accent — the platform's, and every app's.
   *
   *   --accent         a GROUND. Things sit on it; --on-accent is their colour.
   *   --accent-strong  a darker ground, for --on-accent-strong.
   *   --accent-ink     the accent when you draw WITH it — a link, an icon, a
   *                    ring, a selected border — on a --surface.
   *
   * Ink is its own token because the right value depends on the skin's own
   * lightness, which no rule can derive: a dark theme has dark surfaces so the
   * LIGHT accent reads on them, a light theme needs the dark one. Only a skin
   * whose accent AND surfaces are both light must restate it. Get it wrong and
   * the mark fails WCAG 1.4.11 (3.0 for non-text) — the brand lime on a pale
   * grey is 1.84, effectively invisible.
   */
  --accent: #a78bfa;
  --accent-strong: #7c3aed;
  --accent-ink: var(--accent); /* 4.61 on --surface-2 — a light accent on dark surfaces */
  --on-accent: #0f172a; /* 6.56 on --accent */
  --on-accent-strong: #ffffff; /* 5.70 on --accent-strong */
}