/* ============================================================
   RUNNERS — rtl.css
   Loaded only on Arabic pages. Arabic font + directional fixes
   that need to visually flip when dir="rtl".
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;800&display=swap');

[dir="rtl"] {
  --font-body:    'Cairo', 'Baloo', system-ui, -apple-system, sans-serif;
  --font-display: 'Cairo', 'Baloo', system-ui, -apple-system, sans-serif;
}

/* Breadcrumb separator — visually flip the chevron */
[dir="rtl"] .breadcrumb__separator {
  display: inline-block;
  transform: scaleX(-1);
}

/* Card / link arrow icons (svg "next" chevrons drawn pointing right) */
[dir="rtl"] .card__link svg,
[dir="rtl"] .btn__icon-arrow,
[dir="rtl"] .hero__scroll svg {
  transform: scaleX(-1);
}

/* Text-align utilities should flip with direction */
[dir="rtl"] .text-left  { text-align: right; }
[dir="rtl"] .text-right { text-align: left; }

/* Breadcrumb / step connectors that assume LTR flow */
[dir="rtl"] .steps-connector {
  transform: scaleX(-1);
}