/**
 * Product Detail Modal v18
 * คลิป 16:9 เต็มกรอบชัด · คำอธิบายมีแถบเลื่อน · ปุ่มสั่งซื้อสีเข้ม
 * Mobile: คอลัมน์เดียว อ่านครบ
 */

/* บังคับสีปุ่มในหน้ารายละเอียดผ่าน CSS variables ของ .sf-btn-buy */
html body #modalProductDetail {
  --sf-buy-bg: #141414 !important;
  --sf-buy-bg-hover: #1c1c1c !important;
  --sf-buy-border: rgba(255, 255, 255, 0.14) !important;
  --sf-buy-border-hover: rgba(255, 255, 255, 0.22) !important;
  --sf-buy-border-width: 1px !important;
  --sf-buy-shadow: 0 8px 22px rgba(0, 0, 0, 0.45) !important;
}

html body #modalProductDetail .pd-main-img-bg,
html body #modalProductDetail .pd-main-img-decor,
html body #modalProductDetail .pd-gallery-foot { display: none !important; }
html body #modalProductDetail .pd-main-img-wrap::before,
html body #modalProductDetail .pd-main-img-wrap::after { content: none !important; display: none !important; }

html body #modalProductDetail .ix-overlay:not(.open) {
  display: none !important;
  pointer-events: none !important;
}

/* ── Shell ── */
html body #modalProductDetail .ix-modal.pd-modal-wide,
html body #modalProductDetail .ix-modal {
  width: min(1120px, calc(100vw - 1.25rem)) !important;
  max-width: min(1120px, calc(100vw - 1.25rem)) !important;
  max-height: min(92dvh, 900px) !important;
  height: auto !important;
  border-radius: 22px !important;
  border: 1px solid rgba(122, 143, 168, 0.28) !important;
  background: linear-gradient(165deg, #16181d 0%, #0b0c10 100%) !important;
  box-shadow: 0 30px 80px rgba(0,0,0,.55), 0 0 40px rgba(106, 128, 160, 0.08) !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}

html body #modalProductDetail .ix-modal-close {
  z-index: 30 !important;
  pointer-events: auto !important;
  width: 38px; height: 38px; border-radius: 999px;
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.16);
  color: #fff;
}

html body #modalProductDetail .ix-modal-body.pd-modal-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  padding: 1rem 1.2rem 0.85rem !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}
html body #modalProductDetail .ix-modal-body.pd-modal-body::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

html body #modalProductDetail .pd-layout {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.75rem !important;
  width: 100% !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
}

html body #modalProductDetail .pd-top {
  display: grid !important;
  grid-template-columns: minmax(240px, 0.9fr) minmax(0, 1.25fr) !important;
  gap: 1.1rem !important;
  width: 100% !important;
  align-items: stretch !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
}

/* Gallery */
html body #modalProductDetail .pd-gallery {
  display: flex; flex-direction: column; gap: 0.5rem; min-width: 0;
}
html body #modalProductDetail .pd-main-img-wrap {
  width: 100%;
  aspect-ratio: 1 / 1;
  max-height: 300px;
  border-radius: 16px !important;
  border: 1px solid rgba(122, 143, 168, 0.25) !important;
  background: #050506 !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center; justify-content: center;
}
html body #modalProductDetail .pd-main-img {
  width: 100% !important; height: 100% !important;
  object-fit: contain !important; filter: none !important;
}
html body #modalProductDetail .pd-img-caption {
  padding: 0.45rem 0.7rem;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.04);
}
html body #modalProductDetail .pd-img-caption-label {
  display: block; font-size: 0.62rem; letter-spacing: 0.12em;
  text-transform: uppercase; color: rgba(255,255,255,.45);
}
html body #modalProductDetail .pd-img-caption-name {
  font-family: Orbitron, monospace; font-size: 0.95rem; font-weight: 700; color: #fff;
}
html body #modalProductDetail .pd-thumb {
  width: 56px !important; height: 56px !important;
  border-radius: 10px !important; object-fit: cover !important;
  border: 2px solid rgba(255,255,255,.22) !important;
}
html body #modalProductDetail .pd-share {
  display: flex; align-items: center; gap: 0.45rem;
  font-size: 0.78rem; color: rgba(255,255,255,.7);
}
html body #modalProductDetail .pd-share button {
  border-radius: 999px !important; padding: 0.28rem 0.7rem !important;
  font-size: 0.72rem !important; color: #fff !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  background: rgba(255,255,255,.08) !important;
  pointer-events: auto !important;
}

/* Content = ขวา: ชื่อ ราคา คลิป + คำอธิบายในช่องว่างใต้คลิป */
html body #modalProductDetail .pd-content {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.5rem !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: 100% !important;
}
html body #modalProductDetail .pd-head { color: #fff !important; font-size: 0.85rem !important; }
html body #modalProductDetail .pd-product-name {
  margin: 0 !important; color: #fff !important;
  font-size: clamp(1.15rem, 1.8vw, 1.4rem) !important; line-height: 1.25 !important;
}
html body #modalProductDetail .pd-meta-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: 0.65rem; flex-wrap: wrap;
}
html body #modalProductDetail .pd-price {
  color: #fff !important; font-weight: 900;
  font-size: clamp(1.3rem, 2vw, 1.65rem) !important;
}
html body #modalProductDetail .pd-stock > * {
  color: #fff !important; border-radius: 999px; padding: 0.28rem 0.65rem;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.14);
  font-size: 0.85rem;
}
html body #modalProductDetail .pd-media-stack {
  flex: 0 0 auto !important;
  width: 100% !important;
}
html body #modalProductDetail .pd-video-wrap[aria-hidden="true"] { display: none !important; }
html body #modalProductDetail .pd-video-wrap {
  width: 100% !important;
  flex: 0 0 auto !important;
}
html body #modalProductDetail .pd-video {
  position: relative !important;
  width: 100% !important;
  height: 0 !important;
  padding-top: 56.25% !important; /* 16:9 เต็มกรอบชัด */
  border-radius: 14px !important;
  overflow: hidden !important;
  background: #000 !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.35) !important;
}
html body #modalProductDetail .pd-video iframe {
  position: absolute !important;
  inset: 0 !important;
  top: 0 !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  display: block !important;
}

/* ── Description: อยู่ฝั่งขวาใต้คลิป เติมช่องว่าง ── */
html body #modalProductDetail .pd-content > .pd-desc-block,
html body #modalProductDetail .pd-desc-block {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.4rem !important;
  width: 100% !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  margin-top: 0.15rem !important;
}
html body #modalProductDetail .pd-desc-head,
html body #modalProductDetail .pd-desc-label {
  display: inline-flex !important; align-items: center !important; gap: 0.4rem !important;
  color: #e8eef6 !important; font-weight: 800 !important; font-size: 0.95rem !important;
  margin: 0 !important;
}
html body #modalProductDetail .pd-desc-wrap {
  width: 100% !important; box-sizing: border-box !important;
  flex: 1 1 auto !important;
  min-height: 96px !important;
  max-height: min(180px, 22vh) !important;
  border-radius: 14px !important;
  border: 1px solid rgba(122, 143, 168, 0.32) !important;
  background:
    linear-gradient(155deg, rgba(28, 32, 40, 0.95), rgba(14, 16, 20, 0.98)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
  padding: 0.85rem 0.55rem 0.85rem 1rem !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(154, 176, 204, 0.55) rgba(255,255,255,.06) !important;
}
/* แถบเลื่อนในกรอบคำอธิบาย — สวย บาง โค้ง */
html body #modalProductDetail .pd-desc-wrap::-webkit-scrollbar {
  width: 8px !important;
}
html body #modalProductDetail .pd-desc-wrap::-webkit-scrollbar-track {
  background: rgba(255,255,255,.05) !important;
  border-radius: 999px !important;
  margin: 8px 0 !important;
}
html body #modalProductDetail .pd-desc-wrap::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #9ab0cc 0%, #6a80a0 100%) !important;
  border-radius: 999px !important;
  border: 2px solid transparent !important;
  background-clip: padding-box !important;
  box-shadow: 0 0 8px rgba(122, 143, 168, 0.35);
}
html body #modalProductDetail .pd-desc-wrap::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #c5d4e6 0%, #8fa4bc 100%) !important;
  background-clip: padding-box !important;
}
html body #modalProductDetail .pd-desc-body {
  width: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
  height: auto !important;
  overflow: visible !important;
  color: #f0f4f8 !important;
  font-size: 1.02rem !important;
  line-height: 1.8 !important;
  padding-right: 0.45rem !important;
  scrollbar-width: auto !important;
}
html body #modalProductDetail .pd-desc-body::-webkit-scrollbar { width: 0 !important; height: 0 !important; }
html body #modalProductDetail .pd-desc-h {
  color: #fff !important; font-weight: 800 !important; font-size: 1.05rem !important;
  margin: 0.35rem 0 0.3rem !important;
}
html body #modalProductDetail .pd-desc-list,
html body #modalProductDetail .pd-desc-p,
html body #modalProductDetail .pd-desc-body p,
html body #modalProductDetail .pd-desc-body li {
  color: #f0f4f8 !important; font-size: 1.02rem !important; line-height: 1.8 !important;
}
html body #modalProductDetail .pd-desc-list { margin: 0.25rem 0 0.55rem 1.1rem !important; }

/* ── Buy bar ── */
html body #modalProductDetail .pd-buy-footer {
  flex: 0 0 auto !important;
  position: sticky !important;
  bottom: 0 !important;
  z-index: 15 !important;
  width: 100% !important;
  margin-top: auto !important;
  padding: 0.85rem 0 0.35rem !important;
  border-top: 1px solid rgba(122, 143, 168, 0.22) !important;
  background: linear-gradient(180deg, rgba(11,12,16,0), rgba(11,12,16,.97) 28%, #0b0c10 100%) !important;
  display: grid !important;
  grid-template-columns: auto 1fr !important;
  gap: 0.85rem 1rem !important;
  align-items: end !important;
}
html body #modalProductDetail .pd-qty-wrap {
  margin: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.3rem !important;
}
html body #modalProductDetail .pd-qty-label {
  font-size: 0.82rem !important; color: rgba(255,255,255,.85) !important; font-weight: 600 !important;
}
html body #modalProductDetail .pd-qty-row {
  display: flex !important; align-items: center !important; gap: 0.45rem !important;
}
html body #modalProductDetail .pd-qty-btn {
  width: 40px !important; height: 40px !important; border-radius: 999px !important;
  border: 1px solid rgba(122, 143, 168, 0.35) !important;
  background: rgba(122, 143, 168, 0.12) !important; color: #fff !important;
  pointer-events: auto !important;
  transition: background .2s ease, box-shadow .2s ease, transform .15s ease;
}
html body #modalProductDetail .pd-qty-btn:hover {
  background: rgba(122, 143, 168, 0.28) !important;
  box-shadow: 0 0 12px rgba(122, 143, 168, 0.35);
}

html body #modalProductDetail .pd-qty-input {
  width: 58px !important; height: 40px !important; border-radius: 999px !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  background: rgba(255,255,255,.08) !important; color: #fff !important;
  text-align: center !important; font-size: 1rem !important;
}

/* ── ปุ่มสั่งซื้อ: สีเข้มตามตัวอย่างในหน้ารายละเอียด ── */
@keyframes pdBuyShineDark {
  0% { transform: translateX(-130%) skewX(-18deg); opacity: 0; }
  20% { opacity: 0.35; }
  45% { transform: translateX(160%) skewX(-18deg); opacity: 0; }
  100% { transform: translateX(160%) skewX(-18deg); opacity: 0; }
}

html body #modalProductDetail #pdBuyBtn.pd-buy-btn,
html body #modalProductDetail .pd-buy-btn.sf-btn-buy,
html body #modalProductDetail .pd-buy-btn.buy-btn-premium {
  width: 100% !important;
  min-height: 52px !important; height: 52px !important;
  border-radius: 999px !important;
  font-size: 1.08rem !important; font-weight: 800 !important;
  letter-spacing: 0.06em !important;
  color: #ffffff !important;
  background: #141414 !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.06) !important;
  pointer-events: auto !important;
  position: relative !important;
  z-index: 16;
  overflow: hidden !important;
  isolation: isolate;
  animation: none !important;
  transition: background .18s ease, border-color .18s ease, transform .15s ease, box-shadow .18s ease;
}
html body #modalProductDetail #pdBuyBtn.pd-buy-btn .buy-btn-shine {
  position: absolute !important;
  inset: 0 auto 0 0 !important;
  width: 38% !important;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent) !important;
  pointer-events: none !important;
  animation: pdBuyShineDark 3.2s ease-in-out infinite;
  z-index: 1;
}
html body #modalProductDetail #pdBuyBtn.pd-buy-btn .buy-btn-inner {
  position: relative; z-index: 2;
  display: inline-flex; align-items: center; justify-content: center; gap: 0.45rem;
  width: 100%; height: 100%;
}
html body #modalProductDetail #pdBuyBtn.pd-buy-btn .buy-btn-text,
html body #modalProductDetail #pdBuyBtn.pd-buy-btn .buy-btn-icon,
html body #modalProductDetail .pd-buy-btn .buy-btn-inner {
  color: #ffffff !important;
  text-shadow: none !important;
}
html body #modalProductDetail #pdBuyBtn.pd-buy-btn:hover:not(:disabled),
html body #modalProductDetail .pd-buy-btn.sf-btn-buy:hover:not(:disabled) {
  background: #1c1c1c !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.22) !important;
  transform: translateY(-1px);
  filter: none;
  box-shadow: 0 10px 28px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.1) !important;
}
html body #modalProductDetail #pdBuyBtn.pd-buy-btn:active:not(:disabled) {
  transform: translateY(0) scale(0.99);
  background: #101010 !important;
}

