/* ============================================================ Right-to-left overrides — loaded only when (currently: Arabic). The browser handles base text direction; this file mirrors the fixed sidebar layout to the right side and flips the handful of hard-coded directional rules. ============================================================ */ /* --- Arabic type system: Tajawal for the Arabic script, Inter Tight as the Latin companion (brand names, numerals). Overrides the Latin display/head/ body stacks — Cormorant Garamond & Syne have no Arabic glyphs, so headings and the hero would otherwise fall back to an ugly system font. This file loads only for RTL/Arabic and after style.css, so a plain :root override is already scoped to Arabic and wins the cascade. --- */ :root { --font-display: 'Tajawal', 'Inter Tight', Georgia, serif; --font-head: 'Tajawal', 'Inter Tight', sans-serif; --font-body: 'Tajawal', 'Inter Tight', 'Segoe UI', system-ui, sans-serif; } /* --- Core layout: sidebar moves to the right --- */ .sidebar { inset: 0 0 0 auto; /* was: 0 auto 0 0 (pinned left) */ border-right: none; border-left: 1px solid var(--line); } .site-main { margin-left: 0; margin-right: var(--sidebar-w); } /* --- Mobile: sidebar slides in from the right --- */ @media (max-width: 1024px) { .site-main { margin-right: 0; } } /* --- Collapse chevron points the other way --- */ .side-collapse .material-symbols-outlined, .side-group-toggle .caret { transform: scaleX(-1); } /* --- Generic directional helpers --- */ .check-list li, .lang-menu a, .lang-current, .side-nav a, .side-group-toggle { text-align: right; } /* Material caret/arrow icons that imply "forward" get mirrored */ .btn .ico svg, .fb-links, .footer-bottom { /* keep inline rows readable; flex handles order via dir */ } /* Numbers, stats and the live ticker stay LTR for legibility */ .stat-num, .cnt, .live-ticker, .bar-track, table { direction: ltr; } /* Re-align table text to the start (right) even though the box is LTR */ .bond-table th, .bond-table td { text-align: right; } /* --- Collapsed rail: language menu must open INTO the page --- The collapsed icon rail is docked to the right in Arabic, so the LTR default (`.lang-menu { left: 0 }`, growing rightward) spills off the right edge of the screen. Anchor the menu to the right edge and let it grow leftward into the page instead. Same @media as the base collapsed rules (desktop rail). */ @media (min-width: 993px) { :root.nav-collapsed .lang-menu { left: auto; right: 0; } }