/* GENERATED by packages/brand/sync.mjs from packages/brand/tokens.css — DO NOT EDIT.
   Edit the canonical file and run `pnpm brand:sync`. */
/*
 * WayFinder brand tokens — Brand Guidelines v2.0 (August 2026).
 * Figma: KfQfXhWcQNJ0ZiF9xP17aA, canvas 37:2 "WayFinder — Brand (Global)".
 *
 * CANONICAL SOURCE. apps/admin + apps/superadmin @import this through the workspace;
 * apps/nav gets a committed copy at apps/nav/css/tokens.css via `pnpm brand:sync`
 * (it has no bundler, and node_modules is not uploaded to Cloudflare Pages).
 * Edit HERE, never the copy — `pnpm brand:check` fails the build on drift.
 *
 * Two layers, and the distinction matters:
 *   RAMPS  (--wf-coral-*, --wf-ink-*) are the raw guideline values. Do not use them
 *          directly in a component; they carry no meaning.
 *   ROLES  (--wf-brand, --wf-fg, --wf-focus, …) are what components consume.
 *
 * And one boundary that is the whole point of the token layer:
 *   --wf-*                        PRODUCT-owned. A tenant can never change these.
 *   --color-primary/--color-accent TENANT-owned, written at runtime by
 *                                 apps/nav/js/main.js applyTheme() from /api/config.
 * Product chrome (route line, user puck, AR arrow, focus ring, map furniture) must
 * sit on --wf-*, so a white-labelled campus keeps its own identity while navigation
 * affordances stay consistent everywhere. See docs/LANDING-PAGE.md §7.
 */

:root {
  /* ── Ramps ──────────────────────────────────────────────────────────────── */

  /* Signal Coral — the primary. */
  --wf-coral-100: #ffe7e0; /* tint / wash */
  --wf-coral-300: #ff9179; /* light */
  --wf-coral-500: #ff5a3c; /* PRIMARY — fills, the mark, on-dark */
  --wf-coral-600: #e8412a; /* hover / large text */
  --wf-coral-800: #b4301a; /* coral text on Paper (6.22:1, AA) */

  /* Ink scale & Paper. */
  --wf-ink-950: #0c1117;
  --wf-ink-900: #12181f;
  --wf-ink-700: #313a45;
  --wf-ink-500: #64707d;
  --wf-ink-300: #cbd4de;
  --wf-ink-100: #eef2f6;
  --wf-paper: #ffffff;

  /* Functional & semantic. Fills, dots, strokes and icons ONLY — see below. */
  --wf-route: #2f6bff; /* the live route, and the focus ring */
  --wf-success: #16b364; /* on-route · live */
  --wf-warning: #f79009; /* event · caution */
  --wf-error: #f04438; /* off-route · error */

  /* Deep variants of the semantics, and the ones you almost always want for anything
     carrying words. The raw values above fail WCAG AA as text on Paper (Success 2.74:1,
     Warning 2.35:1, Error 3.76:1) — nav's pre-existing dark ambers (#b26a00, #946200)
     were picked for exactly this reason. These work in BOTH directions: as text on a
     light ground, and as a solid fill under white text (each clears 6:1 against white).
     Use the raw semantics for fills, dots, strokes and icons; use these for anything read. */
  --wf-success-text: #087443;
  --wf-warning-text: #b54708;
  --wf-error-text: #b42318;

  /* ── Roles ──────────────────────────────────────────────────────────────── */

  --wf-brand: var(--wf-coral-500); /* the mark, app icon, chips, on-dark */
  --wf-brand-solid: var(--wf-coral-800); /* solid fills carrying small text (AA) */
  --wf-brand-hover: var(--wf-coral-600);
  --wf-brand-text: var(--wf-coral-800); /* coral text on Paper */
  --wf-brand-wash: var(--wf-coral-100);

  --wf-fg: var(--wf-ink-900);
  --wf-fg-muted: var(--wf-ink-500);
  --wf-fg-subtle: var(--wf-ink-300);
  --wf-fg-onbrand: var(--wf-paper);

  --wf-bg: var(--wf-paper);
  --wf-bg-subtle: var(--wf-ink-100);
  --wf-bg-inverse: var(--wf-ink-950);

  --wf-border: var(--wf-ink-300);
  --wf-border-subtle: var(--wf-ink-100);

  /* Accessibility. Route Blue at 2px is the focus ring across every surface. */
  --wf-focus: var(--wf-route);
  --wf-focus-width: 2px;
  --wf-focus-offset: 2px;
  --wf-tap-min: 44px;

  /* Map furniture that is product-owned but outside the brand palette.
     The walkable-path network is deliberately NOT --wf-warning: this golden line
     is what keeps the Route Blue polyline legible against the path graph
     (see apps/nav/css/map.css). Changing it breaks route legibility, not just look. */
  --wf-map-path: #f0c040;
  --wf-map-building: var(--wf-ink-100);
  --wf-map-building-edge: var(--wf-ink-300);
}

/*
 * On dark. `.dark` is the class apps/admin + apps/superadmin toggle on <html>;
 * `.wf-dark` is the neutral name for any other surface that adopts these tokens.
 * Only the values that must change are redefined — the ramps are absolute.
 */
.wf-dark,
.dark {
  --wf-brand-solid: var(--wf-coral-500); /* 6.12:1 on Ink 950 — coral works on dark */
  --wf-brand-text: var(--wf-coral-500);

  --wf-fg: var(--wf-ink-100);
  --wf-fg-muted: var(--wf-ink-300);
  --wf-fg-subtle: var(--wf-ink-500);

  --wf-bg: var(--wf-ink-950);
  --wf-bg-subtle: var(--wf-ink-900);
  --wf-bg-inverse: var(--wf-paper);

  --wf-border: var(--wf-ink-700);
  --wf-border-subtle: var(--wf-ink-900);

  /* On Ink 950 the raw semantics clear AA comfortably, so the text variants —
     which are darkened for white grounds — would be the wrong way round here. */
  --wf-success-text: var(--wf-success);
  --wf-warning-text: var(--wf-warning);
  --wf-error-text: var(--wf-error);
}