/** * RTL layout overrides for Arabic portal (dir="rtl" on ). */ .lang-switch { display: inline-flex; align-items: center; gap: 0.2rem; padding: 0.15rem; border-radius: 999px; border: 1px solid var(--border, #cbd5e1); background: color-mix(in srgb, var(--panel, #fff) 88%, transparent); } .lang-switch__btn { border: 0; background: transparent; color: var(--muted, #64748b); font-size: 0.72rem; font-weight: 600; line-height: 1; padding: 0.35rem 0.55rem; border-radius: 999px; cursor: pointer; } .lang-switch__btn.is-active { color: var(--text, #0f172a); background: var(--accent-muted, rgba(77, 121, 230, 0.12)); } .lang-switch__btn:hover { color: var(--text, #0f172a); } .login-theme { display: flex; align-items: center; gap: 0.5rem; } .sidebar__bottom .lang-switch { width: 100%; justify-content: center; margin-bottom: 0.45rem; } [dir='rtl'] body, html.is-rtl body { font-family: 'IBM Plex Sans Arabic', 'Noto Sans Arabic', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; } [dir='rtl'] .sidebar { left: auto; right: 0; border-right: 0; border-left: 1px solid var(--border); direction: rtl; } [dir='rtl'] .layout__main, [dir='rtl'] .app-main, [dir='rtl'] .main-wrap { margin-left: 0; margin-right: var(--sidebar-w, 13rem); } [dir='rtl'] .topbar__left { flex-direction: row-reverse; } [dir='rtl'] .topbar__right { flex-direction: row-reverse; } /* Topbar chrome — profile cluster sits on the inline-end (left in RTL) */ html.is-rtl .topbar__end, [dir='rtl'] .topbar__end { margin-left: 0; margin-inline-start: auto; padding-left: 0; padding-inline-start: 0.35rem; } html.is-rtl .topbar-profile__menu, [dir='rtl'] .topbar-profile__menu { right: auto; left: auto; inset-inline-end: 0; inset-inline-start: auto; } html.is-rtl .topbar-profile__trigger, [dir='rtl'] .topbar-profile__trigger { flex-direction: row-reverse; padding: 0.2rem 0.2rem 0.2rem 0.55rem; } html.is-rtl .topbar-profile__trigger-meta, [dir='rtl'] .topbar-profile__trigger-meta { text-align: right; align-items: flex-end; } html.is-rtl .topbar-profile__menu-item, [dir='rtl'] .topbar-profile__menu-item { text-align: right; } html.is-rtl .topbar-profile__menu-head, [dir='rtl'] .topbar-profile__menu-head { flex-direction: row-reverse; } html.is-rtl .topbar-notif__badge, [dir='rtl'] .topbar-notif__badge { right: auto; left: auto; inset-inline-end: -0.2rem; } [dir='rtl'] .dash-job-panel__head, [dir='rtl'] .dash-job-panel__label, [dir='rtl'] .dash-job-panel__value, [dir='rtl'] .dash-job-panel__duties { text-align: right; } [dir='rtl'] .dash-job-panel__duties ul { padding-inline-start: 1.15rem; } /* Sidebar nav: use RTL flow (icon right, label right-aligned); avoid row-reverse double-flip */ [dir='rtl'] .side-link, [dir='rtl'] .side-link--link, [dir='rtl'] .side-aux { text-align: right; border-left: none !important; border-right: 2px solid transparent; } [dir='rtl'] .side-link.active, [dir='rtl'] [data-theme='light'] .side-link.active, [dir='rtl'] [data-theme='dark'] .side-link.active { border-left-color: transparent !important; border-right-color: var(--sidebar-nav, #5181b8) !important; } [dir='rtl'] .side-link.has-ico, [dir='rtl'] .sidebar__nav .side-link.side-link--badged, [dir='rtl'] .sidebar__nav .side-link.side-link--nav-two-row .side-link__row1, [dir='rtl'] .sidebar__bottom .side-link--with-ico, [dir='rtl'] .side-aux { flex-direction: row; } [dir='rtl'] .side-link__text, [dir='rtl'] .sidebar__nav .side-link.side-link--badged .side-link__text, [dir='rtl'] .sidebar__nav .side-link.side-link--nav-two-row .side-link__text { text-align: right; } [dir='rtl'] .sidebar__nav .side-link.side-link--badged .side-nav__badge-group { margin-left: 0 !important; margin-inline-start: auto; } [dir='rtl'] .sidebar__nav .side-link.side-link--nav-two-row .side-link__row2 { justify-content: flex-end; } [dir='rtl'] .brand-logos__pair--day .brand-logos__word, [dir='rtl'] .brand-logos__pair--night .brand-logos__word { object-position: right center; } [dir='rtl'] table th, [dir='rtl'] table td, [dir='rtl'] .wd-sessions-table th, [dir='rtl'] .wd-sessions-table td { text-align: right; } [dir='rtl'] .modal-head, [dir='rtl'] .modal-actions, [dir='rtl'] .row, [dir='rtl'] .toolbar, [dir='rtl'] .sr-toolbar, [dir='rtl'] .dp-toolbar { flex-direction: row-reverse; } [dir='rtl'] input[type='search'], [dir='rtl'] input[type='text'], [dir='rtl'] input[type='password'], [dir='rtl'] input[type='email'], [dir='rtl'] select, [dir='rtl'] textarea { text-align: right; } [dir='rtl'] .lang-switch { flex-direction: row-reverse; } [dir='rtl'] .lang-switch__btn { font-family: inherit; } [dir='rtl'] .work-empty { text-align: center; } @media (max-width: 900px) { [dir='rtl'] .sidebar { transform: translateX(100%); } [dir='rtl'] .sidebar.is-open { transform: translateX(0); } [dir='rtl'] .layout__main, [dir='rtl'] .app-main, [dir='rtl'] .main-wrap { margin-right: 0; } } /* Mirror directional chevrons only — not sidebar pictograms */ [dir='rtl'] [class*='__chev'] { transform: scaleX(-1); } [dir='rtl'] .side-link__ico svg { transform: none; } [dir='rtl'] .dash-meta-grid, [dir='rtl'] .summary-grid, [dir='rtl'] .mt-summary__grid { direction: rtl; } [dir='rtl'] .leaflet-control-zoom, [dir='rtl'] .leaflet-bar { direction: ltr; } [dir='rtl'] .numeric, [dir='rtl'] .tabular-nums, [dir='rtl'] time, [dir='rtl'] [data-numeric] { direction: ltr; unicode-bidi: embed; } [dir='rtl'] .i18n-dual-date { align-items: flex-end; text-align: end; }