/* ═══════════════════════════════════════════════════════════════════════════
   family-iq — fonts

   Self-hosted, zero external requests. No fonts.googleapis.com, no
   fonts.gstatic.com. An inherited constraint and kept deliberately: the app is
   installable as a PWA and must render its own text offline, and a font request
   to a third party is a request that can be slow, blocked, or logged.

   Two families, and which one you get is decided by language:

     Cairo              ar · en
     Noto Sans Arabic   ku

   That split is not a preference. tools/font_coverage.py established on
   2026-08-20 that Cairo is missing every Kurdish-only letter — ڵ ڕ ۆ ێ — plus
   ە and ZWNJ. A `unicode-range` declaration is not evidence of coverage: it
   tells the browser which file owns a range, and when a glyph is absent from a
   matched file the browser draws .notdef rather than falling back. The result
   is an empty box in the middle of a word for a reader in Erbil.

   A Kurdish interface that looks slightly different from the Arabic one is an
   acceptable price. An empty box is not.

   ⚠ Both files are VARIABLE fonts, so one file serves every weight. The
     inherited CSS declared cairo-400/600/700/900 as four separate faces; all
     four files are byte-identical (sha256 confirms), so those were four
     declarations of one file. Declared here once per subset with a weight
     range, which is what a variable font is for.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Cairo · Arabic subset ────────────────────────────────────────────────── */
@font-face {
    font-family: 'Cairo';
    font-style: normal;
    font-weight: 200 1000;
    font-display: swap;
    src: url(/fonts/cairo-400.woff2) format('woff2-variations'),
         url(/fonts/cairo-400.woff2) format('woff2');
    unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+0890-0891,
                   U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011,
                   U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC;
}

/* ── Cairo · Latin subset ─────────────────────────────────────────────────── */
/* Carries 0-9, the separators and U+2212. Without them the minus sign and the
   numerals fall to the system font mid-column, at a different height, and the
   amounts column visibly shakes — the classic "the table wobbles" bug. */
@font-face {
    font-family: 'Cairo';
    font-style: normal;
    font-weight: 200 1000;
    font-display: swap;
    src: url(/fonts/cairo-400-latin.woff2) format('woff2-variations'),
         url(/fonts/cairo-400-latin.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
                   U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F,
                   U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
                   U+FEFF, U+FFFD;
}

/* ── Noto Sans Arabic · Sorani ────────────────────────────────────────────── */
/* One file covering letters AND digits on purpose. Splitting it would put the
   Kurdish numerals in Cairo and the letters in Noto, at two different x-heights,
   inside the same amount cell. Subset from the OFL variable release with the
   width axis pinned; digits are tabular, so the amounts column aligns without
   needing a `tnum` feature. */
@font-face {
    font-family: 'Noto Sans Arabic';
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url(/fonts/noto-arabic-ku.woff2) format('woff2-variations'),
         url(/fonts/noto-arabic-ku.woff2) format('woff2');
}

/* ── Tokens ───────────────────────────────────────────────────────────────── */
:root {
    --font-base: 'Cairo', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --font-ku: 'Noto Sans Arabic', 'Cairo', system-ui, sans-serif;
}

body {
    font-family: var(--font-base);
}

/* Locale::fontFamily() names this hook; the layout writes data-locale. */
[data-locale='ku'] body,
[data-locale='ku'] input,
[data-locale='ku'] button,
[data-locale='ku'] select,
[data-locale='ku'] textarea {
    font-family: var(--font-ku);
}

/* a11y-i18n-14: data-locale sets the PAGE default, but Kurdish content can sit
   INSIDE an Arabic/English page — the language-menu buttons name each option
   in that option's own language (lang="ckb" on the Kurdish one, on an ar/en
   page), and a notification row is written and shown in the locale it was
   authored in, not the reader's current page locale. Either falls back to
   Cairo, missing exactly the letters this file exists to cover. `:lang()`
   matches the element AND its descendants (language inherits down the DOM
   the same way direction does), so one rule covers form controls inside a
   Kurdish-language element the same way the data-locale block needs five
   selectors to. Keyed on the standard BCP-47 tag Locale::htmlLang() already
   emits for Kurdish. */
:lang(ckb) {
    font-family: var(--font-ku);
}

/* `.num` and `.cur` (every amount, everywhere — MoneyPresenter::html() emits
   them) live in resources/css/app.css's figure rules now, wave 1A: one
   definition each, where they used to be split across two files that both
   layouts load (css-design-system-14). */
