/* Noga Performance colour system.
   The single source of colour for the website, the client portal and the
   coach area. Pages use these variables only; no hex values in pages. */
:root {
  color-scheme: light;

  /* ---------- Palette ---------- */
  --navy-900: #0F1E33;      /* header bar, footer, dark sections */
  --navy-800: #172A45;      /* cards inside a navy section */
  --navy-700: #1A2433;      /* main text */
  --accent: #2E6A9E;        /* steel blue: primary buttons, links, labels on light */
  --accent-hover: #255A87;
  --accent-soft: #7FB0D4;   /* sky blue: highlights, labels, buttons on navy */
  --accent-tint: #E8F0F7;   /* selected states, subtle panels */
  --bg: #F6F7F9;            /* page background */
  --surface: #FFFFFF;       /* cards, tables, forms */
  --border: #E3E6EB;
  --muted: #5B6573;         /* secondary text */
  --white: #FFFFFF;

  /* ---------- Roles ---------- */
  --surface-2: var(--bg);
  --neutral-soft: #EDEFF2;
  --on-accent: var(--white);          /* text on --accent */
  --on-accent-soft: var(--navy-900);  /* text on --accent-soft */
  --on-navy: var(--white);            /* text on navy */
  --on-navy-muted: #A9B8CB;           /* secondary text on navy */
  --on-navy-line: rgb(255 255 255 / .16);
  --on-navy-line-strong: rgb(255 255 255 / .32);
  --on-navy-hover: rgb(255 255 255 / .08);
  --on-navy-active: rgb(255 255 255 / .14);
  --on-navy-tint: rgb(127 176 212 / .16);
  --on-navy-field: rgb(255 255 255 / .06);
  --on-navy-field-border: #7A8CA8;
  --danger-on-navy: #FFBDB5;
  --focus: var(--accent);
  --focus-on-navy: var(--accent-soft);

  /* ---------- Status ---------- */
  --ok: #2F5A17;      --ok-soft: #E3F0DA;
  --warn: #8A5A00;    --warn-soft: #FBF0D9;
  --danger: #B3261E;  --danger-soft: #FBE6E3;

  /* ---------- Heart-rate zones ---------- */
  /* ---------- Brands ---------- */
  --whatsapp: #25D366;  /* WhatsApp logo green (icon only, never text) */

  --z1: #7D9AA6; --z2: #4F9BC4; --z3: #5F9E37; --z4: #E09D32; --z5: #D4473A;

  /* ---------- Session kinds (also used as text on white) ---------- */
  --k-water: #2A76C6; --k-strength: var(--navy-700); --k-aerobic: #3E7B22; --k-other: #7A5BC2;

  /* ---------- Depth ---------- */
  --shadow: 0 1px 2px rgb(15 30 51 / .06), 0 8px 24px rgb(15 30 51 / .08);
  --shadow-lg: 0 8px 30px rgb(15 30 51 / .25);
  --shadow-dialog: 0 20px 60px rgb(15 30 51 / .35);
  --scrim: rgb(15 30 51 / .85);
  --backdrop: rgb(15 30 51 / .6);
}