/* ==================================================
   서흥중문 제품 상세 3-UP 갤러리
   정확한 기존 클래스만 대상으로 함
================================================== */

/* ------------------------------
   제품 상세 레이아웃
------------------------------ */

@media (min-width: 1100px) {
  .product-page .gallery-product-layout {
    display: grid !important;
    grid-template-columns: 330px minmax(0, 1fr) !important;
    column-gap: clamp(32px, 3vw, 58px) !important;
    align-items: center !important;
    width: 100% !important;
  }

  .product-page .product-copy {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: 330px !important;
    min-width: 0 !important;
    justify-self: start !important;
  }

  .product-page .product-gallery {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    justify-self: stretch !important;
  }
}

/* ------------------------------
   기존 세로 썸네일 제거
------------------------------ */

.product-page .product-gallery .gallery-thumbs {
  display: none !important;
}

/* ------------------------------
   메인 갤러리
------------------------------ */

.product-page .product-gallery .gallery-main {
  position: relative !important;
  width: 100% !important;
  overflow: hidden !important;
  background: #f1f2f2 !important;
}

/* 기존 1장 이미지 자체는 자료로 남기고 화면에서만 숨김 */
.product-page .product-gallery .gallery-main > img[data-gallery-main] {
  display: none !important;
}

/* 새 3장 영역 */
.product-page .seoheung-gallery-stage {
  display: grid;
  width: 100%;
  height: min(72vh, 700px);
  min-height: 520px;
  gap: 8px;
  overflow: hidden;
  background: #f1f2f2;
}

.product-page .seoheung-gallery-item {
  position: relative;
  min-width: 0;
  height: 100%;
  overflow: hidden;
  background: #ededed;
}

.product-page .seoheung-gallery-item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* ------------------------------
   카운터
------------------------------ */

.product-page .gallery-count {
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  left: auto !important;
  z-index: 20 !important;

  padding: 8px 12px !important;
  background: rgba(255, 255, 255, 0.94) !important;
  color: #333 !important;

  font-size: 11px !important;
  line-height: 1 !important;
  letter-spacing: 1.5px !important;
  white-space: nowrap !important;
}

/* ------------------------------
   좌우 화살표
------------------------------ */

.product-page .gallery-arrow {
  position: absolute !important;
  top: 50% !important;
  z-index: 30 !important;

  width: 46px !important;
  height: 46px !important;
  padding: 0 !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  border: 0 !important;
  border-radius: 50% !important;

  background: rgba(255, 255, 255, 0.96) !important;
  color: #222 !important;

  font-size: 21px !important;
  line-height: 1 !important;

  cursor: pointer !important;

  transform: translateY(-50%) !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.10) !important;
}

.product-page .gallery-prev {
  left: 14px !important;
  right: auto !important;
}

.product-page .gallery-next {
  right: 14px !important;
  left: auto !important;
}

.product-page .gallery-arrow:hover {
  background: #fff !important;
}

.product-page .gallery-arrow:focus-visible {
  outline: 2px solid #222 !important;
  outline-offset: 3px !important;
}

.product-page .gallery-arrow[hidden] {
  display: none !important;
}

/* ------------------------------
   TYPE / POINT / SPACE
   기존 좌측 정렬 유지
------------------------------ */

.product-page .product-facts li {
  display: grid !important;
  grid-template-columns: 86px minmax(0, 1fr) !important;
  align-items: center !important;
}

.product-page .product-facts li > span,
.product-page .product-facts li > b {
  margin-left: 0 !important;
  margin-right: 0 !important;
  text-align: left !important;
  justify-self: start !important;
}

/* ------------------------------
   치수표도 같은 시작선
------------------------------ */

.product-page .specs li {
  display: grid !important;
  grid-template-columns: 86px minmax(0, 1fr) !important;
  align-items: center !important;
}

.product-page .specs li > span,
.product-page .specs li > b {
  margin-left: 0 !important;
  margin-right: 0 !important;
  text-align: left !important;
  justify-self: start !important;
}

/* ------------------------------
   태블릿
------------------------------ */

@media (min-width: 768px) and (max-width: 1099px) {
  .product-page .seoheung-gallery-stage {
    height: 580px;
    min-height: 480px;
    gap: 6px;
  }
}

/* ------------------------------
   모바일
------------------------------ */

@media (max-width: 767px) {
  .product-page .seoheung-gallery-stage {
    height: 70vh;
    min-height: 420px;
    gap: 0;
  }

  .product-page .gallery-arrow {
    width: 42px !important;
    height: 42px !important;
  }

  .product-page .gallery-prev {
    left: 10px !important;
  }

  .product-page .gallery-next {
    right: 10px !important;
  }
}