/* Arabic copy (dir="rtl"), loaded after the theme CSS. The theme's own CSS is mirrored by rtl_flip.mjs (rtlcss);
   this file only covers what a CSS mirror can't: arrow icons drawn as SVG paths, and Arabic line height. */

/* Arabic needs a little more line height than the Latin brand fonts */
html[dir="rtl"] body { line-height: 1.7; }
/* headings are set at ~1.05 for the Latin display font; Arabic letters (Lalezar) are taller and would run into the
   next line (collection titles over their description) */
html[dir="rtl"] :is(h1, h2, h3, h4, h5, h6, .h0, .h1, .h2, .h3, .h4, .h5, .trust-icons__title, .menu-drawer__submenu-title) { line-height: 1.35; }

/* signed numbers keep their sign in front ("-17%", not "17%-") */
html[dir="rtl"] .byob-mini-cart__badge { direction: ltr; unicode-bidi: isolate; }

/* SVG arrows that point "forward/back" (their direction is in the path, not in CSS) */
html[dir="rtl"] .i-custom-svg\:caretright,
html[dir="rtl"] .fcc__arrow svg,
html[dir="rtl"] .lp-review-slider [data-review-prev] svg,
html[dir="rtl"] .lp-review-slider [data-review-next] svg,
html[dir="rtl"] .ads-hero .ads-hero__arrow--next .ads-hero__arrow-icon,
html[dir="rtl"] .ads-hero .ads-hero__thumb-arrow--next .ads-hero__thumb-arrow-icon { transform: scaleX(-1); }

/* "previous/back" arrows drawn as the forward arrow turned 180°: a mirror can't flip 180°, and in RTL the plain
   (right-pointing) arrow is already the one that means "back" */
html[dir="rtl"] .ads-hero .ads-hero__arrow--prev .ads-hero__arrow-icon,
html[dir="rtl"] .ads-hero .ads-hero__thumb-arrow--prev .ads-hero__thumb-arrow-icon,
html[dir="rtl"] .mobile-facets__close-button .icon-arrow,
html[dir="rtl"] .menu-drawer__close-button .svg-wrapper { transform: none; }