/* ══════════════ PC ≥1024 ══════════════ */
@media (min-width: 1024px) {
  html body #modalProductDetail .pd-main-img-wrap { max-height: 320px; }
  html body #modalProductDetail .pd-video { padding-top: 56.25% !important; }
  html body #modalProductDetail .pd-desc-body {
    font-size: 1.05rem !important; line-height: 1.8 !important;
  }
  html body #modalProductDetail .pd-buy-footer {
    grid-template-columns: auto minmax(280px, 1fr) !important;
  }
}

/* ══════════════ NOTEBOOK 768–1023 ══════════════ */
@media (min-width: 768px) and (max-width: 1023px) {
  html body #modalProductDetail .ix-modal.pd-modal-wide,
  html body #modalProductDetail .ix-modal {
    width: calc(100vw - 0.85rem) !important;
    max-width: calc(100vw - 0.85rem) !important;
    max-height: calc(100dvh - 0.85rem) !important;
  }
  html body #modalProductDetail .pd-top {
    grid-template-columns: minmax(200px, 0.85fr) minmax(0, 1.3fr) !important;
    gap: 0.9rem !important;
  }
  html body #modalProductDetail .pd-main-img-wrap { max-height: 250px; }
  html body #modalProductDetail .pd-video { padding-top: 56.25% !important; }
  html body #modalProductDetail .pd-desc-wrap {
    padding: 0.8rem 0.5rem 0.8rem 0.95rem !important;
    max-height: min(180px, 26vh) !important;
    overflow-y: auto !important;
  }
  html body #modalProductDetail .pd-desc-body {
    font-size: 1rem !important; line-height: 1.75 !important;
    max-height: none !important; overflow: visible !important;
  }
  html body #modalProductDetail .pd-buy-footer {
    grid-template-columns: auto 1fr !important;
  }
}

html[data-device="notebook"] #modalProductDetail .pd-buy-footer,
html[data-device="desktop"] #modalProductDetail .pd-buy-footer {
  position: sticky !important; bottom: 0 !important;
}

/* ══════════════ MOBILE <768 — คำอธิบายอยู่ใต้รูปตามลำดับปกติ ══════════════ */
@media (max-width: 767px) {
  html body #modalProductDetail .ix-modal.pd-modal-wide,
  html body #modalProductDetail .ix-modal {
    width: calc(100vw - 0.5rem) !important;
    max-width: calc(100vw - 0.5rem) !important;
    max-height: calc(100dvh - 0.5rem) !important;
    border-radius: 16px !important;
  }
  html body #modalProductDetail .pd-top {
    grid-template-columns: 1fr !important;
  }
  html body #modalProductDetail .pd-main-img-wrap {
    max-height: none; aspect-ratio: 1 / 1;
  }
  html body #modalProductDetail .pd-video { padding-top: 56.25% !important; }
  html body #modalProductDetail .pd-desc-wrap {
    max-height: min(200px, 32vh) !important;
    overflow-y: auto !important;
  }
  html body #modalProductDetail .pd-desc-body {
    max-height: none !important; overflow: visible !important;
    font-size: 1.05rem !important;
  }
  html body #modalProductDetail .pd-buy-footer {
    grid-template-columns: 1fr !important;
    gap: 0.65rem !important;
  }
  html body #modalProductDetail #pdBuyBtn.pd-buy-btn {
    background: #141414 !important;
    color: #fff !important;
  }
}

/* PC: กรอบคำอธิบายสูงพอเลื่อนดู */
@media (min-width: 1024px) {
  html body #modalProductDetail .pd-desc-wrap {
    max-height: min(180px, 22vh) !important;
  }
}

html[data-device="mobile"] #modalProductDetail .pd-top,
html[data-device="phone"] #modalProductDetail .pd-top {
  grid-template-columns: 1fr !important;
}

/* ── Final overrides (ชนะ inline / sf-btn) ── */
html body #modalProductDetail .pd-desc-wrap#pdDescWrap,
html body #modalProductDetail #pdDescWrap.pd-desc-wrap {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  max-height: min(180px, 22vh) !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(154, 176, 204, 0.65) rgba(255,255,255,.07) !important;
}
html body #modalProductDetail #pdBuyBtn.sf-btn-buy,
html body #modalProductDetail #pdBuyBtn.pd-buy-btn,
html body #modalProductDetail button#pdBuyBtn {
  background: #141414 !important;
  background-image: none !important;
  color: #ffffff !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.45) !important;
}
html body #modalProductDetail #pdBuyBtn.sf-btn-buy:hover:not(:disabled),
html body #modalProductDetail button#pdBuyBtn:hover:not(:disabled) {
  background: #1c1c1c !important;
  background-image: none !important;
  color: #ffffff !important;
  border-color: rgba(255,255,255,.22) !important;
}


/* ── v19: สต็อกใหญ่ขึ้น + จัดเลขตรง + ซ่อนแทบเลื่อนช่องจำนวน ── */
html body #modalProductDetail .pd-stock {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
}
html body #modalProductDetail .pd-stock .stock-badge,
html body #modalProductDetail .pd-stock .stock-badge--detail {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.55rem !important;
  padding: 0.48rem 0.95rem 0.48rem 0.55rem !important;
  border-radius: 999px !important;
  font-size: 1rem !important;
  line-height: 1 !important;
  min-height: 42px !important;
  background: rgba(255,255,255,.08) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
}
html body #modalProductDetail .pd-stock .stock-badge-icon {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
html body #modalProductDetail .pd-stock .stock-badge-icon svg {
  width: 15px !important;
  height: 15px !important;
}
html body #modalProductDetail .pd-stock .stock-badge-qty {
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 0.28rem !important;
  font-size: 1rem !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}
html body #modalProductDetail .pd-stock .stock-badge-qty strong {
  font-size: 1.28rem !important;
  font-weight: 800 !important;
  color: #fff !important;
  letter-spacing: 0.02em !important;
}
html body #modalProductDetail .pd-stock .stock-badge-unit {
  font-size: 0.92rem !important;
  color: rgba(255,255,255,.78) !important;
  font-weight: 600 !important;
}

/* ซ่อน spinner / แทบเลื่อนของ input number */
html body #modalProductDetail #pdQtyInput.pd-qty-input,
html body #modalProductDetail .pd-qty-input {
  -moz-appearance: textfield !important;
  appearance: textfield !important;
  text-align: center !important;
  padding: 0 0.35rem !important;
}
html body #modalProductDetail #pdQtyInput.pd-qty-input::-webkit-outer-spin-button,
html body #modalProductDetail #pdQtyInput.pd-qty-input::-webkit-inner-spin-button,
html body #modalProductDetail .pd-qty-input::-webkit-outer-spin-button,
html body #modalProductDetail .pd-qty-input::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
  margin: 0 !important;
  display: none !important;
  height: 0 !important;
  width: 0 !important;
}


/* ── v20: กรอบรายละเอียดพรีเมียม + เรืองแสง ── */
@keyframes pdPremiumGlow {
  0%, 100% { box-shadow: 0 0 0 1px rgba(154,176,204,.22), 0 0 22px rgba(106,128,160,.18), 0 18px 40px rgba(0,0,0,.45); }
  50% { box-shadow: 0 0 0 1px rgba(190,210,235,.38), 0 0 34px rgba(122,143,168,.32), 0 18px 44px rgba(0,0,0,.5); }
}
@keyframes pdFrameShimmer {
  0% { background-position: 0% 50%; }
  100% { background-position: 200% 50%; }
}

html body #modalProductDetail .ix-modal.pd-modal-wide,
html body #modalProductDetail .ix-modal {
  border: 1px solid transparent !important;
  background:
    linear-gradient(165deg, #1a1d24 0%, #0c0e13 55%, #090a0e 100%) padding-box,
    linear-gradient(135deg, rgba(180,200,230,.55), rgba(80,100,130,.15) 40%, rgba(160,190,230,.4) 100%) border-box !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.04) inset,
    0 0 40px rgba(106,128,160,.2),
    0 28px 70px rgba(0,0,0,.65) !important;
  position: relative !important;
}
html body #modalProductDetail .ix-modal.pd-modal-wide::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: inherit !important;
  pointer-events: none !important;
  background:
    radial-gradient(ellipse 80% 40% at 50% -10%, rgba(154,176,204,.16), transparent 55%),
    radial-gradient(ellipse 50% 30% at 100% 100%, rgba(90,120,160,.1), transparent 50%);
  z-index: 0 !important;
}
html body #modalProductDetail .ix-modal-body.pd-modal-body {
  position: relative !important;
  z-index: 1 !important;
}

/* กรอบรูปสินค้า */
html body #modalProductDetail .pd-main-img-wrap {
  border: 1px solid transparent !important;
  background:
    #050506 padding-box,
    linear-gradient(145deg, rgba(210,225,245,.55), rgba(70,90,120,.2) 45%, rgba(160,185,220,.45)) border-box !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.04) inset,
    0 0 28px rgba(122,143,168,.28),
    0 12px 28px rgba(0,0,0,.45) !important;
  animation: none !important;
}
html body #modalProductDetail .pd-img-caption {
  border: 1px solid rgba(154,176,204,.28) !important;
  background: linear-gradient(135deg, rgba(122,143,168,.14), rgba(255,255,255,.03)) !important;
  box-shadow: 0 0 16px rgba(106,128,160,.12) !important;
}
html body #modalProductDetail .pd-thumb {
  border: 2px solid rgba(170,195,225,.45) !important;
  box-shadow: 0 0 14px rgba(122,143,168,.35) !important;
}


/* กรอบคำอธิบาย */
html body #modalProductDetail .pd-desc-wrap,
html body #modalProductDetail #pdDescWrap.pd-desc-wrap {
  /* neutralized by v29 */
}
html body #modalProductDetail .pd-desc-head,
html body #modalProductDetail .pd-desc-label {
  /* text-shadow moved to v29 pill */
}

/* แถวราคา + สต็อก */
html body #modalProductDetail .pd-price {
  text-shadow: 0 0 22px rgba(255,255,255,.18);
}
/* stock gradient REMOVED by v30 */

/* ปุ่ม +/- และช่องจำนวน */
html body #modalProductDetail .pd-qty-btn {
  border: 1px solid rgba(170,195,225,.35) !important;
  box-shadow: 0 0 12px rgba(106,128,160,.2) !important;
}
html body #modalProductDetail .pd-qty-input {
  border: 1px solid rgba(170,195,225,.3) !important;
  box-shadow: 0 0 12px rgba(106,128,160,.15) inset !important;
}

/* ปุ่มสั่งซื้อ — ขอบเรืองแสงพรีเมียมบนพื้นเข้ม */
html body #modalProductDetail #pdBuyBtn.pd-buy-btn,
html body #modalProductDetail button#pdBuyBtn {
  border: 1px solid rgba(190,210,235,.35) !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.06) inset,
    0 0 22px rgba(122,143,168,.28),
    0 10px 28px rgba(0,0,0,.45) !important;
}
html body #modalProductDetail #pdBuyBtn.pd-buy-btn:hover:not(:disabled),
html body #modalProductDetail button#pdBuyBtn:hover:not(:disabled) {
  border-color: rgba(220,235,255,.5) !important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.1) inset,
    0 0 32px rgba(154,176,204,.45),
    0 12px 32px rgba(0,0,0,.5) !important;
}

html body #modalProductDetail .pd-buy-footer {
  border-top: 1px solid rgba(154,176,204,.22) !important;
  box-shadow: 0 -12px 28px rgba(0,0,0,.25) !important;
}

@media (prefers-reduced-motion: reduce) {
  html body #modalProductDetail .pd-main-img-wrap { animation: none !important; }
}


/* ── v26: ไม่มีเส้นครอบ · เหลือแค่คลิปมุมโค้ง ── */
html body #modalProductDetail .pd-media-stack {
  background: transparent !important;
}

html body #modalProductDetail .pd-video-wrap {
  width: 100% !important;
  flex: 0 0 auto !important;
  position: relative !important;
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 14px !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  overflow: hidden !important;
  clip-path: inset(0 round 14px) !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
  contain: paint !important;
  transform: none !important;
}
html body #modalProductDetail .pd-video-wrap[aria-hidden="true"] {
  display: none !important;
}
html body #modalProductDetail .pd-video-wrap::before,
html body #modalProductDetail .pd-video-wrap::after {
  content: none !important;
  display: none !important;
}

