/* Sunfere Fashion 3.09.20 - Arabic RTL refinements
   Additive overrides: keep all existing theme CSS files unchanged.
   Applied only when request.document_direction == "rtl".
   CSS logical properties (margin-inline, padding-inline, inset-inline) already follow dir.
*/

/* Base form labels and drawer border */
html[dir="rtl"] .field__label {
  transform-origin: right top;
}
html[dir="rtl"] .drawer-border-shadow {
  border-width: 0 0 0 var(--drawer-border-thickness);
}

/* Desktop navigation / dropdown */
html[dir="rtl"] [layout="left_logo_left_menu"] .header-nav {
  margin: 0 0 0 auto;
}
html[dir="rtl"] .header-nav-dropdown-panel__link {
  padding: 4px 0 4px 15px;
}

/* Select labels and the drop-down arrow padding */
html[dir="rtl"] theme-select > select,
html[dir="rtl"] theme-select > .theme-select__placeholder {
  padding: var(--padding-block-start)
           var(--padding-inline-start)
           var(--padding-block-start)
           calc(var(--padding-inline-end) + var(--icon-size) + 10px);
}

/* Mini-cart success notification anchored from the left */
html[dir="rtl"] .cart-notification__body {
  inset: 100% auto auto 10%;
}
@media (max-width: 959px) {
  html[dir="rtl"] .cart-notification__body {
    inset: 100% auto auto 0;
  }
}

