/* MyToui Theme — one slider surface for products, categories and homepage sections. */
:root { --mt-slider-outside-factor: .54; }
.mytoui-slider-shell {
  --mt-slider-arrow-size: 40px;
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: var(--mt-slider-outer-shadow, none);
  overflow: visible;
}

.mytoui-slider-shell::after {
  content: "";
  position: absolute;
  z-index: 4;
  inset: 0;
  border-radius: inherit;
  background: transparent;
  box-shadow: var(--mt-slider-inner-shadow, none);
  pointer-events: none;
}

.mytoui-slider-shell[data-arrow-position="sides"][data-arrow-side-location="outside"] {
  width: calc(100% - (var(--mt-slider-arrow-size) * var(--mt-slider-outside-factor) * 2));
  margin-inline: calc(var(--mt-slider-arrow-size) * var(--mt-slider-outside-factor));
}

.mytoui-slider-shell > .is-mytoui-context-slider,
.mytoui-slider-shell > .mytoui-category-list,
.mytoui-slider-shell > .is-mytoui-native-category-track {
  position: relative;
  z-index: 1;
  order: 2;
}

.mytoui-theme ul.is-mytoui-context-slider,
.mytoui-theme .is-mytoui-native-category-track,
.mytoui-theme .mytoui-category-section.is-mytoui-slider .mytoui-category-list,
.mytoui-theme .mytoui-home-best__track.is-mytoui-context-slider {
  box-sizing: border-box !important;
  display: flex !important;
  grid-template-columns: none !important;
  flex-wrap: nowrap !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding-block: 0 !important;
  overflow-x: auto !important;
  overflow-y: visible !important;
  scroll-snap-type: x mandatory !important;
  scroll-behavior: smooth !important;
  scrollbar-width: none;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
}

.mytoui-theme ul.is-mytoui-context-slider::-webkit-scrollbar,
.mytoui-theme .is-mytoui-native-category-track::-webkit-scrollbar,
.mytoui-theme .mytoui-category-section.is-mytoui-slider .mytoui-category-list::-webkit-scrollbar,
.mytoui-theme .mytoui-home-best__track.is-mytoui-context-slider::-webkit-scrollbar { display: none; }

.mytoui-slider-clone { pointer-events: none !important; }
.mytoui-slider-clone a,
.mytoui-slider-clone button,
.mytoui-slider-clone input,
.mytoui-slider-clone select,
.mytoui-slider-clone textarea { pointer-events: none !important; }

.mytoui-slider-controls {
  position: relative;
  z-index: 8;
  order: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: var(--mt-slider-arrow-size);
  pointer-events: auto;
}

.mytoui-slider-shell[data-arrow-position="top"] > .mytoui-slider-controls { order: 1; margin-bottom: 10px; }
.mytoui-slider-shell[data-arrow-position="bottom"] > .mytoui-slider-controls { order: 3; margin-top: 10px; }
.mytoui-slider-shell[data-arrow-position="sides"] > .mytoui-slider-controls {
  position: absolute;
  z-index: 10;
  inset: 0;
  display: block;
  min-height: 0;
  margin: 0;
  pointer-events: none;
}

