/* =========================================================================
   RTL adjustments — loaded only when current_lang() === 'ar' (is_rtl()).
   Pragmatic overrides for the heavy hitters: nav, hero, sections, footer,
   reservation modal, WhatsApp FAB, form inputs. Latin text (numbers, MAD,
   phone numbers) is handled by browser bidi automatically.
   ========================================================================= */

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

/* ---------- Nav ----------
   Note : en RTL avec direction:rtl, les flex containers en `flex-direction: row`
   inversent naturellement leur axe (les enfants flowent R→L dans l'ordre du DOM).
   Donc on NE met PAS de row-reverse sur .nav-links — sinon Home (DOM[0]) se
   retrouve à gauche et le lecteur arabe rencontre les liens dans l'ordre inverse.
   On laisse tel quel : DOM Home..Phone → visuel Phone..Home L→R → lecture R→L
   donne Home → Fleet → ... → Phone, ce qui est l'ordre logique attendu. */

/* Dropdowns (currency / lang) : ancrer à gauche en RTL */
html[dir="rtl"] .selector-menu {
    left: 0;
    right: auto;
}

/* ---------- Hero ---------- */
html[dir="rtl"] .hero-content,
html[dir="rtl"] .hero-eyebrow,
html[dir="rtl"] .hero-title,
html[dir="rtl"] .hero-sub {
    text-align: right;
}

/* ---------- Sections génériques ---------- */
html[dir="rtl"] .section-head,
html[dir="rtl"] .section-title,
html[dir="rtl"] .section-sub {
    text-align: right;
}

/* ---------- Booking bar (hero search) ---------- */
html[dir="rtl"] .booking-row,
html[dir="rtl"] .booking-foot {
    flex-direction: row-reverse;
}

/* Icônes dans les champs : swap marges directionnelles */
html[dir="rtl"] .field-icon {
    margin-left: 8px;
    margin-right: 0;
}

/* ---------- Fleet / Gammes / Stats grids ---------- */
html[dir="rtl"] .stats,
html[dir="rtl"] .gammes-grid,
html[dir="rtl"] .fleet-grid {
    direction: rtl;
}

html[dir="rtl"] .fleet-foot {
    flex-direction: row-reverse;
}

/* ---------- Car cards ---------- */
html[dir="rtl"] .car-top,
html[dir="rtl"] .car-foot,
html[dir="rtl"] .car-actions {
    flex-direction: row-reverse;
}

/* ---------- Testimonials ---------- */
html[dir="rtl"] .testimonials-controls {
    flex-direction: row-reverse;
}

/* ---------- Footer ---------- */
html[dir="rtl"] .footer-cols {
    direction: rtl;
}

html[dir="rtl"] .footer-bar nav {
    flex-direction: row-reverse;
}

html[dir="rtl"] .footer,
html[dir="rtl"] .footer h4,
html[dir="rtl"] .footer ul,
html[dir="rtl"] .footer-legal {
    text-align: right;
}

/* ---------- WhatsApp FAB (passer à gauche en RTL) ---------- */
html[dir="rtl"] .wa-fab {
    right: auto;
    left: calc(24px + env(safe-area-inset-left, 0px));
}

html[dir="rtl"] .wa-label {
    right: auto;
    left: 60px;
}

/* ---------- Reservation modal ---------- */
html[dir="rtl"] .rsv-aside,
html[dir="rtl"] .rsv-body {
    text-align: right;
}

html[dir="rtl"] .rsv-row {
    flex-direction: row-reverse;
}

html[dir="rtl"] .rsv-close {
    right: auto;
    left: 12px;
}

html[dir="rtl"] .rsv-actions {
    flex-direction: row-reverse;
}

/* ---------- Form fields ---------- */
html[dir="rtl"] input,
html[dir="rtl"] textarea,
html[dir="rtl"] select {
    text-align: right;
}

/* Inputs type=tel / email / number : laisser LTR pour numeric/latin legibility */
html[dir="rtl"] input[type="tel"],
html[dir="rtl"] input[type="email"],
html[dir="rtl"] input[type="number"],
html[dir="rtl"] input[type="url"] {
    direction: ltr;
    text-align: right;
}

/* ---------- Mirror des flèches CTA en RTL ----------
   Les SVG de "next" pointent vers la droite (→). En RTL, le sens narratif "vers
   l'avant" est à gauche, donc on flip horizontalement les flèches dans les
   boutons / liens dont l'icône représente un mouvement directionnel. */
html[dir="rtl"] .btn svg:not([data-no-flip]),
html[dir="rtl"] .nav-cta svg:not([data-no-flip]),
html[dir="rtl"] .car-link svg,
html[dir="rtl"] .car-book svg,
html[dir="rtl"] .gamme-cta svg,
html[dir="rtl"] .rsv-submit svg,
html[dir="rtl"] .step-icon ~ * svg,
html[dir="rtl"] .cities-foot svg {
    transform: scaleX(-1);
}
/* Exception : ne pas miroiter le SVG WhatsApp (logo de marque) */
html[dir="rtl"] .wa-fab svg,
html[dir="rtl"] .btn-wa-link svg,
html[dir="rtl"] .rsv-wa svg {
    transform: none;
}

/* ---------- Téléphones : forcer LTR pour conserver l'ordre des chiffres ----------
   En RTL, dir hérité réordonne « +212 663 27 86 33 » en « 33 86 27 663 212+ ».
   On force LTR sur tout lien tel: et sur les blocs typés en .tel-text. */
html[dir="rtl"] a[href^="tel:"],
html[dir="rtl"] .tel-text,
html[dir="rtl"] [data-ltr] {
    direction: ltr;
    unicode-bidi: embed;
    display: inline-block;
}

/* Exception : .nav-tel-mobile dans le drawer mobile reste un flex container
   (icône ::before + texte + chevron ::after). On garde direction:ltr pour
   l'ordre des chiffres mais on inverse la flex-direction pour que l'icône
   se retrouve à droite et le chevron à gauche, en cohérence avec les autres
   items du drawer en RTL. */
html[dir="rtl"] .nav-tel-mobile {
    display: flex;
    flex-direction: row-reverse;
}

/* ---------- Brand / Logo — ne pas miroiter ---------- */
html[dir="rtl"] .brand-logo {
    /* logos gardent leur orientation d'origine */
}

/* ---------- Selector trigger (dropdown button) ---------- */
html[dir="rtl"] .selector-trigger {
    flex-direction: row-reverse;
}

/* ---------- Socials list ---------- */
html[dir="rtl"] .socials {
    padding-right: 0;
}