html body #modalProductDetail .pd-video {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 16 / 9 !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  background: #000 !important;
  background-image: none !important;
  box-shadow: none !important;
  clip-path: inset(0 round 14px) !important;
  transform: none !important;
}
html body #modalProductDetail .pd-video::before,
html body #modalProductDetail .pd-video::after {
  content: none !important;
  display: none !important;
}

html body #modalProductDetail .pd-video iframe,
html body #modalProductDetail .pd-video .pd-yt {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  border: 0 !important;
  border-radius: 14px !important;
  display: block !important;
  background: #000 !important;
  transform: none !important;
  filter: none !important;
  box-shadow: none !important;
}


/* ── v30 ROOT FIX: มวลโค้งจริง · ตัดไล่สี/รอยตรง · overflow ซ่อนมุมตัด ── */
html body #modalProductDetail .pd-stock .stock-badge,
html body #modalProductDetail .pd-stock .stock-badge--detail,
html body #modalProductDetail .pd-stock .stock-badge.stock-ok,
html body #modalProductDetail .pd-stock .stock-badge.stock-badge--detail {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.45rem !important;
  width: fit-content !important;
  padding: 0.4rem 0.85rem 0.4rem 0.4rem !important;
  border-radius: 999px !important;
  border: 1px solid rgba(190, 210, 235, 0.4) !important;
  background-color: #151922 !important;
  background-image: none !important;
  background: #151922 !important;
  box-shadow: 0 0 16px rgba(130, 160, 200, 0.3) !important;
  overflow: hidden !important; /* สำคัญ: ตัดมุมตรงภายใน */
  isolation: isolate !important;
  filter: none !important;
  animation: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}
html body #modalProductDetail .pd-stock .stock-badge *,
html body #modalProductDetail .pd-stock .stock-badge--detail * {
  background-image: none !important;
}
html body #modalProductDetail .pd-stock .stock-badge-icon {
  border-radius: 999px !important;
  overflow: hidden !important;
  background: rgba(140, 170, 205, 0.18) !important;
  background-image: none !important;
  border: 1px solid rgba(190, 210, 235, 0.35) !important;
  box-shadow: none !important;
}
html body #modalProductDetail .pd-stock .stock-badge-qty,
html body #modalProductDetail .pd-stock .stock-badge-qty strong,
html body #modalProductDetail .pd-stock .stock-badge-unit {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
  border-radius: 0 !important;
}

html body #modalProductDetail .pd-desc-head,
html body #modalProductDetail .pd-desc-label,
html body #modalProductDetail #pdDescBlock .pd-desc-head.pd-desc-label {
  display: inline-flex !important;
  width: fit-content !important;
  align-items: center !important;
  gap: 0.4rem !important;
  padding: 0.35rem 0.8rem 0.35rem 0.5rem !important;
  border-radius: 999px !important;
  border: 1px solid rgba(180, 200, 225, 0.3) !important;
  background-color: #151922 !important;
  background-image: none !important;
  background: #151922 !important;
  box-shadow: 0 0 12px rgba(130, 160, 200, 0.22) !important;
  text-shadow: none !important;
  overflow: hidden !important; /* สำคัญ: ไม่ให้เห็นมุมตัดด้านใน */
  isolation: isolate !important;
  flex: 0 0 auto !important;
  align-self: flex-start !important;
}
html body #modalProductDetail .pd-desc-head *,
html body #modalProductDetail .pd-desc-label * {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

html body #modalProductDetail .pd-desc-wrap,
html body #modalProductDetail #pdDescWrap {
  background-color: #0e1016 !important;
  background-image: none !important;
  background: #0e1016 !important;
  box-shadow: none !important;
  border: 1px solid rgba(150, 170, 200, 0.22) !important;
  border-radius: 14px !important;
  overflow: hidden !important;
}


/* ── v31: Glow ตาม border-radius จริง (drop-shadow) · ไม่เบี้ยว/ไม่เป็นสี่เหลี่ยม ── */
html body #modalProductDetail .pd-stock,
html body #modalProductDetail .pd-meta-row {
  overflow: visible !important;
  background: transparent !important;
  background-image: none !important;
}

html body #modalProductDetail .pd-stock .stock-badge,
html body #modalProductDetail .pd-stock .stock-badge--detail,
html body #modalProductDetail .pd-stock .stock-badge.stock-ok {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.45rem !important;
  width: fit-content !important;
  padding: 0.4rem 0.85rem 0.4rem 0.4rem !important;
  border-radius: 999px !important;
  border: 1px solid rgba(200, 220, 245, 0.38) !important;
  background: #151922 !important;
  background-color: #151922 !important;
  background-image: none !important;
  /* ห้าม box-shadow แบบ blur ใหญ่ที่ดูเป็นสี่เหลี่ยม */
  box-shadow: none !important;
  overflow: hidden !important;
  isolation: auto !important;
  /* drop-shadow ตามรูปทรง alpha ของปุ่มโค้งเป๊ะ */
  filter:
    drop-shadow(0 0 1px rgba(200, 220, 245, 0.55))
    drop-shadow(0 0 6px rgba(150, 180, 220, 0.55))
    drop-shadow(0 0 14px rgba(120, 160, 200, 0.35)) !important;
  -webkit-filter:
    drop-shadow(0 0 1px rgba(200, 220, 245, 0.55))
    drop-shadow(0 0 6px rgba(150, 180, 220, 0.55))
    drop-shadow(0 0 14px rgba(120, 160, 200, 0.35)) !important;
  animation: none !important;
  transform: translateZ(0);
}
html body #modalProductDetail .pd-stock .stock-badge::before,
html body #modalProductDetail .pd-stock .stock-badge::after,
html body #modalProductDetail .pd-stock .stock-badge--detail::before,
html body #modalProductDetail .pd-stock .stock-badge--detail::after {
  content: none !important;
  display: none !important;
}
html body #modalProductDetail .pd-stock .stock-badge-icon {
  border-radius: 999px !important;
  background: rgba(150, 180, 220, 0.16) !important;
  background-image: none !important;
  border: 1px solid rgba(200, 220, 245, 0.35) !important;
  box-shadow: none !important;
  filter: none !important;
}
html body #modalProductDetail .pd-stock .stock-badge-qty,
html body #modalProductDetail .pd-stock .stock-badge-qty strong,
html body #modalProductDetail .pd-stock .stock-badge-unit {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
}

html body #modalProductDetail .pd-desc-block {
  overflow: visible !important;
  background: transparent !important;
}
html body #modalProductDetail .pd-desc-head,
html body #modalProductDetail .pd-desc-label,
html body #modalProductDetail #pdDescBlock .pd-desc-head.pd-desc-label {
  position: relative !important;
  display: inline-flex !important;
  width: fit-content !important;
  align-items: center !important;
  gap: 0.4rem !important;
  padding: 0.35rem 0.8rem 0.35rem 0.5rem !important;
  border-radius: 999px !important;
  border: 1px solid rgba(190, 210, 235, 0.35) !important;
  background: #151922 !important;
  background-color: #151922 !important;
  background-image: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
  overflow: hidden !important;
  flex: 0 0 auto !important;
  align-self: flex-start !important;
  filter:
    drop-shadow(0 0 1px rgba(200, 220, 245, 0.5))
    drop-shadow(0 0 6px rgba(150, 180, 220, 0.5))
    drop-shadow(0 0 12px rgba(120, 160, 200, 0.32)) !important;
  -webkit-filter:
    drop-shadow(0 0 1px rgba(200, 220, 245, 0.5))
    drop-shadow(0 0 6px rgba(150, 180, 220, 0.5))
    drop-shadow(0 0 12px rgba(120, 160, 200, 0.32)) !important;
}
html body #modalProductDetail .pd-desc-head::before,
html body #modalProductDetail .pd-desc-head::after,
html body #modalProductDetail .pd-desc-label::before,
html body #modalProductDetail .pd-desc-label::after {
  content: none !important;
  display: none !important;
}
html body #modalProductDetail .pd-desc-head *,
html body #modalProductDetail .pd-desc-label * {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
}


/* ── v32: Buy button glow ตาม border-radius (drop-shadow) ── */
html body #modalProductDetail #pdBuyBtn.pd-buy-btn,
html body #modalProductDetail .pd-buy-btn.sf-btn-buy,
html body #modalProductDetail .pd-buy-btn.buy-btn-premium,
html body #modalProductDetail #pdBuyBtn.pd-buy-btn:hover:not(:disabled),
html body #modalProductDetail .pd-buy-btn.sf-btn-buy:hover:not(:disabled) {
  border-radius: 999px !important;
  background: #141414 !important;
  background-image: none !important;
  /* เก็บแค่เส้นขอบบาง + เงาตามรูปทรง */
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06) !important;
  filter:
    drop-shadow(0 0 1px rgba(200, 220, 245, 0.35))
    drop-shadow(0 0 10px rgba(122, 143, 168, 0.38))
    drop-shadow(0 8px 20px rgba(0, 0, 0, 0.45)) !important;
  -webkit-filter:
    drop-shadow(0 0 1px rgba(200, 220, 245, 0.35))
    drop-shadow(0 0 10px rgba(122, 143, 168, 0.38))
    drop-shadow(0 8px 20px rgba(0, 0, 0, 0.45)) !important;
  overflow: visible !important;
}
html body #modalProductDetail #pdBuyBtn.pd-buy-btn::before,
html body #modalProductDetail #pdBuyBtn.pd-buy-btn::after {
  content: none !important;
  display: none !important;
}
html body #modalProductDetail .pd-buy-footer {
  overflow: visible !important;
}

/* end v32 */


/* ── v33: ชั้นพื้นหลังซ้อนทับโค้งตาม border-radius (ไม่เป็นสี่เหลี่ยมคม) ── */
html body #modalProductDetail .pd-stock .stock-badge,
html body #modalProductDetail .pd-stock .stock-badge--detail,
html body #modalProductDetail .pd-stock .stock-badge.stock-ok,
html body #modalProductDetail .pd-desc-head,
html body #modalProductDetail .pd-desc-label,
html body #modalProductDetail #pdDescBlock .pd-desc-head.pd-desc-label {
  position: relative !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  isolation: auto !important;
  /* สาเหตุรอยสี่เหลี่ยม: backdrop-filter ไม่ตามมุมโค้ง */
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background-clip: padding-box !important;
  -webkit-background-clip: padding-box !important;
}

/* ปิด pseudo สี่เหลี่ยมเก่า */
html body #modalProductDetail .pd-stock .stock-badge::before,
html body #modalProductDetail .pd-stock .stock-badge--detail::before,
html body #modalProductDetail .pd-desc-head::before,
html body #modalProductDetail .pd-desc-label::before {
  content: none !important;
  display: none !important;
}

/* glow ตามรูปทรง: ใส่ที่ parent ที่ overflow:visible + drop-shadow */
html body #modalProductDetail .pd-stock {
  overflow: visible !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body #modalProductDetail .pd-stock .stock-badge,
html body #modalProductDetail .pd-stock .stock-badge--detail,
html body #modalProductDetail .pd-stock .stock-badge.stock-ok {
  /* drop-shadow ตาม alpha หลังคลิปแคปซูลแล้ว */
  filter:
    drop-shadow(0 0 1px rgba(200, 220, 245, 0.5))
    drop-shadow(0 0 7px rgba(150, 180, 220, 0.45))
    drop-shadow(0 0 16px rgba(120, 160, 200, 0.28)) !important;
  -webkit-filter:
    drop-shadow(0 0 1px rgba(200, 220, 245, 0.5))
    drop-shadow(0 0 7px rgba(150, 180, 220, 0.45))
    drop-shadow(0 0 16px rgba(120, 160, 200, 0.28)) !important;
  box-shadow: none !important;
}

html body #modalProductDetail .pd-desc-block,
html body #modalProductDetail #pdDescBlock {
  overflow: visible !important;
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html body #modalProductDetail .pd-desc-head,
html body #modalProductDetail .pd-desc-label,
html body #modalProductDetail #pdDescBlock .pd-desc-head.pd-desc-label {
  filter:
    drop-shadow(0 0 1px rgba(200, 220, 245, 0.45))
    drop-shadow(0 0 6px rgba(150, 180, 220, 0.4))
    drop-shadow(0 0 14px rgba(120, 160, 200, 0.24)) !important;
  -webkit-filter:
    drop-shadow(0 0 1px rgba(200, 220, 245, 0.45))
    drop-shadow(0 0 6px rgba(150, 180, 220, 0.4))
    drop-shadow(0 0 14px rgba(120, 160, 200, 0.24)) !important;
  box-shadow: none !important;
}

/* กรอบคำอธิบาย: พื้นหลังเข้มโค้งตามกรอบ */
html body #modalProductDetail .pd-desc-wrap,
html body #modalProductDetail #pdDescWrap.pd-desc-wrap,
html body #modalProductDetail #pdDescWrap {
  border-radius: 14px !important;
  overflow: hidden !important;
  background-clip: padding-box !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  isolation: auto !important;
}

