/**
 * Swiper 12 compatibility shim for the timwholesale theme.
 *
 * The theme markup still uses the legacy `.swiper-container` class and ships the
 * Swiper 5.3.0 base CSS inside bundle.css. Swiper 12 keeps the same
 * `.swiper-wrapper` / `.swiper-slide` structure, so base layout and navigation
 * styling continue to work from bundle.css. What changed between v5 and v12 are
 * the *effect* and *state* modifier classes that Swiper now adds to the
 * container at init: `.swiper-3d`, `.swiper-fade`, `.swiper-pointer-events`,
 * `.swiper-vertical` (v5 used `.swiper-container-3d`, `.swiper-container-fade`,
 * etc.). This file restores only those effect/state rules so the fade and
 * coverflow sliders render correctly, without touching bundle.css or the markup.
 *
 * Remove this file if the project migrates markup/CSS fully to the v12 naming.
 */

/* Pointer / touch behaviour (container gets `.swiper-pointer-events` in v12). */
.swiper-pointer-events {
    touch-action: pan-y;
}

.swiper-pointer-events.swiper-vertical {
    touch-action: pan-x;
}

/* Fade effect (timSwiper3: `.swiper-container.vertical`, effect: 'fade'). */
.swiper-fade.swiper-free-mode .swiper-slide {
    transition-timing-function: ease-out;
}

.swiper-fade .swiper-slide {
    pointer-events: none;
    transition-property: opacity;
}

.swiper-fade .swiper-slide .swiper-slide {
    pointer-events: none;
}

.swiper-fade .swiper-slide-active,
.swiper-fade .swiper-slide-active .swiper-slide-active {
    pointer-events: auto;
}

/* 3D / coverflow effect (timSwiper4: `.swiper-container-col3`, effect: 'coverflow'). */
.swiper-3d {
    perspective: 1200px;
}

.swiper-3d .swiper-wrapper,
.swiper-3d .swiper-slide,
.swiper-3d .swiper-cube-shadow {
    transform-style: preserve-3d;
}

.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top,
.swiper-3d .swiper-slide-shadow-bottom {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10;
}