/**
 * ApprovalTrail — brand design tokens
 * Produced by: brand-designer (Phase 3, step p3.brand) · 2026-08-07
 *
 * This is the single source of truth for color, type, spacing, radius and
 * elevation. The GeneratePress child theme must consume these variables rather
 * than hard-coding values, and theme-planner may ADD tokens after the moodboard
 * pass but should not silently redefine the ones below.
 *
 * Contrast: every foreground token pairs with --at-surface (#FFFFFF) or
 * --at-paper (#F4F1EA) at >= 4.5:1 for body text. Ratios are noted inline.
 * Do NOT introduce a purple/violet gradient, an emoji-led heading, or a
 * "trusted by" logo strip — see reference/design-inputs.md §2.
 */

:root {
	/* ------------------------------------------------------------------
	 * Color — "ink on paper", from the trade this plugin serves.
	 * Ink   = the deep press-blue of the record itself (primary).
	 * Stamp = the burnt-orange of an inked stamp / job-ticket flag (accent).
	 * Paper = warm stock, not clinical white.
	 * ------------------------------------------------------------------ */
	--at-ink-900: #0B2536;
	--at-ink-800: #123B54; /* PRIMARY — 11.4:1 on white */
	--at-ink-700: #17506F;
	--at-ink-600: #20698D; /* interactive / link — 6.0:1 on white */
	--at-ink-500: #2E86A8; /* non-text UI only (borders, fills) */

	--at-stamp-600: #B23F12; /* ACCENT on light — 5.8:1 on white */
	--at-stamp-500: #D0602B; /* non-text UI only */
	--at-stamp-400: #E8A33D; /* accent on dark ink — 7.1:1 on --at-ink-800 */

	--at-paper-50: #FBFAF7;
	--at-paper-100: #F4F1EA; /* page background */
	--at-paper-200: #E7E2D8; /* hairlines on paper */

	--at-neutral-50: #FAFAF9;
	--at-neutral-100: #F3F2F0;
	--at-neutral-200: #E5E3DF;
	--at-neutral-300: #CFCCC6; /* 3.0:1 on white — borders/dividers only */
	--at-neutral-400: #A8A49C;
	--at-neutral-500: #7C7770;
	--at-neutral-600: #5B5750; /* 6.6:1 — secondary text */
	--at-neutral-700: #423F3A;
	--at-neutral-800: #2B2926;
	--at-neutral-900: #1A1917; /* body text — 16.0:1 */

	--at-success: #17683A; /* 7.0:1 — "Approved" */
	--at-success-bg: #E9F4EC;
	--at-danger: #A6291F; /* 7.2:1 — "Changes requested" */
	--at-danger-bg: #FBEDEB;
	--at-warning: #8A6100; /* 5.5:1 — "On hold / waiting" */
	--at-warning-bg: #FBF2DF;
	--at-info: #20698D;

	/* Semantic aliases — prefer these in components. */
	--at-color-primary: var(--at-ink-800);
	--at-color-primary-hover: var(--at-ink-900);
	--at-color-accent: var(--at-stamp-600);
	--at-color-link: var(--at-ink-600);
	--at-color-text: var(--at-neutral-900);
	--at-color-text-muted: var(--at-neutral-600);
	--at-color-border: var(--at-neutral-300);
	--at-surface: #FFFFFF;
	--at-paper: var(--at-paper-100);
	--at-color-focus: var(--at-stamp-600); /* 3:1+ against both surfaces */

	/* ------------------------------------------------------------------
	 * Type
	 * Heading: Charis SIL (SIL OFL, on Google Fonts) — a direct descendant of
	 *   Matthew Carter's Charter. A text serif reads as "document / record",
	 *   which is the product's whole claim, and it is the opposite of the
	 *   default SaaS geometric sans. Self-host; do not hotlink Google Fonts.
	 * Body/UI: Lato (SIL OFL) — humanist, sturdy, wide language coverage.
	 * Mono: Noto Sans Mono (SIL OFL) — used for hashes, IDs and timestamps.
	 *   The SHA-256 fingerprint is a brand motif; it must always be mono.
	 * The committed SVG art renders with "Bitstream Charter" (Charter's
	 * ancestor, installed on the build machine) — same shapes.
	 * ------------------------------------------------------------------ */
	--at-font-heading: "Charis SIL", "Bitstream Charter", Charter, Georgia, "Times New Roman", serif;
	--at-font-body: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--at-font-mono: "Noto Sans Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

	--at-weight-regular: 400;
	--at-weight-medium: 600;
	--at-weight-bold: 700;
	--at-weight-heading: 700;

	/* Modular scale, ratio 1.25, base 1rem/16px. */
	--at-size-xs: 0.8rem;    /* 12.8px — captions, legal */
	--at-size-sm: 0.9rem;    /* 14.4px */
	--at-size-base: 1rem;    /* 16px — body */
	--at-size-lg: 1.25rem;   /* 20px  — lead paragraph, h4 */
	--at-size-xl: 1.5625rem; /* 25px  — h3 */
	--at-size-2xl: 1.9531rem;/* 31px  — h2 */
	--at-size-3xl: 2.4414rem;/* 39px  — h1 */
	--at-size-4xl: 3.0518rem;/* 49px  — hero h1 */

	--at-leading-tight: 1.15; /* display headings */
	--at-leading-snug: 1.3;   /* h2/h3 */
	--at-leading-normal: 1.6; /* body */
	--at-leading-loose: 1.75; /* long-form docs */
	--at-tracking-tight: -0.01em; /* headings only */
	--at-measure: 68ch;       /* max line length for body copy */

	/* ------------------------------------------------------------------
	 * Spacing — 4px base, geometric-ish ramp.
	 * ------------------------------------------------------------------ */
	--at-space-0: 0;
	--at-space-1: 0.25rem; /* 4  */
	--at-space-2: 0.5rem;  /* 8  */
	--at-space-3: 0.75rem; /* 12 */
	--at-space-4: 1rem;    /* 16 */
	--at-space-5: 1.5rem;  /* 24 */
	--at-space-6: 2rem;    /* 32 */
	--at-space-7: 3rem;    /* 48 */
	--at-space-8: 4rem;    /* 64 */
	--at-space-9: 6rem;    /* 96 — section rhythm */
	--at-space-10: 8rem;   /* 128 */

	--at-gutter: var(--at-space-5);
	--at-container: 72rem;      /* 1152px content max */
	--at-container-narrow: 46rem; /* matches the plugin's own approval page */

	/* ------------------------------------------------------------------
	 * Radius / border / elevation
	 * Deliberately restrained: a job ticket, not a rounded SaaS card deck.
	 * ------------------------------------------------------------------ */
	--at-radius-sm: 2px;
	--at-radius-md: 4px;
	--at-radius-lg: 8px;
	--at-radius-xl: 12px;
	--at-radius-pill: 999px;

	--at-border-width: 1px;
	--at-border-strong: 2px;
	--at-rule: var(--at-border-width) solid var(--at-color-border);

	--at-shadow-none: none;
	--at-shadow-sm: 0 1px 2px rgba(11, 37, 54, 0.06);
	--at-shadow-md: 0 2px 6px rgba(11, 37, 54, 0.08);
	--at-shadow-lg: 0 8px 24px rgba(11, 37, 54, 0.10);

	--at-focus-ring: 3px solid var(--at-color-focus);
	--at-focus-offset: 2px;

	--at-duration-fast: 120ms;
	--at-duration-base: 200ms;
	--at-ease: cubic-bezier(0.2, 0, 0.2, 1);
}

/* Honour the OS motion preference — WCAG 2.3.3 / design-inputs §3c. */
@media (prefers-reduced-motion: reduce) {
	:root {
		--at-duration-fast: 0ms;
		--at-duration-base: 0ms;
	}
}