/* ปิด backdrop จากกฎ .stock-badge ทั่วไซต์ */
html body .stock-badge,
html body .stock-badge--detail {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* end v33 */


/* ── v34: ชั้นซ้อนทับโค้งตามปุ่ม · ไม่มีสี่เหลี่ยมคมจาก filter/backdrop ── */
html body #modalProductDetail .pd-stock .stock-badge,
html body #modalProductDetail .pd-stock .stock-badge--detail,
html body #modalProductDetail .pd-stock .stock-badge.stock-ok,
html body #modalProductDetail .pd-desc-head,
html body #modalProductDetail .pd-desc-label,
html body #modalProductDetail #pdDescBlock .pd-desc-head.pd-desc-label {
  position: relative !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  isolation: auto !important;
  transform: translateZ(0);
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  background-clip: padding-box !important;
  /* ห้าม filter: ทำให้เกิดชั้นสี่เหลี่ยมรอบเงา */
  filter: none !important;
  -webkit-filter: none !important;
  /* เงาตาม border-radius ของแคปซูล */
  box-shadow:
    0 0 0 1px rgba(200, 220, 245, 0.36),
    0 0 8px rgba(150, 180, 220, 0.32),
    0 0 18px rgba(120, 160, 200, 0.18) !important;
}

html body #modalProductDetail .pd-stock .stock-badge::before,
html body #modalProductDetail .pd-stock .stock-badge::after,
html body #modalProductDetail .pd-stock .stock-badge--detail::before,
html body #modalProductDetail .pd-stock .stock-badge--detail::after,
html body #modalProductDetail .pd-desc-head::before,
html body #modalProductDetail .pd-desc-head::after,
html body #modalProductDetail .pd-desc-label::before,
html body #modalProductDetail .pd-desc-label::after {
  content: none !important;
  display: none !important;
}

/* ไอคอนหัวคำอธิบาย: วงกลม ไม่ให้พื้นอิโมจิตัดมุม */
html body #modalProductDetail .pd-desc-head-icon {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 22px !important;
  height: 22px !important;
  min-width: 22px !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  background: rgba(150, 180, 220, 0.14) !important;
  border: 1px solid rgba(200, 220, 245, 0.28) !important;
  line-height: 1 !important;
  font-size: 0.78rem !important;
}

/* กรอบคำอธิบายด้านใน */
html body #modalProductDetail .pd-desc-wrap,
html body #modalProductDetail #pdDescWrap {
  border-radius: 14px !important;
  overflow: hidden !important;
  background-clip: padding-box !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  filter: none !important;
}

html body .stock-badge,
html body .stock-badge--detail {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  filter: none !important;
}

/* end v34 */


/* ── v35: เงาขนานขอบโค้ง · ไม่มีแผ่นสี่เหลี่ยมซ้อนทับ ── */
html body #modalProductDetail .pd-stock .stock-badge,
html body #modalProductDetail .pd-stock .stock-badge--detail,
html body #modalProductDetail .pd-stock .stock-badge.stock-ok,
html body #modalProductDetail .pd-desc-head,
html body #modalProductDetail .pd-desc-label,
html body #modalProductDetail #pdDescBlock .pd-desc-head.pd-desc-label {
  filter: none !important;
  -webkit-filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  isolation: auto !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  /* เงาบางๆ ตามขอบโค้งเท่านั้น ไม่เบลอใหญ่จนดูเป็นแผ่นสี่เหลี่ยม */
  box-shadow:
    0 0 0 1px rgba(200, 220, 245, 0.4),
    0 0 6px rgba(160, 185, 220, 0.28) !important;
}

html body #modalProductDetail #pdBuyBtn.pd-buy-btn,
html body #modalProductDetail .pd-buy-btn.sf-btn-buy,
html body #modalProductDetail .pd-buy-btn.buy-btn-premium,
html body #modalProductDetail #pdBuyBtn.pd-buy-btn:hover:not(:disabled),
html body #modalProductDetail .pd-buy-btn.sf-btn-buy:hover:not(:disabled) {
  filter: none !important;
  -webkit-filter: none !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06),
    0 0 0 1px rgba(200, 220, 245, 0.28),
    0 0 10px rgba(122, 143, 168, 0.28),
    0 8px 20px rgba(0, 0, 0, 0.4) !important;
}

/* กรอบคำอธิบาย: มุมโค้งชัด */
html body #modalProductDetail .pd-desc-wrap,
html body #modalProductDetail #pdDescWrap {
  border-radius: 14px !important;
  overflow: hidden !important;
  background-clip: padding-box !important;
}

/* end v35 */


/* ── v36: แก้แสงโดนตัดมุมเดียว (overflow parent) ──
   สาเหตุ: .pd-content / ปุ่ม overflow:hidden + ชิดขอบซ้าย-ขวา
   → เงาด้านที่ชิดขอบถูกตัดเป็นเส้นตรง สีไม่เท่ากัน ── */
html body #modalProductDetail .pd-content {
  overflow: visible !important;
  overflow-x: visible !important;
  overflow-y: visible !important;
}

html body #modalProductDetail .ix-modal-body.pd-modal-body {
  overflow-x: visible !important;
}

html body #modalProductDetail .pd-meta-row {
  overflow: visible !important;
  /* เว้นขวาให้เงาสต็อกไม่ชนขอบคลิป */
  padding-right: 12px !important;
  box-sizing: border-box !important;
}

html body #modalProductDetail .pd-stock {
  overflow: visible !important;
  margin-right: 2px !important;
}

html body #modalProductDetail .pd-desc-block,
html body #modalProductDetail #pdDescBlock {
  overflow: visible !important;
  /* เว้นซ้ายให้เงาหัวคำอธิบายไม่โดนตัด */
  padding-left: 12px !important;
  margin-left: -4px !important;
  box-sizing: border-box !important;
}

/* ปุ่มเองต้อง visible ไม่งั้น box-shadow โดนตัดรอบตัว */
html body #modalProductDetail .pd-stock .stock-badge,
html body #modalProductDetail .pd-stock .stock-badge--detail,
html body #modalProductDetail .pd-stock .stock-badge.stock-ok,
html body #modalProductDetail .pd-desc-head,
html body #modalProductDetail .pd-desc-label,
html body #modalProductDetail #pdDescBlock .pd-desc-head.pd-desc-label {
  overflow: visible !important;
  isolation: auto !important;
  filter: none !important;
  -webkit-filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-radius: 999px !important;
  background-clip: padding-box !important;
  /* เงาสมมาตรรอบแคปซูล */
  box-shadow:
    0 0 0 1px rgba(200, 220, 245, 0.42),
    0 0 8px rgba(150, 180, 220, 0.38),
    0 0 16px rgba(120, 160, 200, 0.2) !important;
}

/* ไอคอนยังคลิปวงกลมได้ */
html body #modalProductDetail .pd-stock .stock-badge-icon,
html body #modalProductDetail .pd-desc-head-icon {
  overflow: hidden !important;
  border-radius: 999px !important;
}

/* end v36 */


/* ── v37: แก้มุมตัด + สีไม่เท่า (clip + วงไอคอน) ── */
/* 1) เปิดทางให้เงาไม่โดนตัดที่ขอบซ้าย/ขวา */
html body #modalProductDetail .pd-content {
  overflow: visible !important;
  overflow-x: visible !important;
  overflow-y: visible !important;
}
html body #modalProductDetail .ix-modal-body.pd-modal-body {
  overflow-x: visible !important;
  padding-left: 10px !important;
  padding-right: 14px !important;
  box-sizing: border-box !important;
}
html body #modalProductDetail .pd-meta-row {
  overflow: visible !important;
  padding-right: 28px !important;
  box-sizing: border-box !important;
}
html body #modalProductDetail .pd-stock {
  overflow: visible !important;
  padding: 12px !important;
  margin: -12px -12px -12px 0 !important;
  box-sizing: content-box !important;
}
html body #modalProductDetail .pd-desc-block,
html body #modalProductDetail #pdDescBlock {
  overflow: visible !important;
  padding: 14px 10px 10px 14px !important;
  margin: -10px -6px 0 -6px !important;
  box-sizing: border-box !important;
}

/* 2) ปุ่ม: overflow visible ให้เงาครบรอบ · สีพื้นสม่ำเสมอ */
html body #modalProductDetail .pd-stock .stock-badge,
html body #modalProductDetail .pd-stock .stock-badge--detail,
html body #modalProductDetail .pd-stock .stock-badge.stock-ok,
html body #modalProductDetail .pd-desc-head,
html body #modalProductDetail .pd-desc-label,
html body #modalProductDetail #pdDescBlock .pd-desc-head.pd-desc-label {
  overflow: visible !important;
  isolation: auto !important;
  filter: none !important;
  -webkit-filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-radius: 999px !important;
  background: #151922 !important;
  background-color: #151922 !important;
  background-image: none !important;
  background-clip: padding-box !important;
  border: 1px solid rgba(200, 220, 245, 0.4) !important;
  box-shadow:
    0 0 0 1px rgba(200, 220, 245, 0.18),
    0 0 10px rgba(150, 180, 220, 0.4),
    0 0 18px rgba(120, 160, 200, 0.22) !important;
}

/* 3) วงไอคอน: สีเดียวกับปุ่ม — ไม่ให้ดูเป็นแผ่นตัดสีคนละโทน */
html body #modalProductDetail .pd-stock .stock-badge-icon,
html body #modalProductDetail .pd-desc-head-icon {
  background: #151922 !important;
  background-color: #151922 !important;
  background-image: none !important;
  border: 1px solid rgba(200, 220, 245, 0.32) !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  box-shadow: none !important;
  filter: none !important;
}

html body #modalProductDetail .pd-stock .stock-badge::before,
html body #modalProductDetail .pd-stock .stock-badge::after,
html body #modalProductDetail .pd-desc-head::before,
html body #modalProductDetail .pd-desc-head::after,
html body #modalProductDetail .pd-desc-label::before,
html body #modalProductDetail .pd-desc-label::after {
  content: none !important;
  display: none !important;
}

/* end v37 */


/* ── v38: แสงสมมาตรรอบปุ่ม — ย้าย glow ไป wrapper ที่มี padding ── */
html body #modalProductDetail .pd-content {
  overflow: visible !important;
}
html body #modalProductDetail .ix-modal-body.pd-modal-body {
  overflow-x: visible !important;
  padding-right: 16px !important;
  padding-left: 12px !important;
  box-sizing: border-box !important;
}

/* STOCK: wrapper รับ drop-shadow ตามรูปแคปซูล · มีที่ว่างรอบเงา */
html body #modalProductDetail .pd-meta-row {
  overflow: visible !important;
  padding-right: 20px !important;
}
html body #modalProductDetail .pd-stock {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  overflow: visible !important;
  padding: 16px !important;
  margin: -16px -8px -16px 0 !important;
  background: transparent !important;
  /* เงาตาม alpha ของลูก (ปุ่มโค้ง) — ไม่โดนตัดในตัวปุ่ม */
  filter:
    drop-shadow(0 0 1px rgba(200, 220, 245, 0.55))
    drop-shadow(0 0 6px rgba(150, 180, 220, 0.5))
    drop-shadow(0 0 12px rgba(120, 160, 200, 0.32)) !important;
  -webkit-filter:
    drop-shadow(0 0 1px rgba(200, 220, 245, 0.55))
    drop-shadow(0 0 6px rgba(150, 180, 220, 0.5))
    drop-shadow(0 0 12px rgba(120, 160, 200, 0.32)) !important;
}
html body #modalProductDetail .pd-stock .stock-badge,
html body #modalProductDetail .pd-stock .stock-badge--detail,
html body #modalProductDetail .pd-stock .stock-badge.stock-ok {
  overflow: visible !important;
  filter: none !important;
  -webkit-filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  isolation: auto !important;
  border-radius: 999px !important;
  background: #151922 !important;
  background-image: none !important;
  border: 1px solid rgba(200, 220, 245, 0.42) !important;
  box-shadow: none !important; /* เงาอยู่ที่ .pd-stock แล้ว */
}

/* DESC HEAD: ห่อด้วย padding บน block แล้วใส่ drop-shadow ที่หัวข้ออย่างเดียว */
html body #modalProductDetail .pd-desc-block,
html body #modalProductDetail #pdDescBlock {
  overflow: visible !important;
  padding: 16px 8px 8px 16px !important;
  margin: -8px 0 0 -8px !important;
}
html body #modalProductDetail .pd-desc-head,
html body #modalProductDetail .pd-desc-label,
html body #modalProductDetail #pdDescBlock .pd-desc-head.pd-desc-label {
  overflow: visible !important;
  isolation: auto !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-radius: 999px !important;
  background: #151922 !important;
  background-image: none !important;
  border: 1px solid rgba(200, 220, 245, 0.4) !important;
  box-shadow: none !important;
  filter:
    drop-shadow(0 0 1px rgba(200, 220, 245, 0.5))
    drop-shadow(0 0 6px rgba(150, 180, 220, 0.45))
    drop-shadow(0 0 12px rgba(120, 160, 200, 0.28)) !important;
  -webkit-filter:
    drop-shadow(0 0 1px rgba(200, 220, 245, 0.5))
    drop-shadow(0 0 6px rgba(150, 180, 220, 0.45))
    drop-shadow(0 0 12px rgba(120, 160, 200, 0.28)) !important;
}

