/* * RTL — Arabic layout overrides * Loaded only when pll_current_language() === 'ar' */ /* ============================================= BASE ============================================= */ [dir="rtl"] body { font-family: 'Tajawal', sans-serif; text-align: right; } [dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3, [dir="rtl"] h4, [dir="rtl"] h5, [dir="rtl"] h6 { font-family: 'Tajawal', sans-serif; font-weight: 800; } [dir="rtl"] p { font-family: 'Tajawal', sans-serif; } /* ============================================= NAVBAR — direction:rtl inherited from already reverses flex row naturally. No row-reverse needed; adding it would cancel the RTL effect. ============================================= */ [dir="rtl"] .nav-menu > li > a { font-family: 'Tajawal', sans-serif; font-weight: 700; } [dir="rtl"] .nav-menu > li > a::after { left: auto; right: 0; } [dir="rtl"] .nav-cta { margin-left: 0; margin-right: 0.5rem; } /* Dropdown — flip to open from right */ [dir="rtl"] .dropdown-menu { left: auto; right: 50%; transform: translateX(50%); } [dir="rtl"] .dropdown-menu li a { flex-direction: row-reverse; text-align: right; } /* Language switcher — keep near hamburger on RTL */ [dir="rtl"] #lang-switcher { order: -1; } /* ============================================= BREADCRUMBS ============================================= */ [dir="rtl"] .breadcrumbs .container { flex-direction: row-reverse; justify-content: flex-start; } /* ============================================= FORMATION HERO ============================================= */ [dir="rtl"] .formation-hero-inner { flex-direction: row-reverse; } [dir="rtl"] .formation-hero h1, [dir="rtl"] .formation-hero p { text-align: right; } /* ============================================= FORMATION INFO CARD ============================================= */ [dir="rtl"] .info-row { text-align: right; } [dir="rtl"] .info-row span:first-child::after { content: " :"; } [dir="rtl"] .info-row span:last-child { text-align: right !important; padding-right: 1rem; flex: 1; } [dir="rtl"] .info-row span:first-child i { margin-right: 0 !important; margin-left: 6px; } /* ============================================= FORMATION BODY ============================================= */ [dir="rtl"] .formation-body-grid { direction: rtl; } [dir="rtl"] .formation-section h2 { flex-direction: row-reverse; text-align: right; } [dir="rtl"] .objectives-list li, [dir="rtl"] .programme-list li { text-align: right; } /* ============================================= SECTIONS & CARDS ============================================= */ [dir="rtl"] .section-header { text-align: right; } [dir="rtl"] .section-tag { text-align: right; } [dir="rtl"] .formation-card { text-align: right; } [dir="rtl"] .formation-card .card-meta { flex-direction: row-reverse; } [dir="rtl"] .feature-item { text-align: right; } /* ============================================= BUTTONS ============================================= */ [dir="rtl"] .btn { font-family: 'Tajawal', sans-serif; font-weight: 700; } [dir="rtl"] .btn i { margin-right: 0; margin-left: 8px; } /* ============================================= FORMATION CARDS ============================================= */ [dir="rtl"] .card-link .fa-arrow-right { transform: scaleX(-1); } [dir="rtl"] .card-meta { flex-direction: row-reverse; } /* ============================================= HERO SECTION ============================================= */ [dir="rtl"] .hero-content { text-align: right; } [dir="rtl"] .hero-actions { flex-direction: row-reverse; justify-content: flex-end; } [dir="rtl"] .hero-badge { flex-direction: row-reverse; } /* ============================================= STATS BAR ============================================= */ [dir="rtl"] .stat-item { border-right: none; border-left: 1px solid rgba(255,255,255,0.15); } [dir="rtl"] .stat-item:last-child { border-left: none; } /* ============================================= CONTACT / INSCRIPTION PAGE (no [dir="rtl"] needed — file is only loaded on Arabic pages) ============================================= */ .contact-hero { text-align: right; } .fs-controls { flex-direction: row-reverse; } .fs-label { text-align: right; } .fs-list { flex-direction: row-reverse; } /* ============================================= FOOTER ============================================= */ [dir="rtl"] .footer-inner { direction: rtl; } [dir="rtl"] .footer-brand { text-align: right; } [dir="rtl"] .footer-col h5 { text-align: right; } [dir="rtl"] .footer-col ul { text-align: right; } [dir="rtl"] .footer-social { flex-direction: row-reverse; justify-content: flex-start; } [dir="rtl"] .footer-bottom-inner { flex-direction: row-reverse; } /* ============================================= MOBILE (≤1024px) ============================================= */ @media (max-width: 1024px) { [dir="rtl"] .nav-menu { text-align: right; align-items: flex-end; } [dir="rtl"] .nav-menu > li > a { text-align: right; } [dir="rtl"] .dropdown-menu li a { flex-direction: row-reverse; text-align: right; } [dir="rtl"] #lang-switcher { order: 0; padding: 0.5rem 1.5rem; border-bottom: 1px solid var(--border); } [dir="rtl"] .lang-switcher ul { flex-direction: row-reverse; justify-content: flex-end; } }