/* QProcure Product Card SAFE V15 */

.qp-live-product-card{
  position:relative !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
  background:#fff !important;
  border:1px solid #e8e4ef !important;
  border-radius:12px !important;
  min-width:0 !important;
}

.qp-product-media-safe,
.qp-live-product-card > .qp-live-product-img{
  width:100% !important;
  height:190px !important;
  min-height:190px !important;
  max-height:190px !important;
  flex:0 0 190px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
  background:#f7f4fb !important;
  border-bottom:1px solid #ece8f3 !important;
}

.qp-product-media-safe img{
  display:block !important;
  position:static !important;
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
  object-fit:contain !important;
  object-position:center !important;
  margin:0 !important;
  padding:8px !important;
  transform:none !important;
}

.qp-live-product-card .qp-live-product-body{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  grid-template-areas:
    "cat price"
    "title price"
    "supplier meta"
    "actions actions" !important;
  gap:4px 14px !important;
  align-items:start !important;
  padding:12px 14px 14px !important;
  background:#fff !important;
  min-height:0 !important;
}

.qp-live-product-card .qp-live-product-body > small{
  grid-area:cat !important;
  margin:0 !important;
  font-size:11px !important;
}

.qp-live-product-card .qp-live-product-body > h3{
  grid-area:title !important;
  margin:0 !important;
  font-size:14px !important;
  line-height:1.25 !important;
}

.qp-live-product-card .qp-product-supplier{
  grid-area:supplier !important;
  margin:0 !important;
  color:#85899a !important;
  font-size:11px !important;
}

.qp-live-product-card .qp-product-price{
  grid-area:price !important;
  justify-self:end !important;
  margin:0 !important;
  color:#5520a8 !important;
  font-size:15px !important;
  font-weight:800 !important;
  white-space:nowrap !important;
}

.qp-live-product-card .qp-product-meta{
  grid-area:meta !important;
  justify-self:end !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:flex-end !important;
  gap:1px !important;
  margin:0 !important;
  color:#8a8fa0 !important;
  font-size:10px !important;
  white-space:nowrap !important;
}

.qp-live-product-card .qp-product-actions{
  grid-area:actions !important;
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:8px !important;
  width:100% !important;
  margin-top:10px !important;
}

.qp-live-product-card .qp-product-actions button{
  width:100% !important;
  min-width:0 !important;
  margin:0 !important;
}

/* Category/media icons do not belong in product cards. */
.qp-live-product-card .qp-category-icon-v54,
.qp-live-product-card .qp-category-icon-host,
.qp-live-product-card .qp-category-fallback-icon,
.qp-live-product-card [data-qp-icon-converted="1"]{
  display:none !important;
}

@media(max-width:700px){
  .qp-product-media-safe,
  .qp-live-product-card > .qp-live-product-img{
    height:170px !important;
    min-height:170px !important;
    max-height:170px !important;
    flex-basis:170px !important;
  }
}



/* =========================================================
   QPROCURE PRODUCT CARD TYPOGRAPHY V18
   Larger card text + slightly smaller Buy Now button.
   ========================================================= */

.qp-live-product-card .qp-live-product-body > small{
  font-size:12px !important;
  line-height:1.25 !important;
}

.qp-live-product-card .qp-live-product-body > h3{
  font-size:15px !important;
  line-height:1.3 !important;
  font-weight:700 !important;
}

.qp-live-product-card .qp-product-supplier{
  font-size:12px !important;
  line-height:1.25 !important;
}

.qp-live-product-card .qp-product-price{
  font-size:16px !important;
  line-height:1.15 !important;
}

.qp-live-product-card .qp-product-meta{
  font-size:11px !important;
  line-height:1.25 !important;
}

/* Keep Add to Cart wider and make Buy Now slightly smaller */
.qp-live-product-card .qp-product-actions{
  grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr) !important;
  gap:8px !important;
}

.qp-live-product-card .qp-product-actions button{
  min-height:38px !important;
  padding:8px 10px !important;
  font-size:13px !important;
  line-height:1.1 !important;
}

.qp-live-product-card .qp-product-actions .primary,
.qp-live-product-card .qp-product-actions button:last-child{
  font-size:12px !important;
  padding-left:8px !important;
  padding-right:8px !important;
}

@media(max-width:700px){
  .qp-live-product-card .qp-live-product-body > h3{
    font-size:14px !important;
  }
  .qp-live-product-card .qp-product-actions{
    grid-template-columns:1fr .82fr !important;
  }
}



/* =========================================================
   QPROCURE PRODUCT BUTTON FONT V19
   Smaller Add to Cart / Buy Now text.
   ========================================================= */

.qp-live-product-card .qp-product-actions button,
.qp-live-product-card .qp-product-actions .live-btn{
  font-size:11px !important;
  line-height:1.05 !important;
  font-weight:700 !important;
  min-height:36px !important;
  padding:7px 8px !important;
}

.qp-live-product-card .qp-product-actions .primary,
.qp-live-product-card .qp-product-actions button:last-child{
  font-size:10.5px !important;
  padding-left:7px !important;
  padding-right:7px !important;
}

@media(max-width:700px){
  .qp-live-product-card .qp-product-actions button,
  .qp-live-product-card .qp-product-actions .live-btn{
    font-size:10.5px !important;
  }

  .qp-live-product-card .qp-product-actions .primary,
  .qp-live-product-card .qp-product-actions button:last-child{
    font-size:10px !important;
  }
}



/* =========================================================
   QPROCURE MOBILE HOME + PRODUCT CARDS V29
   iPhone: readable cards, no text overlap, 2-column products,
   horizontal category cards.
   ========================================================= */