/* ไอคอนสีเดียวกับปุ่ม — ไม่มีวงสีต่าง */
html body #modalProductDetail .pd-stock .stock-badge-icon,
html body #modalProductDetail .pd-desc-head-icon {
  background: #151922 !important;
  background-image: none !important;
  border: 1px solid rgba(200, 220, 245, 0.3) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  filter: none !important;
}

html body #modalProductDetail .pd-stock .stock-badge::before,
html body #modalProductDetail .pd-stock .stock-badge::after,
html body #modalProductDetail .pd-desc-head::before,
html body #modalProductDetail .pd-desc-head::after {
  content: none !important;
  display: none !important;
}

/* กรอบคำอธิบายอย่าดึง filter จากหัว */
html body #modalProductDetail .pd-desc-wrap,
html body #modalProductDetail #pdDescWrap {
  filter: none !important;
}

/* end v38 */


/* ── v39: แสงสมมาตรจริง — ใช้ inset glow (ไม่ถูก modal/กรอบตัด) ── */
html body #modalProductDetail .pd-content {
  overflow: visible !important;
}
html body #modalProductDetail .ix-modal-body.pd-modal-body {
  overflow-x: visible !important;
  padding-right: 18px !important;
  padding-left: 12px !important;
  box-sizing: border-box !important;
}
html body #modalProductDetail .pd-meta-row {
  overflow: visible !important;
  padding-right: 18px !important;
}

/* เลิก filter ที่ wrapper — filter โดน modal overflow ตัดเป็นเส้นตรง */
html body #modalProductDetail .pd-stock {
  filter: none !important;
  -webkit-filter: none !important;
  overflow: visible !important;
  padding: 0 !important;
  margin: 0 !important;
}

html body #modalProductDetail .pd-stock .stock-badge,
html body #modalProductDetail .pd-stock .stock-badge--detail,
html body #modalProductDetail .pd-stock .stock-badge.stock-ok,
html body #modalProductDetail .pd-desc-head,
html body #modalProductDetail .pd-desc-label,
html body #modalProductDetail #pdDescBlock .pd-desc-head.pd-desc-label {
  position: relative !important;
  z-index: 3 !important;
  overflow: hidden !important; /* คลิปพื้นให้โค้ง — เงาเป็น inset อยู่ด้านใน ไม่โดนตัด */
  isolation: auto !important;
  filter: none !important;
  -webkit-filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-radius: 999px !important;
  background: #151922 !important;
  background-color: #151922 !important;
  background-image: none !important;
  border: 1px solid rgba(210, 225, 245, 0.48) !important;
  /* แสงรอบขอบด้านใน = สมมาตรทุกมุม ไม่ล้นออกนอกกรอบ */
  box-shadow:
    inset 0 0 0 1px rgba(200, 220, 245, 0.22),
    inset 0 0 14px rgba(150, 180, 220, 0.28),
    inset 0 0 28px rgba(120, 160, 200, 0.12),
    0 0 0 1px rgba(180, 200, 230, 0.16) !important;
}

/* หัวคำอธิบาย: ยกชั้นเหนือกรอบ + เว้นระยะล่าง ไม่ให้เส้นกรอบทับแสง */
html body #modalProductDetail .pd-desc-block,
html body #modalProductDetail #pdDescBlock {
  overflow: visible !important;
  padding: 4px 4px 0 4px !important;
  margin: 0 !important;
}
html body #modalProductDetail .pd-desc-head,
html body #modalProductDetail .pd-desc-label,
html body #modalProductDetail #pdDescBlock .pd-desc-head.pd-desc-label {
  margin-bottom: 12px !important;
  z-index: 5 !important;
}

html body #modalProductDetail .pd-desc-wrap,
html body #modalProductDetail #pdDescWrap {
  position: relative !important;
  z-index: 1 !important;
  filter: none !important;
  margin-top: 0 !important;
}

/* ไอคอนสีเดียวกับตัวปุ่ม */
html body #modalProductDetail .pd-stock .stock-badge-icon,
html body #modalProductDetail .pd-desc-head-icon,
html body #modalProductDetail .pd-stock .stock-badge .stock-badge-icon {
  background: #151922 !important;
  background-color: #151922 !important;
  background-image: none !important;
  border: 1px solid rgba(200, 220, 245, 0.34) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  filter: none !important;
  overflow: hidden !important;
}

html body #modalProductDetail .pd-stock .stock-badge::before,
html body #modalProductDetail .pd-stock .stock-badge::after,
html body #modalProductDetail .pd-desc-head::before,
html body #modalProductDetail .pd-desc-head::after {
  content: none !important;
  display: none !important;
}

/* end v39 */


/* v39b: force icon bg match pill */
html body #modalProductDetail #pdStock .stock-badge .stock-badge-icon,
html body #modalProductDetail #pdStock .stock-badge.stock-ok .stock-badge-icon,
html body #modalProductDetail #pdStock .stock-badge--detail .stock-badge-icon,
html body #modalProductDetail .pd-stock .stock-badge-icon {
  background: #151922 !important;
  background-color: #151922 !important;
  background-image: none !important;
}


/* ── v40: แสงขอบบางสมมาตร · ไม่มีแผ่นสี่เหลี่ยม · ไม่โดนตัดมุม ── */
html body #modalProductDetail .pd-content {
  overflow: visible !important;
}
html body #modalProductDetail .ix-modal-body.pd-modal-body {
  overflow-x: visible !important;
  padding: 12px 22px 12px 14px !important;
  box-sizing: border-box !important;
}
html body #modalProductDetail .pd-meta-row {
  overflow: visible !important;
  padding-right: 10px !important;
}
html body #modalProductDetail .pd-stock {
  filter: none !important;
  -webkit-filter: none !important;
  overflow: visible !important;
  padding: 10px !important;
  margin: -10px -4px -10px 0 !important;
}

html body #modalProductDetail .pd-stock .stock-badge,
html body #modalProductDetail .pd-stock .stock-badge--detail,
html body #modalProductDetail .pd-stock .stock-badge.stock-ok,
html body #modalProductDetail .pd-desc-head,
html body #modalProductDetail .pd-desc-label,
html body #modalProductDetail #pdDescBlock .pd-desc-head.pd-desc-label {
  position: relative !important;
  z-index: 4 !important;
  overflow: visible !important;
  isolation: auto !important;
  filter: none !important;
  -webkit-filter: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-radius: 999px !important;
  background: #151922 !important;
  background-color: #151922 !important;
  background-image: none !important;
  /* ขอบเรืองบางตามโค้ง — blur น้อยพอไม่ชนขอบคลิป */
  border: 1px solid rgba(210, 225, 245, 0.5) !important;
  box-shadow:
    0 0 0 1px rgba(190, 210, 235, 0.2),
    0 0 8px rgba(150, 180, 220, 0.45) !important;
}

html body #modalProductDetail .pd-desc-block,
html body #modalProductDetail #pdDescBlock {
  overflow: visible !important;
  padding-top: 6px !important;
}
html body #modalProductDetail .pd-desc-head,
html body #modalProductDetail #pdDescBlock .pd-desc-head.pd-desc-label {
  margin-bottom: 14px !important;
  z-index: 6 !important;
}
html body #modalProductDetail .pd-desc-wrap,
html body #modalProductDetail #pdDescWrap {
  z-index: 1 !important;
  filter: none !important;
}

html body #modalProductDetail #pdStock .stock-badge .stock-badge-icon,
html body #modalProductDetail #pdStock .stock-badge-icon,
html body #modalProductDetail .pd-desc-head-icon {
  background: #151922 !important;
  background-color: #151922 !important;
  background-image: none !important;
  border: 1px solid rgba(200, 220, 245, 0.35) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
  filter: none !important;
}

html body #modalProductDetail .pd-stock .stock-badge::before,
html body #modalProductDetail .pd-stock .stock-badge::after,
html body #modalProductDetail .pd-desc-head::before,
html body #modalProductDetail .pd-desc-head::after {
  content: none !important;
  display: none !important;
}

/* end v40 */


/* ── v41: คืนแถบเลื่อนในกรอบคำอธิบายสินค้า ── */
html body #modalProductDetail .pd-desc-wrap,
html body #modalProductDetail #pdDescWrap.pd-desc-wrap,
html body #modalProductDetail #pdDescWrap {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overflow: hidden auto !important;
  -webkit-overflow-scrolling: touch !important;
  max-height: min(240px, 32vh) !important;
  border-radius: 14px !important;
  padding: 0.85rem 0.75rem 0.85rem 0.95rem !important;
  box-sizing: border-box !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(154, 176, 204, 0.7) rgba(255, 255, 255, 0.06) !important;
  /* อย่าใช้ clip-path ที่ตัดสกอลล์บาร์ */
  clip-path: none !important;
}

html body #modalProductDetail .pd-desc-wrap::-webkit-scrollbar,
html body #modalProductDetail #pdDescWrap::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
  display: block !important;
}

html body #modalProductDetail .pd-desc-wrap::-webkit-scrollbar-track,
html body #modalProductDetail #pdDescWrap::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.06) !important;
  border-radius: 8px !important;
  margin: 6px 0 !important;
}

html body #modalProductDetail .pd-desc-wrap::-webkit-scrollbar-thumb,
html body #modalProductDetail #pdDescWrap::-webkit-scrollbar-thumb {
  background: rgba(154, 176, 204, 0.55) !important;
  border-radius: 8px !important;
  border: 2px solid transparent !important;
  background-clip: padding-box !important;
}

html body #modalProductDetail .pd-desc-wrap::-webkit-scrollbar-thumb:hover,
html body #modalProductDetail #pdDescWrap::-webkit-scrollbar-thumb:hover {
  background: rgba(190, 210, 235, 0.75) !important;
  background-clip: padding-box !important;
}

/* เนื้อหาเลื่อนในกรอบ ไม่ซ่อนสกอลล์ของตัวเอง */
html body #modalProductDetail .pd-desc-body,
html body #modalProductDetail #pdDescBody {
  overflow: visible !important;
  max-height: none !important;
  height: auto !important;
}

@media (min-width: 1024px) {
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap {
    max-height: min(280px, 34vh) !important;
    overflow-y: auto !important;
  }
}

/* end v41 */


/* ── v42: MOBILE ONLY — ปุ่มสั่งซื้อ/เลย์เอาต์พอดีจอ ไม่ยุ่ง PC/Notebook ── */
@media (max-width: 767px) {
  html body #modalProductDetail .ix-modal.pd-modal-wide,
  html body #modalProductDetail .ix-modal {
    width: calc(100vw - 0.45rem) !important;
    max-width: calc(100vw - 0.45rem) !important;
    max-height: calc(100dvh - 0.45rem) !important;
    border-radius: 16px !important;
  }

  html body #modalProductDetail .ix-modal-body.pd-modal-body {
    padding: 0.7rem 0.7rem 0 !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    /* มือถือโชว์แถบเลื่อนบางๆ ใน modal ได้ */
    scrollbar-width: thin !important;
    -ms-overflow-style: auto !important;
  }
  html body #modalProductDetail .ix-modal-body.pd-modal-body::-webkit-scrollbar {
    width: 5px !important;
    height: 5px !important;
    display: block !important;
  }
  html body #modalProductDetail .ix-modal-body.pd-modal-body::-webkit-scrollbar-thumb {
    background: rgba(154, 176, 204, 0.45) !important;
    border-radius: 8px !important;
  }

  html body #modalProductDetail .pd-layout {
    gap: 0.55rem !important;
    padding-bottom: 0 !important;
  }

  html body #modalProductDetail .pd-top {
    grid-template-columns: 1fr !important;
    gap: 0.65rem !important;
  }

  /* ย่อรูป/คลิป ให้เหลือที่ให้ปุ่ม+คำอธิบาย */
  html body #modalProductDetail .pd-main-img-wrap {
    max-height: min(210px, 34vw) !important;
    aspect-ratio: 1 / 1 !important;
  }
  html body #modalProductDetail .pd-img-caption {
    padding: 0.35rem 0.55rem !important;
  }
  html body #modalProductDetail .pd-thumb {
    width: 48px !important;
    height: 48px !important;
  }
  html body #modalProductDetail .pd-product-name {
    font-size: 1.15rem !important;
    margin: 0.15rem 0 0.35rem !important;
  }
  html body #modalProductDetail .pd-meta-row {
    margin-bottom: 0.45rem !important;
    padding-right: 4px !important;
  }
  html body #modalProductDetail .pd-video {
    padding-top: 56.25% !important;
  }
  html body #modalProductDetail .pd-video-wrap {
    margin-bottom: 0.35rem !important;
  }

  /* คำอธิบายอยู่เหนือปุ่ม · มีแถบเลื่อนในกรอบ */
  html body #modalProductDetail .pd-desc-block,
  html body #modalProductDetail #pdDescBlock {
    order: unset !important;
    padding: 2px !important;
    margin: 0 !important;
  }
  html body #modalProductDetail .pd-desc-head,
  html body #modalProductDetail #pdDescBlock .pd-desc-head {
    margin-bottom: 8px !important;
  }
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap,
  html body #modalProductDetail #pdDescWrap.pd-desc-wrap {
    max-height: min(150px, 26vh) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 0.7rem 0.55rem 0.7rem 0.8rem !important;
    scrollbar-width: thin !important;
    scrollbar-color: rgba(154, 176, 204, 0.7) rgba(255, 255, 255, 0.06) !important;
  }
  html body #modalProductDetail .pd-desc-wrap::-webkit-scrollbar,
  html body #modalProductDetail #pdDescWrap::-webkit-scrollbar {
    width: 7px !important;
    display: block !important;
  }
  html body #modalProductDetail .pd-desc-wrap::-webkit-scrollbar-thumb,
  html body #modalProductDetail #pdDescWrap::-webkit-scrollbar-thumb {
    background: rgba(154, 176, 204, 0.55) !important;
    border-radius: 8px !important;
  }

  /* ปุ่มสั่งซื้อ: พื้นทึบติดล่าง ไม่โปร่งให้ข้อความทะลุ */
  html body #modalProductDetail .pd-buy-footer {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 40 !important;
    flex: 0 0 auto !important;
    margin-top: 0.35rem !important;
    padding: 0.7rem 0.15rem calc(0.55rem + env(safe-area-inset-bottom, 0px)) !important;
    gap: 0.45rem !important;
    grid-template-columns: 1fr !important;
    align-items: stretch !important;
    border-top: 1px solid rgba(154, 176, 204, 0.28) !important;
    background: #0b0c10 !important;
    background-image: none !important;
    box-shadow: 0 -10px 28px rgba(0, 0, 0, 0.55) !important;
  }

  html body #modalProductDetail .pd-qty-wrap {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0.55rem !important;
  }
  html body #modalProductDetail .pd-qty-label {
    font-size: 0.78rem !important;
    margin: 0 !important;
    flex: 0 0 auto !important;
  }
  html body #modalProductDetail .pd-qty-row {
    margin-left: auto !important;
  }
  html body #modalProductDetail .pd-qty-btn {
    width: 36px !important;
    height: 36px !important;
  }
  html body #modalProductDetail .pd-qty-input,
  html body #modalProductDetail #pdQtyInput.pd-qty-input {
    width: 48px !important;
    height: 36px !important;
    font-size: 0.95rem !important;
  }

  html body #modalProductDetail #pdBuyBtn.pd-buy-btn,
  html body #modalProductDetail .pd-buy-btn.sf-btn-buy,
  html body #modalProductDetail button#pdBuyBtn {
    width: 100% !important;
    min-height: 46px !important;
    height: 46px !important;
    font-size: 1rem !important;
    border-radius: 999px !important;
    background: #141414 !important;
    color: #fff !important;
  }
}

