product-gallery {
  display: block;
  position: relative;
  background-color: #212224;
  border: 1px solid #2e3133;
  border-radius: 12px;
  overflow: hidden;

  &.gallery--sticky {
    position: sticky;
    top: calc(var(--header-height) + 1rem);
  }

  .swiper {
    width: 100%;
  }

  .swiper-wrapper {
    box-sizing: border-box;
  }

  .product-gallery__slider-thumb {
    position: absolute;
    top: 12px;
    left: 12px;
    width: 60px;
    height: 90%;
    overflow: hidden;
    z-index: 2;

    .swiper-slide {
      width: 60px;
      height: 60px;
      border-radius: 6px;
      overflow: hidden;
      cursor: pointer;
      border: 1px solid transparent;
      transition: 0.25s ease-in-out;

      &.swiper-slide-thumb-active {
        border-color: #8a9299;
      }

      &:hover,
      &:focus {
        border-color: #2e3133;
      }
    }

    .thumb-container {
      width: 100%;
      height: 100%;
      background-color: #1a1a1a;

      img {
        width: 100%;
        height: 100%;
        object-fit: contain;
      }
    }
  }
}