/* Page styles: product detail. Core gallery/options tabs live in uadepot.css;
   this file adds the review/Q&A mini-forms, inline empty states and small details. */

.product-root { width:100%; padding:30px 20px; }
.empty-inline { color: var(--text-muted); padding: 8px 0; }
.review-date { margin-left: auto; color: var(--text-light); font-size: 12px; }
.review-title { font-weight: 600; margin-bottom: 4px; }

.mini-form {
  margin-top: 20px; padding: 18px; border: 1px solid var(--border);
  border-radius: var(--radius-md); background: var(--bg-light); max-width: 560px;
}
.mini-form h4 { margin: 0 0 12px; font-size: 15px; }
.mf-row { margin-bottom: 10px; display: flex; flex-direction: column; gap: 4px; }
.mf-row label { font-size: 13px; font-weight: 600; color: var(--text-muted); }
.mini-form input, .mini-form select, .mini-form textarea {
  width: 100%; padding: 10px 12px; border: 1px solid var(--border-dark);
  border-radius: var(--radius-sm); font: inherit; font-size: 14px; background: #fff;
  box-sizing: border-box;
}
.mini-form textarea { resize: vertical; }
.mini-form .btn { margin-top: 4px; }

#addCartBtn[disabled] { opacity: .55; cursor: not-allowed; }
#buyNowBtn[disabled] { opacity: .55; cursor: not-allowed; }
.pd-actions #addCartBtn, .pd-actions #buyNowBtn { min-height: 48px; flex: 1 1 165px; }
.pd-actions #pdFav { min-height: 48px; min-width: 48px; flex: 0 0 48px; }
@media (max-width: 560px) {
  .pd-actions { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 48px; gap: 8px; }
  .pd-actions #addCartBtn, .pd-actions #buyNowBtn { min-width: 0; padding: 10px 4px; font-size: 14px; }
}
#pdFav.is-active i { color: var(--red); }

