/* Support RTL (arabe) pour ApexVPS. * * Tailwind est charge via CDN et emet des utilitaires physiques (margin-right, * left...) qui ne se retournent pas tout seuls sous dir="rtl". Un audit du HTML * ne remonte que 12 classes directionnelles distinctes : elles sont toutes * reprises ici, une par une. Le selecteur [dir="rtl"] suffit a gagner en * specificite, aucun !important n'est necessaire. * * flex-direction, l'ordre des colonnes de grille et l'ordre des mots sont deja * geres nativement par le navigateur grace a dir="rtl" sur . */ [dir="rtl"] body { font-family: "Segoe UI", Tahoma, "Noto Naskh Arabic", "Noto Sans Arabic", "Geeza Pro", "Arabic Typesetting", system-ui, sans-serif; } /* L'arabe demande un peu plus d'air vertical que le latin. */ [dir="rtl"] p, [dir="rtl"] li { line-height: 1.85; } /* --- marges horizontales --- */ [dir="rtl"] .mr-1 { margin-right: 0; margin-left: 0.25rem; } [dir="rtl"] .mr-1\.5 { margin-right: 0; margin-left: 0.375rem; } [dir="rtl"] .mr-2 { margin-right: 0; margin-left: 0.5rem; } [dir="rtl"] .ml-1 { margin-left: 0; margin-right: 0.25rem; } /* --- espacements internes --- */ [dir="rtl"] .pr-4 { padding-right: 0; padding-left: 1rem; } [dir="rtl"] .pl-8 { padding-left: 0; padding-right: 2rem; } /* --- alignements de texte : left = debut de ligne, right = fin --- */ [dir="rtl"] .text-left { text-align: right; } [dir="rtl"] .text-right { text-align: left; } /* --- positionnement absolu (badges "MOST POPULAR", pastilles d'etapes) --- */ [dir="rtl"] .right-6 { right: auto; left: 1.5rem; } [dir="rtl"] .left-4 { left: auto; right: 1rem; } [dir="rtl"] .left-5 { left: auto; right: 1.25rem; } [dir="rtl"] .left-8 { left: auto; right: 2rem; } /* --- fleches et chevrons decoratifs : on les retourne --- */ [dir="rtl"] .fa-arrow-right, [dir="rtl"] .fa-arrow-left, [dir="rtl"] .fa-chevron-right, [dir="rtl"] .fa-chevron-left, [dir="rtl"] .fa-angle-right, [dir="rtl"] .fa-angle-left { transform: scaleX(-1); } /* --- prix, versions et identifiants restent lus de gauche a droite --- */ [dir="rtl"] .stat, [dir="rtl"] code, [dir="rtl"] kbd, [dir="rtl"] samp, [dir="rtl"] pre { direction: ltr; text-align: right; unicode-bidi: embed; } [dir="rtl"] pre, [dir="rtl"] pre code { text-align: left; } /* --- le modal de commande herite du sens, mais ses champs techniques non --- */ [dir="rtl"] .apex-modal input[type="email"], [dir="rtl"] .apex-modal input[type="text"], [dir="rtl"] .apex-modal textarea { direction: ltr; text-align: left; }