/* =====================================================================
   One font, one file, served by us.
   Vazirmatn 33.0.3 by Saber Rastikerdar, SIL Open Font License 1.1
   (the full licence sits beside the files, in static/fonts/OFL.txt).

   WHY THIS IS NOT GOOGLE FONTS ANY MORE
   -------------------------------------
   Every page used to pull Vazirmatn from fonts.googleapis.com. For a
   customer in Iran that request is slow at best and blocked at worst, so
   pages arrived in whatever the machine had -- Tahoma here, Vazirmatn
   there, depending on what happened to be cached. "The font is not the
   same everywhere" was not a styling mistake; it was a network that half
   the time did not answer.

   ONE FILE, NOT THREE
   -------------------
   This file used to declare the two static cuts first and the variable
   one inside @supports, on the theory that a modern browser would use
   the variable and ignore the statics. Measured in Chrome, it downloaded
   ALL THREE: 209 KB of font on a page that needs 85. The rule is the
   other way round now -- the variable face is the plain, unconditional
   one, and the static cuts only exist inside `@supports not`, where a
   browser new enough for variable fonts never looks. Modern browsers now
   fetch exactly one file and old ones still land on Vazirmatn rather
   than Tahoma.

   SUBSET
   ------
   Vazirmatn-Variable-fa.woff2 is the upstream variable font cut down to
   what this product writes in: Arabic/Persian, basic Latin, the digits,
   punctuation, currency, ZWNJ and the Arabic presentation forms. That is
   111 KB -> 85 KB with every Persian glyph intact; what it drops is
   Latin Extended-A (the European accented letters). scripts/build_fonts.py
   --vazirmatn rebuilds it from the original, which is kept beside it.
   ===================================================================== */

@font-face {
  font-family: 'Vazirmatn';
  src: url('/static/fonts/Vazirmatn-Variable-fa.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* Only for a browser too old to understand a variable font. One that
   does understand one never reads this block, so these two files are
   never even discovered, let alone downloaded. */
@supports not (font-variation-settings: normal) {
  @font-face {
    font-family: 'Vazirmatn';
    src: url('/static/fonts/Vazirmatn-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
  }
  @font-face {
    font-family: 'Vazirmatn';
    src: url('/static/fonts/Vazirmatn-Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
  }
}

/* The one stack the whole application uses. Every template sets its own
   `font-family: 'Vazirmatn', Tahoma, sans-serif` today; this variable is
   here so the next one does not have to repeat the list. */
:root {
  --ui-font: 'Vazirmatn', Tahoma, Arial, sans-serif;
}

/* ONE FONT, INCLUDING THE THINGS THAT DO NOT INHERIT IT
   -----------------------------------------------------
   A <button>, <input>, <select> or <textarea> does NOT inherit the
   page's font: every browser gives form controls their own UI font
   unless told otherwise. Every template set the font on `body` and
   thought it was done -- so the page was Vazirmatn and the buttons in
   the middle of it were Arial. Measured in Chrome, that was 12 inputs,
   12 buttons and 6 selects on the design page alone, and it is exactly
   what "the font is not the same everywhere" looks like.

   Declared here, in the one stylesheet all thirteen pages already link,
   rather than thirteen times. Only the SIZE is left alone: the panels
   set their own, and a control is often deliberately smaller than the
   text around it.

   This file is never served with a generated customer site -- those
   carry their own font stack from design_system.py -- so nothing here
   can reach into a site the customer designed. */
html, body { font-family: var(--ui-font); }
button, input, select, textarea, optgroup {
  font-family: inherit;
  font-feature-settings: inherit;
}
