/* ============================================================
   YOUPTECK — Surcouche RTL pour l'arabe
   Chargée uniquement quand <html dir="rtl"> (langue = ar)
   ============================================================ */

/* Police adaptée à l'arabe (Inter n'a pas de glyphes arabes) */
body[dir="rtl"], [dir="rtl"] body {
  font-family: 'Cairo', 'Tajawal', 'Inter', sans-serif;
}
[dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3, [dir="rtl"] .s-title,
[dir="rtl"] .hero h1, [dir="rtl"] .logo-text, [dir="rtl"] .nav-logo {
  font-family: 'Cairo', 'Tajawal', 'Inter', sans-serif;
}

/* Alignement de texte par défaut */
[dir="rtl"] .crit-list { text-align: right; }

/* Barres d'accent latérales (sidebar, agenda) : passent à droite en RTL */
[dir="rtl"] .sb-item { border-left: none; border-right: 3px solid transparent; }
[dir="rtl"] .sb-item.on { border-left: none; border-right-color: var(--blue2); }
[dir="rtl"] .ag-item { border-left: none; border-right: 4px solid var(--border); border-radius: 10px 0 0 10px; }

/* Icônes directionnelles (flèches) : on les retourne visuellement */
[dir="rtl"] .ti-arrow-right::before,
[dir="rtl"] .btn .ti-arrow-right,
[dir="rtl"] .f-next .ti-arrow-right,
[dir="rtl"] .lbtn .ti-arrow-right {
  display: inline-block;
  transform: scaleX(-1);
}
[dir="rtl"] .step-item .ti-check { transform: none; }

/* Effets décoratifs du hero : miroir horizontal */
[dir="rtl"] .hero-glow1 { right: auto; left: -100px; }
[dir="rtl"] .hero-glow2 { left: auto; right: 100px; }
[dir="rtl"] .float-badge.b1 { left: auto; right: -6%; }
[dir="rtl"] .float-badge.b2 { right: auto; left: -10%; }
[dir="rtl"] .float-badge.b3 { left: auto; right: 6%; }

/* Formulaires : les champs texte suivent le sens de lecture naturellement,
   mais on force l'alignement pour les champs latins (email, téléphone) */
[dir="rtl"] input[type="email"],
[dir="rtl"] input[type="tel"],
[dir="rtl"] input[type="password"] {
  text-align: right;
  direction: rtl;
}

/* Cartes et listes à puces : le point/icône passe naturellement à droite
   grâce à direction:rtl hérité, aucun ajustement flex nécessaire ici */

/* Stepper d'inscription : la ligne de progression garde son sens visuel
   correct grâce à l'inversion automatique de flexbox en RTL */

/* Marquee partenaires : on inverse le sens de défilement pour qu'il
   continue visuellement de la droite vers la gauche à l'écran */
[dir="rtl"] .partners-track { animation-direction: reverse; }

/* Sélecteur de langue : petit ajustement d'espacement */
[dir="rtl"] .lang-switch { direction: ltr; }