@media (max-width:700px){

  html,body{
    width:100% !important;
    max-width:100% !important;
    overflow-x:hidden !important;
  }

  .main,
  .content,
  .page,
  .home-main-layout,
  .home-main-left{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }

  .content{
    padding-left:12px !important;
    padding-right:12px !important;
  }

  /* Categories: horizontal swipe instead of squeezed cards */
  .home-category-grid{
    display:flex !important;
    gap:10px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    scroll-snap-type:x proximity !important;
    -webkit-overflow-scrolling:touch !important;
    padding:2px 0 8px !important;
    margin:0 !important;
  }

  .home-category-grid::-webkit-scrollbar{
    display:none !important;
  }

  .home-category-card{
    flex:0 0 150px !important;
    width:150px !important;
    min-width:150px !important;
    min-height:132px !important;
    padding:14px !important;
    scroll-snap-align:start !important;
    overflow:hidden !important;
  }

  .home-category-card h3{
    font-size:15px !important;
    line-height:1.2 !important;
    margin:10px 0 5px !important;
    word-break:normal !important;
  }

  .home-category-card p{
    font-size:12px !important;
    line-height:1.2 !important;
    margin:0 !important;
  }

  /* Featured Materials: 2 clean columns */
  .qp-live-product-grid{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
    width:100% !important;
  }

  .qp-live-product-card{
    width:100% !important;
    min-width:0 !important;
    border-radius:12px !important;
  }

  .qp-product-media-safe,
  .qp-live-product-card > .qp-live-product-img{
    height:145px !important;
    min-height:145px !important;
    max-height:145px !important;
    flex-basis:145px !important;
  }

  .qp-product-media-safe img{
    padding:6px !important;
    object-fit:contain !important;
  }

  /* Stack product details vertically on mobile to avoid overlap */
  .qp-live-product-card .qp-live-product-body{
    display:flex !important;
    flex-direction:column !important;
    gap:3px !important;
    padding:10px !important;
    min-height:168px !important;
  }

  .qp-live-product-card .qp-live-product-body > small{
    order:1 !important;
    font-size:10px !important;
    line-height:1.2 !important;
    margin:0 !important;
    color:#56505f !important;
  }

  .qp-live-product-card .qp-live-product-body > h3{
    order:2 !important;
    font-size:14px !important;
    line-height:1.2 !important;
    margin:0 !important;
    min-height:34px !important;
    overflow-wrap:anywhere !important;
  }

  .qp-live-product-card .qp-product-supplier{
    order:3 !important;
    font-size:10px !important;
    line-height:1.2 !important;
    margin:0 !important;
  }

  .qp-live-product-card .qp-product-price{
    order:4 !important;
    align-self:flex-start !important;
    text-align:left !important;
    font-size:15px !important;
    line-height:1.15 !important;
    margin-top:4px !important;
    white-space:normal !important;
  }

  .qp-live-product-card .qp-product-meta{
    order:5 !important;
    align-self:flex-start !important;
    align-items:flex-start !important;
    text-align:left !important;
    font-size:9px !important;
    line-height:1.2 !important;
    white-space:normal !important;
    margin-top:2px !important;
  }

  .qp-live-product-card .qp-product-actions{
    order:6 !important;
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:6px !important;
    width:100% !important;
    margin-top:auto !important;
    padding-top:8px !important;
  }

  .qp-live-product-card .qp-product-actions button,
  .qp-live-product-card .qp-product-actions .live-btn{
    min-height:36px !important;
    padding:6px 5px !important;
    font-size:10px !important;
    line-height:1.05 !important;
    white-space:normal !important;
    word-break:normal !important;
  }

  /* Section headings stay aligned and don't float in center */
  .home-section-head{
    display:flex !important;
    align-items:flex-end !important;
    justify-content:space-between !important;
    gap:8px !important;
  }

  .home-section-head h2{
    font-size:23px !important;
    line-height:1.15 !important;
    margin:2px 0 0 !important;
  }

  .home-section-head .live-btn{
    flex:0 0 auto !important;
    padding:8px 10px !important;
    font-size:11px !important;
  }

  .home-eyebrow{
    font-size:10px !important;
  }

  /* Floating chat smaller and out of product text */
  .floating-chat-button{
    width:52px !important;
    height:52px !important;
    right:14px !important;
    bottom:86px !important;
  }
}

@media (max-width:390px){
  .qp-live-product-grid{
    gap:8px !important;
  }

  .qp-product-media-safe,
  .qp-live-product-card > .qp-live-product-img{
    height:132px !important;
    min-height:132px !important;
    max-height:132px !important;
    flex-basis:132px !important;
  }

  .qp-live-product-card .qp-live-product-body{
    padding:9px !important;
  }

  .qp-live-product-card .qp-product-actions button,
  .qp-live-product-card .qp-product-actions .live-btn{
    font-size:9.5px !important;
  }
}



/* =========================================================
   QPROCURE PRODUCT IMAGE PADDING V30
   Reduce empty space above/below product images.
   ========================================================= */

.qp-product-media-safe img{
  padding:2px 6px !important;
}

@media (max-width:700px){
  .qp-product-media-safe,
  .qp-live-product-card > .qp-live-product-img{
    height:132px !important;
    min-height:132px !important;
    max-height:132px !important;
    flex-basis:132px !important;
  }

  .qp-product-media-safe img{
    padding:1px 4px !important;
  }
}

@media (max-width:390px){
  .qp-product-media-safe,
  .qp-live-product-card > .qp-live-product-img{
    height:124px !important;
    min-height:124px !important;
    max-height:124px !important;
    flex-basis:124px !important;
  }

  .qp-product-media-safe img{
    padding:0 3px !important;
  }
}
