/* Slider */
.product-item-detail-slider-container {
  position: relative;
  max-width: 100%;
  background: transparent;
  transition: background 800ms ease;
}

.product-item-detail-slider-block {
  position: relative;
  box-sizing: border-box;
  aspect-ratio: 552 / 703;
}

.product-item-detail-slider-block.product-item-detail-slider-block-square {
  padding-top: 100%;
}

.product-item-detail-slider-images-container {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.product-item-detail-slider-image {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  text-align: center;
  opacity: 0;
  transition: opacity 250ms linear;
}

.product-item-detail-slider-image.active {
  z-index: 10;
  opacity: 1;
}

.product-item-detail-slider-image img {
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  outline: 1px solid transparent;
  background-position: center;
  background-repeat: no-repeat;
  transition: background-size 450ms ease, width 450ms ease, height 450ms ease, outline 450ms ease;
  transform: translateY(-50%) translateX(-50%);
}

.product-item-detail-slider-progress-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 180;
  height: 3px;
}

/*Slider Controls*/
.product-item-detail-slider-controls-block {
  padding: 10px 0;
  text-align: center;
}

.product-item-detail-slider-controls-image {
  position: relative;
  display: inline-block;
  overflow: hidden;
  width: 65px;
  height: 65px;
  outline: 1px solid #c0cfda;
  background-color: #fff;
  text-align: center;
  cursor: pointer;
}

.bx-retina .product-item-detail-slider-controls-image {
  outline-width: .5px;
}

.bx-no-retina .product-item-detail-slider-controls-image.active {
  outline-width: 2px;
}

.bx-retina .product-item-detail-slider-controls-image.active {
  outline-width: 1px;
}

.product-item-detail-slider-controls-image img {
  position: absolute;
  top: 50%;
  left: 50%;
  max-width: 65px;
  max-height: 65px;
  width: auto;
  height: auto;
  transform: translateY(-50%) translateX(-50%);
}

.product-item-detail-slider-left,
.product-item-detail-slider-right {
  position: absolute;
  top: 0;
  bottom: 0;
  z-index: 111;
  display: block;
  width: 25%;
  background: rgba(255, 255, 255, 0) url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2216%22%20height%3D%2230%22%20viewBox%3D%220%200%2016%2030%22%3E%3Cpolygon%20fill%3D%22%23000000%22%20fill-rule%3D%22evenodd%22%20points%3D%2216%2050%202%2036%2016%2022%2015%2021%201%2035%200%2036%201%2037%2015%2051%22%20transform%3D%22translate(0%20-21)%22%2F%3E%3C%2Fsvg%3E') no-repeat center;
  opacity: .57;
  cursor: pointer;
  transition: all 300ms ease;
}

.product-item-detail-slider-left {
  left: 0;
}

.product-item-detail-slider-right {
  right: 0;
  transform: rotate(180deg);
}

.product-item-detail-slider-left:hover,
.product-item-detail-slider-right:hover {
  background-color: rgba(255, 255, 255, .4);
  opacity: .8;
}

.product-item-detail-slider-close {
  display: none;
}

.product-item-detail-slider-container.popup .product-item-detail-slider-image img {
  max-width: 100%;
  max-height: 90vh;
  width: auto;
  cursor: default
}

.product-item-detail-slider-container.popup .product-item-detail-slider-controls-block {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  overflow-y: auto;
  padding: 20px;
  border-left: 1px solid #d3d3d3;
  background-color: #fff;
}

.product-item-detail-slider-container.popup .product-item-detail-slider-controls-image {
  display: block;
  margin-bottom: 20px;
}