/* Le Swiper doit pouvoir prendre la hauteur du parent */
.mvp-product-gallery-carousel__outer,
.mvp-product-gallery-carousel {
  height: 100%;
}
.mvp-product-gallery-carousel.swiper{
    padding-bottom: 0;
}
.mvp-product-gallery-carousel .swiper-wrapper,
.mvp-product-gallery-carousel .swiper-slide {
    height: 100%;
    aspect-ratio: 2 / 1;
    max-height: 315px;
}

/* Image en cover via <img> */
.mvp-product-gallery-carousel__link,
.mvp-product-gallery-carousel__img {
    display: block;
    width: 100%;
    height: 100% !important;
}

.mvp-product-gallery-carousel__img {
  object-fit: cover;
  object-position: center;
}

.mvp-product-gallery-carousel .swiper-pagination-progressbar {
    margin-top: 35px!important;
    transform: none!important;
    height: 16px!important;
        width: 100% !important;
    left: 0 !important;
}
.mvp-product-gallery-carousel .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background-color: #000;
    height: 85%;
    top: 1px;
    left: 1px;
    border-radius: 10px;
}

.mvp-product-gallery-carousel.swiper::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 60px;
  height: 100%;
  pointer-events: none;
  z-index: 10;

  /* fondu blanc vers la droite */
  background: linear-gradient(to left, rgba(255,255,255,1), rgba(255,255,255,0));
}

@media screen and (max-width: 769px) {
    .mvp-product-gallery-carousel.swiper{
        padding-bottom: 15px;
    }
    .mvp-product-gallery-carousel .swiper-pagination-progressbar {
        margin-top: 15px!important;
        height: 8px!important;
    }
}