.swiper-slider {
  position: relative;
  overflow-x: hidden;

  .swiper-button-next,
  .swiper-button-prev {
    overflow: hidden;
    width: var(--spred-size-2, 16px);
    height: var(--spred-size-2, 16px);
    transition: opacity ease 0.2s;
    opacity: 0.5;
    background-color: var(--spred-button-primary-bg, #494949);
    clip-path: polygon(100% 50%, 0 100%, 5% 50%, 0 0);
  }

  .swiper-button-prev {
    transform: rotate(-180deg) translateX(var(--spred-size-0-5, 4px))
      translateY(-50%);
  }

  .swiper-button-next {
    transform: translateX(var(--spred-size-0-5, 4px)) translateY(50%);
  }

  .swiper-button-next:hover,
  .swiper-button-prev:hover {
    opacity: 1;
  }

  .swiper-button-next::after,
  .swiper-button-prev::after {
    display: none;
    content: "";
  }

  .swiper-pagination {
    bottom: var(--spred-size-3, 24px);
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: var(--spred-size-5, 40px);
    gap: var(--spred-size-1, 8px);
  }

  .swiper-pagination-bullet {
    position: relative;
    width: var(--spred-size-1-5, 12px);
    height: var(--spred-size-1-5, 12px);
    border: 1px solid var(--spred-button-primary-bg, #000);
    background-color: var(--spred-button-primary-bg, #000);
  }

  .swiper-pagination-bullet:hover {
    opacity: 1;
    border: 1px solid var(--spred-button-primary-border, #000);
    background-color: var(--spred-button-primary-bg, #000);
  }

  .swiper-pagination-bullet-active {
    background-color: var(--spred-button-primary-bg, #000);
  }

  .swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .swiper-slide-thumb-active {
    border: 3px solid var(--spred-button-primary-bg, #000);
  }

  &.is_venobox {
    margin-bottom: var(--spred-size-3, 24px);

    .swiper-slide-thumb-active {
      border: none;
    }
  }

  &:not(.is_venobox) {
    .swiper-slide {
      padding: 4px;
    }
  }
}

.swiper-thumbs {
  padding-block: var(--spred-size-2, 16px);
}