/* ============================================================ rtl.css — right-to-left + Arabic typography layer. Applies only when (set by I18N.setLang). Arabic has no uppercase and letter-spacing breaks the script's joining, so both are neutralised for Arabic text. ============================================================ */ [dir="rtl"]{--ar-body:'IBM Plex Sans Arabic','Noto Sans Arabic','Segoe UI',Tahoma,sans-serif;--ar-disp:'Noto Kufi Arabic','IBM Plex Sans Arabic','Segoe UI',Tahoma,sans-serif;} [dir="rtl"] body,[dir="rtl"] button,[dir="rtl"] input,[dir="rtl"] textarea,[dir="rtl"] select,[dir="rtl"] option{font-family:var(--ar-body);} [dir="rtl"] *{letter-spacing:normal!important;text-transform:none!important;word-spacing:normal!important;} [dir="rtl"] h1,[dir="rtl"] h2,[dir="rtl"] h3,[dir="rtl"] .cond,[dir="rtl"] .kicker,[dir="rtl"] .btn,[dir="rtl"] .helpbtn,[dir="rtl"] .mono,[dir="rtl"] .ghost,[dir="rtl"] .langsel{font-family:var(--ar-disp);} [dir="rtl"] h1,[dir="rtl"] h2,[dir="rtl"] .authwm,[dir="rtl"] .entry h1{line-height:1.15;} [dir="rtl"] .tag,[dir="rtl"] .authtag{line-height:1.4;} /* text alignment: anything explicitly left-aligned flips */ [dir="rtl"] .hmenu-item,[dir="rtl"] .choice,[dir="rtl"] .authbox,[dir="rtl"] .moodresp .rtext,[dir="rtl"] button.fsnapitem,[dir="rtl"] .room,[dir="rtl"] .dchathd .dsub,[dir="rtl"] .msg{text-align:right;} /* accent bars sit on the reading edge */ [dir="rtl"] .moodresp .rtext,[dir="rtl"] .pulled,[dir="rtl"] .msg.them,[dir="rtl"] .presp,[dir="rtl"] .callout,[dir="rtl"] .pitem.done{border-left:none;border-right:3px solid var(--green);} [dir="rtl"] .moodresp .rtext.urgent,[dir="rtl"] .presp.urgent{border-right-color:var(--coral);} [dir="rtl"] .callout{border-right-color:var(--amber);} [dir="rtl"] .pulsecard::before{left:auto;right:0;} /* absolutely-positioned chrome */ [dir="rtl"] .hmenu-pop{right:auto;left:0;} [dir="rtl"] .dock{right:auto;left:0;border-left:none;border-right:1px solid var(--line-2);box-shadow:30px 0 80px rgba(0,0,0,.55);} @keyframes dockin-rtl{from{transform:translateX(-36px);opacity:0;}} [dir="rtl"] .dock{animation-name:dockin-rtl;} /* auto-margins flip */ [dir="rtl"] .pladd,[dir="rtl"] .gaugerow .gs,[dir="rtl"] .bcrow .bopts{margin-left:0;margin-right:auto;} /* arrow glyphs (.ar) point the reading direction */ [dir="rtl"] .ar{display:inline-block;transform:scaleX(-1);} /* Arabic labels need more room than the latin originals */ [dir="rtl"] .punchbtn,[dir="rtl"] .helpbtn{white-space:nowrap;} [dir="rtl"] .hmenu-pop{min-width:196px;} /* keep latin/number runs readable inside Arabic sentences */ [dir="rtl"] .num,[dir="rtl"] .tel,[dir="rtl"] a[href^="tel:"]{direction:ltr;unicode-bidi:embed;display:inline-block;}