/**
 * HOFER Media Carousel Edge Fade
 * https://hofermedia.at/
 */

.hm-carousel-edge-fade {
    --hm-carousel-edge-fade-width: 72px;
    -webkit-mask-image: linear-gradient(
        to right,
        transparent 0,
        #000 var(--hm-carousel-edge-fade-width),
        #000 calc(100% - var(--hm-carousel-edge-fade-width)),
        transparent 100%
    );
    mask-image: linear-gradient(
        to right,
        transparent 0,
        #000 var(--hm-carousel-edge-fade-width),
        #000 calc(100% - var(--hm-carousel-edge-fade-width)),
        transparent 100%
    );
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
}

.hm-carousel-edge-fade .swiper-wrapper,
.hm-carousel-edge-fade .slick-track,
.hm-carousel-edge-fade .elementor-swiper,
.hm-carousel-edge-fade ul.products {
    will-change: transform;
}

@media (max-width: 767px) {
    .hm-carousel-edge-fade {
        --hm-carousel-edge-fade-width: min(48px, 14vw);
    }
}

@media (prefers-reduced-motion: reduce) {
    .hm-carousel-edge-fade .swiper-wrapper,
    .hm-carousel-edge-fade .slick-track {
        will-change: auto;
    }
}