/*
 * Brand settings for the billboard map: The Billboard Network.
 *
 * Every colour, font, corner shape and text treatment the map uses is defined
 * here and nowhere else (the site's own pages use assets/tbn.css, which holds
 * the same brand colours). Brand rules: Night Navy, Signal Cyan, Daylight and
 * White; no red anywhere; square corners.
 *
 * Fonts: Oswald and Nunito Sans are loaded by each page from Google Fonts. When
 * the licensed Bee Four / Avenir Next World files are added, put those names
 * first in --bm-font-heading / --bm-font-body (and in --display / --sans in tbn.css).
 *
 * Keep text colours dark enough on their backgrounds (WCAG AA: 4.5:1 for body text).
 */
:root {
  /* Main brand colour: buttons, the selected tab, clusters. */
  --bm-color-primary: #131F49;       /* Night Navy */
  --bm-color-primary-hover: #0B1433;
  --bm-color-on-primary: #ffffff;
  --bm-color-focus: #16B4D1;         /* Signal Cyan focus ring */

  /* Pins: navy, a lighter slate for Static boards, cyan when selected. */
  --bm-color-pin-digital: #131F49;
  --bm-color-pin-static: #56607F;
  --bm-color-pin-mixed: #131F49;
  --bm-color-pin-active: #16B4D1;
  --bm-color-pin-active-outline: #131F49;
  --bm-color-pin-outline: #ffffff;
  --bm-color-pin-glyph: #ffffff; /* the small billboard drawn inside each pin */
  --bm-color-pin-badge: #131F49; /* the "2" on a structure with two faces */

  /* Board type badges on the card (the design's ".tag": white on cyan). */
  --bm-color-badge-digital: #ffffff;
  --bm-color-badge-digital-bg: #16B4D1;
  --bm-color-badge-static: #ffffff;
  --bm-color-badge-static-bg: #131F49;

  /* Text and surfaces. */
  --bm-color-text: #131F49;
  --bm-color-muted: #4A5374;
  --bm-color-surface: #ffffff;
  --bm-color-surface-alt: #E6F5FA;   /* Daylight */
  --bm-color-border: #D3D7E1;
  --bm-color-border-strong: #131F49;

  /* "Showing sample boards." note (local development only). */
  --bm-color-note: #131F49;
  --bm-color-note-bg: #E6F5FA;

  /* Fonts. */
  --bm-font-body: "Nunito Sans", "Avenir Next World", Inter, system-ui, sans-serif;
  --bm-font-heading: "Oswald", "Haettenschweiler", "Impact", sans-serif;
  --bm-font-label: var(--bm-font-body); /* small uppercase labels and Board IDs */

  /* Text treatments. Card titles: the display face, uppercase. Buttons, badges,
     tabs: Nunito Sans ExtraBold Italic, uppercase (the design's button style). */
  --bm-heading-weight: 500;
  --bm-heading-transform: uppercase;
  --bm-heading-line-height: 1.1;
  --bm-strong-style: italic;
  --bm-strong-weight: 900;
  --bm-strong-transform: uppercase;
  --bm-strong-tracking: 0.05em;
  --bm-button-size: 13.5px;

  /* Shape and depth: square corners throughout. */
  --bm-radius: 0;
  --bm-radius-small: 0;
  --bm-radius-pill: 0;
  --bm-radius-round: 0;
  --bm-radius-sheet: 0;
  --bm-shadow: 0 16px 40px rgba(19, 31, 73, 0.18), 0 2px 6px rgba(19, 31, 73, 0.10);

  /* Height of the map section inside a page (/boards/ sets its own in assets/tbn.css). */
  --bm-height: min(80vh, 760px);
}
