/* =====================================================================
   RTL — droite à gauche (version arabe)
   À charger APRÈS style.css, uniquement sur les pages en dir="rtl".
   Le reste du CSS repose sur grid/flex : il s'inverse tout seul.
   Ce fichier ne corrige que ce qui ne s'inverse pas automatiquement.
   ===================================================================== */

:root[dir="rtl"] {
  --font-display: "Noto Kufi Arabic", "Cairo", -apple-system, "Segoe UI", sans-serif;
  --font-body:    "Cairo", "Noto Kufi Arabic", -apple-system, "Segoe UI", sans-serif;
}

/* L'interlettrage casse la liaison cursive de l'arabe : on l'annule. */
[dir="rtl"] .eyebrow,
[dir="rtl"] .progress,
[dir="rtl"] .tier {
  letter-spacing: 0;
}

/* La majuscule automatique n'a pas de sens en arabe. */
[dir="rtl"] .eyebrow { text-transform: none; }

/* Les flèches des boutons doivent pointer vers la gauche. */
[dir="rtl"] .btn img[src$="arrow.svg"] { transform: scaleX(-1); }

/* Indicateur de progression : coin opposé. */
[dir="rtl"] .progress { left: auto; right: 22px; }

/* L'arabe a besoin d'un peu plus d'air vertical. */
[dir="rtl"] body { line-height: 1.85; }
[dir="rtl"] h1 { line-height: 1.35; }
[dir="rtl"] h2 { line-height: 1.4; }

/* Le prix reste lu de gauche à droite (chiffres + devise). */
[dir="rtl"] .price { direction: ltr; text-align: right; unicode-bidi: isolate; }

/* Les citations gardent leur barre du bon côté. */
[dir="rtl"] blockquote { border-left: 0; border-right: 3px solid var(--accent); padding-left: 0; padding-right: 18px; }