/* ============================================================
   SwiftPay Design Tokens — single source of truth
   ============================================================ */
:root {
  /* ---- Typography ---- */
  --font-family-primary: "Roboto";
  --font-family-stack: "Roboto", sans-serif;
  --font-size-xs: 11px;
  --font-size-sm: 12px;
  --font-size-md: 13px;
  --font-size-lg: 14px;
  --font-size-xl: 15px;
  --font-size-2xl: 16px;
  --font-size-3xl: 18px;
  --font-size-4xl: 24px;
  --font-weight-base: 600;
  --font-lineheight-base: 1.5;

  /* ---- Color (semantic) ---- */
  --color-surface-base: #000000;
  --color-surface-raised: #181818;
  --color-surface-muted: #fbbf24;   /* amber accent */
  --color-text-primary: #ffffff;    /* mapped from text.tertiary (AA safe) */
  --color-text-secondary: #b3b3b3;  /* AA-safe muted; raw #333333 reserved for borders */
  --color-border: #333333;
  --color-accent: #cc3366;          /* magenta accent (was text.inverse) */
  --color-on-accent: #000000;
  --color-error: #ff5a5f;           /* added: required by state rules */

  /* ---- Spacing ---- */
  --space-1: 12px;
  --space-2: 14.4px;
  --space-3: 24px;
  --space-4: 48px;
  --space-5: 96px;

  /* ---- Radius / Motion ---- */
  --radius-xs: 3px;
  --radius-sm: 50px;
  --motion-instant: 300ms;
}