/* Fix final: corregir columna izquierda del modal de producto */
.product-detail-modal.bc-support-left-active-modal .product-detail-grid.product-detail-grid-enhanced{
  grid-template-columns:minmax(360px,430px) minmax(0,1fr) !important;
  gap:34px !important;
  align-items:start !important;
}
.product-detail-modal.bc-support-left-active-modal .detail-gallery-wrap{
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  width:100% !important;
  max-width:420px !important;
  margin:0 auto !important;
  padding:0 12px 12px !important;
  box-sizing:border-box !important;
  overflow:visible !important;
}
.product-detail-modal.bc-support-left-active-modal .detail-image,
.product-detail-modal.bc-support-left-active-modal .detail-image.detail-image-enhanced{
  width:100% !important;
  min-height:340px !important;
  margin:0 !important;
  padding:18px !important;
  box-sizing:border-box !important;
  overflow:visible !important;
}
.product-detail-modal.bc-support-left-active-modal .detail-image #modalMainImage,
.product-detail-modal.bc-support-left-active-modal .detail-image #modalProductImage,
.product-detail-modal.bc-support-left-active-modal .detail-image img{
  width:100% !important;
  max-width:100% !important;
  max-height:250px !important;
  min-height:250px !important;
  object-fit:contain !important;
}
.product-detail-modal.bc-support-left-active-modal .detail-image-zoom-btn{
  top:10px !important;
  right:10px !important;
}
.product-detail-modal.bc-support-left-active-modal .detail-thumbs-strip{
  width:100% !important;
  margin-top:10px !important;
  padding:0 6px !important;
  box-sizing:border-box !important;
  display:grid !important;
  grid-template-columns:40px 1fr 40px !important;
  gap:8px !important;
  align-items:center !important;
}
.product-detail-modal.bc-support-left-active-modal .detail-thumbs-strip .detail-gallery-arrow{
  position:static !important;
  transform:none !important;
  margin:0 !important;
  justify-self:center !important;
}
.product-detail-modal.bc-support-left-active-modal .product-detail-grid.product-detail-grid-enhanced .detail-thumbs.detail-thumbs-visible{
  justify-content:flex-start !important;
  overflow-x:auto !important;
  padding:2px 0 8px !important;
  margin:0 !important;
}
.product-detail-modal.bc-support-left-active-modal .detail-support-left{
  width:100% !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 6px !important;
  box-sizing:border-box !important;
}
.product-detail-modal.bc-support-left-active-modal .detail-support-left .detail-note.detail-wompi-note,
.product-detail-modal.bc-support-left-active-modal .detail-support-left .bc-delivery-box{
  width:100% !important;
  margin:0 !important;
  box-sizing:border-box !important;
}
.product-detail-modal.bc-support-left-active-modal .detail-support-left .bc-delivery-result{
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
}
.product-detail-modal.bc-support-left-active-modal .detail-support-left .bc-delivery-result > div{
  min-width:0 !important;
}
@media(max-width:980px){
  .product-detail-modal.bc-support-left-active-modal .product-detail-grid.product-detail-grid-enhanced{
    grid-template-columns:1fr !important;
  }
  .product-detail-modal.bc-support-left-active-modal .detail-gallery-wrap{
    max-width:100% !important;
    padding:0 4px 10px !important;
  }
}

/* ==========================================================
   FIX SOLICITADO: tarjetas alineadas + icono real WhatsApp
   Fecha: 2026-06-22
   ========================================================== */
.product-grid,
.ninos-product-grid{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:28px !important;
  align-items:stretch !important;
}
.product-grid .product-card,
.ninos-product-grid .product-card{
  display:flex !important;
  flex-direction:column !important;
  height:100% !important;
  min-width:0 !important;
  background:#fff !important;
  border:1px solid #d9e5fb !important;
  border-radius:30px !important;
  overflow:hidden !important;
  box-shadow:0 16px 34px rgba(16,42,99,.08) !important;
}
.product-grid .product-card .product-img,
.ninos-product-grid .product-card .product-img{
  width:100% !important;
  height:260px !important;
  min-height:260px !important;
  padding:18px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#f8fbff !important;
  border-bottom:1px solid #edf3ff !important;
}
.product-grid .product-card .product-img img,
.ninos-product-grid .product-card .product-img img,
.product-grid .product-card .product-img img[data-product-preview],
.ninos-product-grid .product-card .product-img img[data-product-preview]{
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
  margin:auto !important;
}
.product-grid .product-card .product-body,
.ninos-product-grid .product-card .product-body{
  flex:1 !important;
  display:flex !important;
  flex-direction:column !important;
  width:100% !important;
  min-width:0 !important;
  padding:18px 18px 22px !important;
}
.product-grid .product-card .product-tags,
.ninos-product-grid .product-card .product-tags{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  min-height:36px !important;
  margin:0 0 12px !important;
  overflow:hidden !important;
}
.product-grid .product-card .product-body h3,
.ninos-product-grid .product-card .product-body h3{
  min-height:44px !important;
  margin:0 0 10px !important;
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}
.product-grid .product-card .product-card-desc,
.ninos-product-grid .product-card .product-card-desc,
.product-grid .product-card .product-body p,
.ninos-product-grid .product-card .product-body p{
  min-height:66px !important;
  margin:0 0 14px !important;
  display:-webkit-box !important;
  -webkit-line-clamp:3 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}