/* Product swatch carousel fade */
html[dir="rtl"] .block-product-variant-picker .variant-picker__swatch-carousel-button {
  background: linear-gradient(to left, transparent, #fff 40%);
}

/* Product media gallery + text cards: physical scroll padding */
@media (max-width: 959px) {
  html[dir="rtl"] .product-detail__media-gallery[data-mobile-layout="two-columns"] .media-gallery__list,
  html[dir="rtl"] .product-detail__media-gallery[data-mobile-layout="hide-thumbnail"] .media-gallery__list,
  html[dir="rtl"] .product-detail__media-gallery[data-mobile-layout="show-thumbnail"] .media-gallery__list {
    scroll-padding-left: auto;
    scroll-padding-right: var(--padding-inline-start);
  }
  html[dir="rtl"] .text-columns-with-image__card-group-scroll {
    scroll-padding-left: auto;
    scroll-padding-right: var(--card-group-padding);
  }
}

/* Only the seven horizontal directional icons are marked with this class. */
html[dir="rtl"] svg.sunfere-directional-arrow {
  scale: -1 1;
}

/* Keep prices and numeric fields in their conventional reading order */
html[dir="rtl"] .product-price__sale,
html[dir="rtl"] .product-price__origin,
html[dir="rtl"] .cart-item__total-final,
html[dir="rtl"] .cart-item__total-original,
html[dir="rtl"] .price-range-input input,
html[dir="rtl"] .product-item__price,
html[dir="rtl"] .product-item__ori-price,
html[dir="rtl"] .gsf-spd-sale-price,
html[dir="rtl"] .gsf-spd-regular-price {
  direction: ltr;
  unicode-bidi: isolate;
}
/* Sunfere Fashion 3.09.20: additional RTL fixes.
   Append to the END of public/base/sunfere-arabic-rtl.css.
   These selectors affect RTL only. */

/* A logical right inset changes sides in RTL, but translateX does not. */
html[dir="rtl"] .announcement-bar__button-wrapper,
html[dir="rtl"] .image-promotion__content .image-promotion__content-inner,
html[dir="rtl"] .product-media-preview__tools,
html[dir="rtl"] .product-group .media-container__pager,
html[dir="rtl"] .product-group .media-container__pager--arrows,
html[dir="rtl"] .product-anchor__content,
html[dir="rtl"] .product-anchor__content::before {
  transform: translateX(50%);
}

/* Center loading indicator when its inset-inline-start flips sides. */
html[dir="rtl"] .facets-loading {
  transform: translate(50%, -50%);
}

/* The closed mobile navigation should slide out to the RTL start side. */
html[dir="rtl"] .header-nav-drawer:not(.open) .header-nav-drawer__content {
  transform: translateX(100%);
}

/* Desktop overlapping image/text block. */
@media (min-width: 960px) {
  html[dir="rtl"] .image-with-text-section.overlap .image-with-text__group {
    transform: translateX(36px);
  }
}

/* A logical right-anchored switch should slide toward the physical left. */
html[dir="rtl"] .field-switch input:checked + .field-switch-slider::before {
  transform: translateX(-20px);
}

/* Fix an invalid declaration in the earlier patch (auto is not a scroll-padding value). */
@media (max-width: 959px) {
  html[dir="rtl"] .product-detail__media-gallery[data-mobile-layout="two-columns"] .media-gallery__list,
  html[dir="rtl"] .product-detail__media-gallery[data-mobile-layout="hide-thumbnail"] .media-gallery__list,
  html[dir="rtl"] .product-detail__media-gallery[data-mobile-layout="show-thumbnail"] .media-gallery__list {
    scroll-padding-left: 0;
    scroll-padding-right: var(--padding-inline-start);
  }
  html[dir="rtl"] .text-columns-with-image__card-group-scroll {
    scroll-padding-left: 0;
    scroll-padding-right: var(--card-group-padding);
  }
}

/* RTL：移动端分类页商品数量右侧留白 */
@media (max-width: 959px) {
  html[dir="rtl"] .page-width.facets-count.js-action {
    padding-right: 10px !important;
    box-sizing: border-box;
  }
}

@media (max-width: 959px) {
  html[dir="rtl"] .facets-mobile-inner > .page-width.facets-count {
    position: relative !important;
    left: -10px !important;
  }
}
/* SHOPLINE 高阶商品列表 RTL */
html[dir="rtl"] .advc-product-item-info {
  direction: rtl;
  text-align: right !important;
}

html[dir="rtl"] .advc-product-list-item-slide {
  margin-left: 0 !important;
  margin-right: 10px !important;
}

/* 商品推荐插件 RTL 适配 */

/* 商品从右向左排列 */
html[dir="rtl"] .recommend-grid {
  direction: rtl !important;
}

/* 商品卡片及标题右对齐 */
html[dir="rtl"] .recommend-grid .col,
html[dir="rtl"] .recommend-grid .recommend-product-item-info,
html[dir="rtl"] .recommend-grid .recommend-product-item-title {
  direction: rtl !important;
  text-align: right !important;
}

/* 价格从右侧开始排列 */
html[dir="rtl"] .recommend-grid .recommend-product-item-price {
  direction: rtl !important;
  text-align: right !important;
  justify-content: flex-start !important;
}

/* 金额数字保持正常顺序 */
html[dir="rtl"] .recommend-grid .notranslate {
  direction: ltr !important;
  unicode-bidi: isolate;
}

/* 促销标签移动至图片右上角 */
html[dir="rtl"] .recommend-grid .recommend-product-item-sale-tag {
  left: auto !important;
  right: 8px !important;
}

/* 加购按钮适配阿拉伯语 */
html[dir="rtl"] .recommend-grid .recommend-product-item-button-warpper {
  direction: rtl !important;
}

/* 加购车后的商品推荐：Swiper RTL */
html[dir="rtl"] .swiper:has(.recommend-product-item-button-mobile-warpper),
html[dir="rtl"] .swiper-container:has(.recommend-product-item-button-mobile-warpper) {
  direction: rtl !important;
}

/* 商品卡片信息 */
html[dir="rtl"] .swiper-wrapper:has(.recommend-product-item-button-mobile-warpper) .recommend-product-item-info {
  direction: rtl !important;
  text-align: right !important;
}

/* 标题 */
html[dir="rtl"] .swiper-wrapper:has(.recommend-product-item-button-mobile-warpper) .recommend-product-item-title {
  text-align: right !important;
}

/* 价格、划线价、折扣 */
html[dir="rtl"] .swiper-wrapper:has(.recommend-product-item-button-mobile-warpper) .recommend-product-item-price {
  direction: rtl !important;
  justify-content: flex-start !important;
  text-align: right !important;
}

/* 价格数字仍从左向右显示 */
html[dir="rtl"] .swiper-wrapper:has(.recommend-product-item-button-mobile-warpper) .notranslate {
  direction: ltr !important;
  unicode-bidi: isolate;
}

/* 促销标签右对齐 */
html[dir="rtl"] .swiper-wrapper:has(.recommend-product-item-button-mobile-warpper) .recommend-product-item-sale-tag {
  left: auto !important;
  right: 8px !important;
}

/* 加购按钮 */
html[dir="rtl"] .swiper-wrapper:has(.recommend-product-item-button-mobile-warpper) .recommend-product-item-button-mobile-warpper {
  direction: rtl !important;
}