.size-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; }
.product-gallery, .product-detail-info { min-width: 0; }
.product-gallery .main-image { position:relative; touch-action:pan-y; }
.product-gallery .main-image img {
  display:block; object-fit:contain; cursor:zoom-in; user-select:none;
  -webkit-user-drag:none; -webkit-tap-highlight-color:transparent; touch-action:pan-y;
}
.gallery-nav, .gallery-zoom {
  position:absolute; z-index:2; display:grid; place-items:center; width:40px; height:40px;
  border:1px solid var(--border); border-radius:50%; background:rgba(255,255,255,.94);
  color:var(--primary); cursor:pointer; box-shadow:var(--shadow-sm);
}
.gallery-nav:hover, .gallery-zoom:hover { background:var(--primary); color:#fff; }
.gallery-prev { left:12px; top:50%; transform:translateY(-50%); }
.gallery-next { right:12px; top:50%; transform:translateY(-50%); }
.gallery-zoom { right:12px; bottom:12px; }
.gallery-nav:focus-visible, .gallery-zoom:focus-visible, .gallery-lightbox button:focus-visible { outline:3px solid var(--gold); outline-offset:2px; }
.pd-price { align-items:baseline; gap:10px; }
.pd-price .now { color:var(--primary); white-space:nowrap; }
.pd-price .was { color:var(--text-light); font-size:15px; white-space:nowrap; }
.pd-summary { margin-bottom:18px; }
.pd-summary .pd-desc { white-space:pre-line; overflow-wrap:anywhere; margin-bottom:4px; }
.pd-desc.is-collapsed { display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
.pd-read-more { padding:2px 0; color:var(--primary); font-weight:700; text-decoration:underline; cursor:pointer; }
.pt-body p { white-space:pre-line; overflow-wrap:anywhere; }
.gallery-lightbox-open { overflow:hidden; }
.gallery-lightbox-back { position:fixed; inset:0; z-index:1400; display:grid; place-items:center; padding:16px; background:rgba(0,0,0,.88); }
.gallery-lightbox { width:min(1200px,100%); max-height:calc(100dvh - 32px); display:flex; flex-direction:column; color:#fff; }
.gallery-lightbox-head { display:flex; align-items:center; justify-content:space-between; min-height:44px; font-weight:700; }
.gallery-lightbox button { display:grid; place-items:center; width:42px; height:42px; flex:none; border:1px solid rgba(255,255,255,.55); border-radius:50%; background:rgba(20,20,20,.72); color:#fff; cursor:pointer; }
.gallery-lightbox button:hover { background:#fff; color:var(--primary); }
.gallery-lightbox-stage { position:relative; display:flex; align-items:center; justify-content:center; min-height:0; }
.gallery-lightbox-stage img { display:block; width:100%; height:calc(100dvh - 108px); object-fit:contain; touch-action:pan-y; user-select:none; -webkit-user-drag:none; }
.gallery-lightbox-stage button { position:absolute; top:50%; transform:translateY(-50%); z-index:2; }
.gallery-lightbox-prev { left:8px; }
.gallery-lightbox-next { right:8px; }
.gallery-lightbox button[hidden] { display:none; }
.size-tools { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:6px; }
.size-corresponding { display:block; color:var(--text-muted); font-size:12px; margin-top:3px; }
.unit-btn { border:0; background:none; color:var(--text-muted); cursor:pointer; font:inherit; font-size:12px; padding:3px 4px; }
.unit-btn.active { color:var(--text); font-weight:700; border-bottom:2px solid currentColor; }
.guide-link {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:38px; margin-left:8px; padding:8px 13px; border:1px solid var(--primary);
  border-radius:6px; background:var(--primary); color:#fff; font:inherit;
  font-size:14px; font-weight:700; line-height:1.2; cursor:pointer;
}
.guide-link:hover { background:#00346d; border-color:#00346d; }
.guide-link:focus-visible, .pt-tab:focus-visible, .size-guide-modal-close:focus-visible { outline:3px solid var(--gold); outline-offset:2px; }
.size-btn.is-sold-out { opacity:.45; text-decoration:line-through; }
@media (max-width: 480px) {
  .size-head { align-items:flex-start; flex-direction:column; }
  .size-tools { width:100%; justify-content:flex-start; }
  .guide-link { margin-left:auto; }
}
.pt-headers { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:thin; }
.pt-tab { flex:0 0 auto; white-space:nowrap; }
.size-chart-view { display:flex; justify-content:center; width:100%; }
.size-chart-view img { display:block; width:auto; max-width:100%; height:auto; }
.size-guide-open { overflow:hidden; }
.size-guide-modal-back {
  position:fixed; inset:0; z-index:1200; display:flex; align-items:center;
  justify-content:center; padding:20px; background:rgba(0,0,0,.66);
}
.size-guide-modal {
  box-sizing:border-box; width:min(920px, 100%); max-height:calc(100dvh - 40px);
  overflow:auto; background:#fff; padding:18px; border-radius:6px; overscroll-behavior:contain;
}
.size-guide-modal-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.size-guide-modal-head h2 { margin:0; font-size:20px; }
.size-guide-modal-close { width:40px; height:40px; border:0; background:var(--bg-light); border-radius:4px; color:var(--text); font-size:26px; line-height:1; cursor:pointer; }
.size-guide-modal img { display:block; width:auto; max-width:100%; height:auto; margin:0 auto; }
@media (max-width: 560px) {
  .product-root { padding:24px 14px; }
  .product-layout { gap:20px; }
  .gallery-nav, .gallery-zoom { width:44px; height:44px; }
  .thumbs { max-width:100%; overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:none; -webkit-overflow-scrolling:touch; padding-bottom:2px; touch-action:pan-x; }
  .thumbs::-webkit-scrollbar { display:none; }
  .thumbs .thumb { flex:0 0 64px; width:64px; height:64px; }
  .gallery-lightbox-back { padding:8px; }
  .gallery-lightbox-stage button { width:34px; height:34px; }
  .gallery-lightbox-stage img { height:calc(100dvh - 90px); }
  .size-guide-modal-back { padding:10px; }
  .size-guide-modal { max-height:calc(100dvh - 20px); padding:12px; }
  .pt-tab { padding:13px 14px; }
  .pt-body { padding:16px; }
}