/* สำรองถ้ามี data-device=mobile */
html[data-device="mobile"] body #modalProductDetail .pd-buy-footer,
html[data-device="phone"] body #modalProductDetail .pd-buy-footer {
  background: #0b0c10 !important;
  background-image: none !important;
  position: sticky !important;
  bottom: 0 !important;
}

/* end v42 */


/* ── v43: MOBILE ONLY — กรอบอธิบายใหญ่ขึ้น + รูปเต็มไม่มีดำสองข้าง ── */
@media (max-width: 767px) {
  /* รูปสินค้า: เต็มกรอบ ตัดขอบแทนการเหลือดำ */
  html body #modalProductDetail .pd-main-img-wrap {
    width: 100% !important;
    max-height: none !important;
    aspect-ratio: 1 / 1 !important;
    background: #050506 !important;
    overflow: hidden !important;
  }
  html body #modalProductDetail .pd-main-img,
  html body #modalProductDetail #pdMainImg.pd-main-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    filter: none !important;
  }
  html body #modalProductDetail .pd-thumb,
  html body #modalProductDetail #pdThumb.pd-thumb {
    object-fit: cover !important;
    object-position: center center !important;
  }

  /* กรอบคำอธิบายใหญ่ขึ้น เลื่อนในกรอบได้ */
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap,
  html body #modalProductDetail #pdDescWrap.pd-desc-wrap {
    max-height: min(280px, 42vh) !important;
    min-height: 180px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    padding: 0.85rem 0.65rem 0.85rem 0.9rem !important;
  }
}

html[data-device="mobile"] body #modalProductDetail .pd-main-img,
html[data-device="phone"] body #modalProductDetail .pd-main-img {
  object-fit: cover !important;
}
html[data-device="mobile"] body #modalProductDetail .pd-desc-wrap,
html[data-device="phone"] body #modalProductDetail .pd-desc-wrap,
html[data-device="mobile"] body #modalProductDetail #pdDescWrap,
html[data-device="phone"] body #modalProductDetail #pdDescWrap {
  max-height: min(280px, 42vh) !important;
  min-height: 180px !important;
}

/* end v43 */


/* ── v44: MOBILE ONLY — รูปเต็มความกว้าง + กรอบอธิบายใหญ่ ── */
@media (max-width: 767px) {
  html body #modalProductDetail .ix-modal-body.pd-modal-body {
    padding-left: 0.45rem !important;
    padding-right: 0.45rem !important;
  }
  html body #modalProductDetail .pd-gallery,
  html body #modalProductDetail .pd-main-img-wrap,
  html body #modalProductDetail .pd-content,
  html body #modalProductDetail .pd-media-stack,
  html body #modalProductDetail .pd-video-wrap {
    width: 100% !important;
    max-width: 100% !important;
  }
  html body #modalProductDetail .pd-main-img-wrap {
    margin: 0 !important;
    max-height: none !important;
    aspect-ratio: 1 / 1 !important;
    overflow: hidden !important;
  }
  html body #modalProductDetail .pd-main-img,
  html body #modalProductDetail #pdMainImg {
    width: 100% !important;
    height: 100% !important;
    min-width: 100% !important;
    min-height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    /* ซูมเล็กน้อยตัดขอบดำในไฟล์รูป (ถ้ามี) */
    transform: scale(1.04) !important;
  }
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap {
    max-height: min(300px, 46vh) !important;
    min-height: 200px !important;
  }
}

/* end v44 */


/* ── v45: PC + Notebook — รูป+คำอธิบายซ้าย · คลิปขวา ── */
@media (min-width: 768px) {
  html body #modalProductDetail .ix-modal.pd-modal-wide,
  html body #modalProductDetail .ix-modal {
    width: min(1180px, calc(100vw - 1.5rem)) !important;
    max-width: min(1180px, calc(100vw - 1.5rem)) !important;
    max-height: min(94dvh, 920px) !important;
  }

  html body #modalProductDetail .ix-modal-body.pd-modal-body {
    padding: 1.05rem 1.25rem 0.75rem !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  html body #modalProductDetail .pd-top {
    display: grid !important;
    grid-template-columns: minmax(300px, 0.92fr) minmax(0, 1.2fr) !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
    grid-template-areas:
      "gallery content"
      "desc content" !important;
    gap: 0.95rem 1.25rem !important;
    align-items: stretch !important;
    min-height: 0 !important;
  }

  html body #modalProductDetail .pd-gallery {
    grid-area: gallery !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0.55rem !important;
    min-width: 0 !important;
  }

  html body #modalProductDetail .pd-content {
    grid-area: content !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0.55rem !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: 100% !important;
  }

  html body #modalProductDetail .pd-desc-block,
  html body #modalProductDetail #pdDescBlock {
    grid-area: desc !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0.45rem !important;
    min-height: 0 !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* รูปใหญ่พอ ไม่เล็กเกิน */
  html body #modalProductDetail .pd-main-img-wrap {
    width: 100% !important;
    max-height: min(360px, 42vh) !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 18px !important;
    border: 1px solid rgba(170, 195, 225, 0.32) !important;
    box-shadow:
      0 0 0 1px rgba(255, 255, 255, 0.04) inset,
      0 0 28px rgba(122, 143, 168, 0.2),
      0 14px 32px rgba(0, 0, 0, 0.4) !important;
    overflow: hidden !important;
  }
  html body #modalProductDetail .pd-main-img,
  html body #modalProductDetail #pdMainImg {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
  }

  html body #modalProductDetail .pd-img-caption {
    border-radius: 12px !important;
    border: 1px solid rgba(154, 176, 204, 0.25) !important;
    background: linear-gradient(135deg, rgba(122, 143, 168, 0.12), rgba(255, 255, 255, 0.03)) !important;
  }

  /* ขวา: หัวข้อ + คลิปเด่น */
  html body #modalProductDetail .pd-head {
    font-size: 0.82rem !important;
    letter-spacing: 0.04em !important;
    opacity: 0.9;
  }
  html body #modalProductDetail .pd-product-name {
    font-size: clamp(1.25rem, 1.7vw, 1.55rem) !important;
  }
  html body #modalProductDetail .pd-media-stack {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
  }
  html body #modalProductDetail .pd-video-wrap {
    flex: 1 1 auto !important;
    width: 100% !important;
    min-height: 0 !important;
  }
  html body #modalProductDetail .pd-video {
    border-radius: 16px !important;
    border: none !important;
    box-shadow:
      0 0 0 1px rgba(180, 200, 230, 0.22),
      0 0 28px rgba(106, 128, 160, 0.18),
      0 16px 36px rgba(0, 0, 0, 0.4) !important;
    overflow: hidden !important;
  }

  /* ช่องอธิบายใหญ่ ใต้รูปซ้าย */
  html body #modalProductDetail .pd-desc-head,
  html body #modalProductDetail #pdDescBlock .pd-desc-head {
    margin-bottom: 0.15rem !important;
  }
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap,
  html body #modalProductDetail #pdDescWrap.pd-desc-wrap {
    flex: 1 1 auto !important;
    width: 100% !important;
    min-height: 220px !important;
    max-height: min(340px, 40vh) !important;
    height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    padding: 1rem 0.85rem 1rem 1.05rem !important;
    border-radius: 16px !important;
    border: 1px solid rgba(154, 176, 204, 0.28) !important;
    background: #0e1016 !important;
    box-shadow:
      0 0 0 1px rgba(255, 255, 255, 0.03) inset,
      0 10px 28px rgba(0, 0, 0, 0.28) !important;
    scrollbar-width: thin !important;
    scrollbar-color: rgba(154, 176, 204, 0.7) rgba(255, 255, 255, 0.06) !important;
  }
  html body #modalProductDetail .pd-desc-wrap::-webkit-scrollbar,
  html body #modalProductDetail #pdDescWrap::-webkit-scrollbar {
    width: 8px !important;
    display: block !important;
  }
  html body #modalProductDetail .pd-desc-wrap::-webkit-scrollbar-thumb,
  html body #modalProductDetail #pdDescWrap::-webkit-scrollbar-thumb {
    background: rgba(154, 176, 204, 0.55) !important;
    border-radius: 8px !important;
  }

  html body #modalProductDetail .pd-buy-footer {
    margin-top: 0.85rem !important;
  }
}

/* mobile: ลำดับ รูป → รายละเอียด/คลิป → คำอธิบาย */
@media (max-width: 767px) {
  html body #modalProductDetail .pd-top {
    display: flex !important;
    flex-direction: column !important;
    grid-template-areas: none !important;
    grid-template-rows: none !important;
  }
  html body #modalProductDetail .pd-gallery {
    order: 1 !important;
    grid-area: auto !important;
  }
  html body #modalProductDetail .pd-content {
    order: 2 !important;
    grid-area: auto !important;
  }
  html body #modalProductDetail .pd-desc-block,
  html body #modalProductDetail #pdDescBlock {
    order: 3 !important;
    grid-area: auto !important;
  }
}

/* end v45 */


/* ── v46: PC ขยายช่องอธิบายซ้ายให้เต็มแถวล่าง ── */
@media (min-width: 768px) {
  html body #modalProductDetail .pd-top {
    grid-template-rows: auto minmax(240px, 1fr) !important;
  }
  html body #modalProductDetail .pd-gallery {
    gap: 0.4rem !important;
  }
  html body #modalProductDetail .pd-main-img-wrap {
    max-height: min(340px, 38vh) !important;
  }
  html body #modalProductDetail .pd-desc-block,
  html body #modalProductDetail #pdDescBlock {
    align-self: stretch !important;
    height: 100% !important;
    min-height: 240px !important;
  }
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap,
  html body #modalProductDetail #pdDescWrap.pd-desc-wrap {
    flex: 1 1 auto !important;
    min-height: 240px !important;
    max-height: none !important;
    height: 100% !important;
  }
  html body #modalProductDetail .pd-content {
    justify-content: flex-start !important;
  }
  html body #modalProductDetail .pd-media-stack {
    flex: 0 0 auto !important;
  }
  html body #modalProductDetail .pd-video-wrap {
    flex: 0 0 auto !important;
    width: 100% !important;
  }
  html body #modalProductDetail .pd-video {
    /* คง 16:9 ชัด */
    height: 0 !important;
    padding-top: 56.25% !important;
    aspect-ratio: auto !important;
    min-height: 0 !important;
  }
}

/* end v46 */


/* ── v47: ย้อนเลย์เอาต์เดิม (อธิบายขวาใต้คลิป) + ตกแต่งพรีเมียมเบาๆ ── */

