/* العربية (ar) overrides.
 *
 * Loaded by header.php only when the page is in Arabic, after the mirrored stylesheets in
 * css/rtl/ and the shared css/rtl/rtl-fixes.css. Everything is scoped to html[lang="ar"].
 *
 * Modern Standard Arabic, set in Vazirmatn. Western digits are used throughout, as Arabic
 * tech sites do, so specs such as "8 GB" read the same in the plan cards and the copy.
 *
 * Layout mirroring comes from the generated css/rtl/*.rtl.css; directional icons and bidi
 * fixes shared by all right-to-left languages are in css/rtl/rtl-fixes.css -- do not
 * repeat them here, or they mirror twice. This language's own font, tracking and italics
 * are below.
 */

/* What js/main.js reads about this language's script:
   --pot-heading-wrap-lh     line height of a heading that wraps (1.3 if not set) */
html[lang="ar"] { --pot-heading-wrap-lh: 1.55; }

/* Arabic font, self-hosted (the site loads no fonts from third parties).
   Vazirmatn covers the Arabic letters, both digit sets and the ZWNJ.
   unicode-range limits Vazirmatn to the Arabic-script characters; Latin text keeps the
   site's own Inter.
   Licensed under the SIL Open Font License, see fonts/vazirmatn/OFL.txt. */
@font-face {
    font-family: "Vazirmatn";
    src: url("/fonts/vazirmatn/Vazirmatn-wght.woff2") format("woff2-variations"),
         url("/fonts/vazirmatn/Vazirmatn-wght.woff2") format("woff2");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
    unicode-range: U+0600-06FF, U+0750-077F, U+0870-089F, U+08A0-08FF,
                   U+FB50-FDFF, U+FE70-FEFF, U+200C-200F, U+2E80-2E8F;
}

/* Letter-spacing pulls apart letters that must join, so any tracking the theme applies
   (headings, buttons, labels -- its ls-* utilities carry !important) is removed; and there
   is no true italic, so the browser's synthetic slant is turned off. Icon fonts rely on
   <i> and are left alone. */
html[lang="ar"] body,
html[lang="ar"] body *:not([class*="icon"]):not([class*="fa-"]):not([class*="bi-"]):not([class*="feather"]) {
    letter-spacing: normal !important;
    word-spacing: normal;
}
html[lang="ar"] :is(em, cite, dfn, var,
    i:not([class*="icon"]):not([class*="fa-"]):not([class*="bi-"]):not([class*="feather"])) {
    font-style: normal;
    font-weight: 600;        /* keep the emphasis the italic carried */
}

/* Latin stays in the site's own faces; Arabic-script glyphs fall through to Vazirmatn,
   declared above. Setting the theme's two font variables rather than
   font-family on a list of selectors reaches everything the theme styles with them. */
html[lang="ar"] {
    --primary-font: "Inter", "Vazirmatn", "Segoe UI", Tahoma, sans-serif;
    --alt-font: "Plus Jakarta Sans", "Vazirmatn", "Segoe UI", Tahoma, sans-serif;
}
html[lang="ar"] body,
html[lang="ar"] :is(input, textarea, select, button, .btn) {
    font-family: var(--primary-font);
}

/* Arabic script sits taller than Latin and its dots and marks need room; the Latin line
   heights the theme uses clip them. */
html[lang="ar"] body, html[lang="ar"] p, html[lang="ar"] li { line-height: 1.85; }
/* Small headings set with a size utility (an h3 at fs-20) keep the theme's 50px line: it is what
   spaces them. main.js tightens them only when they wrap, to --pot-heading-wrap-lh. */
html[lang="ar"] :is(h1, h2, h3, h4, h5, h6):not(.fs-12, .fs-13, .fs-14, .fs-15, .fs-16, .fs-17, .fs-18, .fs-19, .fs-20, .fs-22, .fs-24, .fs-26, .fs-2, .fs-3, .fs-4, .fs-5, .fs-6) { line-height: 1.45; }