/* Apex RTL overrides — loaded only when dir="rtl" (Arabic pages).
   Prefer logical properties so most layout flips automatically; this file
   handles the cases that don't. Expand per page during Wave 1. */

html[dir="rtl"] body { font-family: "GE SS Two", "ARSMaquettePro", sans-serif; text-align: right; }

/* Navbar mirrors automatically via the dir="rtl" cascade (the nav <ul>s are
   #navbar-list / .nav-list ul, so they reverse on their own). We only flip the
   PHYSICAL margins/floats that don't auto-flip:
     - .menu-margin: 70px gap between the logo and the left nav block. In LTR it
       sits to the right of the logo; under RTL the logo moves right, so the gap
       must move to the right side too — otherwise the links jam against the logo.
     - .find-store-btn (and its icon): inter-item / icon-to-text gaps.
   (The previous `.navbar-nav { flex-direction: row-reverse }` rule was a no-op —
   the apex nav has no .navbar-nav element — and row-reverse would have double-
   reversed the order against dir=rtl; removed.) */
html[dir="rtl"] .menu-margin       { margin-left: 0; margin-right: 70px; }
html[dir="rtl"] .find-store-btn     { margin-right: 0; margin-left: 35px; }
html[dir="rtl"] .find-store-btn svg { margin-right: 0; margin-left: 12px; }
html[dir="rtl"] .header-main-right .nav-list.float-end { float: none; }

html[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before { transform: scaleX(-1); }