.mytoui-slider-arrow {
  display: grid !important;
  place-items: center !important;
  width: var(--mt-slider-arrow-size) !important;
  height: var(--mt-slider-arrow-size) !important;
  min-width: var(--mt-slider-arrow-size) !important;
  margin: 0 !important;
  padding: 0 !important;
  border: var(--mt-slider-arrow-border, 1px solid #d0d5dd) !important;
  border-radius: var(--mt-slider-arrow-radius, 999px) !important;
  color: var(--mt-slider-arrow-color, #344054) !important;
  background: var(--mt-slider-arrow-bg, #fff) !important;
  box-shadow: var(--mt-slider-arrow-shadow, none) !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  -webkit-tap-highlight-color: transparent;
}

.mytoui-slider-arrow:disabled { opacity: .32; cursor: default !important; }
.mytoui-slider-arrow svg {
  display: block;
  width: 52%;
  height: 52%;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: var(--mt-slider-arrow-stroke, 2) !important;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.mytoui-slider-shell[data-arrow-position="sides"] .mytoui-slider-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.mytoui-slider-shell[data-arrow-position="sides"][data-arrow-side-location="inside"] .mytoui-slider-arrow.is-prev { left: 8px; }
.mytoui-slider-shell[data-arrow-position="sides"][data-arrow-side-location="inside"] .mytoui-slider-arrow.is-next { right: 8px; }
.mytoui-slider-shell[data-arrow-position="sides"][data-arrow-side-location="outside"] .mytoui-slider-arrow.is-prev { left: calc(var(--mt-slider-arrow-size) * var(--mt-slider-outside-factor) * -1); }
.mytoui-slider-shell[data-arrow-position="sides"][data-arrow-side-location="outside"] .mytoui-slider-arrow.is-next { right: calc(var(--mt-slider-arrow-size) * var(--mt-slider-outside-factor) * -1); }

.mytoui-slider-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.mytoui-slider-shell[data-dots="no"] .mytoui-slider-dots { display: none !important; }
.mytoui-slider-shell[data-dots-position="outside"] { padding-bottom: 24px; }
.mytoui-slider-shell[data-dots-position="outside"] > .mytoui-slider-controls .mytoui-slider-dots {
  position: absolute;
  right: 50%;
  bottom: -20px;
  transform: translateX(50%);
  pointer-events: auto;
}
.mytoui-slider-shell[data-dots-position="inside"] > .mytoui-slider-controls .mytoui-slider-dots {
  position: absolute;
  right: 50%;
  bottom: 8px;
  transform: translateX(50%);
  pointer-events: auto;
}
.mytoui-slider-dots button {
  width: 7px;
  height: 7px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: #d0d5dd;
  cursor: pointer;
}
.mytoui-slider-dots button.is-active {
  width: 18px;
  background: var(--mt-primary, #15803d);
}

.is-mytoui-context-slider.is-dragging { cursor: grabbing; scroll-snap-type: none !important; user-select: none; }
.categories-slider-wrapper,
.subcat-slider-wrapper { overflow: visible !important; }

@media (max-width: 768px) {
  body.mytoui-theme { --mt-slider-outside-factor: .46; }
}

/* Neutralize QuickTheme's native slider frame once MyToui owns the track. */
.mytoui-theme .categories-slider-section[data-mytoui-native-category="yes"],
.mytoui-theme .subcat-slider-section[data-mytoui-native-category="yes"] {
  padding-inline: 12px !important;
  background: transparent !important;
  box-shadow: none !important;
}
.mytoui-theme .categories-slider-section[data-mytoui-native-category="yes"] .categories-slider-wrapper,
.mytoui-theme .subcat-slider-section[data-mytoui-native-category="yes"] .subcat-slider-wrapper {
  padding-inline: 0 !important;
  margin-inline: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

/* QuickTheme wraps the original category track in a scrolling viewport. Once MyToui
   owns the track, the track itself is the scroller; keep the outer viewport visible
   so pagination dots/side controls cannot be clipped on shop/category archives. */
.mytoui-theme .categories-slider-section[data-mytoui-native-category="yes"] .categories-slider,
.mytoui-theme .subcat-slider-section[data-mytoui-native-category="yes"] .subcat-slider-viewport {
  margin-inline: 0 !important;
  overflow: visible !important;
  scroll-snap-type: none !important;
}
.mytoui-theme .categories-slider-section[data-mytoui-native-category="yes"] .mytoui-slider-shell,
.mytoui-theme .subcat-slider-section[data-mytoui-native-category="yes"] .mytoui-slider-shell {
  overflow: visible !important;
}

/* 3.2: arrows can share the bottom control row with dots. */
.mytoui-slider-shell[data-arrow-position="bottom_dots"] > .mytoui-slider-controls{
  order:3; position:relative; display:flex; align-items:center; justify-content:center; gap:10px; margin-top:10px; min-height:var(--mt-slider-arrow-size);
}
.mytoui-slider-shell[data-arrow-position="bottom_dots"] > .mytoui-slider-controls .mytoui-slider-arrow{position:static!important;transform:none!important;flex:0 0 var(--mt-slider-arrow-size)!important}
.mytoui-slider-shell[data-arrow-position="bottom_dots"] > .mytoui-slider-controls .mytoui-slider-dots{position:static!important;right:auto!important;bottom:auto!important;transform:none!important;min-width:56px}
.mytoui-slider-shell[data-arrow-position="bottom_dots"]{padding-bottom:0!important}

/* MyToui Theme 3.3 — configurable pagination dots. */
.mytoui-theme .mytoui-slider-dots { gap:var(--mt-slider-dot-gap,7px) !important; }
.mytoui-theme .mytoui-slider-dots button {
  width:var(--mt-slider-dot-size,7px) !important; height:var(--mt-slider-dot-size,7px) !important;
  min-width:0 !important; padding:0 !important; border:0 !important; border-radius:999px !important;
  background:var(--mt-slider-dot,#d0d5dd) !important; transition:width .18s ease,background .18s ease !important;
}
.mytoui-theme .mytoui-slider-dots button.is-active { width:calc(var(--mt-slider-dot-size,7px) * 2.5) !important; background:var(--mt-slider-dot-active,#15803d) !important; }

/* 3.13.0 — desktop pagination is always visually below the slider when configured outside. */
@media (min-width:769px){
  .mytoui-theme .mytoui-slider-shell[data-dots="yes"][data-dots-position="outside"]{padding-bottom:30px!important}
  .mytoui-theme .mytoui-slider-shell[data-dots="yes"][data-dots-position="outside"]>.mytoui-slider-controls .mytoui-slider-dots{display:flex!important;position:absolute!important;right:50%!important;bottom:-24px!important;transform:translateX(50%)!important;z-index:12!important;pointer-events:auto!important}
  .mytoui-theme .mytoui-slider-shell[data-arrow-position="bottom_dots"][data-dots-position="outside"]{padding-bottom:0!important}
  .mytoui-theme .mytoui-slider-shell[data-arrow-position="bottom_dots"][data-dots-position="outside"]>.mytoui-slider-controls .mytoui-slider-dots{position:static!important;right:auto!important;bottom:auto!important;transform:none!important}
}