/* ============================================================================ * PaxPost24 RTL Fix v1.0 * ============================================================================ * Universal RTL flip for index.html + all portals when fa/ar/he/ur is active. * Activated via: + * ============================================================================ */ /* === FARSI/ARABIC FONTS === */ @import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@300;400;500;600;700;800;900&family=Cairo:wght@300;400;500;600;700;800;900&display=swap'); html[dir="rtl"] body, body.pp-rtl { direction: rtl; text-align: right; } /* Persische Texte = Vazirmatn, Arabische = Cairo */ html[lang="fa"] body, html[lang="ur"] body { font-family: 'Vazirmatn', 'Inter', -apple-system, sans-serif !important; } html[lang="ar"] body, html[lang="he"] body { font-family: 'Cairo', 'Inter', -apple-system, sans-serif !important; } /* Headlines bleiben Playfair (Latin) für Brand-Konsistenz - Farsi/Arabisch nutzen Vazirmatn/Cairo */ html[lang="fa"] body h1, html[lang="fa"] body h2, html[lang="fa"] body h3, html[lang="ar"] body h1, html[lang="ar"] body h2, html[lang="ar"] body h3, html[lang="he"] body h1, html[lang="he"] body h2, html[lang="he"] body h3, html[lang="ur"] body h1, html[lang="ur"] body h2, html[lang="ur"] body h3 { font-family: inherit !important; font-weight: 700; } /* === GLOBAL TEXT ALIGNMENT FLIP === */ body.pp-rtl, body.pp-rtl p, body.pp-rtl div, body.pp-rtl span, body.pp-rtl li, body.pp-rtl label { text-align: right; } /* Aber: zentrierte und Button-Texte bleiben center */ body.pp-rtl [style*="text-align:center"], body.pp-rtl [style*="text-align: center"], body.pp-rtl .center, body.pp-rtl button, body.pp-rtl .btn, body.pp-rtl .pp-btn { text-align: center !important; } /* === FLEX FLIP === */ body.pp-rtl .pp-header, body.pp-rtl .pp-nav, body.pp-rtl .pp-hero-content, body.pp-rtl .hero-actions, body.pp-rtl .features-grid, body.pp-rtl .stats-row, body.pp-rtl .nav-links, body.pp-rtl .footer-cols, body.pp-rtl [class*="flex-row"], body.pp-rtl [class*="grid-row"] { flex-direction: row-reverse !important; } /* === HERO BLOCK === */ body.pp-rtl .pp-hero-mono::before { margin-left: 10px; margin-right: 0; } body.pp-rtl .pp-hero-mono { flex-direction: row-reverse; justify-content: flex-end; } /* === HEADER === */ body.pp-rtl .pp-header-inner, body.pp-rtl .pp-header > div, body.pp-rtl header > div { flex-direction: row-reverse !important; } body.pp-rtl .pp-logo, body.pp-rtl .logo { margin-left: auto; margin-right: 0; } body.pp-rtl .pp-nav-links, body.pp-rtl .nav-links { flex-direction: row-reverse; } /* Hamburger menu position */ body.pp-rtl .pp-hamburger, body.pp-rtl .hamburger, body.pp-rtl [class*="menu-btn"] { margin-left: 0 !important; margin-right: auto !important; left: 16px !important; right: auto !important; } /* Lang button position */ body.pp-rtl .pp-lang-btn, body.pp-rtl [class*="lang-btn"] { margin-right: 12px; margin-left: 0; } /* === BUTTONS === */ body.pp-rtl .btn, body.pp-rtl .pp-btn { direction: rtl; } body.pp-rtl .btn .icon-arrow-right::before, body.pp-rtl .btn::after, body.pp-rtl button::after { transform: scaleX(-1); } /* === CARDS === */ body.pp-rtl .feature-card, body.pp-rtl .pp-card, body.pp-rtl .stat-card, body.pp-rtl [class*="-card"] { text-align: right; } body.pp-rtl .feature-card .icon, body.pp-rtl .feature-card svg, body.pp-rtl .pp-card .icon { margin-right: 0; margin-left: auto; } /* === FORMS === */ body.pp-rtl input, body.pp-rtl textarea, body.pp-rtl select { direction: rtl; text-align: right; } body.pp-rtl input[type="email"], body.pp-rtl input[type="url"], body.pp-rtl input[type="number"], body.pp-rtl input[type="tel"] { direction: ltr; /* Email/URL/Zahlen bleiben LTR */ text-align: right; /* aber rechts ausgerichtet */ } body.pp-rtl label { text-align: right; display: block; } /* === MARGIN/PADDING SWAP === */ body.pp-rtl [style*="padding-left"] { padding-right: var(--rtl-pl, inherit) !important; padding-left: 0 !important; } body.pp-rtl [style*="padding-right"] { padding-left: var(--rtl-pr, inherit) !important; padding-right: 0 !important; } body.pp-rtl [style*="margin-left:auto"], body.pp-rtl [style*="margin-left: auto"] { margin-left: 0 !important; margin-right: auto !important; } body.pp-rtl [style*="margin-right:auto"], body.pp-rtl [style*="margin-right: auto"] { margin-right: 0 !important; margin-left: auto !important; } /* === LISTS === */ body.pp-rtl ul, body.pp-rtl ol { padding-left: 0; padding-right: 1.5em; } body.pp-rtl .pt-features li { padding-left: 0; padding-right: 14px; } body.pp-rtl .pt-features li::before { left: auto; right: 0; } /* === DROPDOWN === */ body.pp-rtl .pp-lang-dropdown, body.pp-rtl .lang-dropdown, body.pp-rtl [class*="-dropdown"] { right: auto !important; left: 16px !important; text-align: right; } /* === BORDERS === */ body.pp-rtl [style*="border-left"] { border-right: var(--rtl-bl, inherit); border-left: none !important; } /* === ARROWS / CHEVRONS FLIP === */ body.pp-rtl .arrow-right, body.pp-rtl [class*="chevron-right"], body.pp-rtl [class*="caret-right"] { transform: scaleX(-1); display: inline-block; } /* === NUMBERS STAY LTR === */ body.pp-rtl .pp-mono, body.pp-rtl [class*="mono"], body.pp-rtl .price, body.pp-rtl .amount, body.pp-rtl time { direction: ltr; unicode-bidi: bidi-override; display: inline-block; } /* === TIMELINE / PROGRESS === */ body.pp-rtl .pp-timeline { flex-direction: row-reverse; } /* === FOOTER === */ body.pp-rtl .pp-footer .footer-cols { flex-direction: row-reverse; } /* === HERO MONO LINE FLIP === */ body.pp-rtl .pp-hero-mono::before, body.pp-rtl [class*="hero-mono"]::before { content: ''; display: inline-block; } /* === MOBILE MENU SLIDE === */ body.pp-rtl .pp-mobile-menu, body.pp-rtl .mobile-menu { left: auto !important; right: 0 !important; transform: translateX(100%); } body.pp-rtl .pp-mobile-menu.open, body.pp-rtl .mobile-menu.open { transform: translateX(0); } /* === TOASTS === */ body.pp-rtl #ppI18nToast, body.pp-rtl .pp-toast, body.pp-rtl [class*="toast"] { right: auto !important; left: 24px !important; transform: translateX(-380px); } body.pp-rtl #ppI18nToast.show, body.pp-rtl .pp-toast.show { transform: translateX(0); } /* === ANIMATIONS FLIP === */ body.pp-rtl .pp-fade-in-right { animation-name: ppFadeInLeft; } body.pp-rtl .pp-fade-in-left { animation-name: ppFadeInRight; } @keyframes ppFadeInRight { from { opacity: 0; transform: translateX(20px); } to { opacity: 1; transform: translateX(0); } } @keyframes ppFadeInLeft { from { opacity: 0; transform: translateX(-20px); } to { opacity: 1; transform: translateX(0); } } /* === CARDS GRID === */ body.pp-rtl .pricing-cards, body.pp-rtl .features-cards, body.pp-rtl .partner-types, body.pp-rtl .stats-grid { /* Grid wird auto-flipped via direction:rtl auf body */ } /* === KEEP THESE LTR ALWAYS === */ body.pp-rtl code, body.pp-rtl pre, body.pp-rtl kbd, body.pp-rtl samp, body.pp-rtl .code, body.pp-rtl .url, body.pp-rtl [class*="code"] { direction: ltr; text-align: left; unicode-bidi: embed; } /* === PRICE TAGS === */ body.pp-rtl .pt-price, body.pp-rtl .price-tag { text-align: right; } /* === SLIDER / PAGINATION === */ body.pp-rtl .pagination, body.pp-rtl .swiper-pagination { flex-direction: row-reverse; } /* === TABS === */ body.pp-rtl .tab-bar, body.pp-rtl .pp-tabs { flex-direction: row-reverse; } /* === SVG ICONS FLIP === */ body.pp-rtl svg.icon-directional, body.pp-rtl svg[data-flip-rtl="true"] { transform: scaleX(-1); } /* === SCROLLBAR === */ body.pp-rtl ::-webkit-scrollbar { /* keep right side scrollbar in RTL too */ } /* === MODAL CLOSE BUTTON === */ body.pp-rtl .modal-close, body.pp-rtl [class*="close-btn"] { right: auto !important; left: 16px !important; }