/* ============================================================================
   EquipDash Design System v2 - the tokens themselves (P0).
   The single source of every color, type size, space, radius and shadow.
   Nothing outside this file may declare a raw hex for UI chrome.

   Split out of tokens.css so a surface can take the tokens WITHOUT the
   portal chrome that file also carries (.content / .modal-* / .offcanvas-*).
   The widget layouts load this plus eq-toast.css and nothing else.
   Spec: docs/mockups/design-system-v2.html - Plan: docs/DESIGN_SYSTEM_V2_PLAN.md
   ========================================================================== */

:root {
	/* ---- brand ---- */
	--ed-navy-900: #00224a;
	--ed-navy-700: #003264; /* primary actions, the accent */
	--ed-navy-600: #0a4a8c; /* links, hover, focus */
	--ed-navy-200: #dbe4f0; /* soft navy fill + border: comparison bars, lane segments */
	--ed-navy-100: #eaf1f8; /* selected, info chips */

	/* ---- surfaces ---- */
	--ed-canvas: #f5f7fb;   /* app background behind cards */
	--ed-surface: #ffffff;  /* cards */
	--ed-sunken: #f8fafd;   /* wells, hover rows */

	/* ---- text ---- */
	--ed-ink: #22314e;      /* headings, body */
	--ed-muted: #5A7089;    /* secondary (AA-checked; predates v2) */
	--ed-faint: #95a2b6;    /* captions, placeholders */

	/* ---- border ---- */
	--ed-border: #e7ecf3;   /* the ONE border color */

	/* ---- status ---- */
	--ed-success: #1d8a45;
	--ed-success-soft: #e7f4ec;
	--ed-success-border: #bfe3cc; /* border on a success-soft fill */
	--ed-warning: #b45309;
	--ed-warning-soft: #fdf3e7;
	--ed-danger: #c02626;
	--ed-danger-soft: #fbeaea;

	/* ---- closed (a date the shop is not trading) ----
	   Deliberately neutral: the status colors above already mean overdue, late
	   and paid on the surfaces this appears on, and being shut is not a problem
	   to fix. Used by <x-ui.closed-chip> and the calendar's closed band. */
	--ed-closed: #45536b;        /* the chip's words */
	--ed-closed-soft: #eef1f5;   /* the chip's fill */
	--ed-closed-line: #dde3ea;   /* the band's edge, and its hatch */
	--ed-closed-wash: #f3f5f8;   /* the band's ground */

	/* ---- bot marks (a bot's initials square; picked from its id, never semantic) ---- */
	--ed-mark-1: #0f766e;
	--ed-mark-2: #1d4ed8;
	--ed-mark-3: #92400e;
	--ed-mark-4: #0e7490;
	--ed-mark-5: #4d7c0f;
	--ed-mark-6: #9f1239;

	/* ---- AI (Dash surfaces only) ---- */
	--ed-ai: #7C3AED;
	--ed-ai-2: #9d64f2; /* gradient partner for --ed-ai */
	--ed-ai-soft: #f3edfd;

	/* ---- WhatsApp's own chrome, for the example chat on the WhatsApp page ----
	   Not ours and never semantic: these are the colors WhatsApp paints its own
	   app in, so a picture of that app on our page looks like the thing the
	   owner will open on their phone. Nothing else in the portal may use them.
	   They live here because hexes are only allowed in a tokens file
	   (lint-design-system R2), and the module stylesheet that draws the chat
	   reads them from here. */
	--wa-header: #075e54;
	--wa-avatar: #0b7a6d;
	--wa-ground: #ece5dd;
	--wa-bubble-in: #ffffff;
	--wa-bubble-out: #dcf8c6;
	--wa-bubble-ink: #111b21;
	--wa-bubble-time: #7c8a94;
	--wa-link: #1f7ae0;
	--wa-brand: #25d366;
	--wa-bar: #f4f4f4;
	--wa-bar-ink: #8b97a0;
	--wa-day-ink: #5c6a72;

	/* ---- on-accent (text/icons on filled navy, danger, ai) ---- */
	--ed-on-accent: #ffffff;
	/* State pills keep their meaning on a navy card: the fill goes translucent
	   white and the words take a light tint of the same state (learned rule
	   0012 - an inverting row carries its children's color with it). */
	--ed-on-navy-fill: rgba(255, 255, 255, 0.18);
	--ed-on-navy-danger: #ffc2bd;
	--ed-on-navy-warning: #ffd79a;
	--ed-on-navy-success: #a6e6c0;
	--ed-danger-strong: #a81f1f; /* danger hover */
	--ed-setup-border: #d4dcea;  /* dashed border on setup cards */
	--ed-hatch-blocked: repeating-linear-gradient(45deg, #e6ebf3 0 6px, #f3f6fa 6px 12px); /* unavailable timeline segments */

	/* ---- type scale (BRCandor is the one brand face) ---- */
	--ed-font: "BRCandor", sans-serif;
	--ed-display-30: 600 30px/1.2 var(--ed-font);
	--ed-display-24: 600 24px/1.25 var(--ed-font);
	--ed-title-18: 600 18px/1.3 var(--ed-font);
	--ed-subtitle-15: 600 15px/1.4 var(--ed-font);
	--ed-body-14: 400 14px/1.5 var(--ed-font);
	--ed-small-12: 400 12.5px/1.45 var(--ed-font);
	--ed-caption-11: 600 11px/1.3 var(--ed-font); /* + uppercase + .06em spacing */

	/* ---- space (4-base) ---- */
	--ed-s1: 4px;
	--ed-s2: 8px;
	--ed-s3: 12px;
	--ed-s4: 16px;
	--ed-s5: 20px;
	--ed-s6: 24px;
	--ed-s7: 32px;
	--ed-s8: 40px;

	/* ---- radius ---- */
	--ed-r-ctl: 8px;
	--ed-r-card: 12px;
	--ed-r-pill: 999px;

	/* ---- overlay scrim behind modals and drawers ---- */
	--ed-scrim: rgba(0, 34, 74, .35);

	/* ---- shadows ---- */
	--ed-shadow-card: 0 1px 2px rgba(29, 43, 69, .05), 0 8px 24px rgba(29, 43, 69, .07);
	--ed-shadow-pop: 0 12px 40px rgba(29, 43, 69, .18);

	/* ---- motion ---- */
	--ed-fast: 150ms ease;

	/* ---- named z layers ---- */
	--ed-z-nav: 100;
	--ed-z-drawer: 1050;
	--ed-z-modal: 1055;
	--ed-z-toast: 1080;
	--ed-z-tooltip: 1090;
}