/** * RTL (Right-to-Left) overrides for Arabic layout. * Loaded conditionally when dir="rtl" is set on . * Tailwind handles most RTL via logical properties; this file covers custom CSS. */ /* Arabic font family */ [dir="rtl"] body, [dir="rtl"] input, [dir="rtl"] select, [dir="rtl"] textarea, [dir="rtl"] button { font-family: 'Noto Sans Arabic', 'DM Sans', system-ui, -apple-system, sans-serif; } /* Flip text alignment */ [dir="rtl"] .text-left { text-align: right; } [dir="rtl"] .text-right { text-align: left; } /* Flip margins */ [dir="rtl"] .ml-1 { margin-left: 0; margin-right: 0.25rem; } [dir="rtl"] .ml-2 { margin-left: 0; margin-right: 0.5rem; } [dir="rtl"] .ml-3 { margin-left: 0; margin-right: 0.75rem; } [dir="rtl"] .ml-4 { margin-left: 0; margin-right: 1rem; } [dir="rtl"] .mr-1 { margin-right: 0; margin-left: 0.25rem; } [dir="rtl"] .mr-2 { margin-right: 0; margin-left: 0.5rem; } [dir="rtl"] .mr-3 { margin-right: 0; margin-left: 0.75rem; } [dir="rtl"] .mr-4 { margin-right: 0; margin-left: 1rem; } /* Flip paddings */ [dir="rtl"] .pl-1 { padding-left: 0; padding-right: 0.25rem; } [dir="rtl"] .pl-2 { padding-left: 0; padding-right: 0.5rem; } [dir="rtl"] .pl-3 { padding-left: 0; padding-right: 0.75rem; } [dir="rtl"] .pl-4 { padding-left: 0; padding-right: 1rem; } [dir="rtl"] .pr-1 { padding-right: 0; padding-left: 0.25rem; } [dir="rtl"] .pr-2 { padding-right: 0; padding-left: 0.5rem; } [dir="rtl"] .pr-3 { padding-right: 0; padding-left: 0.75rem; } [dir="rtl"] .pr-4 { padding-right: 0; padding-left: 1rem; } /* Flip border-l / border-r */ [dir="rtl"] .border-l { border-left: 0; border-right-width: 1px; } [dir="rtl"] .border-r { border-right: 0; border-left-width: 1px; } [dir="rtl"] .border-l-4 { border-left: 0; border-right: 4px solid; border-right-color: inherit; } /* Flip rounded corners */ [dir="rtl"] .rounded-l-lg { border-radius: 0 0.5rem 0.5rem 0; } [dir="rtl"] .rounded-r-lg { border-radius: 0.5rem 0 0 0.5rem; } /* Flex direction */ [dir="rtl"] .space-x-2 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 1; } [dir="rtl"] .space-x-4 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 1; } [dir="rtl"] .space-x-5 > :not([hidden]) ~ :not([hidden]) { --tw-space-x-reverse: 1; } /* Search form RTL: flip rounded corners */ [dir="rtl"] form[data-modern-search] input[name="keyword"] { border-radius: 0 0.5rem 0.5rem 0; } [dir="rtl"] form[data-modern-search] button[type="submit"] { border-radius: 0.5rem 0 0 0.5rem; } /* Font Awesome icons in RTL - flip directional icons */ [dir="rtl"] .fa-chevron-right::before { content: "\f053"; } /* becomes chevron-left */ [dir="rtl"] .fa-chevron-left::before { content: "\f054"; } /* becomes chevron-right */ [dir="rtl"] .fa-arrow-right::before { content: "\f060"; } [dir="rtl"] .fa-arrow-left::before { content: "\f061"; } /* Legacy grid RTL */ [dir="rtl"] main .row { flex-direction: row-reverse; } /* Logo text - keep LTR for brand names */ [dir="rtl"] .logo-text { direction: ltr; unicode-bidi: embed; }