/* ยกเลิก grid areas ของ v45/v46 */
@media (min-width: 768px) {
  html body #modalProductDetail .pd-top {
    display: grid !important;
    grid-template-columns: minmax(260px, 0.9fr) minmax(0, 1.25fr) !important;
    grid-template-rows: none !important;
    grid-template-areas: none !important;
    gap: 1.15rem !important;
    align-items: stretch !important;
  }
  html body #modalProductDetail .pd-gallery,
  html body #modalProductDetail .pd-content,
  html body #modalProductDetail .pd-desc-block,
  html body #modalProductDetail #pdDescBlock {
    grid-area: auto !important;
    order: unset !important;
  }
}

@media (max-width: 767px) {
  html body #modalProductDetail .pd-gallery,
  html body #modalProductDetail .pd-content,
  html body #modalProductDetail .pd-desc-block {
    order: unset !important;
  }
}

/* โครงเดิม: คอนเทนต์ขวาเป็นคอลัมน์ ชื่อ→คลิป→คำอธิบาย */
html body #modalProductDetail .pd-content {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.55rem !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: 100% !important;
}

html body #modalProductDetail .pd-content > .pd-desc-block,
html body #modalProductDetail .pd-desc-block,
html body #modalProductDetail #pdDescBlock {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.4rem !important;
  width: 100% !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  margin-top: 0.2rem !important;
  padding: 0 !important;
  height: auto !important;
  align-self: stretch !important;
}

/* พรีเมียมเบาๆ — รูป */
html body #modalProductDetail .pd-main-img-wrap {
  border-radius: 18px !important;
  border: 1px solid rgba(180, 200, 230, 0.28) !important;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.04) inset,
    0 0 26px rgba(122, 143, 168, 0.16),
    0 14px 32px rgba(0, 0, 0, 0.38) !important;
}
@media (min-width: 1024px) {
  html body #modalProductDetail .pd-main-img-wrap {
    max-height: 320px !important;
  }
  html body #modalProductDetail .pd-main-img,
  html body #modalProductDetail #pdMainImg {
    object-fit: contain !important;
  }
}

html body #modalProductDetail .pd-img-caption {
  border-radius: 12px !important;
  border: 1px solid rgba(154, 176, 204, 0.22) !important;
  background: linear-gradient(135deg, rgba(122, 143, 168, 0.1), rgba(255, 255, 255, 0.03)) !important;
}

/* พรีเมียมเบาๆ — คลิป */
html body #modalProductDetail .pd-video {
  border-radius: 16px !important;
  border: none !important;
  box-shadow:
    0 0 0 1px rgba(180, 200, 230, 0.2),
    0 0 24px rgba(106, 128, 160, 0.14),
    0 14px 30px rgba(0, 0, 0, 0.35) !important;
  height: 0 !important;
  padding-top: 56.25% !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
}

/* พรีเมียมเบาๆ — กรอบคำอธิบายใต้คลิป (เลย์เอาต์เดิม) */
html body #modalProductDetail .pd-desc-wrap,
html body #modalProductDetail #pdDescWrap,
html body #modalProductDetail #pdDescWrap.pd-desc-wrap {
  flex: 1 1 auto !important;
  width: 100% !important;
  min-height: 110px !important;
  max-height: min(220px, 26vh) !important;
  height: auto !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  padding: 0.95rem 0.8rem 0.95rem 1rem !important;
  border-radius: 16px !important;
  border: 1px solid rgba(154, 176, 204, 0.26) !important;
  background: #0e1016 !important;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.03) inset,
    0 8px 22px rgba(0, 0, 0, 0.25) !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(154, 176, 204, 0.65) rgba(255, 255, 255, 0.06) !important;
}

@media (min-width: 1024px) {
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap {
    max-height: min(200px, 24vh) !important;
  }
}

html body #modalProductDetail .pd-desc-wrap::-webkit-scrollbar,
html body #modalProductDetail #pdDescWrap::-webkit-scrollbar {
  width: 8px !important;
  display: block !important;
}
html body #modalProductDetail .pd-desc-wrap::-webkit-scrollbar-thumb,
html body #modalProductDetail #pdDescWrap::-webkit-scrollbar-thumb {
  background: rgba(154, 176, 204, 0.5) !important;
  border-radius: 8px !important;
}

/* พรีเมียมเบาๆ — ฟุตเตอร์ซื้อ */
html body #modalProductDetail .pd-buy-footer {
  border-top: 1px solid rgba(154, 176, 204, 0.22) !important;
  box-shadow: 0 -10px 24px rgba(0, 0, 0, 0.22) !important;
}

/* end v47 */


/* ── v48: ขยายกรอบคำอธิบายอีกนิด · ยังเว้นระยะไม่ชิดเส้น ── */
html body #modalProductDetail .pd-content > .pd-desc-block,
html body #modalProductDetail .pd-desc-block,
html body #modalProductDetail #pdDescBlock {
  margin-top: 0.35rem !important;
  margin-bottom: 0.45rem !important; /* ไม่ชิดเส้นฟุตเตอร์ */
  gap: 0.45rem !important;
}

html body #modalProductDetail .pd-desc-wrap,
html body #modalProductDetail #pdDescWrap,
html body #modalProductDetail #pdDescWrap.pd-desc-wrap {
  min-height: 140px !important;
  max-height: min(280px, 32vh) !important;
  padding: 1.05rem 0.95rem 1.15rem 1.1rem !important; /* เผื่อล่างไม่ให้ข้อความชิดขอบ */
  box-sizing: border-box !important;
}

@media (min-width: 1024px) {
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap {
    min-height: 160px !important;
    max-height: min(300px, 34vh) !important;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap {
    max-height: min(240px, 30vh) !important;
  }
}

/* มือถือคงระยะไม่ชิดขอบจอ/เส้น */
@media (max-width: 767px) {
  html body #modalProductDetail .pd-desc-block,
  html body #modalProductDetail #pdDescBlock {
    margin-bottom: 0.55rem !important;
  }
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap {
    max-height: min(300px, 44vh) !important;
    min-height: 200px !important;
    padding: 0.95rem 0.75rem 1.1rem 0.9rem !important;
  }
}

/* end v48 */


/* ── v49: กรอบคำอธิบายกว้างขึ้น + ยาวลงมาอีก · ไม่ชิดเส้น ── */
@media (min-width: 1024px) {
  /* ให้คอลัมน์ขวากว้างขึ้น → กรอบอธิบายกว้างขึ้น */
  html body #modalProductDetail .pd-top {
    grid-template-columns: minmax(240px, 0.78fr) minmax(0, 1.4fr) !important;
    gap: 1rem 1.1rem !important;
  }
}

html body #modalProductDetail .pd-content > .pd-desc-block,
html body #modalProductDetail .pd-desc-block,
html body #modalProductDetail #pdDescBlock {
  width: 100% !important;
  margin-top: 0.4rem !important;
  margin-bottom: 0.55rem !important; /* ไม่ชิดเส้นซื้อ */
  padding: 0 !important;
}

html body #modalProductDetail .pd-desc-wrap,
html body #modalProductDetail #pdDescWrap,
html body #modalProductDetail #pdDescWrap.pd-desc-wrap {
  width: 100% !important;
  box-sizing: border-box !important;
  min-height: 180px !important;
  max-height: min(340px, 38vh) !important;
  padding: 1.1rem 1.05rem 1.25rem 1.15rem !important;
  overflow-y: auto !important;
}

@media (min-width: 1024px) {
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap {
    min-height: 200px !important;
    max-height: min(360px, 40vh) !important;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  html body #modalProductDetail .pd-top {
    grid-template-columns: minmax(200px, 0.8fr) minmax(0, 1.35fr) !important;
  }
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap {
    min-height: 160px !important;
    max-height: min(280px, 34vh) !important;
  }
}

@media (max-width: 767px) {
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap {
    width: 100% !important;
    min-height: 220px !important;
    max-height: min(340px, 48vh) !important;
    padding: 1rem 0.85rem 1.2rem 0.95rem !important;
  }
  html body #modalProductDetail .pd-desc-block {
    margin-bottom: 0.6rem !important;
  }
}

/* end v49 */


/* ── v50: กรอบคำอธิบายห้ามล้ำเส้นฟุตเตอร์ (border-top ของปุ่มซื้อ) ── */
html body #modalProductDetail .pd-layout {
  /* เผื่อที่ให้ฟุตเตอร์ + ช่องว่างเหนือเส้น */
  padding-bottom: 0.15rem !important;
}

html body #modalProductDetail .pd-content > .pd-desc-block,
html body #modalProductDetail .pd-desc-block,
html body #modalProductDetail #pdDescBlock {
  margin-top: 0.35rem !important;
  margin-bottom: 0.85rem !important; /* ระยะชัดเหนือเส้น */
  padding-bottom: 0 !important;
  flex: 0 1 auto !important; /* ไม่ยืดทะลุเส้น */
  max-height: none !important;
  overflow: visible !important;
}

html body #modalProductDetail .pd-desc-wrap,
html body #modalProductDetail #pdDescWrap,
html body #modalProductDetail #pdDescWrap.pd-desc-wrap {
  /* สูงพออ่านได้ แต่ไม่ดันทะลุเส้นซื้อ */
  flex: 0 1 auto !important;
  height: auto !important;
  min-height: 120px !important;
  max-height: min(200px, 22vh) !important;
  margin-bottom: 0 !important;
  box-sizing: border-box !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

@media (min-width: 1024px) {
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap {
    max-height: min(190px, 20vh) !important;
    min-height: 130px !important;
  }
  html body #modalProductDetail .pd-desc-block,
  html body #modalProductDetail #pdDescBlock {
    margin-bottom: 1rem !important;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap {
    max-height: min(170px, 22vh) !important;
  }
}

@media (max-width: 767px) {
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap {
    max-height: min(220px, 32vh) !important;
    min-height: 150px !important;
  }
  html body #modalProductDetail .pd-desc-block {
    margin-bottom: 0.75rem !important;
  }
}

/* เส้นฟุตเตอร์อยู่เหนือเนื้อหาเสมอ · กรอบอธิบายอยู่ใต้ stacking ปกติ */
html body #modalProductDetail .pd-buy-footer {
  position: sticky !important;
  bottom: 0 !important;
  z-index: 40 !important;
  margin-top: 0 !important;
  border-top: 1px solid rgba(154, 176, 204, 0.28) !important;
  background: #0b0c10 !important;
  background-image: none !important;
}

/* end v50 */


/* ── v51: คืนความกว้างกรอบอธิบายแบบเดิม · ยังไม่ล้ำเส้นล่าง ── */
@media (min-width: 1024px) {
  html body #modalProductDetail .pd-top {
    grid-template-columns: minmax(240px, 0.78fr) minmax(0, 1.4fr) !important;
    gap: 1rem 1.1rem !important;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  html body #modalProductDetail .pd-top {
    grid-template-columns: minmax(200px, 0.8fr) minmax(0, 1.35fr) !important;
  }
}

html body #modalProductDetail .pd-content {
  width: 100% !important;
  min-width: 0 !important;
}

html body #modalProductDetail .pd-content > .pd-desc-block,
html body #modalProductDetail .pd-desc-block,
html body #modalProductDetail #pdDescBlock {
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 0.35rem !important;
  margin-bottom: 0.85rem !important;
  flex: 0 1 auto !important;
}

html body #modalProductDetail .pd-desc-wrap,
html body #modalProductDetail #pdDescWrap,
html body #modalProductDetail #pdDescWrap.pd-desc-wrap {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  min-height: 130px !important;
  max-height: min(200px, 22vh) !important;
  padding: 1.05rem 1rem 1.15rem 1.1rem !important;
  overflow-y: auto !important;
}

@media (min-width: 1024px) {
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap {
    max-height: min(190px, 20vh) !important;
    min-height: 140px !important;
  }
}

@media (max-width: 767px) {
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap {
    width: 100% !important;
    max-height: min(220px, 32vh) !important;
  }
}

/* end v51 */


