/* ============================================================
   RTL EXTRAS — loaded only by pages under /ar/ (dir="rtl").
   The heavy lifting (left/right offsets, translateX signs,
   gradients, margins) is done at build time: tools/build-assets.js
   runs every source sheet through rtlcss for /ar/ bundles. This
   file carries only what a mechanical mirror cannot know:
   the Arabic face, script-specific typography, glyph flips, and
   bidi isolation for inherently-LTR runs. Everything here is
   authored FOR the RTL page, so rtlcss must not flip it again.
   ============================================================ */
/*rtl:begin:ignore*/

/* Arabic face — variable weight, arabic ranges only, so Latin runs
   (SAP product names, digits, emails) keep rendering in Inter. */
@font-face {
  font-family: "Noto Sans Arabic";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/fonts/noto-sans-arabic-var.woff2") format("woff2");
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-088E, U+08A0-08FF, U+FB50-FDFF, U+FE70-FEFC;
}

html[lang="ar"] {
  --font-sans: "Noto Sans Arabic", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* Arabic script is cursive: tracking breaks letter joining, and the
   design's wide-tracked uppercase eyebrows have no Arabic equivalent. */
html[lang="ar"] * { letter-spacing: 0 !important; }

/* Arabic needs slightly taller leading than the Latin-tuned defaults. */
html[lang="ar"] body { line-height: 1.65; }

/* Inherently left-to-right runs inside RTL text: keep their internal
   order and let bidi place them as one unit. */
[dir="rtl"] a[href^="tel:"],
[dir="rtl"] a[href^="mailto:"] {
  direction: ltr;
  unicode-bidi: isolate;
}
[dir="rtl"] input[type="email"],
[dir="rtl"] input[type="tel"] {
  direction: ltr;
  text-align: end;
}

/* Directional glyphs and inline SVG arrows point "forward" (→ / ↗ in
   LTR); mirror them so forward stays forward. The .caret chevron is
   vertical and is deliberately not listed. */
[dir="rtl"] .arr {
  display: inline-block;
  transform: scaleX(-1);
}
[dir="rtl"] .card-arrow svg,
[dir="rtl"] .link-arrow svg,
[dir="rtl"] .pill-arrow svg,
[dir="rtl"] .s6-arrow svg,
[dir="rtl"] .i4-arrow svg,
[dir="rtl"] .sv4-arrow svg,
[dir="rtl"] .cat-arrow svg,
[dir="rtl"] .head-arrow svg,
[dir="rtl"] .arrowlink svg,
[dir="rtl"] .r3-arrow svg,
[dir="rtl"] .csc-arrow svg,
[dir="rtl"] .hcta-ico svg,
[dir="rtl"] .ind-carousel-btn svg {
  transform: scaleX(-1);
}

/*rtl:end:ignore*/