.main-swiper {
    width: 100%;
    height: 400px;
    margin-bottom: 10px;
  }
  .thumb-swiper {
    width: 100%;
    height: 100px;
  }
  .thumb-swiper .swiper-slide {
    width: 100px;
    height: 100px;
    opacity: 0.4;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .thumb-swiper .swiper-slide-thumb-active {
    opacity: 1;
    border: 2px solid #000;
  }

/* Fix image display only inside Swiper slides */
.main-swiper .swiper-slide img,
.thumb-swiper .swiper-slide img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

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

.swiper-slide img {
    user-select: none;   /* Prevents selection highlight */
    -webkit-user-drag: none; /* Prevents dragging ghost image */
    outline: none;       /* Removes blue outline */
}