/* Right-to-left corrections, loaded only for Arabic. dir="rtl" on already flips text, inline layout and the natural order of flex and grid children, so this file only has to undo the places the site hard-codes a side. Anything using flex/grid ordering or logical properties needs nothing. This is a first pass covering the shared chrome. A full RTL design review of every marketing page has not been done - see docs/LOCALIZATION.md. */ [dir="rtl"] { text-align: right; } /* Directional padding/margin the stylesheets set explicitly. */ [dir="rtl"] .te-container, [dir="rtl"] .te-section { direction: rtl; } /* Lists and bullets sit on the wrong side by default when a left padding is hard-coded. */ [dir="rtl"] ul, [dir="rtl"] ol { padding-right: 1.25rem; padding-left: 0; } /* Anything the site nudges with a left-hand offset needs the mirror. */ [dir="rtl"] .te-auth, [dir="rtl"] .te-authform, [dir="rtl"] .te-alert { text-align: right; } /* Icons that sat before their label now need the gap on the other side. */ [dir="rtl"] .te-btn > svg:first-child, [dir="rtl"] .te-btn > img:first-child { margin-left: .5rem; margin-right: 0; } /* Arrow glyphs point the wrong way once the reading direction flips. */ [dir="rtl"] .te-back-arrow { transform: scaleX(-1); display: inline-block; } /* Numbers, code, URLs and the language picker itself stay left-to-right even inside an RTL page - a phone number or a URL reads the same in every language. */ [dir="rtl"] code, [dir="rtl"] pre, [dir="rtl"] .te-langpicker, [dir="rtl"] [dir="ltr"] { direction: ltr; text-align: left; }