/* ============================================================ MAROCSIRA — RTL OVERRIDES (Arabic) Loaded only for Arabic visitors (see inc/i18n.php). Flexbox/Grid row layouts already mirror automatically once is set — this file only fixes the physical (non-logical) left/right, text-align and border-side rules that CSS does not flip on its own. ============================================================ */ body.rtl { font-family: 'Tajawal', 'Plus Jakarta Sans', system-ui, sans-serif; } body.rtl .brand-logo, body.rtl .footer-brand { font-family: 'Cinzel Decorative', 'Playfair Display', serif; /* keep the Latin wordmark as designed */ } /* Skip link: off-screen on the correct side, revealed on focus */ body.rtl .skip { left: auto; right: -9999px; } body.rtl .skip:focus { left: auto; right: 0; border-radius: 0 0 0 var(--radius-sm); } /* Text alignment: components that were pinned to physical "left" should read from the right in Arabic. */ body.rtl .vertical-card, body.rtl .trust-card, body.rtl .journey-step, body.rtl .shop-card { text-align: right; } /* Accent bars: a "leading edge" accent should sit on the right in RTL, matching where the eye starts reading. */ body.rtl .privacy-note { border-left: none; border-right: 4px solid var(--color-mint-fresh); } body.rtl .reassurance-card { border-left: none; border-right: 5px solid var(--color-majorelle); } /* Checklist bullet position */ body.rtl .checklist li { padding-left: 0; padding-right: 1.75rem; } body.rtl .checklist li::before { left: auto; right: 0; } /* Footer link hover nudge should move toward the reading direction */ body.rtl .site-footer ul a:hover { padding-left: 0; padding-right: 4px; } /* Mandatory D13/D14 rule banner and CTA band already use flex + gap and mirror on their own; no override needed there. */ /* Floating WhatsApp button: bottom-left in RTL instead of bottom-right */ body.rtl .floating-whatsapp { right: auto; left: 2rem; } /* Language switcher dropdown: opens toward the reading direction */ body.rtl .lang-menu { right: auto; left: 0; } @media (max-width: 768px) { body.rtl .floating-whatsapp { right: auto; left: 1.2rem; } } /* Corridor route arrow direction: content already uses "←" in the Arabic string table, so no CSS mirroring of the label itself is needed here. */ /* Mobile menu drawer and top-bar already stretch full width (left:0; right:0) so no directional fix is required there. */