/* Product Detail (PDP) - Professional UI (v2)
   Note: this file is included only on product page.
*/

/* Ensure mobile bottom nav never shows on desktop */
.bottom-nav, .bottomNav, #bottomNav, .mobile-bottom-nav, .mobile-nav, .fixed-bottom-nav { display:none !important; }
@media (max-width: 768px){
  .bottom-nav, .bottomNav, #bottomNav, .mobile-bottom-nav, .mobile-nav, .fixed-bottom-nav { display:flex !important; }
}

.pdp{ padding:18px 0; }
.pdp-top{ display:grid; grid-template-columns:1.2fr 1fr; gap:18px; align-items:start; }
@media (max-width:992px){ .pdp-top{ grid-template-columns:1fr; } }

.pdp-gallery{ position:relative; }
.pdp-main-wrap{ position:relative; background:#fff; border-radius:18px; padding:12px; border:1px solid rgba(0,0,0,.06); box-shadow:0 10px 26px rgba(0,0,0,.06); }
.pdp-main-img{ width:100%; height:420px; object-fit:contain; display:block; border-radius:14px; background:#f7f7f7; }
@media (max-width:480px){ .pdp-main-img{ height:320px; } }

.pdp-hint{ position:absolute; right:12px; bottom:12px; padding:8px 10px; font-size:12px; color:rgba(0,0,0,.6); background:rgba(255,255,255,.85); border:1px solid rgba(0,0,0,.06); border-radius:999px; backdrop-filter: blur(6px); }

.pdp-thumbs{ display:flex; gap:10px; flex-wrap:wrap; margin-top:12px; }
.pdp-thumb{ width:64px; height:64px; border-radius:14px; overflow:hidden; border:2px solid transparent; background:#fff; padding:0; cursor:pointer; }
.pdp-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.pdp-thumb.is-active{ border-color: rgba(255,141,0,.9); box-shadow:0 6px 16px rgba(255,141,0,.22); }

.pdp-zoom-pane{ position:absolute; top:0; right:-360px; width:340px; height:340px; background:#fff; border-radius:18px; border:1px solid rgba(0,0,0,.06); box-shadow:0 10px 26px rgba(0,0,0,.08); background-repeat:no-repeat; opacity:0; pointer-events:none; transform: translateY(8px); transition:.18s ease; }
.pdp-zoom-pane.is-on{ opacity:1; transform: translateY(0); }
@media (max-width:1200px){ .pdp-zoom-pane{ display:none !important; } }

.pdp-zoom-lens{ position:absolute; top:12px; left:12px; border-radius:16px; background: rgba(255,141,0,.12); border:1px solid rgba(255,141,0,.35); opacity:0; pointer-events:none; }
.pdp-zoom-lens.is-on{ opacity:1; }

.pdp-info{ background:#fff; border-radius:18px; padding:16px; border:1px solid rgba(0,0,0,.06); box-shadow:0 10px 26px rgba(0,0,0,.06); }
.pdp-title-row{ display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.pdp-title{ margin:0; font-size:24px; font-weight:650; letter-spacing:-.02em; }

.pdp-chip{ font-size:12px; border-radius:999px; padding:6px 10px; display:inline-flex; align-items:center; gap:6px; border:1px solid rgba(0,0,0,.06); white-space:nowrap; }
.pdp-chip i{ font-size:8px; }
.pdp-chip-ok{ background: rgba(30,185,110,.10); color:#1eb96e; }
.pdp-chip-no{ background: rgba(235,80,80,.10); color:#eb5050; }

.pdp-price{ margin-top:10px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.pdp-old{ color: rgba(0,0,0,.35); text-decoration: line-through; font-size:14px; }
.pdp-now{ font-size:26px; font-weight:750; }
.pdp-badge{ font-size:12px; padding:6px 10px; border-radius:999px; border:1px solid rgba(0,0,0,.06); }
.pdp-badge-discount{ background: rgba(255,77,79,.10); color:#ff4d4f; }
.pdp-badge-new{ background: rgba(30,185,110,.10); color:#1eb96e; }

.pdp-short{ margin-top:10px; color: rgba(0,0,0,.65); line-height:1.45; }

.pdp-block{ margin-top:14px; }
.pdp-block-title{ font-size:13px; color: rgba(0,0,0,.70); display:flex; align-items:center; gap:8px; margin-bottom:10px; }
.pdp-variants{ display:flex; gap:10px; flex-wrap:wrap; }
.pdp-variants .variant-btn{ border:1px solid rgba(0,0,0,.10); background:#fff; border-radius:12px; padding:10px 12px; font-weight:650; cursor:pointer; transition:.12s ease; }
.pdp-variants .variant-btn.is-active{ border-color: rgba(255,141,0,.95); box-shadow: 0 8px 18px rgba(255,141,0,.18); }

.pdp-form{ margin-top:16px; display:flex; flex-direction:column; gap:12px; }
.pdp-qty{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.pdp-qty-label{ font-size:13px; color: rgba(0,0,0,.70); }
.pdp-qty-box{ display:flex; align-items:center; border:1px solid rgba(0,0,0,.10); border-radius:12px; overflow:hidden; }
.pdp-qty-btn{ width:42px; height:40px; background:#fff; border:0; cursor:pointer; font-size:18px; }
.pdp-qty-box input{ width:72px; height:40px; border:0; text-align:center; outline:none; }

.pdp-add{ width:100%; padding:16px 16px; border-radius:14px; font-weight:800; font-size:16px; letter-spacing:.2px; box-shadow:0 14px 28px rgba(0,0,0,.10); }
.pdp-add i{ margin-right:8px; }
.pdp-add:hover{ transform: translateY(-1px); box-shadow:0 18px 34px rgba(0,0,0,.12); }

/* Review stars (selectable) */
.pdp-stars{ display:flex; gap:8px; }
.pdp-star{ width:42px; height:40px; border-radius:12px; border:1px solid rgba(0,0,0,.10); background:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:.12s ease; color: rgba(0,0,0,.25); }
.pdp-star.is-on{ border-color: rgba(255,176,32,.65); background: rgba(255,176,32,.14); color:#ffb020; box-shadow:0 8px 18px rgba(255,176,32,.18); }
.pdp-star:focus{ outline: 2px solid rgba(255,141,0,.35); outline-offset:2px; }

/* Simple captcha row */
.pdp-captcha{ display:flex; align-items:center; gap:10px; }
.pdp-captcha-q{ flex:1; display:flex; align-items:center; gap:8px; font-size:13px; color: rgba(0,0,0,.70); padding:10px 12px; border-radius:12px; border:1px dashed rgba(0,0,0,.14); background: rgba(0,0,0,.02); }
.pdp-captcha input{ width:140px; }
@media (max-width:480px){ .pdp-captcha{ flex-direction:column; align-items:stretch; } .pdp-captcha input{ width:100%; } }
.pdp-trust{ display:flex; flex-direction:column; gap:6px; color: rgba(0,0,0,.55); font-size:13px; }
.pdp-trust i{ margin-right:6px; }

.pdp-bottom{ display:grid; grid-template-columns:1.1fr .9fr; gap:18px; margin-top:18px; }
@media (max-width:992px){ .pdp-bottom{ grid-template-columns:1fr; } }

.pdp-desc, .pdp-video, .pdp-reviews{ background:#fff; border-radius:18px; padding:16px; border:1px solid rgba(0,0,0,.06); box-shadow:0 10px 26px rgba(0,0,0,.06); }
.pdp-sec-title{ font-size:14px; font-weight:750; display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.pdp-desc-body{ color: rgba(0,0,0,.68); line-height:1.55; }

.pdp-video-box{ border-radius:14px; overflow:hidden; background:#f7f7f7; border:1px solid rgba(0,0,0,.06); }
.pdp-embed iframe{ width:100%; height:300px; display:block; border:0; }
@media (max-width:480px){ .pdp-embed iframe{ height:220px; } }
.pdp-video-empty{ padding:22px; display:flex; align-items:center; gap:10px; color: rgba(0,0,0,.6); }

.pdp-reviews{ margin-top:18px; }
.pdp-reviews-grid{ display:grid; grid-template-columns:1fr 1.4fr; gap:18px; align-items:start; }
@media (max-width:992px){ .pdp-reviews-grid{ grid-template-columns:1fr; } }

.pdp-review-form .pdp-form-row{ display:flex; flex-direction:column; gap:6px; margin-bottom:10px; }
.pdp-review-form input, .pdp-review-form select, .pdp-review-form textarea{ border:1px solid rgba(0,0,0,.10); border-radius:12px; padding:10px 12px; outline:none; background:#fff; }

.pdp-review-item{ padding:12px; border:1px solid rgba(0,0,0,.06); border-radius:14px; margin-bottom:10px; }
.pdp-review-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:6px; }
.pdp-review-name{ font-weight:700; }
.pdp-review-stars .fa-star{ font-size:12px; }
.pdp-review-stars .is-on{ color:#ffb020; }
.pdp-review-stars .is-off{ color: rgba(0,0,0,.15); }
.pdp-review-text{ color: rgba(0,0,0,.65); }

.muted{ color: rgba(0,0,0,.55); }
.tiny{ font-size:12px; }

/* Lightbox */
.pdp-lightbox{ position:fixed; inset:0; background: rgba(0,0,0,.72); display:none; align-items:center; justify-content:center; z-index:9999; }
.pdp-lightbox.is-on{ display:flex; }
.pdp-lb-img{ max-width:min(92vw,1100px); max-height:86vh; border-radius:16px; background:#111; }
.pdp-lb-close{ position:absolute; top:16px; right:18px; width:44px; height:44px; border-radius:999px; border:0; background: rgba(255,255,255,.15); color:#fff; font-size:28px; cursor:pointer; }
.pdp-lb-nav{ position:absolute; top:50%; transform: translateY(-50%); width:46px; height:64px; border-radius:14px; border:0; background: rgba(255,255,255,.14); color:#fff; font-size:34px; cursor:pointer; }
.pdp-lb-prev{ left:16px; }
.pdp-lb-next{ right:16px; }
.no-scroll{ overflow:hidden; }
