/* Native free-scroll product carousel: Digikala-like continuous movement. */
.webino-native-carousel .webino-slider__viewport {
    display: block !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-inline: contain;
    overflow-anchor: none;
    scroll-snap-type: none;
    scroll-behavior: smooth;
    scrollbar-width: none;
    touch-action: pan-x pan-y pinch-zoom !important;
    cursor: grab;
    -webkit-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    padding-block: var(--webino-card-shadow-space, 24px);
    margin-block: calc(var(--webino-card-shadow-space, 24px) * -1);
}
.webino-native-carousel .webino-slider__viewport::-webkit-scrollbar { display:none; }
.webino-native-carousel .webino-slider__viewport:active { cursor:grabbing; }
.webino-native-carousel .webino-slider__track {
    width: 100% !important;
    min-width: 100%;
    display: grid !important;
    grid-auto-flow: column;
    grid-auto-columns: calc((100% - (var(--webino-native-per-view, var(--webino-per-view-desktop, 4)) - 1) * var(--webino-native-gap, var(--webino-carousel-gap, 20px))) / var(--webino-native-per-view, var(--webino-per-view-desktop, 4)));
    gap: var(--webino-native-gap, var(--webino-carousel-gap, 20px)) !important;
    transform: none !important;
    transition: none !important;
    will-change: auto !important;
}
.webino-native-carousel .webino-slider__slide {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    flex: none !important;
    scroll-snap-align: none;
    scroll-snap-stop: normal;
    /* The legacy slider hides every slide except the first until .is-ready is set. */
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

/* Optional legacy/card-lock mode. Manual scrolling is free by default so the
   viewport can stop between two cards, while arrows and dots still align to a
   product when used. */
.webino-native-carousel.has-scroll-snap .webino-slider__viewport{
    scroll-snap-type:inline proximity;
}
.webino-native-carousel.has-scroll-snap .webino-slider__slide{
    scroll-snap-align:start;
}
.webino-native-carousel.is-free-scroll .webino-slider__viewport{
    scroll-snap-type:none!important;
}
.webino-native-carousel.is-free-scroll .webino-slider__slide{
    scroll-snap-align:none!important;
}

.webino-native-carousel .webino-slider__slide[aria-hidden="true"] {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}
.webino-native-carousel.is-native-dragging .webino-slider__viewport {
    scroll-behavior: auto !important;
    scroll-snap-type: none !important;
    cursor: grabbing;
}
.webino-native-carousel.is-native-dragging .webino-slider__slide { scroll-snap-align: none; }
.webino-native-carousel .webino-slider__slide,
.webino-native-carousel .webino-product-card,
.webino-native-carousel .webino-product-card * {
    touch-action: pan-x pan-y pinch-zoom !important;
}
.webino-native-carousel img,
.webino-native-carousel a {
    -webkit-user-drag: none;
    user-drag: none;
}
.webino-native-carousel.has-mobile-peek { --webino-native-mobile-peek: .18; }

@media (max-width: 1024px) {
    .webino-native-carousel { --webino-native-per-view: var(--webino-per-view-tablet, 2); --webino-native-gap: var(--webino-gap-tablet, var(--webino-carousel-gap, 20px)); }
}
@media (max-width: 767px) {
    .webino-native-carousel { --webino-native-per-view: var(--webino-per-view-mobile, 1); --webino-native-gap: var(--webino-gap-mobile, var(--webino-carousel-gap, 14px)); }
    .webino-native-carousel.has-mobile-peek .webino-slider__track {
        grid-auto-columns: calc((100% - (var(--webino-native-per-view, 1) - 1) * var(--webino-native-gap, 14px)) / (var(--webino-native-per-view, 1) + var(--webino-native-mobile-peek, .18)));
    }
}

/* Webino 9.2.1: browser momentum owns finger scrolling; JS smooth is reserved
   for navigation buttons. This prevents a second animated jump on touchend. */
.webino-native-carousel .webino-slider__viewport{scroll-behavior:auto!important;overflow-anchor:none}
@media(pointer:coarse){
  .webino-native-carousel .webino-slider__viewport{scroll-behavior:auto!important;scroll-snap-stop:normal!important}
}

/* Webino 9.2.3 — true continuous loop uses mirrored slide sequences before
   and after the original list. The internal coordinate reset happens between
   identical content and is therefore visually invisible. */
.webino-native-carousel [data-webino-loop-clone="1"]{
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
}
.webino-native-carousel [data-webino-loop-clone="1"] *{
    -webkit-user-drag:none;
}