.product-grid .product-card .price,
.ninos-product-grid .product-card .price{
  min-height:32px !important;
  margin:0 0 14px !important;
  margin-top:0 !important;
}
.product-grid .product-card .card-btn-group,
.ninos-product-grid .product-card .card-btn-group,
.product-grid .product-card .product-body > .add-btn,
.ninos-product-grid .product-card .product-body > .add-btn,
.product-grid .product-card .product-body > .btn-ver,
.ninos-product-grid .product-card .product-body > .btn-ver{
  margin-top:auto !important;
}
.product-grid .product-card .card-btn-group,
.ninos-product-grid .product-card .card-btn-group{
  display:flex !important;
  flex-direction:column !important;
  gap:10px !important;
  width:100% !important;
}
.product-grid .product-card .btn-ver,
.ninos-product-grid .product-card .btn-ver,
.product-grid .product-card .add-btn,
.ninos-product-grid .product-card .add-btn{
  width:100% !important;
  min-height:56px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  border-radius:18px !important;
}
.product-grid .product-card .btn-regalo,
.ninos-product-grid .product-card .btn-regalo,
.product-grid .product-card .gift-btn,
.ninos-product-grid .product-card .gift-btn,
.product-grid .product-card [data-add-gift-draft],
.ninos-product-grid .product-card [data-add-gift-draft]{
  width:100% !important;
  min-height:52px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  border-radius:18px !important;
  white-space:normal !important;
}
.product-grid .product-card .product-body > .gift-btn,
.ninos-product-grid .product-card .product-body > .gift-btn,
.product-grid .product-card .product-body > [data-add-gift-draft],
.ninos-product-grid .product-card .product-body > [data-add-gift-draft]{
  margin-top:10px !important;
}
@media(max-width:1180px){
  .product-grid,.ninos-product-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important;}
}
@media(max-width:860px){
  .product-grid,.ninos-product-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:18px !important;}
  .product-grid .product-card .product-img,
  .ninos-product-grid .product-card .product-img{height:235px !important;min-height:235px !important;}
}
@media(max-width:640px){
  .product-grid,.ninos-product-grid{grid-template-columns:1fr !important;gap:16px !important;}
  .product-grid .product-card .product-img,
  .ninos-product-grid .product-card .product-img{height:285px !important;min-height:285px !important;}
  .product-grid .product-card .product-card-desc,
  .ninos-product-grid .product-card .product-card-desc,
  .product-grid .product-card .product-body p,
  .ninos-product-grid .product-card .product-body p{min-height:auto !important;}
}

button#modalWhatsappBtn,
.btn-wa,
.wa-btn.detail-wa{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:10px !important;
}
button#modalWhatsappBtn img,
.btn-wa img,
.wa-btn.detail-wa img,
#modalWhatsappBtn .wa-icon{
  display:none !important;
}
button#modalWhatsappBtn::before,
.btn-wa::before,
.wa-btn.detail-wa::before{
  content:"" !important;
  display:inline-block !important;
  width:24px !important;
  height:24px !important;
  flex:0 0 24px !important;
  background:#fff !important;
  -webkit-mask:url('../img/whatsapp-glyph-white.svg') center/contain no-repeat !important;
  mask:url('../img/whatsapp-glyph-white.svg') center/contain no-repeat !important;
}
.product-card .product-body > .add-btn[data-open-product]::before{
  content:"👁" !important;
  display:inline-block !important;
  margin-right:8px !important;
  line-height:1 !important;
}


/* === FIX WhatsApp icon visible en modal de producto — 2026-06-22 === */
button#modalWhatsappBtn,
.wa-btn.detail-wa,
.btn-wa{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:10px!important;
}
button#modalWhatsappBtn::before,
.wa-btn.detail-wa::before,
.btn-wa::before{
  content:""!important;
  display:inline-block!important;
  width:24px!important;
  height:24px!important;
  flex:0 0 24px!important;
  background:transparent url('../img/whatsapp-glyph-white.svg') center/contain no-repeat!important;
  -webkit-mask:none!important;
  mask:none!important;
}
button#modalWhatsappBtn img.wa-icon,
.wa-btn.detail-wa img.wa-icon,
.wa-btn img.wa-icon,
.btn-wa img{
  display:none!important;
}