/* ================================================================ RTL.CSS – Arabic right-to-left overrides Loaded only when is set. ================================================================ */ /* Arabic font */ @import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;800;900&display=swap'); [dir="rtl"] { font-family: 'Cairo', 'Montserrat', sans-serif; direction: rtl; text-align: right; } /* ── Navbar – Layout identisch zu DE/EN: Logo links, Sprache rechts ────────── */ /* flex-direction:row folgt der writing-direction → bei dir=rtl fließt row ebenfalls von rechts. direction:ltr auf der Navbar erzwingt echte LTR-Reihenfolge. */ [dir="rtl"] nav, [dir="rtl"] .navbar-container, [dir="rtl"] .navbar-inner { direction: ltr; flex-direction: row; } /* Separator: bei LTR-Layout bleibt border-left korrekt (zwischen Logo und Links) */ /* Linktext in der Navbar: uppercase+letter-spacing funktioniert mit Arabisch problemlos */ /* ── Promo Bar ──────────────────────────────────────────────────── */ [dir="rtl"] .promo-bar__track { animation-direction: reverse; } [dir="rtl"] .promo-bar__close { left: 12px; right: auto; } [dir="rtl"] .promo-bar__cta { margin-right: auto; margin-left: 48px; } /* ── Hero ───────────────────────────────────────────────────────── */ @media (min-width: 1051px) { [dir="rtl"] .hero-content-wrapper { flex-direction: row-reverse; } } [dir="rtl"] .hero-text { text-align: right; } /* ── Promo Section ──────────────────────────────────────────────── */ [dir="rtl"] .promo-cards { flex-direction: row-reverse; } [dir="rtl"] .promo-combined-labels { flex-direction: row-reverse; } /* ── Benefits ───────────────────────────────────────────────────── */ @media (min-width: 1051px) { [dir="rtl"] .benefits-container { flex-direction: row-reverse; } } [dir="rtl"] .benefits-text { text-align: right; } [dir="rtl"] .benefits-features { text-align: right; } [dir="rtl"] .benefits-button i { transform: rotate(180deg); } /* ── License Section ────────────────────────────────────────────── */ [dir="rtl"] .license-cards { direction: rtl; } [dir="rtl"] .license-details p { text-align: right; } /* ── Pricing ────────────────────────────────────────────────────── */ [dir="rtl"] .pricing-section__head { text-align: right; } [dir="rtl"] .pricing-tabs { flex-direction: row-reverse; } [dir="rtl"] .pricing-row { flex-direction: row-reverse; } [dir="rtl"] .pricing-fehlstunde { flex-direction: row-reverse; text-align: right; } [dir="rtl"] .pricing-fehlstunde__icon { margin-right: 0; margin-left: 1rem; } /* ── First Aid ──────────────────────────────────────────────────── */ @media (min-width: 1051px) { [dir="rtl"] .first-aid-container { flex-direction: row-reverse; } } [dir="rtl"] .first-aid-content { text-align: right; } [dir="rtl"] .first-aid-icons { text-align: right; } /* ── LKW Section ────────────────────────────────────────────────── */ @media (min-width: 1051px) { [dir="rtl"] .truck-license-container { flex-direction: row-reverse; } } [dir="rtl"] .truck-license-text { text-align: right; } [dir="rtl"] .truck-license-list li { flex-direction: row-reverse; text-align: right; } [dir="rtl"] .truck-license-list li i { margin-right: 0; margin-left: 0.6rem; } [dir="rtl"] .truck-button i { transform: rotate(180deg); } /* ── Absolventen ────────────────────────────────────────────────── */ [dir="rtl"] .absolventen-header { text-align: right; } /* ── Contact ────────────────────────────────────────────────────── */ /* Kein flex-direction:row-reverse – direction:rtl lässt Icon automatisch rechts erscheinen */ [dir="rtl"] .contact-header { text-align: right; } [dir="rtl"] .contact-card { text-align: right; } [dir="rtl"] .contact-email-bar i { margin-right: 0; margin-left: 0.5rem; } /* ── FAQ ────────────────────────────────────────────────────────── */ [dir="rtl"] .faq-container { text-align: right; } [dir="rtl"] .faq-question { flex-direction: row-reverse; } [dir="rtl"] .arrow-icon { margin-right: auto; margin-left: 0; } /* ── Footer ─────────────────────────────────────────────────────── */ /* Spaltenreihenfolge wie DE/EN – direction:ltr auf dem Container erzwingt echte LTR-Reihenfolge */ [dir="rtl"] .footer-container, [dir="rtl"] .footer-bottom__inner { direction: ltr; flex-direction: row; } /* Spalten-Inhalt bleibt Arabic RTL */ [dir="rtl"] .footer-brand-col, [dir="rtl"] .footer-col { direction: rtl; text-align: right; } [dir="rtl"] .footer-nav { padding-right: 0; } /* Kein flex-direction:row-reverse in Kontakt-Karten und Standort-Items – direction:rtl (vererbt von footer-col) platziert Icon automatisch rechts */ [dir="rtl"] .footer-contact-card { text-align: right; } [dir="rtl"] .footer-location__addr { text-align: right; } /* ── LTR-Daten: Telefon / E-Mail / Adresse / Uhrzeiten ─────────── */ /* direction:rtl würde Nummern und LTR-Strings spiegeln – hier erzwingen wir LTR */ [dir="rtl"] a[href^="tel:"], [dir="rtl"] a[href^="mailto:"] { direction: ltr; unicode-bidi: embed; display: inline-block; } /* Adressen und Öffnungszeiten in Kontakt-Karten */ [dir="rtl"] .contact-card__body span:not(.contact-card__label), [dir="rtl"] .footer-contact-card__body a, [dir="rtl"] .footer-location__addr { direction: ltr; unicode-bidi: embed; display: inline-block; } /* ── Cookie Banner ──────────────────────────────────────────────── */ [dir="rtl"] .cookie-banner__inner { flex-direction: row-reverse; } [dir="rtl"] .cookie-banner__text { text-align: right; } [dir="rtl"] .cookie-banner__actions { flex-direction: row-reverse; } [dir="rtl"] .cookie-option { flex-direction: row-reverse; } [dir="rtl"] .cookie-option__badge { margin-right: auto; margin-left: 0; } /* ── Language Switcher ──────────────────────────────────────────── */ .lang-switcher { display: flex; align-items: center; gap: 4px; flex-shrink: 0; } .lang-btn { display: inline-flex; align-items: center; justify-content: center; padding: 3px 8px; border-radius: 6px; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: rgba(255, 255, 255, 0.72); background: rgba(255, 255, 255, 0.12); border: 1.5px solid transparent; cursor: pointer; transition: all 0.2s; text-decoration: none !important; } .lang-btn:hover { background: rgba(255, 255, 255, 0.22); border-color: rgba(255, 255, 255, 0.5); color: #fff; } .lang-btn.active { background: var(--main-color, #0077b6); color: #fff; border-color: var(--main-color, #0077b6); } /* ── About / Team page ──────────────────────────────────────────── */ @media (min-width: 1051px) { [dir="rtl"] .about-container { flex-direction: row-reverse; } } [dir="rtl"] .about-text { text-align: right; } [dir="rtl"] .team-container { text-align: right; } [dir="rtl"] .timeline-item.left { flex-direction: row-reverse; } [dir="rtl"] .timeline-item.right { flex-direction: row; } [dir="rtl"] .timeline-content { text-align: right; } /* ── Legal pages ────────────────────────────────────────────────── */ [dir="rtl"] .legal-hero { text-align: right; } [dir="rtl"] .legal-hero__back { flex-direction: row-reverse; } [dir="rtl"] .legal-body { text-align: right; } [dir="rtl"] .legal-card { flex-direction: row-reverse; text-align: right; } [dir="rtl"] .legal-card__icon { margin-right: 0; margin-left: 1rem; } [dir="rtl"] .legal-section { text-align: right; } /* ── Modal ──────────────────────────────────────────────────────── */ [dir="rtl"] .modal-content { text-align: right; } [dir="rtl"] .checkbox-label { flex-direction: row-reverse; } [dir="rtl"] .close { right: auto; left: 1rem; } /* ── Fahrschueler page ──────────────────────────────────────────── */ [dir="rtl"] .fs-hero__inner { text-align: right; } [dir="rtl"] .fs-step { text-align: right; } [dir="rtl"] .fs-type-card { flex-direction: row-reverse; text-align: right; } [dir="rtl"] .fs-type-card__body { text-align: right; }