/* Right-to-left layout (Arabic). Linked only from pages with dir="rtl".
   Every rule sits under html[dir="rtl"]. Most of the mirroring comes free
   from the browser's own flex, grid and text-align:start handling; this file
   covers what main.css and home.css write in physical terms. */

html[dir="rtl"] body {
  text-align: start;
}

/* Figures, charts and times read left to right even inside Arabic text.
   localizePage also wraps figures in running text in <span dir="ltr">. */
html[dir="rtl"] .stat,
html[dir="rtl"] .hero-live-stats strong,
html[dir="rtl"] [data-stat],
html[dir="rtl"] .steps__num,
html[dir="rtl"] .gateway-boards__figure,
html[dir="rtl"] .chart,
html[dir="rtl"] time,
html[dir="rtl"] [data-ltr],
html[dir="rtl"] .kwh {
  direction: ltr;
  unicode-bidi: isolate;
}

/* main.css flips alternate feature rows with direction: rtl; on a page that is
   already rtl the same flip has to go back to ltr. */
@media (min-width: 768px) {
  html[dir="rtl"] .feature-row--reverse {
    direction: ltr;
  }

  html[dir="rtl"] .feature-row--reverse > * {
    direction: rtl;
  }
}

/* Arrows that point along the reading direction. Only where the row is
   horizontal: below 768px main.css rotates the arrow to point down. */
@media (min-width: 768px) {
  html[dir="rtl"] .feature-row__arrow {
    transform: scaleX(-1);
  }
}

/* Code, commands and register addresses stay left to right. */
html[dir="rtl"] code,
html[dir="rtl"] pre,
html[dir="rtl"] kbd {
  direction: ltr;
  unicode-bidi: isolate;
  text-align: left;
}

/* Arabic type. JetBrains Mono has no Arabic glyphs, and a monospaced fallback
   with letter-spacing pulls the joined letters of a word apart. localizePage
   loads Noto Sans Arabic on every Arabic page; Latin text in it falls back to
   the system sans. The tool pages (map, flash, help, logs) declare these
   tokens inline and two of them name Inter directly, so the font is forced on
   everything that is not code. */
html[lang^="ar"] {
  --font-primary: 'Noto Sans Arabic', 'Geeza Pro', 'Noto Naskh Arabic', Tahoma, system-ui, sans-serif;
  --font-display: var(--font-primary);
}

html[lang^="ar"] body,
html[lang^="ar"] body :not(code, pre, kbd, samp, code *, pre *, kbd *) {
  font-family: var(--font-primary) !important;
}

html[lang^="ar"] :not(code, pre, kbd) {
  letter-spacing: normal !important;
}