/*
 * Design tokens: the V1 SMS brand, "Threshold" (brand guide v1.0, 29 October 2026; the guide and its pack are kept in docs/brand/).
 * Graphite, amber and white, Arial throughout, 8px buttons and 12px cards. This replaces the earlier teal, warm white, orange and
 * serif look of 15 October 2026. The token NAMES are unchanged, so a name such as --bar or --accent now simply holds the new colour.
 *
 * This file is the single source for colour. The style guide page reads it and works out contrast from these values, and a test
 * fails if a text pair that the product uses falls below WCAG AA (4.5:1). Add a colour here, not in a view.
 *
 * Amber (--accent) is a FILL: buttons, selected tabs and edges, with graphite text on it (--accent-ink). Amber is never text on a light
 * surface (2.11 to 1). Text that is a link uses the dark amber --link. Warnings keep their own colour and always carry a word and a
 * shape, so brand amber is never the only thing that says "warning".
 *
 * Status colours keep one meaning everywhere: good, warning, critical, information, and none (not yet checked). Never rely on colour
 * alone for status: always pair it with an icon shape and a word.
 * Light only, by choice: no dark theme is planned. The top bar is white on a grey page, as the brand guide's default header is; graphite is for the page band (the hero) and text.
 *
 * Arial is the typeface (the guide's portable baseline), so no page loads a font from a third party. Registrations, airport codes
 * and times use the system monospace face.
 */
:root {
  /* Ground and surfaces */
  --bg: #eaeef1;
  --surface: #ffffff;
  --surface-2: #f4f6f8;
  --sky: #e1e7ec;
  --line: #d7dee3;
  --dots: #e4e9ed;
  --track: #d7dee3;
  --stub-end: #e9edf0;

  /* Ink (graphite) */
  --ink: #242d36;
  --ink-2: #2f3a45;
  --ink-3: #3b4854;
  --muted: #52616d;

  /* The top bar, and the one strong colour (used for marks and edges, never for small text) */
  --bar: #ffffff;
  --orange: #e5a744;

  /* Amber (the action colour): a fill with graphite text on it. --link is the text colour for links. */
  --accent: #e5a744;
  --accent-ink: #242d36;
  --accent-hover: #cf9130;
  --link: #755000;
  --brass-light: #e5a744;
  --brass-pale: #f7e3bd;

  /* Status */
  --good: #176b45;
  --good-bg: #e3f2ea;
  --warn: #805600;
  --warn-bg: #fff1cc;
  --crit: #b42318;
  --crit-bg: #fbe7e4;
  --info: #175cd3;
  --info-bg: #e4edfb;
  --none: #52616d;
  --none-bg: #eaeef1;
  --none-bar: #a9b4bd;


  --font-head: Arial, Helvetica, sans-serif;
  --font-body: Arial, Helvetica, sans-serif;
  --font-mono: ui-monospace, Menlo, Consolas, monospace;

  --radius: 8px;
  --radius-lg: 12px;
  --shadow-1: 0 2px 10px rgba(36, 45, 54, .07);
  --shadow-2: 0 10px 28px rgba(36, 45, 54, .12);

  /* The look of an operator's own manual ("Read as a manual"). These are only the defaults: the page sets them
     inline from what was read in the operator's file, so that look is data, never a colour in a view. */
  --mp-font: var(--font-body);
  --mp-accent: var(--ink);
  --mp-fill: var(--sky);
}