/**
 * ItcSlider
 * @version 1.0.1
 * @author https://github.com/itchief
 * @copyright Alexander Maltsev 2020 - 2023
 * @license MIT (https://github.com/itchief/ui-components/blob/master/LICENSE)
 * @tutorial https://itchief.ru/javascript/slider
 */

.itc-slider {
  position: relative;
}

.itc-slider-wrapper {
    position: relative;
    z-index: 6;
  overflow: hidden;
  background: #000;
}

.itc-slider-items {
  display: flex;
  transition: transform 0.5s ease;
  will-change: transform;
  --gap: 16px;
  gap: var(--gap);
}

.itc-slider-transition-none {
  transition: none;
}

/* на маленьких устройствах 1 слайд */
.itc-slider-item {
  flex: 0 0 100%;
}

/* на средних экранах (ширина больше 768px) 2 слайда */
@media (min-width: 768px) {
  .itc-slider-item {
    flex: 0 0 calc(50% - var(--gap) / 2);
  }
}

.itc-slider-item-catalog {
  text-decoration: none;
}

/* на больших экранах (ширина больше 1200px) 3 слайда */
@media (min-width: 1200px) {
  .itc-slider-item {
    flex: 0 0 calc(33.3333333333% - var(--gap) * 2 / 3);
  }
  .itc-slider-item-catalog {
    flex: 0 0 calc(50% - var(--gap) / 2);
  }
}

/* кнопки влево и вправо */
.itc-slider-btn {
  position: absolute;
  top: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  background: transparent;
  border: none;
  cursor: pointer;
}

.itc-slider-btn-hide {
  display: none;
}

.itc-slider-btn-prev {
  left: 0;
}

.itc-slider-btn-next {
  right: 0;
}

.itc-slider-btn:hover,
.itc-slider-btn:focus {
  color: #fff;
  text-decoration: none;
  background: rgb(0 0 0 / 30%);
  outline: 0;
}

.itc-slider-btn::before {
  content: "";
  display: inline-block;
  width: 30px;
  height: 30px;
  background: transparent no-repeat center center;
  background-size: 100% 100%;
}

.itc-slider-btn-prev::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30' fill='none'%3E%3Cpath d='M10.625 16L17.75 23C18.25 23.5 19 23.5 19.5 23C20 22.5 20 21.75 19.5 21.25L13.375 15L19.5 8.75C20 8.25 20 7.5 19.5 7C19.25 6.75 19 6.625 18.625 6.625C18.25 6.625 18 6.75 17.75 7L10.625 14C10.125 14.625 10.125 15.375 10.625 16C10.625 15.875 10.625 15.875 10.625 16Z' fill='url(%23paint0_linear_1_94)'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_1_94' x1='15.0625' y1='6.625' x2='15.0625' y2='23.375' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23008DD2'/%3E%3Cstop offset='1' stop-color='%234E59A2'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E");
}

.itc-slider-btn-next::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30' fill='none'%3E%3Cpath d='M19.375 14L12.25 7C11.75 6.5 11 6.5 10.5 7C10 7.5 10 8.25 10.5 8.75L16.625 15L10.5 21.25C10 21.75 10 22.5 10.5 23C10.75 23.25 11 23.375 11.375 23.375C11.75 23.375 12 23.25 12.25 23L19.375 16C19.875 15.375 19.875 14.625 19.375 14C19.375 14.125 19.375 14.125 19.375 14Z' fill='url(%23paint0_linear_1_96)'/%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_1_96' x1='14.9375' y1='23.375' x2='14.9375' y2='6.625' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23008DD2'/%3E%3Cstop offset='1' stop-color='%234E59A2'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E");
}

/* индикаторы */
.itc-slider-indicators {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 15;
  display: flex;
  justify-content: center;
  margin: 0 15%;
  padding-left: 0;
  list-style: none;
}

.itc-slider-indicator {
  flex: 0 1 auto;
  box-sizing: content-box;
  width: 30px;
  height: 5px;
  margin-right: 3px;
  margin-left: 3px;
  text-indent: -999px;
  background-color: rgb(255 255 255 / 50%);
  background-clip: padding-box;
  border-top: 15px solid transparent;
  border-bottom: 15px solid transparent;
  cursor: pointer;
}

.itc-slider-indicator-active {
  background-color: rgb(255 255 255 / 90%);
}