/* * Oud Al Khoori – RTL (Right-to-Left) Overrides * Loaded conditionally when is_rtl() is true (Arabic, etc.) */ /* Local Arabic typeface — file lives at /assets/Fontes/, this CSS lives at /assets/css/ */ @font-face { font-family: 'Frutiger LT Arabic'; src: url('../Fontes/FrutigerLTArabic-55Roman.ttf') format('truetype'); font-weight: 400; font-style: normal; font-display: swap; } /* ========== GENERAL ========== */ body.rtl { direction: rtl; text-align: right; /* Override the theme's font CSS variables so every var(--fontPrimary) / var(--fontSecondary) reference (headings, hero panels, prices, etc.) picks up Frutiger automatically — no per-class !important needed. */ --fontPrimary: 'Frutiger LT Arabic', 'Lato', sans-serif; --fontSecondary: 'Frutiger LT Arabic', 'Lato', sans-serif; } /* Belt-and-suspenders: force Frutiger on every rendered element in RTL — EXCEPT icon-font elements (Dashicons, FontAwesome, side-cart `xoo-*` icons, `` tags used for icons, etc.) where the icon glyph lives in a private Unicode area that Frutiger doesn't have, which would render as "?" boxes. */ body.rtl, body.rtl *:not(i):not(svg):not(svg *):not([class*="icon"]):not([class*="Icon"]):not([class*="dashicons"]):not([class*="xoo-"]):not([class^="fa-"]):not([class*=" fa-"]):not(.fa):not(.fab):not(.far):not(.fas):not(.fal):not(.fad) { font-family: 'Frutiger LT Arabic', 'Lato', sans-serif !important; } /* ========== WOOCOMMERCE ========== */ /* Sale badge: flip from left to right */ body.rtl .woocommerce span.onsale, body.rtl .woocommerce ul.products li.product .onsale { left: auto; right: 10px; } /* Product grid badge: top-right instead of top-left */ body.rtl .woocommerce ul.products li.product .onsale { left: auto; right: 0; } /* Page titles — handled by text-align: start in main CSS */ /* Cart totals: float left in RTL */ body.rtl .woocommerce .cart-collaterals .cart_totals { float: left; } /* My Account navigation: border flip */ body.rtl .woocommerce-account .woocommerce-MyAccount-navigation { border-right: none; border-left: 1px solid rgba(18, 18, 18, 0.08); } /* Quantity input borders: symmetric, no change needed */ /* Checkbox checkmark position */ body.rtl .oak-checkbox.checked::after { left: auto; right: 4px; } /* Back link arrow: flip */ body.rtl .oak-back-link svg { transform: scaleX(-1); } /* Top bar: sort label */ body.rtl .oak-top-bar { justify-content: flex-start; } /* Filter sidebar */ body.rtl .oak-filter-toggle svg { margin-left: 0; margin-right: auto; } /* ========== PRODUCT SINGLE ========== */ /* No row-reverse needed — direction:rtl on auto-flips flex children, placing the image (first HTML child) on the right and summary on the left. */ @media (max-width: 767px) { body.rtl .oak-product-row { flex-direction: column; } } /* ========== HEADER / FOOTER ========== */ /* Cart badge: flip from -right to -left */ body.rtl .site-header .cart-badge { right: auto; left: -6px; } /* Search bar */ body.rtl #searchBar form { flex-direction: row-reverse; } /* ========== GIFT SECTION (template-homepage.php) ========== */ body.rtl .gift-section-layout { flex-direction: row-reverse; } body.rtl .gift-nav-prev { left: auto; right: -18px; } body.rtl .gift-nav-next { right: auto; left: -18px; } body.rtl .gift-nav-prev svg, body.rtl .gift-nav-next svg { transform: scaleX(-1); } /* ========== VIDEO SECTION ========== */ body.rtl .video-play-btn { right: auto; left: 24px; } /* ========== PROMO BANNERS ========== */ body.rtl .promo-gradient-overlay { background: linear-gradient(to left, rgba(0,0,0,0.8), rgba(0,0,0,0.55), rgba(0,0,0,0.2)); } body.rtl .promo-shop-btn-corner { right: auto; left: 28px; } /* ========== PRODUCT BADGES (Tailwind overrides) ========== */ body.rtl .product-badge { left: auto; right: 8px; } /* ========== LOGIN PAGE ========== */ body.rtl .login .button-primary { float: left; } /* ========== MOBILE MENU ========== */ body.rtl #mobileMenu nav { text-align: right; } /* ========== SHOP LAYOUT ========== */ /* In RTL, default flex direction naturally puts sidebar (first HTML child) on the right */ body.rtl .oak-sidebar { padding-inline-end: 0; padding-inline-start: 30px; } /* Top bar: keep sort/count aligned to the right in RTL (mirror LTR position) */ body.rtl .oak-top-bar { justify-content: flex-start; } /* Fix select underline width in RTL */ body.rtl .oak-top-bar .woocommerce-ordering select { min-width: auto; width: auto; } /* Result count alignment in RTL */ body.rtl .oak-top-bar .woocommerce-result-count { margin-inline-start: 12px; } @media (max-width: 767px) { body.rtl .oak-shop-layout { flex-direction: column; } }