/* ========================================================= rtl.css — HUN Arabic (RTL) layout adjustments Optional companion stylesheet. Only applies when is set by translations.js (Arabic active). Link AFTER stylee.css and any page-specific stylesheets. ========================================================== */ html[dir="rtl"] body { text-align: right; } /* Header / nav */ html[dir="rtl"] .header-inner { flex-direction: row-reverse; } html[dir="rtl"] .main-nav { flex-direction: row-reverse; } html[dir="rtl"] .nav-dropdown { right: 0; left: auto; text-align: right; } html[dir="rtl"] .header-right { flex-direction: row-reverse; } html[dir="rtl"] .chev svg, html[dir="rtl"] .btn-arrow svg { transform: scaleX(-1); } /* Mobile menu */ html[dir="rtl"] .mobile-panel { right: auto; left: 0; } /* Footer */ html[dir="rtl"] .footer-grid, html[dir="rtl"] .footer-main { text-align: right; } html[dir="rtl"] .socials { flex-direction: row-reverse; } /* Generic content blocks that use flex rows (cards, meta rows, etc.) */ html[dir="rtl"] .event-card-meta, html[dir="rtl"] .meta-item, html[dir="rtl"] .prov-card-footer { flex-direction: row-reverse; } /* Arrows used as directional cues should flip in RTL */ html[dir="rtl"] .arrow { display: inline-block; transform: scaleX(-1); } /* Lang switcher */ .lang-switcher { display: inline-flex; align-items: center; gap: 6px; margin-inline-end: 12px; font-size: 13px; } .lang-btn { background: none; border: none; cursor: pointer; padding: 2px 4px; font: inherit; color: inherit; opacity: 0.6; } .lang-btn.active { opacity: 1; font-weight: 600; } .lang-divider { opacity: 0.4; } /* NOTE: This file covers common layout patterns only. Because the project's full CSS (stylee.css, providers.css, events.css, etc.) was not supplied, some page-specific components may need extra [dir="rtl"] rules added by hand once you see them rendered. */