/* ─────────────────────────────────────────────────────────────
   Contact Current brand layer.
   Linked AFTER /styles/tokens.css by start/, home/, editor/ and
   admin/ — i.e. everything served on a Contact Current host.

   HISTORY: this file used to exclude /editor and /admin. That was
   wrong for /editor (the CC colour rule of 2026-07-14 names it a CC
   surface) and, from 2026-07-29, wrong for /admin too — the console
   answers on sites.contactcurrent.com, so Brighthouse orange there
   read as a different product.

   BEFORE YOU ADD A SURFACE: the remap below collapses orange→pink
   and yellow→blue, so any TWO categories coded with those hues
   become one colour. Status/category coding must use the semantic
   --warn / --build tokens in tokens.css, which this file leaves
   alone on purpose. The console's stage badges were repointed for
   exactly this reason; scripts/e2e-brand-tokens.mjs fences it.

   Satoshi is self-hosted (Fontshare license forbids CDN reuse);
   weight rule per CC brand: display 900, buttons/labels 700,
   body 400–500. Palette: pink #ff007f primary, blue #0061ef
   secondary — aliased onto the token names the pages already
   consume, so both themes stay AA via the existing accent-text
   pairs in tokens.css.
   ───────────────────────────────────────────────────────────── */
@import url('/styles/satoshi.css');

:root{
  --head:'Satoshi',system-ui,sans-serif;
  --body:'Satoshi',system-ui,Arial;

  /* CC accent remap — aliases resolve per-theme, so dark/light
     AA text variants keep working without duplication */
  --orange:var(--pink);
  --orange-text:var(--pink-text);
  --orange-a:var(--pink-a);
  --orange-line:var(--pink-line);
  --yellow:var(--blue);
  --yellow-text:var(--blue-text);
  --yellow-a:var(--blue-a);
  --yellow-line:var(--blue-line);
  /* own literal, NOT var(--send) — tokens.css documents --send as "editor send only";
     coupling client primary buttons to it would restyle them on any editor tweak */
  --grad:linear-gradient(135deg,#ff007f,#0061ef);
}

/* The hue remap collapses orange→pink and yellow→blue, which makes the /home
   quick-tile color coding collide (q-orange==q-pink, q-yellow==q-blue). Re-point
   the two colliding tiles to looks still distinct under the CC skin.
   NOTE: this alias layer is a stopgap — when a client page next needs a REAL
   orange/yellow, introduce semantic tokens (--accent/--accent-2/--warn) in the
   pages and override those here instead. */
.q-orange .qico{background:var(--grad);color:#fff}
.q-yellow .qico{background:var(--surface-hover);box-shadow:inset 0 0 0 1px var(--line-2);color:var(--ink-2)}
