/* ============================================================
   LUMÉA — product detail
   Additions the ported Lumea classes do not cover: the platform
   variant selects, the real gallery/video states, the zoom
   lightbox details and the rating form controls.
   Colours come from the palette tokens in theme.css.
   ============================================================ */

/* ---------- page scaffold ---------- */
.pd-crumbs{text-align:left;padding:clamp(1.4rem,3vw,2.2rem) 0 0}
.pd-wrap{padding:2.4rem 0 clamp(3rem,7vw,5.5rem)}

/* ---------- gallery: image or video ---------- */
.pd-main [hidden]{display:none}
.pd-main:not([role]){cursor:default}
.pd-main.is-video{cursor:default}
.pd-main video{width:100%;height:100%;object-fit:contain;background:var(--bg-tile)}
.pd-zoom-hint .hint-tap{display:none}
@media (hover:none){
  .pd-zoom-hint .hint-click{display:none}
  .pd-zoom-hint .hint-tap{display:inline}
}

/* ---------- variants (selects built by attributes.js) ---------- */
.pd-variants .attribute-selector-group{margin-bottom:0}
.pd-variants .attribute-selector-group + .attribute-selector-group{margin-top:1rem}
.pd-variants .attribute-selector-group label{
  display:block;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ink-soft);margin-bottom:.5rem;
}

/* ---------- price / stock ---------- */
.pd-price [hidden]{display:none}
.pd-buy [data-product-button-price-wrap]{display:inline-flex;align-items:baseline;gap:.3rem}
.pd-buy [hidden]{display:none}
.pd-stock{margin-top:.2rem}

/* ---------- product attributes ---------- */
.pd-attrs{margin:0;border-top:1px solid var(--line-soft)}
.pd-attrs>div{
  display:flex;justify-content:space-between;gap:1rem;
  padding:.55rem 0;border-bottom:1px solid var(--line-soft);font-size:.84rem;
}
.pd-attrs dt{
  flex:none;color:var(--ink-mute);font-size:.66rem;letter-spacing:.16em;
  text-transform:uppercase;padding-top:.16rem;
}
.pd-attrs dd{margin:0;color:var(--ink-soft);text-align:right;word-break:break-word}
.pd-attrs dd a{color:var(--gold-deep);text-decoration:underline;text-underline-offset:2px}
.acc-panel>.pd-attrs:first-child{border-top:none}
.pd-file{margin-top:.9rem;font-size:.84rem}
.pd-file .text-link{font-size:.68rem;letter-spacing:.16em}

/* ---------- rich description inside the info column ---------- */
.pd-desc>:first-child{margin-top:0}
.pd-desc>:last-child{margin-bottom:0}
.pd-desc p+p{margin-top:.8rem}
.pd-desc ul,.pd-desc ol{margin:.9rem 0 0 1.1rem}
.pd-desc ul{list-style:disc}
.pd-desc ol{list-style:decimal}
.pd-desc li{margin-bottom:.3rem;padding-left:.2rem}
.pd-desc li::marker{color:var(--gold)}
.pd-desc a{color:var(--gold-deep);text-decoration:underline;text-underline-offset:2px}
.pd-desc h2,.pd-desc h3,.pd-desc h4{font-size:1.05rem;margin:1.2rem 0 .4rem;color:var(--ink)}

/* ---------- zoom lightbox ---------- */
body.lb-open{overflow:hidden}
#product-lightbox .lb-stage img{object-fit:contain;background:var(--bg-tile)}
#product-lightbox .lb-btn:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* ---------- reviews ---------- */
#tab-reviews{background:var(--bg-alt)}
#tab-reviews,#write-review{scroll-margin-top:110px}
.rw-score .rw-stars{display:inline-flex;align-items:center;margin-top:.45rem}
.rw-score .stars svg{width:15px;height:15px}
.review-form .review-field{margin-bottom:1.35rem}
.review-form .star-label{
  display:block;font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ink-soft);margin-bottom:.5rem;
}
.review-form .star-label .req{color:var(--gold-deep)}
.pd-star-field{flex-direction:row-reverse;justify-content:flex-end}
.pd-star-field label{height:2rem;width:1.6rem;display:inline-flex;align-items:center;justify-content:center;color:var(--ink-mute)}
.pd-star-field input:focus-visible + label{outline:2px solid var(--gold-deep);outline-offset:2px}

@media (max-width:700px){
  .pd-crumbs{padding-top:1.2rem}
  .pd-wrap{padding-top:1.6rem}
  .pd-attrs>div{font-size:.8rem}
  .rw-score .big{font-size:3.2rem}
}