/* ═══════════════════════════════════════════════════════════════
   BirdsEyeView Design System — Colour Tokens
   Default uses the OLD bev theme colours.
   NEW design system colours are applied via JS override for localhost.
   ═══════════════════════════════════════════════════════════════ */

:root {
  /* ── OLD BEV DEFAULT COLOURS ── */
  --baseDark: #021b33;
  --baseLight: #112943;
  --pale-salmon: #fbb39e;
  --activeColorV2: #67e8ff;
  --sea-green: #4dfa91;
  --dodger-blue: #3ebcff;
  --activeColorV3: #3ebcff;
  --very-light-brown: #e2b47f;
  --input-info-message: white;
  --buttonPrimary: #2e4864;
  --buttonPrimaryHover: #1a324d;
  --buttonPrimaryColor: #ffff;
  --buttonSecondary: #e1ebf7;
  --buttonSecondaryHover: #ffff;
  --buttonSecondaryColor: #112943;
  --modal-bg: #1e3855;
  --danger: #ff7777;
  --veryLightSecondary: #e1ebf7;
  --activeColorV1: #3cd1ba;
  --baseShade1: #193553;
  --black-pearl: #011a32;
  --baseShade2: #2d4b6c;
  --light-orange: #ffb6a0;
  --warning: #ffcc00;
  --loginContainerBg: rgba(2, 27, 51, 0.75);
  --baseText: #ffffff;
  --defaultInputBorder: #ffffff;
  --alertBg: #021b33;
  --inputBgColor: transparent;
  --inputColor: white;
  --welcomeTextMargin: 0;

  /* ── FALLBACKS FOR NEW TOKENS USED IN CSS ── */
  --action: var(--activeColorV1);
  --glow-pink: none;
  --focus-ring: rgba(60, 209, 186, 0.45);
  --hairline: rgba(255, 255, 255, 0.14);
  --img-overlay: rgba(2, 27, 51, 0.6);
  --loginContainerBgOnSmall: rgba(2, 27, 51, 0.75);

  /* ── DYNAMIC COLOR REPLACEMENTS ── */
  --canvas: radial-gradient(120% 90% at 50% -10%, #0a2547 0%, #04102a 60%);
  --surface-light: #ffffff;
  --surface-light-hover: #d4edfa;
  --text-primary: #ffffff;
  --text-on-light: #000000;
  --text-on-light-soft: #4d5258;
  --text-secondary: #72767b;
  --panel-grey: #bbbbbb;
  --img-overlay-dark: rgba(0,0,0,0.5);
  --img-overlay-light: rgba(0,0,0,0.2);
  --shadow-md: 0 1px 8px rgba(0,0,0,0.6);
  --danger-focus: rgba(224, 73, 44, 0.45);
}