/* Momentum Fitness IRL — design tokens. One stylesheet, imported by the landing page and the
   trainer page; the report email carries the same values inline. Light first. Greek overrides
   sit under :lang(el). Red, amber and green are state colours only (trainer page). */

:root {
  /* ground and ink */
  --ground: #F5F5F2;
  --surface: #FFFFFF;
  --ink: #141413;
  --ink-muted: #5B5B57;
  --ink-dim: #8A8A85;
  --rule: #D9D9D6;
  --rule-soft: #E6E6E3;

  /* the one accent: Voltage */
  --accent: #3D5AFE;
  --accent-text: #2A41D6;
  --accent-tint: #EEF1FF;

  /* state colours, trainer page only; the word always sits beside the colour */
  --ok: #1B7F3B;
  --ok-tint: #E3F4E8;
  --warn: #8A5300;
  --warn-tint: #FFF1D6;
  --bad: #B3001B;
  --bad-tint: #FDE3E6;
  --bad-deep: #7A0012;
  --on-bad: #FFFFFF;

  /* type families */
  --font-display: Anton, "Arial Narrow", Impact, sans-serif;
  --font-ui: "Public Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --font-data: "JetBrains Mono", ui-monospace, Menlo, Consolas, monospace;
  --font-email: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;

  /* type sizes */
  --size-11: 11px;
  --size-12: 12px;
  --size-13: 13px;
  --size-15: 15px;
  --size-16: 16px;
  --size-18: 18px;
  --size-20: 20px;
  --size-26: 26px;
  --size-30: 30px;
  --size-32: 32px;
  --size-40: 40px;
  --size-56: 56px;
  --size-72: 72px;
  --size-wall-number: 140px;
  --line-tight: 1.1;
  --line-body: 1.45;

  /* spacing steps */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;

  /* radii */
  --radius-s: 8px;
  --radius-m: 12px;
  --radius-l: 14px;
  --radius-pill: 999px;

  /* strokes */
  --stroke: 2px;
  --stroke-heavy: 3px;
}

:lang(el) {
  --font-display: "Roboto Condensed", "Arial Narrow", sans-serif;
  --font-ui: "Noto Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
}

html { background: var(--ground); color: var(--ink); font-family: var(--font-ui); }