/* Km Zero · ajustements pour les langues écrites de droite à gauche (arabe)
   Chargé par base.html.twig quand <html dir="rtl">. Les grilles et flex s'inversent seuls ;
   ici, uniquement les positions, marges et décorations écrites en gauche / droite. */

/* Polices : lettres latines en Jost / Manrope, lettres arabes en Noto Kufi / Noto Sans Arabic */
:root {
  --f-titre: "Jost", "Noto Kufi Arabic", "Futura", system-ui, sans-serif;
  --f-slogan: "Josefin Sans", "Noto Kufi Arabic", system-ui, sans-serif;
  --f-texte: "Manrope", "Noto Sans Arabic", system-ui, -apple-system, "Segoe UI", sans-serif;
}
/* L'espacement des lettres casse la liaison des lettres arabes ; pas de majuscules en arabe */
body, body * { letter-spacing: 0 !important; }
body { line-height: 1.75; }
h1, h2, h3 { line-height: 1.35; }

/* Flèches décoratives des boutons et liens (→ devient ←) */
a > span[aria-hidden="true"]:last-child,
button > span[aria-hidden="true"]:last-child { display: inline-block; scale: -1 1; }

/* ---------- Accueil ---------- */
/* Voile du hero et de l'appel final : foncé du côté du texte, donc à droite */
.hero-card::before { background: linear-gradient(270deg, rgba(19, 38, 30, .78) 0%, rgba(19, 38, 30, .45) 45%, rgba(19, 38, 30, .05) 100%); }
.cta-card::before { background: linear-gradient(260deg, rgba(30, 77, 59, .96) 0%, rgba(30, 77, 59, .86) 50%, rgba(30, 77, 59, .55) 100%); }
/* Soulignements animés : ils se dessinent de droite à gauche */
.hero h1 .accent { background-position: 100% 92%; }
.hero-float { right: auto; left: 32px; }
.blob-3 { margin-left: 0; margin-right: 9%; }
.mission-splash { left: auto; right: -6px; }
.mission-palm { left: auto; right: -10px; }

.journey-track { left: auto; right: calc(var(--badge) / 2 - 1px); }
.stop { padding-left: 0; padding-right: calc(var(--badge) + 24px); }
.stop-badge { left: auto; right: 0; }
.stop-num { right: auto; left: 0; }
@media (min-width: 860px) {
  .stop { padding-right: 0; }
  .journey-track { left: calc((100% - 80px) / 3 - var(--badge) / 2); right: calc(var(--badge) / 2); }
  .journey-plane { left: auto; right: 0; scale: -1 1; }
}
@keyframes fly-rtl {
  0% { right: 0; opacity: 0; }
  8% { opacity: 1; }
  92% { opacity: 1; }
  100% { right: calc(100% - 28px); opacity: 0; }
}
.journey.is-visible .journey-plane { animation-name: fly-rtl; }

.checks li { padding-left: 0; padding-right: 26px; }
.checks li::before { left: auto; right: 2px; }
.aud-num { left: auto; right: 20px; }
.faq summary { padding: 20px 0 20px 40px; }
.faq summary::after { right: auto; left: 4px; }
.cta-speed { right: auto; left: 32px; scale: -1 1; }
.footer-watermark { right: auto; left: -90px; }
.wa-float { right: auto; left: 16px; }
.post-tag { left: auto; right: 14px; }
.post-link:hover .post-more span { transform: translateX(-4px); }
.reveal-left { transform: translateX(28px); }
.scroll-progress { left: auto; right: 0; transform-origin: right; }

/* ---------- En-tête : sous-menu Services et langues ---------- */
@media (min-width: 1201px) {
  .submenu { left: auto; right: -24px; }
}
.lang-list { right: auto; left: 0; }
.lang-list a[aria-current="true"]::after { margin-left: 0; margin-right: auto; }

/* ---------- Fenêtre « En savoir plus » ---------- */
.pm-head { padding: 28px 28px 24px 72px; background: radial-gradient(120% 120% at 0% 0%, #2F6A52 0%, var(--vert) 60%); }
.pm-head::after { right: auto; left: -70px; }
.pm-close { right: auto; left: 16px; }
.pm-not li, .pm-good li { padding-left: 0; padding-right: 22px; }
.pm-not li::before { left: auto; right: 4px; }
.pm-good li::before { left: auto; right: 2px; }

/* ---------- Pages intérieures (pages.css) ---------- */
.breadcrumb li:not(:last-child)::after { content: "‹"; margin-left: 0; margin-right: 6px; }
.how-num { right: auto; left: 22px; }
.route-pill { left: auto; right: 18px; }
.faq-search svg { left: auto; right: 16px; }
.faq-search input { padding: 0 48px 0 18px; }
.article-toc ol { padding-left: 0; padding-right: 18px; }
.price-table th { text-align: right; }

/* ---------- Pages services (service.css) ---------- */
.sv-hero-media::before { left: auto; right: -24px; }
.sv-hero-card { right: auto; left: -8px; }
.sv-hero-card li { padding-left: 0; padding-right: 20px; }
.sv-hero-card li::before { left: auto; right: 1px; }
.sv-timeline::before { left: auto; right: 23px; }
.sv-pc-fx { text-align: left; }

/* ---------- Réservation (reservation.css) ---------- */
.stepper li::before { right: auto; left: 50%; }
.check em { margin-left: 0; margin-right: 6px; }
.review .review-edit { margin-left: 0; margin-right: 8px; }
.step-nav #next-btn, .step-nav #submit-btn { margin-left: 0; margin-right: auto; }
.summary-list dd { text-align: left; }
.summary-trust li { padding-left: 0; padding-right: 22px; }
.summary-trust li::before { left: auto; right: 2px; }
.summary-fx, .pay-fx { text-align: left; }
.done-next { text-align: right; }
.bk-pack .pack-top { padding-right: 0; padding-left: 40px; }
.bk-radio { right: auto; left: 20px; }
.opt-tile-check { right: auto; left: 16px; }
@media (max-width: 999px) {
  .summary-inner summary::after { margin-left: 0; margin-right: 8px; }
  .summary-total-mobile { margin-left: 0; margin-right: auto; }
}

/* ---------- Espace client (espace-client.css) ---------- */
.login-visual::after { right: auto; left: -120px; }
.login-symbol { right: auto; left: 40px; }
.progress-steps li::before { left: auto; right: -50%; }
.pay-row em { margin-left: 0; margin-right: 4px; }
.pay-bar span { transform-origin: right; }
.dash-head::after { right: auto; left: -60px; }
.dash-count { margin-left: 0; margin-right: auto; }
@media (min-width: 760px) { .bk-side { text-align: left; } }
.invoices th { text-align: right; }
.prefs legend { float: right; }
.switch span::after { left: auto; right: 2px; }
.switch input:checked + span::after { transform: translateX(-18px); }
.text-btn { margin-left: 0; margin-right: 6px; }
@media (max-width: 899px) {
  .login-symbol { right: auto; left: 28px; }
}
