/* ---------------------------------------------------------------------------
   Arabic / RTL overrides. Loaded ONLY when nt_is_rtl() — the English site is
   completely untouched by this file.

   The base stylesheet is mostly flexbox/grid, which mirrors on its own under
   dir="rtl". These rules cover the handful of hard-coded directional
   properties plus the Arabic type stack.
   --------------------------------------------------------------------------- */

/* Arabic faces. Playfair Display / Manrope carry no Arabic glyphs, so without
   this every character falls back to whatever the OS picks. Cairo for display,
   Tajawal for body — both are proper Arabic types, not Latin fonts with
   bolted-on Arabic. */
[dir="rtl"] body,
[dir="rtl"] input,
[dir="rtl"] textarea,
[dir="rtl"] select,
[dir="rtl"] button {
  font-family: 'Tajawal', 'Cairo', 'Noto Kufi Arabic', system-ui, sans-serif;
}
[dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3,
[dir="rtl"] h4, [dir="rtl"] .brand, [dir="rtl"] .hero__eyebrow {
  font-family: 'Cairo', 'Tajawal', 'Noto Kufi Arabic', system-ui, sans-serif;
  letter-spacing: 0;           /* Arabic is cursive — letter-spacing breaks joins */
}

/* Arabic renders smaller at the same px size and needs more line height. */
[dir="rtl"] body { line-height: 1.85; }
[dir="rtl"] p, [dir="rtl"] li { font-size: 1.03em; }

/* --- mirrored directional properties (see style.css line refs) --- */
[dir="rtl"] .plank            { border-left: 0; border-right: 6px solid var(--red); }
[dir="rtl"] .plank ul         { padding-left: 0; padding-right: 22px; }
[dir="rtl"] .card--accent,
[dir="rtl"] .alert            { border-left: 0; border-right: 4px solid; }
[dir="rtl"] .quote            { border-left: 0; border-right: 4px solid var(--red); }
[dir="rtl"] table.data th,
[dir="rtl"] table.data td     { text-align: right; }
[dir="rtl"] .admin-sidebar nav a            { border-left: 0; border-right: 3px solid transparent; }
[dir="rtl"] .admin-sidebar nav a.is-active  { border-left-color: transparent; border-right-color: var(--red); }

/* auto-margins flip */
[dir="rtl"] .push-right,
[dir="rtl"] [style*="margin-left: auto"] { margin-left: 0 !important; margin-right: auto !important; }

/* Numbers, dates, money, phone and email stay LTR even inside Arabic text —
   otherwise "$25" and "(313) 555-1234" render reversed. */
[dir="rtl"] .ltr,
[dir="rtl"] .amount,
[dir="rtl"] time,
[dir="rtl"] a[href^="tel:"],
[dir="rtl"] a[href^="mailto:"] {
  direction: ltr;
  unicode-bidi: embed;
  display: inline-block;
}

/* The logo is an English wordmark — keep it visually leading. */
[dir="rtl"] .brand__logo { direction: ltr; }

/* --- language toggle --- */
.nav__lang {
  display: inline-flex; align-items: center;
  margin-inline-start: 10px; padding: 5px 12px;
  border: 1.5px solid var(--navy, #0A1633);
  border-radius: 999px;
  font-size: .82rem; font-weight: 700; line-height: 1;
  color: var(--navy, #0A1633); text-decoration: none;
  white-space: nowrap;
}
.nav__lang:hover { background: var(--navy, #0A1633); color: #fff; }
/* The toggle always shows the OTHER language in its own script, so its label
   must not inherit the current direction. */
.nav__lang[lang="ar"] { font-family: 'Cairo', 'Tajawal', system-ui, sans-serif; direction: rtl; }
.nav__lang[lang="en"] { direction: ltr; }