/* Gamyra AI — RTL + Arabic typography (interface-language layer). * Active ONLY under html[dir="rtl"] (set by gds-i18n.js); pages with i18n off * never set it, so this file is inert for them. dir=rtl mirrors flex rows and * logical properties for free — this file covers what it cannot reach. Every * selector below was verified against the i18n census (platform/i18n/ * I18N_CENSUS.json, lens rtl-css): the codebase has ZERO logical properties, * so each physical site that carries direction meaning gets a mirror here. * (Brief §07: letter-spacing, bidi isolation, glyph flips, inside-out panels.) */ /* ---- typography: Arabic is a joined script ---- */ html[dir="rtl"] * { letter-spacing: normal !important; text-transform: none !important; } html[dir="rtl"] body { font-family: -apple-system, "SF Arabic", "Geeza Pro", "Segoe UI", "Noto Naskh Arabic UI", system-ui, sans-serif; } html[dir="rtl"] .gds-top-bar, html[dir="rtl"] aside.sidebar, html[dir="rtl"] .gds-sidebar { font-size: 1.03em; line-height: 1.45; } /* ---- bidi isolation: Latin/numeric runs (unicode-bidi is NOT inherited) ---- */ html[dir="rtl"] .gds-version-pill, html[dir="rtl"] .gds-drawer-version, html[dir="rtl"] .gds-brand, html[dir="rtl"] .cost-pill, html[dir="rtl"] .gds-cost-pill, html[dir="rtl"] .gds-past-cost, html[dir="rtl"] .gds-context-meter, html[dir="rtl"] .gds-who-role, html[dir="rtl"] .badge, html[dir="rtl"] .tag-complex, html[dir="rtl"] .gds-file-size, html[dir="rtl"] .gds-files-section-count, html[dir="rtl"] .gds-att-size, html[dir="rtl"] [data-gds-ltr] { direction: ltr; unicode-bidi: isolate; text-align: right; } /* Timestamps are ARABIC under ar (fmtDate 'ar-u-nu-latn': Arabic month, Latin digits) — forcing them LTR detached the day number from its month ('أغسطس 2026، 01:55 ص … 20'). plaintext resolves the paragraph direction from the first strong character: RTL for the Arabic date, LTR for a Latin one. */ html[dir="rtl"] .gds-meta-when, html[dir="rtl"] .gds-when-text, html[dir="rtl"] .gds-past-item-when, html[dir="rtl"] .hm-date, html[dir="rtl"] .gds-recycle-when { unicode-bidi: plaintext; text-align: start; } /* Code stays LTR and LEFT-aligned (an LTR block right-aligned reads wrong). */ html[dir="rtl"] code, html[dir="rtl"] pre, html[dir="rtl"] kbd, html[dir="rtl"] .gds-code-chip, html[dir="rtl"] .gds-md pre { direction: ltr; unicode-bidi: isolate; text-align: left; } /* User / model content: resolve per element from its own first strong char. */ html[dir="rtl"] .gds-past-row [data-role="title"], html[dir="rtl"] .gds-past-title, html[dir="rtl"] .gds-past-summary, html[dir="rtl"] .gds-header-title, html[dir="rtl"] .gds-msg, html[dir="rtl"] .gds-md, html[dir="rtl"] .gds-md p, html[dir="rtl"] .gds-md li, html[dir="rtl"] textarea, html[dir="rtl"] input[type="text"], html[dir="rtl"] input[type="search"], html[dir="rtl"] .gds-past-title-input { unicode-bidi: plaintext; text-align: start; } /* ---- the three inside-out panels (asymmetric radius + one missing border) ---- */ html[dir="rtl"] aside.sidebar { border-radius: 0 var(--radius-lg, 16px) var(--radius-lg, 16px) 0; border-right: 1px solid #FFFFFF12; border-left: none; } html[dir="rtl"] .gds-sidebar { border-radius: 0 var(--radius-lg, 16px) var(--radius-lg, 16px) 0; border-right: 1px solid #FFFFFF12; border-left: none; } html[dir="rtl"] .gds-files-drawer, html[dir="rtl"] .app-shell > .gds-files-drawer { border-radius: var(--radius-lg, 16px) 0 0 var(--radius-lg, 16px); border-left: 1px solid #FFFFFF12; border-right: none; } /* ---- physical-gutter controls + their clearance paddings ---- */ html[dir="rtl"] .sidebar-show { left: auto; right: 10px; } html[dir="rtl"] .app-shell:has(.sidebar-show:not([hidden])) main { padding-left: 0; padding-right: 48px; } html[dir="rtl"] .gds-sidebar-show { left: auto; right: 12px; } html[dir="rtl"] .gds-shell:has(.gds-sidebar-show:not([hidden])) .gds-header { padding-left: 0; padding-right: 60px; } html[dir="rtl"] .gds-files-show { right: auto; left: 10px; } html[dir="rtl"] .gds-shell:has(.gds-files-show:not([hidden])) .gds-header { padding-right: 0; padding-left: 60px; } html[dir="rtl"] .gds-past-panel { right: auto; left: 18px; } /* resize handles sit on the pane's INNER edge — mirror them */ html[dir="rtl"] .sidebar-resize { right: auto; left: 0; } html[dir="rtl"] .gds-sidebar-resize { right: auto; left: -2px; } html[dir="rtl"] .gds-files-drawer-resize { left: auto; right: 0; } /* ---- accent bars, indents, small margins that encode a side ---- */ html[dir="rtl"] aside nav a.is-current { border-left: 0; border-right: 2px solid var(--accent); padding-left: 0; padding-right: 12px; } html[dir="rtl"] .tr-list-row.is-active { box-shadow: inset -3px 0 0 var(--accent); } html[dir="rtl"] .nav-item, html[dir="rtl"] .recycle-bottom, html[dir="rtl"] .gds-recycle-toggle { text-align: right; } html[dir="rtl"] .tag-complex, html[dir="rtl"] .cost-pill, html[dir="rtl"] .badge, html[dir="rtl"] .gds-tag-helpful, html[dir="rtl"] .gds-att-dl { margin-left: 0; margin-right: 4px; } html[dir="rtl"] .gds-rte-editor ul, html[dir="rtl"] .gds-rte-editor ol, html[dir="rtl"] .gds-md ul, html[dir="rtl"] .gds-md ol { padding-left: 0; padding-right: 22px; } html[dir="rtl"] .gds-msg.user { margin-left: 0; margin-right: auto; } html[dir="rtl"] .gds-msg.assistant { margin-right: 0; margin-left: auto; } /* ---- glyphs that mean a direction: flip the glyph, not the button ---- */ /* ‹ › are bidi-MIRRORED characters: the browser already flips them under dir=rtl, so a scaleX(-1) on top double-mirrored every pane chevron back to its LTR orientation (QA 2026-08-20). Only glyphs that are NOT mirrored by Unicode (▸ ▾ arrows drawn with non-mirrored chars) get the CSS flip. */ html[dir="rtl"] .gds-files-row-chevron { display: inline-block; transform: scaleX(-1) translateY(-0.08em); } /* The ▸ caret rotates +90° to open; under RTL it points ◂ so rotate the other way. */ html[dir="rtl"] .gds-recycle-section[open] .gds-recycle-section-caret { transform: rotate(-90deg); } html[dir="rtl"] .gds-recycle-section-caret { display: inline-block; transform: scaleX(-1); } /* Custom