/* rtl.css — right-to-left support, active only when (Farsi, Arabic…). Setting dir="rtl" already mirrors text direction, flexbox/grid order and logical (start/end) alignment. These rules fix the pieces that don't auto-mirror and keep inherently left-to-right data (numbers, times, money, emails, code) readable. */ /* --- inherently LTR content stays LTR even inside RTL prose --- */ [dir="rtl"] time, [dir="rtl"] .mono, [dir="rtl"] code, [dir="rtl"] kbd, [dir="rtl"] [data-ltr], [dir="rtl"] input[type="email"], [dir="rtl"] input[type="tel"], [dir="rtl"] input[type="url"], [dir="rtl"] input[type="number"] { direction: ltr; unicode-bidi: isolate; text-align: start; } /* --- form fields read right-to-left --- */ [dir="rtl"] input[type="text"], [dir="rtl"] input[type="search"], [dir="rtl"] input[type="password"], [dir="rtl"] textarea, [dir="rtl"] select { text-align: right; } /* --- the floating assistant stays bottom-right (utility overlay); its prose is RTL --- */ [dir="rtl"] .vcm-chat-messages, [dir="rtl"] .vcm-chat-header, [dir="rtl"] .vcm-chat-hinfo, [dir="rtl"] .vcm-chat-suggestions, [dir="rtl"] #vcm-chat-input { text-align: right; } /* English demo/prompt bubbles opt back into LTR via data-ltr */ [dir="rtl"] [data-ltr] { direction: ltr; unicode-bidi: isolate; } /* --- directional chevrons / arrows flip horizontally --- */ [dir="rtl"] .chev, [dir="rtl"] .arrow, [dir="rtl"] [data-flip-rtl] { transform: scaleX(-1); } /* --- console sidebar/nav: labels align to the right of their icons --- */ [dir="rtl"] .navItem, [dir="rtl"] .tab { text-align: right; } /* --- untranslated marketing body (landing) reads more naturally left-aligned --- */ [dir="rtl"] [data-ltr-block] { direction: ltr; text-align: left; } /* --- notification-bell count badge sits on the opposite corner in RTL --- */ [dir="rtl"] .nbell-badge { right: auto; left: -5px; }