/* Hallmark · genre: modern-minimal · macrostructure: Workbench · design-system: design.md · designed-as-app
 * theme: studied-DNA (source: rfidtoday/assets/css/tokens.css "Dock light")
 *
 * SmartOffice design tokens. Same palette and type as the public RFID Today
 * site, so staff moving from the website logo into SmartOffice stay inside
 * one brand. Every colour and font in app.css and jqx.smartoffice.css
 * references a token from this file; add a token here before using a value.
 *
 * Colour grammar, never swapped:
 *   blue (steel) = the next action (filled buttons, current nav, focus)
 *   orange (tag) = evidence and emphasis (section marks, warnings, counts)
 */

:root{
  /* ---------- ground and ink ---------- */
  --dock:#EEF1F2;        /* page ground */
  --dock-2:#F7F8F9;      /* raised surface: cards, bars */
  --dock-3:#E3E8EA;      /* recessed surface: table headers, wells */
  --ink:#151B21;
  --ink-2:#4B565F;
  --ink-3:#616C76;       /* measured 4.6:1 on --dock */

  /* ---------- tag orange: emphasis ---------- */
  --tag:#E2571C;
  --tag-soft:#F0763F;
  --tag-deep:#BF430E;
  --tag-ink:#B03F0D;
  --tag-wash:#FBE7DC;

  /* ---------- logo blue: every action ---------- */
  --steel:#17439E;
  --steel-hover:#0F3480;
  --steel-ink:#123A8A;
  --steel-wash:#E1EAF9;
  --on-steel:#F2F6FD;

  /* ---------- status ---------- */
  --ok:#1D7A4B;
  --ok-wash:#DDF1E6;
  --bad:#B42318;
  --bad-wash:#FBE4E1;

  /* ---------- home page module hues (main / ink for text / wash for grounds) ---------- */
  --hue-teal:#0E7C86;   --hue-teal-ink:#0B5F67;   --hue-teal-wash:#DDF2F3;
  --hue-violet:#6D3FC0; --hue-violet-ink:#55309A; --hue-violet-wash:#EDE6FA;
  --hue-green:#1D7A4B;  --hue-green-ink:#17603B;  --hue-green-wash:#DDF1E6;
  --hue-rose:#B4235F;   --hue-rose-ink:#921C4D;   --hue-rose-wash:#FBE3EC;
  --hue-amber:#B26B00;  --hue-amber-ink:#8A5300;  --hue-amber-wash:#FDF0D8;
  --hue-indigo:#3949AB; --hue-indigo-ink:#2C3888; --hue-indigo-wash:#E4E7F8;
  /* chart series: each dashboard chart has its own pair (each pair validated: lightness band, CVD and
     contrast on the light surface) */
  --chart-1:#2F66CC; --chart-2:#C27A00;     /* income: billed, received */
  --chart-3:#0098A8; --chart-4:#D1495B;     /* income against expenses: received, expenses */
  --chart-5:#7B52D1; --chart-6:#2E9E5B;     /* service reports: general, MA/PM */

  /* ---------- lines, from the ink hue ---------- */
  --line:rgba(21,27,33,.14);
  --line-soft:rgba(21,27,33,.08);
  --line-strong:rgba(21,27,33,.28);

  /* ---------- dark band ---------- */
  --night:#10161B;
  --night-2:#182027;
  --night-ink:#E7ECEE;
  --night-ink-2:#9AA6AE;
  --night-line:rgba(231,236,238,.16);

  /* ---------- type ---------- */
  --font-display:'Anuphan',system-ui,sans-serif;
  --font-body:'Sarabun',system-ui,sans-serif;
  --display-weight:600;
  --lh-thai:1.7;

  --text-xs:.75rem;  --text-sm:.875rem; --text-base:1rem;
  --text-md:1.125rem; --text-lg:1.375rem; --text-xl:1.75rem;
  --text-display:clamp(1.6rem,1.4vw + 1.1rem,2.25rem);

  /* ---------- motion ---------- */
  --ease-out:cubic-bezier(.23,1,.32,1);
  --ease-in:cubic-bezier(.7,0,.84,0);
  --ease-in-out:cubic-bezier(.65,0,.35,1);
  --dur-micro:120ms; --dur-short:220ms; --dur-long:420ms;

  /* ---------- radius by role ---------- */
  --r-control:10px;
  --r-pill:999px;
  --r-card:16px;
  --r-sheet:20px;

  /* ---------- rhythm ---------- */
  --gutter:clamp(12px,3vw,40px);
  --shell:1600px;
  --bar-h:60px;

  /* ---------- spacing (4pt scale) ---------- */
  --space-3xs:.25rem; --space-2xs:.5rem;  --space-xs:.75rem;
  --space-sm:1rem;    --space-md:1.5rem;  --space-lg:2rem;
  --space-xl:3rem;    --space-2xl:4.5rem;

  /* ---------- shadow ---------- */
  --shadow-sm:0 1px 2px rgba(21,27,33,.06);
  --shadow-md:0 8px 24px rgba(21,27,33,.09);
  --shadow-lg:0 20px 45px rgba(21,27,33,.18);
  --scrim:rgba(16,22,27,.48);
}
