/* Arabic / RTL layer for pandorabot.ae.
   SOURCE FILE — the build copies this into assets/css/arabic.css. It must live
   outside assets/ because the build wipes and re-copies assets/ from the
   English repo on every run, which would otherwise delete it.

   Loaded AFTER index.rtl.css (the mechanically mirrored LTR sheet). This file
   only carries what a mirror cannot do: typography and glyphs. */

:root {
  --font-arabic: "IBM Plex Sans Arabic", "Noto Sans Arabic", "Geeza Pro",
                 "Segoe UI", system-ui, sans-serif;
}

/* Geist ships no Arabic glyphs, so Arabic would fall back to whatever the OS
   provides and lose the brand entirely. Geist stays FIRST so Latin runs
   (PandoraBot, CRM, AI) keep rendering in the brand face; the Arabic face
   picks up everything Geist cannot draw. */
body, button, input, textarea, select {
  font-family: var(--font-geist-sans), var(--font-arabic) !important;
}

/* Arabic needs more line height than Latin at the same size, and the negative
   tracking the Latin display type uses is wrong for Arabic script. */
body { line-height: 1.7 }
h1, h2, h3, h4, .xp-eyebrow, .art-hero h1 { letter-spacing: normal !important }
h1, h2 { line-height: 1.3 !important }

/* 126 of the arrows sit in <span class="arrow">. Mirroring the glyph beats
   swapping the character: the English HTML stays the single source of truth,
   so a new zip cannot reintroduce a wrong-way arrow. */
.arrow, .footer-brief .arrow, .xp-subnav-cta .arrow {
  display: inline-block;
  transform: scaleX(-1);
}
/* the mega-menu chevron points down, not sideways */
.mega summary span { transform: none }

/* Latin fragments inside Arabic sentences (product names, prices, URLs) must
   stay left-to-right or their digits and punctuation visibly reorder. */
.ltr, .xp-price b, .art-table td.num, code, time {
  direction: ltr;
  unicode-bidi: isolate;
}

/* article lists: the source sets padding with a physical value */
.art-body ul, .art-body ol { padding-left: 0; padding-right: 22px }

/* a field reads right-to-left, but an email or URL typed into it should not */
input[type="email"], input[type="url"], input[type="tel"] {
  direction: ltr;
  text-align: right;
}