/* ─────────────────────────────────────────────────────────────────────────────
   Sanad UI · fonts

   Self-hosted. docs/06 requires it and the reason is concrete: a webfont served
   from a CDN that fails — blocked, slow, offline branch — silently falls back,
   and a fallback with different metrics changes every column width on a dense
   grid. The operator does not see "the font failed"; they see a layout that
   moved.

   This file spent months declaring faces that pointed at cairo-variable.woff2
   and ibm-plex-mono.woff2 — two files nobody had ever downloaded. The folder did
   not exist. So the rule above was written, and then broken by the same file
   that states it, silently, exactly as it warns. The names below are the files
   tools/fetch-brand-fonts.py actually writes.

   Cairo for the interface: design/reference/design-handoff/README.md names it and
   marks the typography final. IBM Plex Mono for EVERY number — document number,
   amount, date, item code, account code — because tabular digits are why a
   column of figures can be scanned rather than read.

   font-display: swap over block. A branch on a poor connection should read the
   invoice in a fallback face rather than stare at nothing.
   ───────────────────────────────────────────────────────────────────────────── */

@font-face {
  font-family: 'Cairo';
  src: url('../fonts/cairo-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Cairo';
  src: url('../fonts/cairo-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Cairo';
  src: url('../fonts/cairo-600.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Cairo';
  src: url('../fonts/cairo-700.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Every amount, code and date. Three weights: 400 in tables, 500 for emphasis,
   600 for the totals a reader's eye should land on first. */
@font-face {
  font-family: 'IBM Plex Mono';
  src: url('../fonts/ibm-plex-mono-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'IBM Plex Mono';
  src: url('../fonts/ibm-plex-mono-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'IBM Plex Mono';
  src: url('../fonts/ibm-plex-mono-600.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* The brand's own face, for the logo lockup and the login panel. BRAND.md names
   it; the handoff names Cairo for the interface. The two are answering different
   questions rather than disagreeing, so both are here. */
@font-face {
  font-family: 'IBM Plex Sans Arabic';
  src: url('../fonts/ibm-plex-sans-arabic-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'IBM Plex Sans Arabic';
  src: url('../fonts/ibm-plex-sans-arabic-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'IBM Plex Sans Arabic';
  src: url('../fonts/ibm-plex-sans-arabic-600.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}