/* ═══════════════════════════════════════════════════════════════════════════ YOYO WEBSITE — RTL (Right-to-Left) STYLES Arabic Language Support for Frozen Yogurt & Desserts — Irbid, Jordan This file contains ONLY position and margin overrides needed for RTL. The browser handles text direction, flex order, and text alignment automatically via the dir="rtl" attribute on . ═══════════════════════════════════════════════════════════════════════════ */ /* ═══════════════════════════════════════════════════════════════════════════ 1. NAVBAR ═══════════════════════════════════════════════════════════════════════════ */ .navbar-burger { margin-right: auto; margin-left: 0; } /* ═══════════════════════════════════════════════════════════════════════════ 2. INGREDIENT CARDS ═══════════════════════════════════════════════════════════════════════════ */ .ingredient-num { margin-right: auto; margin-left: 0; } /* ═══════════════════════════════════════════════════════════════════════════ 3. CATEGORIES SECTION ═══════════════════════════════════════════════════════════════════════════ */ .cat-badge { margin-left: 0; margin-right: auto; } .cat-content { left: auto; right: 1.5rem; } /* ═══════════════════════════════════════════════════════════════════════════ 4. SWEETS SECTION ═══════════════════════════════════════════════════════════════════════════ */ .sweet-tag { left: auto; right: 1rem; } /* ═══════════════════════════════════════════════════════════════════════════ 5. LOCATION SECTION ═══════════════════════════════════════════════════════════════════════════ */ .info-icon { margin-left: 1rem; margin-right: 0; } /* ═══════════════════════════════════════════════════════════════════════════ 6. IMAGE CAPTIONS ═══════════════════════════════════════════════════════════════════════════ */ .image-caption { left: auto; right: 1.5rem; } /* ═══════════════════════════════════════════════════════════════════════════ 7. SCROLL ANIMATION (FRAME-BASED) ═══════════════════════════════════════════════════════════════════════════ */ .fy-animation-phase-text { left: auto; right: clamp(2rem, 8vw, 8rem); } /* ═══════════════════════════════════════════════════════════════════════════ 8. CATERING SECTION ═══════════════════════════════════════════════════════════════════════════ */ .catering-badge { margin-right: 0; margin-left: auto; } /* ═══════════════════════════════════════════════════════════════════════════ 9. FOOTER ═══════════════════════════════════════════════════════════════════════════ */ .footer-section-links { align-items: flex-end; } /* ═══════════════════════════════════════════════════════════════════════════ 10. BUTTONS — FLIP DIRECTIONAL ICONS ═══════════════════════════════════════════════════════════════════════════ */ .btn svg[data-lucide="arrow-right"], .btn svg[data-lucide="chevron-right"], .btn svg[data-lucide="arrow-up-right"] { transform: scaleX(-1); } /* ═══════════════════════════════════════════════════════════════════════════ 11. RESPONSIVE ADJUSTMENTS ═══════════════════════════════════════════════════════════════════════════ */ @media (max-width: 768px) { .cat-content { right: 1rem; } .sweet-tag { right: 0.625rem; } .fy-animation-phase-text { right: 5.5rem; } }