/* Nahleh RTL layer — Dawn is authored with physical (left/right) properties
   throughout. This file mirrors the components used on the header, footer,
   and product page for html[dir="rtl"]. New Nahleh markup is authored
   logical-property-first (margin-inline-*, inset-inline-*) and needs no
   entry here.

   Scope note: drawer/menu-drawer slide-in directions are pure-CSS state
   (no JS sets inline transforms), so they are safely mirrored below.
   Deeper interaction nuances (e.g. horizontal slider scroll-snap math in
   component-slider.css, which depends on browser-specific scrollLeft sign
   conventions in RTL) are left as Dawn ships them and should get a manual
   QA pass once the Collection page phase brings sliders into daily use. */

html[dir='rtl'] {
  /* ============ Menu drawer ============ */
}

html[dir='rtl'] .menu-drawer {
  left: auto;
  right: 0;
  transform: translateX(100%);
}

html[dir='rtl'] .menu-drawer summary.menu-drawer__menu-item {
  padding-right: 3rem;
  padding-left: 5.2rem;
}

html[dir='rtl'] .menu-drawer__menu-item > .svg-wrapper {
  right: auto;
  left: 3rem;
}

html[dir='rtl'] .js .menu-drawer__submenu {
  left: auto;
  right: 0;
  transform: translateX(-100%);
}

html[dir='rtl'] .menu-drawer__close-button {
  text-align: right;
  padding: 1.2rem 3rem 1.2rem 2.6rem;
}

html[dir='rtl'] .menu-drawer__close-button .svg-wrapper {
  margin-right: 0;
  margin-left: 1rem;
}

html[dir='rtl'] .menu-drawer__account account-icon > .svg-wrapper {
  margin-right: 0;
  margin-left: 1rem;
}

html[dir='rtl'] .menu-drawer__account shop-user-avatar {
  margin-right: -0.45rem;
  margin-left: 0.55rem;
}

html[dir='rtl'] .menu-drawer .list-social {
  margin-left: 0;
  margin-right: -1.25rem;
}

/* ============ Mega menu / list menu dropdowns ============ */

html[dir='rtl'] .mega-menu__content {
  left: auto;
  right: 0;
}

html[dir='rtl'] .header__submenu.list-menu--disclosure {
  border-left: 0.1rem solid rgba(var(--color-foreground), 0.08);
  border-right: 0;
}

html[dir='rtl'] .list-menu--right {
  right: auto;
  left: 0;
}

/* ============ Header search ============ */

html[dir='rtl'] .search__input.field__input {
  padding-right: 1.6rem;
  padding-left: 9.8rem;
}

html[dir='rtl'] .search__button {
  right: auto;
  left: var(--inputs-border-width);
}

html[dir='rtl'] .reset__button {
  right: auto;
  left: calc(var(--inputs-border-width) + 4.4rem);
}

html[dir='rtl'] .reset__button::after {
  right: auto;
  left: 0;
  border-right: 0;
  border-left: 0.1rem solid rgba(var(--color-foreground), 0.08);
}

html[dir='rtl'] .predictive-search {
  left: auto;
  right: -0.1rem;
}

html[dir='rtl'] .predictive-search--header {
  right: auto;
  left: 0;
}

html[dir='rtl'] .predictive-search__item {
  text-align: right;
}

html[dir='rtl'] .predictive-search__item--term .icon-arrow {
  margin-left: 0;
  margin-right: calc(var(--font-heading-scale) * 2rem);
  transform: scaleX(-1);
}

/* ============ Cart notification ============ */

html[dir='rtl'] .cart-notification-wrapper {
  right: auto;
  left: 0;
}

html[dir='rtl'] .cart-count-bubble {
  left: auto;
  right: 2.2rem;
}

html[dir='rtl'] .cart-notification__heading svg,
html[dir='rtl'] .cart-notification-product svg {
  margin-right: 0;
  margin-left: 1rem;
}

/* ============ Cart drawer ============ */
/* Flexbox `justify-content: flex-end` on .drawer already flips sides with
   dir="rtl", moving the panel to the left edge — only the off-canvas
   transform + edge-touching border/close-button need re-mirroring. */

html[dir='rtl'] .drawer__inner {
  transform: translateX(-100%);
  border-right: 0.1rem solid rgba(var(--color-foreground), 0.2);
  border-left: 0;
}

html[dir='rtl'] .drawer.active .drawer__inner {
  transform: translateX(0);
}

html[dir='rtl'] .drawer__close {
  right: auto;
  left: -10px;
}

html[dir='rtl'] .cart-drawer__warnings .drawer__close {
  left: 5px;
  right: auto;
}

html[dir='rtl'] .cart-drawer .cart-item__nested-line .cart-item__image {
  float: left;
}

html[dir='rtl'] .cart-drawer .cart-items thead th:nth-child(2) {
  padding-left: 0;
  padding-right: 0;
}

html[dir='rtl'] .cart-drawer .cart-item .loading__spinner {
  right: auto;
  left: 5px;
}

html[dir='rtl'] .cart-drawer .cart-item > td + td {
  padding-left: 0;
  padding-right: 1rem;
}

html[dir='rtl'] .cart-drawer .tax-note {
  text-align: right;
  margin: 1.2rem auto 2rem 0;
}

/* ============ Pagination ============ */

html[dir='rtl'] .pagination__list > li:not(:last-child) {
  margin-right: 0;
  margin-left: 1rem;
}

html[dir='rtl'] .pagination__item--next .icon {
  margin-left: 0;
  margin-right: -0.2rem;
  transform: rotate(-90deg);
}

html[dir='rtl'] .pagination__item--next:hover .icon {
  transform: rotate(-90deg) scale(1.07);
}

html[dir='rtl'] .pagination__item--prev .icon {
  margin-right: 0;
  margin-left: -0.2rem;
  transform: rotate(90deg);
}

html[dir='rtl'] .pagination__item--prev:hover .icon {
  transform: rotate(90deg) scale(1.07);
}

/* ============ Generic directional icon mirroring ============ */

html[dir='rtl'] .disclosure__button .icon-caret,
html[dir='rtl'] .facets__disclosure-vertical .icon-caret {
  transform: scaleX(-1);
}

html[dir='rtl'] .breadcrumbs__link + .breadcrumbs__link::before {
  transform: scaleX(-1);
}

/* ============ Product page ============ */

html[dir='rtl'] .product__media-wrapper .product__modal-opener--image {
  right: auto;
  left: 1.6rem;
}

html[dir='rtl'] .slider-buttons .slider-button--next .icon,
html[dir='rtl'] .slider-buttons .slider-button--prev .icon {
  transform: scaleX(-1);
}