/* RTL overrides for Arabic and other RTL languages */ /* Note: dir="rtl" on automatically reverses flex-direction: row and grid layouts. Do NOT add flex-direction: row-reverse here — it would double-reverse back to LTR order. */ /* Prevent RTL overflow shift — in RTL, overflow extends left and can cause the viewport to shift right if not clipped at the html level */ html[dir="rtl"] { overflow-x: hidden; } /* Text alignment */ [dir="rtl"] .hero-text, [dir="rtl"] .hero-description, [dir="rtl"] .section-description, [dir="rtl"] .media-description, [dir="rtl"] .booking-form-subtitle, [dir="rtl"] .form-section-title, [dir="rtl"] label, [dir="rtl"] .footer-heading, [dir="rtl"] .footer-links, [dir="rtl"] .footer-contact { text-align: right; } [dir="rtl"] .section-header { text-align: center; } /* Hero title */ [dir="rtl"] .hero-title { text-align: right; } /* CTA section */ [dir="rtl"] .cta-content { text-align: right; } /* Margin/padding swaps for inline SVG icons */ [dir="rtl"] .media-link svg { margin-left: 0; margin-right: 4px; } [dir="rtl"] .nav-link svg { margin-left: 0; margin-right: 4px; } [dir="rtl"] .footer-links a svg { margin-left: 0; margin-right: 4px; } [dir="rtl"] .footer-contact svg { margin-right: 0; margin-left: 8px; } /* Language dropdown positioning */ [dir="rtl"] .nav-lang-panel { right: auto; left: 0; } /* Carousel — keep LTR so drag/scroll direction stays consistent */ [dir="rtl"] .carousel-track { direction: ltr; } /* Form alignment */ [dir="rtl"] input, [dir="rtl"] select, [dir="rtl"] textarea { text-align: right; } /* Arrow/chevron icons that point directionally */ [dir="rtl"] .button-icon { transform: scaleX(-1); }