/* Gallery Section - Swiper.js Styles */

.gallery {
  position: relative;
  overflow: visible;
}

.gallery > .container {
  position: static;
}

/* Swiper Container */
.gallery-swiper {
  width: 100%;
  padding: 0 50px 50px 50px;
  position: static !important;  /* Стрелки позиционируются от .gallery */
  box-sizing: border-box;
}

/* Gallery Item */
.gallery-item {
  display: flex;
  justify-content: center;
  align-items: center;
}

.gallery-item img {
  width: 100%;
  height: 350px;
  object-fit: cover;
  border-radius: 8px;
}

.gallery-item .img-placeholder {
  width: 100%;
  height: 350px;
  border-radius: 8px;
}

/* Single Image Mode */
.gallery--single .gallery-item img,
.gallery--single .gallery-item .img-placeholder {
  height: 746px;
  border-radius: 50px;
}

.gallery--single .gallery-swiper {
  padding: 0;
}

/* Swiper Pagination (dots) */
.gallery-swiper .swiper-pagination {
  bottom: 10px;
}

.gallery-swiper .swiper-pagination-bullet {
  width: 10px;
  height: 10px;
  background: var(--brand-text, #3D3D3D);
  opacity: 0.3;
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.gallery-swiper .swiper-pagination-bullet-active {
  opacity: 1;
  background: var(--brand-gold, #E2C08D);
  transform: scale(1.2);
}

/* Swiper Navigation Arrows - Figma style */
.gallery .swiper-button-prev,
.gallery .swiper-button-next {
  color: #3D3D3D !important;
  width: 30px !important;
  height: 30px !important;
  background: transparent !important;
  top: calc(50% - 25px) !important;
  z-index: 10 !important;
}

.gallery .swiper-button-prev {
  left: 15px !important;
}

.gallery .swiper-button-next {
  right: 15px !important;
}

.gallery-swiper .swiper-button-prev:hover,
.gallery-swiper .swiper-button-next:hover {
  color: #E2C08D !important;
}

/* Override Swiper default arrow icons completely */
.gallery .swiper-button-prev::after,
.gallery .swiper-button-next::after {
  font-family: 'Inter', Arial, sans-serif !important;
  font-size: 28px !important;
  font-weight: 300 !important;
  line-height: 1 !important;
}

.gallery .swiper-button-prev::after {
  content: '←' !important;
}

.gallery .swiper-button-next::after {
  content: '→' !important;
}

/* Responsive */
@media (max-width: 991px) {
  .gallery-swiper {
    padding: 0 50px 50px 50px;
  }

  .gallery-swiper .swiper-button-prev {
    left: 10px !important;
  }

  .gallery-swiper .swiper-button-next {
    right: 10px !important;
  }

  .gallery-item img,
  .gallery-item .img-placeholder {
    height: 300px;
  }

  /* Single mode responsive */
  .gallery--single .gallery-item img,
  .gallery--single .gallery-item .img-placeholder {
    height: 500px;
    border-radius: 35px;
  }
}

@media (max-width: 768px) {
  .gallery-swiper {
    padding: 0 0 40px 0;
  }

  .gallery-item img,
  .gallery-item .img-placeholder {
    height: 280px !important;
    width: 100% !important;
    border-radius: 15px !important;
  }

  /* Hide arrows on mobile, use swipe */
  .gallery-swiper .swiper-button-prev,
  .gallery-swiper .swiper-button-next {
    display: none !important;
  }

  /* Single mode responsive */
  .gallery--single .gallery-item img,
  .gallery--single .gallery-item .img-placeholder {
    height: 300px !important;
    width: 100% !important;
    border-radius: 15px !important;
  }

  /* Show arrows in single mode on tablets */
  .gallery--single .swiper-button-prev,
  .gallery--single .swiper-button-next {
    display: flex !important;
  }
}

@media (max-width: 576px) {
  .gallery-item img,
  .gallery-item .img-placeholder {
    height: 220px !important;
    width: 100% !important;
    border-radius: 10px !important;
  }

  .gallery-swiper .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
  }

  /* Single mode responsive */
  .gallery--single .gallery-item img,
  .gallery--single .gallery-item .img-placeholder {
    height: 250px !important;
    width: 100% !important;
    border-radius: 10px !important;
  }

  /* Hide arrows on mobile for single mode too */
  .gallery--single .swiper-button-prev,
  .gallery--single .swiper-button-next {
    display: none !important;
  }
}
