/* V48 — product detail mobile polish.
   Scope: product.html only.
   Built after V47. Does not touch header, drawer, home, store, cart, dashboard, or Firestore logic.

   Fixes:
   - Removes the large shaded zoom overlay/circle from the main image.
   - Keeps the main image clickable and keeps the text hint below the gallery.
   - Makes quick facts compact on mobile.
   - Keeps radio circles, removes only strange focus/overlay artifacts.
   - Keeps specs as two-column rows on mobile to reduce vertical length.
*/

/* 1) Remove any overlay on the main product image. The image itself stays clickable. */
body.product-v48 .product-gallery-main::after,
body.product-v48 .product-gallery-main.image-placeholder::after{
  content:none!important;
  display:none!important;
  opacity:0!important;
  visibility:hidden!important;
  background:none!important;
}

body.product-v48 .product-gallery-main{
  cursor:zoom-in!important;
}

body.product-v48 .product-gallery-hint{
  margin-top:12px!important;
  color:rgba(255,247,229,.62)!important;
  font-size:12px!important;
  line-height:1.7!important;
}

/* 2) Compact quick facts on all widths without changing their data. */
body.product-v48 .product-quick-facts{
  gap:8px!important;
}

body.product-v48 .product-quick-facts span{
  min-height:42px!important;
  padding:8px 10px!important;
  border-radius:16px!important;
  font-size:12px!important;
  line-height:1.35!important;
}

/* 3) Packaging: keep radio circles, hide only accidental focus/box artifacts. */
body.product-v48 .packaging-options label{
  overflow:hidden!important;
}

body.product-v48 .packaging-options input[type="radio"]{
  appearance:auto!important;
  -webkit-appearance:radio!important;
  box-shadow:none!important;
  outline:0!important;
  background:transparent!important;
  border-radius:50%!important;
  flex:0 0 18px!important;
}

body.product-v48 .packaging-options input[type="radio"]::before,
body.product-v48 .packaging-options input[type="radio"]::after{
  content:none!important;
  display:none!important;
}

/* 4) Specifications: keep label and value in the same row on mobile. */
@media(max-width:680px){
  body.product-v48 .product-gallery-hint{
    font-size:11.5px!important;
    margin-top:10px!important;
  }

  body.product-v48 .product-quick-facts{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
    margin-top:14px!important;
  }

  body.product-v48 .product-quick-facts span{
    min-height:40px!important;
    padding:7px 6px!important;
    border-radius:14px!important;
    font-size:10.8px!important;
    line-height:1.35!important;
    font-weight:850!important;
  }

  body.product-v48 .product-options{
    gap:14px!important;
    margin-top:18px!important;
  }

  body.product-v48 .option-group{
    gap:8px!important;
  }

  body.product-v48 .packaging-options label{
    min-height:58px!important;
    padding:10px 9px!important;
    border-radius:18px!important;
    font-size:12.2px!important;
    line-height:1.45!important;
  }

  body.product-v48 .packaging-options input[type="radio"]{
    width:17px!important;
    height:17px!important;
    min-width:17px!important;
    min-height:17px!important;
    flex-basis:17px!important;
  }

  body.product-v48 .specs-table{
    border-radius:18px!important;
  }

  body.product-v48 .specs-row{
    grid-template-columns:minmax(108px,.44fr) minmax(0,.56fr)!important;
    align-items:stretch!important;
    min-height:0!important;
  }

  body.product-v48 .specs-row dt,
  body.product-v48 .specs-row dd{
    display:flex!important;
    align-items:center!important;
    padding:8px 10px!important;
    font-size:12px!important;
    line-height:1.45!important;
    min-height:40px!important;
  }

  body.product-v48 .specs-row dt{
    background:rgba(20,16,10,.045)!important;
    color:rgba(24,18,9,.58)!important;
    font-weight:850!important;
  }

  body.product-v48 .specs-row dd{
    background:rgba(255,255,255,.46)!important;
    color:#14100a!important;
    font-weight:850!important;
    word-break:break-word!important;
  }
}

@media(max-width:380px){
  body.product-v48 .product-quick-facts{
    grid-template-columns:1fr!important;
  }

  body.product-v48 .product-quick-facts span{
    min-height:36px!important;
    font-size:11.2px!important;
  }

  body.product-v48 .specs-row{
    grid-template-columns:minmax(92px,.42fr) minmax(0,.58fr)!important;
  }

  body.product-v48 .specs-row dt,
  body.product-v48 .specs-row dd{
    padding:8px 9px!important;
    font-size:11.4px!important;
  }
}