/* Teppa brand tokens. Define colours here only; never hard-code them anywhere else.
   The same values live in mobile/lib/theme/teppa_theme.dart and dashboard/assets/tokens.css. */

@font-face {
  font-family: "Outfit";
  src: url("../fonts/Outfit-Regular.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Outfit";
  src: url("../fonts/Outfit-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "Outfit";
  src: url("../fonts/Outfit-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-display: swap;
}

:root {
  --brand: #7e22ce;       /* primary: headers, buttons, logo */
  --brand-deep: #2e1065;  /* dark backgrounds */
  --accent: #facc15;      /* change received, vouchers, call-to-action chips */
  --ink: #0a0a0a;         /* body text and all QR codes */
  --surface: #ffffff;     /* backgrounds */
  --muted: #52525b;       /* secondary text */

  /* Not brand colours: functional states and tints only. */
  --danger: #b91c1c;
  --soft-brand: #f3e8ff;  /* tinted panels behind brand text */
  --line: color-mix(in srgb, var(--muted) 22%, var(--surface));
  --wash: color-mix(in srgb, var(--muted) 6%, var(--surface));

  --font: "Outfit", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}