@charset "UTF-8";
/*-----------------------------------------------------------------------------------

	PeopleForward — Colour Scheme: Blue (default)
	assets/css/colors/blue.css

	Confident blue does the work; coral marks what is urgent or human.
	This is the scheme style.css is drawn in, repeated here so that every scheme
	has a file of its own and the colour link always names one.

	A colour scheme loads after style.css, from <link id="color-scheme"> in each
	page's <head>, and sets the brand tokens only: the primary colour (links,
	buttons, the hero stage, selected states) and the accent (urgent badges,
	hand-drawn strokes, glows). To recolour the theme, point that link at another
	file in this folder. Tokens that differ between the light and the dark theme
	hold both values in light-dark().

-----------------------------------------------------------------------------------*/

/* ----------------------------------------------------------------
	Brand Tokens
---------------------------------------------------------------- */

:root {
  /* Primary. --c-primary is the text and link colour, lighter in the dark theme;
     --c-primary-fill carries white text and stays the same in both. --c-tint is
     the pale version behind chips and selected items (dark in the dark theme);
     --c-tint-fill stays pale, for hovers on white buttons. */
  --c-primary: light-dark(#1f4be0, #8eaaff);
  --c-primary-fill: #1f4be0;
  --c-primary-hover: #173bbd;
  --c-tint: light-dark(#e9efff, #1a2650);
  --c-tint-fill: #e9efff;
  --c-map-edge: light-dark(#9fb3f5, #3b4f8f);

  /* Accent. Its fills carry navy text (--c-deep). --c-accent-soft and
     --c-accent-ink are the background and text of accent badges;
     --c-accent-light is for small text and icons on navy, and for icons and
     large text on the primary fill. */
  --c-accent: #ff6b4a;
  --c-accent-hover: #ff5a35;
  --c-accent-soft: light-dark(#ffe8e1, #3b211d);
  --c-accent-ink: light-dark(#b8341b, #ff9e88);
  --c-accent-light: #ffb8a6;

  /* Glows in the corner of the hero and page title backgrounds. */
  --c-glow: light-dark(rgb(255 232 225 / 0.7), rgb(255 107 74 / 0.1));
  --c-glow-soft: light-dark(rgb(255 232 225 / 0.55), rgb(255 107 74 / 0.08));

  /* Bootstrap's primary as numbers, for its .text-primary, .bg-primary and
     other utilities (style.css points --bs-primary at --c-primary-fill). */
  --bs-primary-rgb: 31, 75, 224;
}

/* ----------------------------------------------------------------
	Fallback Without light-dark()
---------------------------------------------------------------- */

/* Browsers without light-dark() stay in the light theme (see style.css): they
   get the first value of each light-dark() above. Keep the two in step. */
@supports not (color: light-dark(#000, #fff)) {
  :root {
    --c-primary: #1f4be0;
    --c-tint: #e9efff;
    --c-map-edge: #9fb3f5;
    --c-accent-soft: #ffe8e1;
    --c-accent-ink: #b8341b;
    --c-glow: rgb(255 232 225 / 0.7);
    --c-glow-soft: rgb(255 232 225 / 0.55);
  }
}
