/** * markt.machen.cockpit — RTL (Right-to-Left) Stylesheet * Applied automatically when i18n detects an RTL language (Arabic, Hebrew, etc.) * The attribute is set by i18n.js */ /* ── Base direction ───────────────────────────────────────────── */ [dir="rtl"] { direction: rtl; text-align: right; } /* ── Sidebar ──────────────────────────────────────────────────── */ [dir="rtl"] .app-layout { flex-direction: row-reverse; } [dir="rtl"] .sidebar { border-right: none; border-left: 1px solid var(--color-border); right: 0; left: auto; } [dir="rtl"] .sidebar-nav .nav-link { flex-direction: row-reverse; text-align: right; } [dir="rtl"] .sidebar-nav .nav-link svg { margin-right: 0; margin-left: var(--space-3); } [dir="rtl"] .sidebar-footer { flex-direction: row-reverse; } [dir="rtl"] .user-info { flex-direction: row-reverse; text-align: right; } /* ── Top bar ──────────────────────────────────────────────────── */ [dir="rtl"] .top-bar { flex-direction: row-reverse; } [dir="rtl"] .top-bar-title { text-align: right; } [dir="rtl"] .mobile-menu-btn { margin-right: 0; margin-left: var(--space-3); } /* ── Cards & containers ───────────────────────────────────────── */ [dir="rtl"] .card { text-align: right; } [dir="rtl"] .help-layout { flex-direction: row-reverse; } [dir="rtl"] .help-sidebar { border-right: none; border-left: 1px solid var(--color-border); } /* ── Forms ─────────────────────────────────────────────────────── */ [dir="rtl"] .form-input, [dir="rtl"] .form-textarea, [dir="rtl"] .form-select { text-align: right; } [dir="rtl"] .form-label { text-align: right; } /* ── Buttons with icons ───────────────────────────────────────── */ [dir="rtl"] .btn svg { margin-right: 0; margin-left: var(--space-2); } [dir="rtl"] .btn-icon-right svg { margin-left: 0; margin-right: var(--space-2); } /* ── Tables ────────────────────────────────────────────────────── */ [dir="rtl"] th, [dir="rtl"] td { text-align: right; } /* ── Flex utility overrides ───────────────────────────────────── */ [dir="rtl"] .flex-row { flex-direction: row-reverse; } /* ── Chevrons & arrows ────────────────────────────────────────── */ [dir="rtl"] .help-toc-chevron, [dir="rtl"] .help-nav-prev svg, [dir="rtl"] .help-nav-next svg { transform: scaleX(-1); } [dir="rtl"] .help-breadcrumb svg { transform: scaleX(-1); } /* ── Settings tabs ────────────────────────────────────────────── */ [dir="rtl"] .settings-tabs { flex-direction: row-reverse; } [dir="rtl"] .settings-tab svg { margin-right: 0; margin-left: var(--space-2); } /* ── Toast notifications ──────────────────────────────────────── */ [dir="rtl"] .toast-container { right: auto; left: var(--space-4); } /* ── Auth pages ───────────────────────────────────────────────── */ [dir="rtl"] .auth-card { text-align: right; } [dir="rtl"] .auth-switch { text-align: center; } /* ── Scoring / KPI ────────────────────────────────────────────── */ [dir="rtl"] .score-card, [dir="rtl"] .kpi-card { text-align: right; } /* ── Pipeline (Sales) ─────────────────────────────────────────── */ [dir="rtl"] .pipeline-stages { flex-direction: row-reverse; } /* ── Spacing utilities ────────────────────────────────────────── */ [dir="rtl"] .ml-auto { margin-left: 0; margin-right: auto; } [dir="rtl"] .mr-auto { margin-right: 0; margin-left: auto; } /* ── Mobile sidebar overlay ───────────────────────────────────── */ @media (max-width: 768px) { [dir="rtl"] .sidebar { transform: translateX(100%); left: auto; right: 0; } [dir="rtl"] .sidebar.open { transform: translateX(0); } }