/* KFCRIS brand fonts — @font-face declarations
 *
 * Paths are relative to this CSS file. When the brand kit is served
 * from `/shared/brand/`, fonts resolve to `/shared/brand/fonts/*`.
 *
 * Sakkal Majalla is intentionally NOT bundled — it's a Windows system
 * font and we rely on Almarai / system fallbacks elsewhere.
 *
 * Usage:
 *   <link rel="stylesheet" href="/shared/brand/fonts.css">
 * then any text element can opt in via:
 *   font-family: var(--kfcris-font-display-ar);   (or any other token)
 */

/* === Saudi — corporate display sans (Latin + light Arabic).
 * Two cuts: Regular (400), Bold (700). Use for headings or banners. */
@font-face {
  font-family: "Saudi";
  src: url("fonts/Saudi-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Saudi";
  src: url("fonts/Saudi-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* === Greta Arabic — corporate Arabic body face. Four weights:
 * Light (300), Regular (400), Medium (500), Bold (700).
 * Opt in via `font-family: "Greta Arabic"` or the display-ar token. */
@font-face {
  font-family: "Greta Arabic";
  src: url("fonts/GretaArabic-Light.otf") format("opentype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Greta Arabic";
  src: url("fonts/Greta_Arabic_Regular.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Greta Arabic";
  src: url("fonts/GretaArabic-Medium.otf") format("opentype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Greta Arabic";
  src: url("fonts/Greta_Arabic_Bold.otf") format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* === Amiri — Arabic typesetting font. Bundled mainly for PDF/print
 * export so jsPDF can shape Arabic correctly. Available to UI surfaces
 * if a more classical / typographic feel is wanted. */
@font-face {
  font-family: "Amiri";
  src: url("fonts/amiri-regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* === Twemoji Country Flags — scoped to Regional Indicator glyphs
 * so Windows users see real flag emoji. Loaded with a tight
 * unicode-range so it only ships when actually needed. */
@font-face {
  font-family: "Twemoji Country Flags";
  src: url("fonts/TwemojiCountryFlags.woff2") format("woff2");
  unicode-range: U+1F1E6-1F1FF;   /* Regional Indicator A–Z */
  font-display: swap;
}
