/* sweatsheet colour tokens, shared by the app, the coach dashboard and the product page.
   mat-it brand: navy #020070, indigo #3a2bda, violet #6c66fb, lavender #adb0fd.
   Each page adds its own layout tokens (radius, sizes) and the few colours only it uses. */

:root {
  --bg: #f5f5fa;
  --surface: #ffffff;
  --surface-2: #efeff7;
  --text: #0f0e33;
  --muted: #6b6a8a;
  --line: #e4e4f0;
  --accent: #3a2bda;
  --accent-ink: #ffffff;
  --accent-soft: #ebeaff;
  --brand-navy: #020070;
  --protein: #12a594;
  --carbs: #f0a330;
  --fat: #ec5b78;
  --steps: #0ea5e9;
  --train: #f2702e;
  --water: #2f7bea;
  --danger: #c93636; /* 4.5:1 on --bg as well as on --surface */
  --shadow: 0 1px 2px rgb(2 0 112 / .04), 0 6px 20px rgb(2 0 112 / .05);
  color-scheme: light;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0b0a1f;
    --surface: #15142e;
    --surface-2: #201f3d;
    --text: #eeeefb;
    --muted: #9998b8;
    --line: #26254a;
    --accent: #8a84ff;
    --accent-ink: #0b0a1f;
    --accent-soft: #24215a;
    --brand-navy: #adb0fd;
    --protein: #2dd4bf;
    --carbs: #f5b54f;
    --fat: #f17891;
    --steps: #38bdf8;
    --train: #ff8a52;
    --water: #60a5fa;
    --danger: #f06464;
    --shadow: 0 0 #0000;
    color-scheme: dark;
  }
}