/* ============================================================
   Color — Willa
   ------------------------------------------------------------
   Patisserie (direction CC1 — quieter blue ask).

   Pastel grounds carry the identity: a pistachio page, blossom
   and sky wells, butter-adjacent warm washes. The ink is deep
   olive, so even the text belongs to the pistachio family. Blue
   appears under one rule — ONE BLUE THING PER SURFACE: a
   deepened sky (#3f6d8e) is the single action color, and where
   a surface has no ask, it has no blue. Stat/statement surfaces
   use a pastel band (sky wash) carrying a deep figure — never
   a dark slab.

   Pastel rule: display pastels (blossom #fbdce7, sky #dcebf7,
   pistachio wash #e4ead2, peony bloom #ec7fa4) carry NO text;
   anything text-bearing uses the deep functional ramp, validated
   at 4.5:1 on the darkest surface it can land on (the blossom
   waiting tint #fbdce7, not just white).

   Sunny Launch tie: footer byline only.
   ============================================================ */
:root {
  /* ---- Base surfaces ---- */
  --bg-field: #dcebf7;        /* sky wash — statement band: slides, masthead, hero band */
  --bg-sand: #f6f8ee;         /* pistachio page bg, family-facing light surfaces */
  --bg-surface: #ffffff;      /* cards, inputs, elevated */
  --bg-sunken: #fbdce7;       /* blossom — quoted/echoed notes, recessed wells */
  --bg-admin: #2f3a2a;        /* operator dashboard bg — deep olive */
  --bg-admin-surface: #3e4a38;/* dark-mode card surface */
  --bg-admin-border: #54614c; /* dark-mode hairline */

  /* ---- Deep olive ink (text) ---- */
  --ink-900: #3d4a36;         /* headings, primary text */
  --ink-700: #4c5845;         /* section accents */
  --ink-500: #525e4a;         /* body copy, descriptions */
  --ink-300: #68745f;         /* placeholders, meta — 4.6:1 on the page */
  --ink-tint: #e4ead2;        /* pistachio wash — soft fills */
  --text-inverse: #f4f6ec;    /* pistachio-white on deep olive */

  /* ---- Sky (the one action color — one blue thing per surface) ---- */
  --sky-500: #3f6d8e;         /* primary CTAs, accent — deepened sky */
  --sky-600: #2d5470;         /* hover / text-safe */
  --sky-100: #dcebf7;         /* sky tint — focus rings, soft fills, the band */

  /* ---- On the band (deep figures on sky wash) ---- */
  --on-band: #2d5470;         /* stat figures, band headlines */
  --on-band-body: #42536b;    /* band body copy */

  /* ---- Peony (warmth, atmosphere — never body text) ---- */
  --peony-500: #ec7fa4;       /* full-bloom peony — decorative highlight */
  --peony-deep: #cb3a68;      /* attention — unassigned slots; the deep pair never whispers */
  --peony-100: #fbdce7;       /* blossom tint */
  --peony-400: #d95f87;       /* soft display peony — LARGE text only (3:1 on blossom/sky), never UI text */
  --sky-400: #5b8db4;         /* soft display sky — LARGE text only, wordmark + display accents */
  --sage-400: #7a8a5c;        /* soft display sage — LARGE text only, wordmark + display accents */

  /* ---- Borders (pistachio-tinted) ---- */
  --border-light: #e7e9d9;    /* subtle dividers */
  --border-medium: #cdd1bb;   /* input borders, stronger dividers */

  /* ---- Proposal status (the core interaction) ---- */
  --status-confirmed: #4a6b3d;
  --status-confirmed-bg: #e9efdf;
  --status-pending: #9c3568;   /* deep peony — needs your input */
  --status-pending-bg: #fbdce7;
  --status-rejected: #93313d;
  --status-rejected-bg: #f9e6ea;
  --status-expired: #5f6660;
  --status-expired-bg: #e9ece7;

  /* ---- Email-only accents (briefing) ---- */
  --email-field: #faf9f4;      /* the canvas the briefing sits on — off-white, no hue conflict with the masthead */
  --email-quote-bg: #f9faf2;
  --email-waiting-bg: #fdeef2; /* lighter than blossom — accents validated on blossom still pass */
  --email-progress-teal: #a9bfa0;  /* cleared bar — sage (name kept for back-compat) */

  /* ---- Assignee pills (per-parent, deterministic by index) ---- */
  --assignee-0: #3f6d8e;  /* parent 0 — sky deep */
  --assignee-1: #aa3864;  /* parent 1 — peony deep (4.77:1 on blossom) */
  --assignee-2: #77593c;  /* parent 2 — bronze */
  --assignee-3: #6b5875;  /* parent 3 — dusty violet */
  --assignee-gap: #cb3a68;/* missing pickup/dropoff — vivid peony */
  --assignee-unknown: #68745f;

  /* ---- Kid name accents (KID_COLOR_PALETTE, middot titles) ----
     Every entry clears 4.5:1 on the blossom tint #fbdce7. */
  --kid-olive: #5c6b3d;
  --kid-peony: #aa3864;
  --kid-sky: #35608a;
  --kid-bronze: #77593c;
  --kid-violet: #6b5875;
  --kid-berry: #98394d;
  --kid-slate: #58535c;
  --kid-pine: #3d5a4a;

  /* ---- Sunny Launch (parent brand — footer credit only) ---- */
  --sunny-orange: #f27822;
  --sunny-ink: #000000;

  /* ---- Back-compat aliases (denim/rose/blush/clay names from earlier directions) ---- */
  --denim-500: var(--sky-500);
  --denim-600: var(--sky-600);
  --denim-100: var(--sky-100);
  --rose-500: var(--sky-500);
  --rose-600: var(--sky-600);
  --rose-100: var(--sky-100);
  --blush-500: var(--peony-500);
  --blush-bright: var(--peony-deep);
  --blush-100: var(--peony-100);
  --clay-500: var(--sky-500);
  --clay-600: var(--sky-600);
  --clay-100: var(--sky-100);
  --apricot-500: var(--peony-500);
  --apricot-bright: var(--peony-deep);
  --apricot-100: var(--peony-100);
  --kid-denim: var(--kid-sky);
  --kid-rose: var(--kid-peony);
  --kid-mauve: var(--kid-violet);
  --kid-garnet: var(--kid-berry);
  --kid-brick: var(--kid-berry);
  --kid-navy: var(--kid-sky);
  --kid-clay: var(--kid-peony);
  --kid-teal: var(--kid-sky);
  --kid-apricot: var(--kid-bronze);
  --kid-plum: var(--kid-violet);
  --kid-moss: var(--kid-olive);
  --kid-periwinkle: var(--kid-slate);
  --kid-mustard: var(--kid-berry);

  /* ---- Semantic aliases (prefer these in components) ---- */
  --surface-page: var(--bg-sand);
  --surface-card: var(--bg-surface);
  --surface-field: var(--bg-field);
  --text-heading: var(--ink-900);
  --text-primary: var(--ink-900);
  --text-secondary: var(--ink-500);
  --text-body: var(--ink-500);
  --text-muted: var(--ink-300);
  --action-primary: var(--sky-500);
  --action-primary-hover: var(--sky-600);
  --focus-ring: var(--sky-100);
}