/* ── v52: คลิปเล็กลง+ชัด · ช่องอธิบายใหญ่ขึ้น · สวย ไม่ล้ำเส้น ── */
@media (min-width: 1024px) {
  html body #modalProductDetail .pd-top {
    grid-template-columns: minmax(250px, 0.85fr) minmax(0, 1.3fr) !important;
    gap: 1.05rem 1.15rem !important;
    align-items: start !important;
  }

  /* คลิปเล็กลง ชัด ไม่ scale */
  html body #modalProductDetail .pd-media-stack {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 560px !important;
  }
  html body #modalProductDetail .pd-video-wrap {
    width: 100% !important;
    max-width: 560px !important;
    margin: 0 !important;
  }
  html body #modalProductDetail .pd-video {
    position: relative !important;
    width: 100% !important;
    max-width: 560px !important;
    height: auto !important;
    padding-top: 0 !important;
    aspect-ratio: 16 / 9 !important;
    border-radius: 14px !important;
    border: none !important;
    overflow: hidden !important;
    background: #000 !important;
    box-shadow:
      0 0 0 1px rgba(180, 200, 230, 0.22),
      0 0 22px rgba(106, 128, 160, 0.14),
      0 12px 28px rgba(0, 0, 0, 0.35) !important;
    transform: none !important;
    filter: none !important;
  }
  html body #modalProductDetail .pd-video iframe,
  html body #modalProductDetail .pd-video .pd-yt {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    border: 0 !important;
    display: block !important;
    transform: none !important;
    filter: none !important;
    -webkit-transform: none !important;
  }

  /* ช่องอธิบายใหญ่ขึ้น — ยังเว้นเหนือเส้นซื้อ */
  html body #modalProductDetail .pd-desc-block,
  html body #modalProductDetail #pdDescBlock {
    margin-top: 0.55rem !important;
    margin-bottom: 0.9rem !important;
    flex: 0 1 auto !important;
  }
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap {
    min-height: 180px !important;
    max-height: min(280px, 30vh) !important;
    padding: 1.1rem 1.05rem 1.2rem 1.15rem !important;
    border-radius: 16px !important;
    border: 1px solid rgba(154, 176, 204, 0.28) !important;
    background: #0e1016 !important;
    box-shadow:
      0 0 0 1px rgba(255, 255, 255, 0.03) inset,
      0 10px 24px rgba(0, 0, 0, 0.28) !important;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  html body #modalProductDetail .pd-media-stack,
  html body #modalProductDetail .pd-video-wrap,
  html body #modalProductDetail .pd-video {
    max-width: 480px !important;
  }
  html body #modalProductDetail .pd-video {
    padding-top: 0 !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
    transform: none !important;
  }
  html body #modalProductDetail .pd-video iframe {
    transform: none !important;
  }
  html body #modalProductDetail .pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap {
    max-height: min(240px, 28vh) !important;
    min-height: 150px !important;
    margin-bottom: 0 !important;
  }
  html body #modalProductDetail .pd-desc-block {
    margin-bottom: 0.85rem !important;
  }
}

/* กัน blur จาก scale ทุกขนาด */
html body #modalProductDetail .pd-video,
html body #modalProductDetail .pd-video iframe,
html body #modalProductDetail .pd-yt {
  transform: none !important;
  -webkit-transform: none !important;
  filter: none !important;
  image-rendering: auto !important;
}

/* end v52 */


/* ── v53: บังคับช่องอธิบายสูงขึ้นหลังลดคลิป · ไม่ล้ำเส้น ── */
html body #modalProductDetail .pd-content .pd-desc-block#pdDescBlock,
html body #modalProductDetail #pdDescBlock.pd-desc-block {
  margin-bottom: 0.9rem !important;
  flex: 0 1 auto !important;
}

html body #modalProductDetail .pd-content #pdDescWrap.pd-desc-wrap,
html body #modalProductDetail #pdDescWrap.pd-desc-wrap,
html body #modalProductDetail .pd-content .pd-desc-wrap {
  min-height: 200px !important;
  max-height: min(290px, 32vh) !important;
}

@media (min-width: 1024px) {
  html body #modalProductDetail .pd-content #pdDescWrap.pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap.pd-desc-wrap {
    min-height: 220px !important;
    max-height: min(300px, 34vh) !important;
  }
  html body #modalProductDetail .pd-media-stack,
  html body #modalProductDetail .pd-video-wrap,
  html body #modalProductDetail .pd-video {
    max-width: 520px !important;
  }
}

/* end v53 */


/* ── v54: คลิปกว้างเต็มคอลัมน์ขวา ให้ขอบตรงกับช่องอธิบาย ── */
@media (min-width: 1024px) {
  html body #modalProductDetail .pd-media-stack,
  html body #modalProductDetail .pd-video-wrap,
  html body #modalProductDetail .pd-video {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  html body #modalProductDetail .pd-video {
    aspect-ratio: 16 / 9 !important;
    padding-top: 0 !important;
    height: auto !important;
  }
  html body #modalProductDetail .pd-video iframe {
    transform: none !important;
    width: 100% !important;
    height: 100% !important;
  }
  /* คลิปสูงขึ้นตามความกว้าง — ลดช่องอธิบายนิดให้ไม่ล้ำเส้นปุ่มซื้อ */
  html body #modalProductDetail .pd-content #pdDescWrap.pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap.pd-desc-wrap {
    min-height: 170px !important;
    max-height: min(240px, 28vh) !important;
  }
}

/* end v54 */


/* ── v55: คลิปชัด (poster maxres) + กว้างเต็มคอลัมน์ ── */
/* ตัด transform ของ modal ที่ทำให้ iframe/คลิปเบลอ */
html body #modalProductDetail.ix-overlay .ix-modal,
html body #modalProductDetail .ix-modal.pd-modal-wide,
html body #modalProductDetail .pd-modal-wide {
  transform: none !important;
  -webkit-transform: none !important;
  filter: none !important;
}

html body #modalProductDetail .pd-media-stack,
html body #modalProductDetail .pd-video-wrap,
html body #modalProductDetail .pd-video {
  max-width: 100% !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

html body #modalProductDetail .pd-video {
  position: relative !important;
  aspect-ratio: 16 / 9 !important;
  padding-top: 0 !important;
  height: auto !important;
  overflow: hidden !important;
  border-radius: 14px !important;
  background: #000 !important;
  transform: none !important;
  filter: none !important;
  -webkit-font-smoothing: antialiased !important;
}

html body #modalProductDetail .pd-video iframe,
html body #modalProductDetail .pd-video .pd-yt {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  transform: none !important;
  filter: none !important;
  image-rendering: auto !important;
}

/* โปสเตอร์ชัดก่อนกดเล่น */
html body #modalProductDetail .pd-yt-poster {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  cursor: pointer !important;
  background: #000 center / cover no-repeat !important;
  transform: none !important;
  filter: none !important;
  z-index: 2 !important;
}

html body #modalProductDetail .pd-yt-poster img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  border: 0 !important;
  transform: none !important;
  filter: none !important;
  image-rendering: -webkit-optimize-contrast !important;
  image-rendering: high-quality !important;
  -ms-interpolation-mode: nearest-neighbor !important;
}

html body #modalProductDetail .pd-yt-play {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 68px !important;
  height: 48px !important;
  margin: -24px 0 0 -34px !important;
  border: 0 !important;
  border-radius: 14px !important;
  background: #ff0000 !important;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.45) !important;
  pointer-events: none !important;
  z-index: 3 !important;
}

html body #modalProductDetail .pd-yt-play::before {
  content: "" !important;
  position: absolute !important;
  left: 26px !important;
  top: 14px !important;
  width: 0 !important;
  height: 0 !important;
  border-style: solid !important;
  border-width: 10px 0 10px 16px !important;
  border-color: transparent transparent transparent #fff !important;
}

html body #modalProductDetail .pd-video.is-playing .pd-yt-poster {
  display: none !important;
}

@media (min-width: 1024px) {
  html body #modalProductDetail .pd-content #pdDescWrap.pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap.pd-desc-wrap {
    min-height: 170px !important;
    max-height: min(240px, 28vh) !important;
  }
}

/* end v55 */


/* ── v56: โน้ตบุ๊กแยก (จอสูง ≤900px ที่ความกว้าง ≥1024) — เห็นคำอธิบาย · ปุ่มไม่ทับกัน ── */
@media (min-width: 1024px) and (max-height: 900px) {
  html body #modalProductDetail .ix-modal.pd-modal-wide,
  html body #modalProductDetail .ix-modal {
    width: min(1180px, calc(100vw - 1.25rem)) !important;
    max-width: min(1180px, calc(100vw - 1.25rem)) !important;
    max-height: calc(100dvh - 1rem) !important;
    height: auto !important;
  }

  html body #modalProductDetail .ix-modal-body.pd-modal-body,
  html body #modalProductDetail .pd-modal-body {
    display: flex !important;
    flex-direction: column !important;
    max-height: calc(100dvh - 1rem) !important;
    overflow: hidden !important;
    padding-bottom: 0 !important;
  }

  html body #modalProductDetail .pd-layout {
    gap: 0.4rem !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  html body #modalProductDetail .pd-top {
    grid-template-columns: minmax(190px, 0.7fr) minmax(0, 1.4fr) !important;
    gap: 0.8rem !important;
    min-height: 0 !important;
    overflow: hidden !important;
    align-items: start !important;
  }

  html body #modalProductDetail .pd-main-img-wrap {
    max-height: min(220px, 32vh) !important;
  }
  html body #modalProductDetail .pd-main-img,
  html body #modalProductDetail #pdMainImg {
    transform: none !important;
  }
  html body #modalProductDetail .pd-thumb-row,
  html body #modalProductDetail .pd-share {
    margin-top: 0.3rem !important;
  }

  html body #modalProductDetail .pd-content {
    gap: 0.3rem !important;
    height: auto !important;
    max-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    padding-bottom: 0.25rem !important;
    scrollbar-width: thin !important;
  }

  html body #modalProductDetail .pd-head { font-size: 0.8rem !important; margin: 0 !important; }
  html body #modalProductDetail .pd-product-name {
    font-size: 1.28rem !important;
    line-height: 1.15 !important;
    margin: 0 !important;
  }
  html body #modalProductDetail .pd-meta-row { margin: 0.1rem 0 0.15rem !important; }
  html body #modalProductDetail .pd-price { font-size: 1.28rem !important; }

  /* คลิป 16:9 ชัด · สูงไม่กินที่คำอธิบาย · กว้างเต็มแนวได้ตามสัดส่วน */
  html body #modalProductDetail .pd-media-stack,
  html body #modalProductDetail .pd-video-wrap {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0.1rem 0 0.2rem !important;
    flex: 0 0 auto !important;
  }
  html body #modalProductDetail .pd-video {
    width: min(100%, 420px) !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: none !important;
    aspect-ratio: 16 / 9 !important;
    padding-top: 0 !important;
    border-radius: 12px !important;
  }
  html body #modalProductDetail .pd-yt-play {
    width: 56px !important;
    height: 40px !important;
    margin: -20px 0 0 -28px !important;
  }
  html body #modalProductDetail .pd-yt-play::before {
    left: 22px !important;
    top: 11px !important;
    border-width: 9px 0 9px 14px !important;
  }

  /* คำอธิบายเห็นชัด · ไม่ทับเส้นปุ่มซื้อ */
  html body #modalProductDetail .pd-content .pd-desc-block#pdDescBlock,
  html body #modalProductDetail #pdDescBlock.pd-desc-block {
    display: flex !important;
    flex-direction: column !important;
    flex: 0 1 auto !important;
    min-height: 0 !important;
    margin: 0.15rem 0 0.55rem !important;
    gap: 0.3rem !important;
  }
  html body #modalProductDetail .pd-content #pdDescWrap.pd-desc-wrap,
  html body #modalProductDetail #pdDescWrap.pd-desc-wrap,
  html body #modalProductDetail .pd-content .pd-desc-wrap {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    min-height: 120px !important;
    max-height: min(190px, 26vh) !important;
    height: auto !important;
    overflow-y: auto !important;
    margin: 0 !important;
    padding: 0.75rem 0.8rem 0.8rem 0.9rem !important;
    border-radius: 12px !important;
  }
  html body #modalProductDetail .pd-desc-body,
  html body #modalProductDetail #pdDescBody {
    font-size: 0.92rem !important;
    line-height: 1.55 !important;
  }

  /* แถบซื้อ: แยกชัด · พื้นทึบ · ไม่ทับคำอธิบาย */
  html body #modalProductDetail .pd-buy-footer {
    position: sticky !important;
    bottom: 0 !important;
    z-index: 30 !important;
    flex: 0 0 auto !important;
    display: grid !important;
    grid-template-columns: auto minmax(0, 1fr) !important;
    align-items: end !important;
    column-gap: 1.25rem !important;
    row-gap: 0.4rem !important;
    margin-top: 0.1rem !important;
    padding: 0.75rem 0.15rem 0.5rem !important;
    border-top: 1px solid rgba(122, 143, 168, 0.28) !important;
    background: #0b0c10 !important;
    box-shadow: 0 -10px 24px rgba(0, 0, 0, 0.45) !important;
    isolation: isolate !important;
  }
  html body #modalProductDetail .pd-buy-footer .pd-qty,
  html body #modalProductDetail .pd-buy-footer .pd-qty-wrap,
  html body #modalProductDetail .pd-buy-footer #pdQtyWrap {
    align-self: end !important;
    margin: 0 0.25rem 0 0 !important;
    max-width: 168px !important;
    padding-right: 0.25rem !important;
  }
  html body #modalProductDetail #pdBuyBtn.pd-buy-btn,
  html body #modalProductDetail .pd-buy-footer #pdBuyBtn {
    width: 100% !important;
    max-width: none !important;
    min-height: 48px !important;
    height: 48px !important;
    margin: 0 !important;
    align-self: end !important;
  }

  /* toast ไม่ทับปุ่มซื้อ */
  html body .ix-toast.show {
    bottom: 5.75rem !important;
    z-index: 10050 !important;
  }
}

/* end v56 */


/* ── v56t: toast ไม่ทับแถบซื้อบนโน้ตบุ๊ก ── */
@media (min-width: 1024px) and (max-height: 900px) {
  html body .ix-toast,
  html body .ix-toast.show {
    bottom: 7.25rem !important;
    top: auto !important;
    z-index: 10050 !important;
  }
}

/* end v56t */