/* =======================================================================
   PGR-WORKSPACE — design tokens (one source for every page)
   Loaded before workspace.css, book/book.css and compat/track.css.
   Official colours: blue (action, Oct 2026 — was teal), gray (text, lines), baby blue (surfaces).
   Typeface: Atkinson Hyperlegible Next (self-hosted, SIL OFL 1.1) → Segoe UI.
   ======================================================================= */

/* ---------------------------------------------------------------- fonts */
@font-face {
  font-family: "Atkinson Hyperlegible Next";
  src: url("font.php?f=AtkinsonHyperlegibleNext-wght.woff2") format("woff2");
  font-weight: 200 800; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Atkinson Hyperlegible Next";
  src: url("font.php?f=AtkinsonHyperlegibleNext-Italic-wght.woff2") format("woff2");
  font-weight: 200 800; font-style: italic; font-display: swap;
}

:root {
  /* type */
  --font-sans: "Atkinson Hyperlegible Next", "Segoe UI", ui-sans-serif, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, "Cascadia Mono", Consolas, "SF Mono", Menlo, monospace;
  --font: var(--font-sans);
  --mono: var(--font-mono);
  --fs: 15px;            /* base size (was 14px) */
  --fs-sm: 13px;
  --fs-xs: 12px;
  --lh: 1.55;

  /* gray — cooled toward blue so text, lines and surfaces read as one material */
  --text: #1f2a37;
  --text-2: #4b5768;
  --text-3: #596577;     /* ≥ 4.5:1 on white and on the sidebar */
  --ink: #1b2430;        /* toasts, tooltips */
  --on-accent: #ffffff;
  --bg: #ffffff;
  --surface: #ffffff;
  --panel: #f5f7fa;
  --border: #e2e7ee;
  --border-strong: #cdd5e0;
  --border-2: var(--border-strong);
  --border-input: #8090a3;
  --hover: rgba(31, 42, 55, .06);
  --active: var(--sky-100);
  --glass: rgba(255, 255, 255, .92);
  --scrim: rgba(20, 30, 45, .25);
  --scrim-light: rgba(20, 30, 45, .08);
  --scrim-dark: rgba(20, 30, 45, .4);

  /* baby blue — surfaces only, never a second action colour */
  --sky-50: #eef4f7;
  --sky-100: #dce9f0;
  --sky-200: #bcd6e2;
  --sky-700: #1f4f66;
  --sidebar: var(--sky-50);

  /* blue — the single action colour (buttons, links, selection) */
  --accent: #1a5fb4;
  --accent-hover: #164f97;
  --accent-press: #123f7a;
  --accent-soft: #e6eefa;
  --accent-line: #b9cdee;
  --focus: #1a5fb4;

  /* states */
  --danger: #c4402f;
  --danger-soft: #fdecea;
  --danger-text: #6e1d14;
  --warn: #9a6700;
  --warn-soft: #fbf3db;
  --ok: #1c4a2c;
  --ok-soft: #dbeddb;
  --pay: #1b3f5c;
  --pay-soft: #d9e8f2;
  --hold: #6b4a00;
  --hold-soft: #fbeec3;
  --busy: #5f5e5a;
  --busy-soft: #ebeae8;
  --info: #2b5ea8;
  --info-soft: #e8f0fb;

  /* shape, depth, motion */
  --radius: 5px;
  --radius-lg: 9px;
  --shadow: 0 0 0 1px rgba(20, 30, 45, .05), 0 3px 6px rgba(20, 30, 45, .08), 0 9px 24px rgba(20, 30, 45, .16);
  --shadow-soft: 0 1px 2px rgba(20, 30, 45, .06), 0 0 0 1px rgba(20, 30, 45, .04);
  --dur: .16s;
  --dur-slow: .22s;
  --ease: cubic-bezier(.2, .7, .2, 1);
  --sidebar-w: 248px;
  --peek-w: 640px;
  --tap: 32px;

  /* charts (blue ramp, light → dark) */
  --c-released: #1a5fb4;
  --c-issued: #6b9bd8;
  --c-pending: #b9cdee;
  --c-pending-2: #d8e4f6;
  --c-rest: #edf1f6;

  /* calendar dots (Donations) */
  --dot-for_approval: #d9a300;
  --dot-approved: #2c6e9e;
  --dot-processing: #7b4ea0;
  --dot-completed: #2f7d4a;
  --dot-returned: #c46a1c;

  /* Notion-style tags */
  --t-gray-bg: #e8ecf1; --t-gray: #46505e;
  --t-brown-bg: #eee0da; --t-brown: #5c3b23;
  --t-orange-bg: #fadec9; --t-orange: #6b3a10;
  --t-yellow-bg: #fbeec3; --t-yellow: #5e4410;
  --t-green-bg: #dbeddb; --t-green: #1c4a2c;
  --t-blue-bg: #d9e8f2; --t-blue: #1b3f5c;
  --t-purple-bg: #e8deee; --t-purple: #4a2a61;
  --t-red-bg: #ffe2dd; --t-red: #6e1d14;
  --t-teal-bg: #d6ece8; --t-teal: #0d4d47;

  /* Facility Scheduler */
  --fb-ok: var(--ok); --fb-ok-bg: var(--ok-soft);
  --fb-pay: var(--pay); --fb-pay-bg: var(--pay-soft);
  --fb-hold: var(--hold); --fb-hold-bg: var(--hold-soft); --fb-hold-line: #c99a1e;
  --fb-blk: #4a4843; --fb-blk-bg: #ebeae8; --fb-blk-line: #8f8d88;
  --fb-free: var(--sky-100);                 /* "available" on calendars = baby blue */

  color-scheme: light;
  font-family: var(--font-sans);
  font-size: var(--fs);
  line-height: var(--lh);
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
  font-feature-settings: "kern" 1;
}
@media (pointer: coarse) { :root { --tap: 42px; } }

/* ------------------------------------------------- reader preferences (My profile) */
html[data-text="comfortable"] { --fs: 17px; --fs-sm: 15px; --fs-xs: 13.5px; --lh: 1.65; }
html[data-font="segoe"]  { --font-sans: "Segoe UI", ui-sans-serif, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; }
html[data-font="system"] { --font-sans: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; }

/* ------------------------------------------------- shared primitives */
.num, .code, .tabular, kbd, time, [data-code] { font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1, "kern" 1; }
code, pre, .mono { font-family: var(--font-mono); }

/* focus: blue ring with a white gap so it is visible on any background (GOV.UK pattern) */
:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; box-shadow: 0 0 0 2px var(--bg); border-radius: 4px; }

/* one motion rule for the whole system */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* the sidebar is baby blue; keep its lines a touch cooler so they do not look gray on blue */
.sidebar { --border: #d3e1e8; --hover: rgba(31, 79, 102, .08); }

/* public and tracking pages share the same shell */
@media print { :root { --fs: 12.5pt; } }
