/* GENERATED FILE — do not edit by hand.
 *
 * Source of truth: src/theme.js
 * Regenerate:      npm run tokens
 *
 * The three web surfaces (index, kiosk, partner) each used to declare their own
 * :root block of hand-copied hex, and had already drifted. Now the app and the
 * web share one definition.
 */

:root {
  --bg: #F6F9FC;
  --card: #FFFFFF;
  --card2: #EFF6FD;      /* theme.js: cardAlt */
  --line: #A8D2F5;
  --teal: #2E9BE6;
  --tealDim: #7FC1EE;
  --text: #0F1E30;
  --dim: #5A6B7D;        /* theme.js: textDim — WCAG AA on --bg */
  --amber: #B4790C;
  --green: #0E7A3C;
  --greenSoft: rgba(14,122,60,0.12);
  --danger: #D64545;
  --onAccent: #FFFFFF;
  --notice: #0F1E30;
  --onNotice: #FFFFFF;
  --noticeEdge: rgba(255,255,255,0.12);
  --tealSoft: rgba(46,155,230,0.12);
  --amberSoft: rgba(180,121,12,0.12);
  --dangerSoft: rgba(214,69,69,0.10);

  /* Omani number plate + favourite gold. Not theme roles, but defined once
     here rather than repeated in each file that draws them. */
  --plate: #F2C531;
  --plateRed: #B4231F;
  --plateInk: #111111;
  --gold: #F4C542;

  --radius-card: 20px;
  --radius-pill: 999px;
  --radius-control: 14px;

  /* One typeface across app and web. Every surface previously fell back to
     system-ui, so WashPass rendered as a different product per platform.
     IBM Plex Sans Arabic covers Latin and Arabic in one family, so Arabic no
     longer drops into a mismatched fallback. Self-hosted: no third-party
     request on a payment page. */
  --font: 'IBM Plex Sans Arabic', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
}

/* Form controls do not inherit the page font in any browser — they default to
   the OS control font (Arial here). Without this, every input and button on
   every surface rendered in Arial while the prose around it rendered in Plex,
   which is the same cross-surface mismatch the self-hosting above exists to
   prevent. Only the family is inherited: each page still sets its own control
   font-size and weight. */
button, input, select, textarea { font-family: inherit; }

/* Keyboard focus in the product's own accent. The browser default is a thin
   near-black ring, which on these blue-tinted surfaces reads as a rendering
   artefact rather than "you are here". :where() keeps specificity at zero, so
   any page that already styles its own focus (the console tab bar) still wins. */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--teal);
  outline-offset: 2px;
}

/* woff2 only. `swap` so text is readable immediately rather than invisible
   while the font loads on a forecourt with bad signal. 700 is the heaviest
   weight this family ships, mapped across 700-900 so the browser does not
   synthesise a smeared fake bold at large sizes. */
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  src: url('/fonts/latin-400-normal.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  src: url('/fonts/latin-500-normal.woff2') format('woff2');
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  src: url('/fonts/latin-600-normal.woff2') format('woff2');
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  src: url('/fonts/latin-700-normal.woff2') format('woff2');
  font-weight: 700 900; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  src: url('/fonts/arabic-400-normal.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF;
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  src: url('/fonts/arabic-500-normal.woff2') format('woff2');
  font-weight: 500; font-style: normal; font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF;
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  src: url('/fonts/arabic-600-normal.woff2') format('woff2');
  font-weight: 600; font-style: normal; font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF;
}
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  src: url('/fonts/arabic-700-normal.woff2') format('woff2');
  font-weight: 700 900; font-style: normal; font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFF;
}