.card-slider {
  overflow: hidden;

  @include media-breakpoint-down(sm) {
    padding: 0 40px;
  }

  @include media-breakpoint-only(md) {
    padding: 0 25px;
  }

  &__wrapper {
    position: relative;

    // sass-lint:disable no-important
    &.card-slider_frozen {
      .swiper-container {
        padding: 0;

        .swiper-slide {
          @include make-col-ready;
          margin-right: 0 !important;
          margin-bottom: 30px !important;

          @include media-breakpoint-down(sm) {
            @include make-col(12);
          }
        }

        &[data-slides-md='3'] .swiper-slide {
          @include media-breakpoint-only(md) {
            @include make-col(4);
          }
        }

        &[data-slides='3'] .swiper-slide {
          @include media-breakpoint-up(lg) {
            @include make-col(4);
          }
        }

        &[data-slides='4'] .swiper-slide {
          @include media-breakpoint-up(lg) {
            @include make-col(3);
          }
        }

        .swiper-slide-duplicate {
          display: none;
        }
      }

      .swiper-wrapper {
        @include make-row;
        width: auto;
        transform: translateX(0) !important;
      }

      .card-slider__btn-prev,
      .card-slider__btn-next {
        display: none;
      }

      .card-slider__actions {
        padding-top: 0;
      }
    }
  }

  &__btn-prev,
  &__btn-next {
    @include button-slider;

    .card-slider_expandable & {
      margin-top: -32px;
    }
  }

  &__btn-prev {
    left: -45px;
    @include media-breakpoint-only(md) {
      left: 5px;
    }
    @include media-breakpoint-down(sm) {
      left: 0;
    }
  }

  &__btn-next {
    right: -45px;
    @include media-breakpoint-only(md) {
      right: 5px;
    }
    @include media-breakpoint-down(sm) {
      right: 0;
    }
  }

  &__actions {
    padding-top: 30px;
  }

  &__btn {
    min-width: 148px;

    span {
      pointer-events: none;
    }
  }

  .swiper-slide {
    height: auto;
    margin-right: 30px;

    .similar-products-v2 & {
      height: 100%;
    }
  }

  @include media-breakpoint-only(md) {
    &[data-slides-md='3'] {
      .swiper-slide {
        width: calc(33% - 20px);
      }
    }

    &[data-slides-md='4'] {
      .swiper-slide {
        width: calc(25% - 22.5px);
      }
    }
  }

  @include media-breakpoint-up(lg) {
    &[data-slides='3'] {
      .swiper-slide {
        width: calc(33.33% - 20px);
      }
    }

    &[data-slides='4'] {
      .swiper-slide {
        width: calc(25% - 22.5px);
      }
    }
  }

  .card {
    margin-bottom: 0;
  }
}