/* ============================================================
   CarDiagnosticScanner Product Experience v1.4.0
   Editorial ecommerce cards. CSS is registered in wp_head.
   Scoped to Product Experience components only, Lato sitewide.
   No shadows, gradients, color clashes, or disruptive JS layout.
   ============================================================ */
.csc-product-slider,
.csc-product-grid-wrap,
.csc-product-archive,
.csc-product-wishlist-page{
  --csc-product-card:#ffffff;
  --csc-product-border:#e0e8e3;
  --csc-product-border-soft:#e8eee9;
  --csc-product-terracotta:#141c20;
  --csc-product-terracotta-dark:#111C25;
  --csc-product-blush:#268f2b;
  --csc-product-charcoal:#141c20;
  --csc-product-text:#141c20;
  --csc-product-muted:#596a68;
  font-family:'Lato',Arial,sans-serif!important;
}

/* Equal-height cards with distinct product imagery and details. */
.csc-product-slider .csc-product-card,
.csc-product-grid-wrap .csc-product-card,
.csc-product-archive .csc-product-card,
.csc-product-wishlist-page .csc-product-card{
  background:#fff!important;
  border:1px solid #e0e8e3!important;
  border-radius:15px!important;
  box-shadow:0 3px 12px rgba(15,47,33,.035)!important;
  height:100%!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  transform:none!important;
  transition:border-color .18s ease,box-shadow .18s ease!important;
}
@media(hover:hover){
 .csc-product-slider .csc-product-card:hover,
 .csc-product-grid-wrap .csc-product-card:hover,
 .csc-product-archive .csc-product-card:hover,
.csc-product-wishlist-page .csc-product-card:hover{
   border-color:#9caf9c!important;
   box-shadow:0 7px 22px rgba(15,47,33,.085)!important;
   transform:none!important;
 }
}
.csc-product-slider .csc-product-card-media,
.csc-product-grid-wrap .csc-product-card-media,
.csc-product-archive .csc-product-card-media,
.csc-product-wishlist-page .csc-product-card-media{
  aspect-ratio:1/1!important;
  background:#fff!important;
  border-bottom:1px solid #e8eee9!important;
  flex:0 0 auto!important;
}
.csc-product-card-image-link,
.csc-product-card-image-link img,
.csc-product-card-media img.csc-product-card-image{
  background:#fff!important;
}
.csc-product-slider .csc-product-card-image,
.csc-product-grid-wrap .csc-product-card-image,
.csc-product-archive .csc-product-card-image,
.csc-product-wishlist-page .csc-product-card-image{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  padding:9px!important;
  transform:none!important;
  border:0!important;
  border-radius:0!important;
}
@media(hover:hover){
 .csc-product-card:hover .csc-product-card-image{
  transform:scale(1.025)!important;
 }
}
.csc-product-slider .csc-product-sale-badge,
.csc-product-grid-wrap .csc-product-sale-badge,
.csc-product-archive .csc-product-sale-badge,
.csc-product-wishlist-page .csc-product-sale-badge{
  background:#141c20!important;
  border:0!important;
  color:#fff!important;
  border-radius:6px!important;
  min-width:auto!important;
  font:800 10px/1.15 'Lato',Arial,sans-serif!important;
  padding:6px 8px!important;
  box-shadow:none!important;
  top:10px!important;
  left:10px!important;
}
.csc-product-card .csc-product-wishlist-ui{
  background:#fff!important;
  border:1px solid #e0e8e3!important;
  border-radius:50%!important;
  box-shadow:0 2px 6px rgba(15,47,33,.035)!important;
}

/* Categories, 3-line titles and a fixed bottom CTA area. */
.csc-product-slider .csc-product-card-body,
.csc-product-grid-wrap .csc-product-card-body,
.csc-product-archive .csc-product-card-body,
.csc-product-wishlist-page .csc-product-card-body{
  flex:1 1 auto!important;
  display:flex!important;
  flex-direction:column!important;
  min-width:0!important;
  padding:12px 13px 13px!important;
  background:#fff!important;
}
.csc-product-card-eyebrow{
  display:block!important;
  width:100%!important;
  margin:0 0 7px!important;
  color:#238728!important;
  font:900 9px/1.25 'Lato',Arial,sans-serif!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
  overflow:hidden!important;
  white-space:nowrap!important;
  text-overflow:ellipsis!important;
}
.csc-product-slider .csc-product-card-title,
.csc-product-grid-wrap .csc-product-card-title,
.csc-product-archive .csc-product-card-title,
body .csc-product-card-title{
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:3!important;
  overflow:hidden!important;
  min-height:3.96em!important;
  max-height:3.96em!important;
  margin:0 0 11px!important;
  padding:0!important;
  color:#141c20!important;
  font-family:'Lato',Arial,sans-serif!important;
  font-size:13px!important;
  line-height:1.32!important;
  font-weight:800!important;
  letter-spacing:-.005em!important;
  text-align:left!important;
}
.csc-product-card-title a,
body .csc-product-card-title a{
  color:inherit!important;
  font:inherit!important;
  text-decoration:none!important;
  overflow-wrap:anywhere;
}
.csc-product-card-bottom{
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-end!important;
  margin-top:auto!important;
  min-width:0!important;
}
.csc-product-slider .csc-product-price-row,
.csc-product-grid-wrap .csc-product-price-row,
.csc-product-archive .csc-product-price-row,
.csc-product-wishlist-page .csc-product-price-row{
  display:flex!important;
  align-items:center!important;
  margin:0 0 11px!important;
  min-height:29px!important;
}
.csc-product-slider .csc-product-price,
.csc-product-grid-wrap .csc-product-price,
.csc-product-archive .csc-product-price,
.csc-product-wishlist-page .csc-product-price{
  display:flex!important;
  flex-wrap:wrap!important;
  column-gap:7px!important;
  row-gap:4px!important;
  align-items:baseline!important;
  min-width:0!important;
  font:900 16px/1.25 'Lato',Arial,sans-serif!important;
  color:#141c20!important;
  letter-spacing:-.015em!important;
}
.csc-product-price ins{
  order:0;
  text-decoration:none!important;
}
.csc-product-price del{
  order:1;
  display:inline!important;
  margin:0!important;
  font:600 11px/1.25 'Lato',Arial,sans-serif!important;
  color:#7a877f!important;
  opacity:1!important;
  text-decoration:line-through!important;
}
.csc-product-price del span,
.csc-product-price del .amount{
  color:inherit!important;
  font:inherit!important;
  text-decoration:line-through!important;
}
.csc-product-price .woocommerce-Price-amount,
.csc-product-price .amount{
  font-weight:inherit!important;
}
.csc-product-card-buy-row{
  margin-top:auto!important;
  min-width:0!important;
  width:100%!important;
}
.csc-product-card a.csc-product-buy-button,
.csc-product-card a.csc-product-buy-button:visited{
  position:relative!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  width:100%!important;
  min-height:39px!important;
  padding:9px 8px!important;
  margin:0!important;
  background:#141c20!important;
  border:1px solid #141c20!important;
  border-radius:8px!important;
  color:#fff!important;
  font:800 11.5px/1.15 'Lato',Arial,sans-serif!important;
  letter-spacing:.01em!important;
  text-decoration:none!important;
  box-shadow:none!important;
  white-space:nowrap!important;
  transition:background-color .16s ease,border-color .16s ease!important;
}
.csc-product-card--premium a.csc-product-buy-button--cart,
.csc-product-card--premium a.csc-product-buy-button--options{
  background:#268f2b!important;
  border-color:#268f2b!important;
}
.csc-product-card a.csc-product-buy-button:hover{
  background:#111C25!important;
  border-color:#111C25!important;
  color:#fff!important;
  box-shadow:none!important;
}
.csc-product-card .csc-product-button-icon{
  display:block!important;
  width:14px!important;
  height:14px!important;
  flex:0 0 14px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.9!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  transform:none!important;
}
.csc-product-card a.csc-product-buy-button:focus-visible,
.csc-product-card-title a:focus-visible,
.csc-product-card-image-link:focus-visible,
.csc-product-wishlist-ui:focus-visible{
  outline:2px solid #268f2b!important;
  outline-offset:2px!important;
}
/* Five comfortably sized products per row on desktop by default. */
@media(min-width:1101px){
  .csc-product-grid,
  .csc-product-archive-grid{gap:14px!important}
  .csc-product-slider-track{gap:14px!important}
}
@media(min-width:768px) and (max-width:1100px){
  .csc-product-grid,.csc-product-archive-grid{gap:12px!important}
  .csc-product-slider-track{gap:12px!important}
}
@media(max-width:767px){
  /* Keep real native horizontal swipe and vertical page scrolling. */
  .csc-product-slider-track{
    overflow-x:auto!important;
    overflow-y:hidden!important;
    touch-action:pan-x pan-y!important;
    -webkit-overflow-scrolling:touch!important;
    scroll-snap-type:x proximity!important;
  }
  .csc-product-slider-track>.csc-product-card{scroll-snap-align:start!important}
  .csc-product-grid,.csc-product-archive-grid{gap:9px!important}
  .csc-product-slider .csc-product-card-body,
  .csc-product-grid-wrap .csc-product-card-body,
  .csc-product-archive .csc-product-card-body,
.csc-product-wishlist-page .csc-product-card-body{padding:9px 9px 10px!important}
  .csc-product-card-eyebrow{
    font-size:8px!important;
    margin-bottom:5px!important;
    letter-spacing:.035em!important;
  }
  body .csc-product-card-title,
  .csc-product-grid-wrap .csc-product-card-title,
  .csc-product-slider .csc-product-card-title,
  .csc-product-archive .csc-product-card-title,
.csc-product-wishlist-page .csc-product-card-title{
    font-size:11.5px!important;
    line-height:1.30!important;
    min-height:3.9em!important;
    max-height:3.9em!important;
    margin-bottom:8px!important;
    -webkit-line-clamp:3!important;
  }
  .csc-product-price-row{
    min-height:24px!important;
    margin-bottom:9px!important;
  }
  .csc-product-slider .csc-product-price,
  .csc-product-grid-wrap .csc-product-price,
  .csc-product-archive .csc-product-price,
.csc-product-wishlist-page .csc-product-price{
    font-size:13px!important;
    gap:4px!important;
  }
  .csc-product-price del{font-size:9px!important}
  .csc-product-card a.csc-product-buy-button{
    min-height:37px!important;
    padding:8px 5px!important;
    font-size:10.2px!important;
    border-radius:7px!important;
    gap:4px!important;
  }
  .csc-product-card .csc-product-button-icon{
    width:12px!important;
    height:12px!important;
    flex-basis:12px!important;
  }
  .csc-product-slider .csc-product-sale-badge,
  .csc-product-grid-wrap .csc-product-sale-badge,
  .csc-product-archive .csc-product-sale-badge,
.csc-product-wishlist-page .csc-product-sale-badge{
    top:6px!important;left:6px!important;font-size:9px!important;
    padding:5px 6px!important;
  }
  .csc-product-slider .csc-product-card-image,
  .csc-product-grid-wrap .csc-product-card-image,
  .csc-product-archive .csc-product-card-image,
.csc-product-wishlist-page .csc-product-card-image{padding:5px!important}
}
@media(max-width:355px){
 .csc-product-card a.csc-product-buy-button{font-size:9.4px!important}
 .csc-product-card-eyebrow{font-size:7.7px!important}
}
@media(prefers-reduced-motion:reduce){
 .csc-product-card,.csc-product-card *,
 .csc-product-card a.csc-product-buy-button{transition:none!important}
}


/* ========================================================================
   v1.5.0: INTEGRATED SLIDER WIDTH + MOBILE 3-LINE ELLIPSIS FIXES
   These live in the plugin's final CSS loaded in <head>, not in custom CSS
   or functions.php. Keep the grid columns responsive to admin settings.
   ======================================================================== */

/* Match actual carousel column width to its 14px card gap. The original
   frontend stylesheet calculated desktop widths using only 10px gaps. */
.csc-product-slider[data-csc-product-slider] {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
}
.csc-product-slider[data-csc-product-slider] .csc-product-slider-track {
    box-sizing: border-box !important;
    display: grid !important;
    grid-auto-flow: column !important;
    grid-template-columns: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    scrollbar-width: none !important;
    scroll-snap-type: x proximity !important;
}
.csc-product-slider[data-csc-product-slider] .csc-product-slider-track > .csc-product-card {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    scroll-snap-align: start !important;
}
/* Default setting = five full cards, while honoring any custom setting. */
@media (min-width: 1101px) {
    .csc-product-slider[data-csc-product-slider] .csc-product-slider-track {
        gap: 14px !important;
        grid-auto-columns: calc((100% - (var(--csc-product-slider-desktop, 5) - 1) * 14px) / var(--csc-product-slider-desktop, 5)) !important;
    }
}
@media (min-width: 768px) and (max-width: 1100px) {
    .csc-product-slider[data-csc-product-slider] .csc-product-slider-track {
        gap: 12px !important;
        grid-auto-columns: calc((100% - 24px) / 3) !important;
    }
}
@media (max-width: 767px) {
    .csc-product-slider[data-csc-product-slider] {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .csc-product-slider[data-csc-product-slider] .csc-product-slider-track {
        gap: 8px !important;
        grid-auto-columns: calc((100% - (var(--csc-product-slider-mobile, 2) - 1) * 8px) / var(--csc-product-slider-mobile, 2)) !important;
        touch-action: pan-x pan-y !important;
        overscroll-behavior-x: contain !important;
    }
    /* Clamp the actual product title LINK, not only its H3 wrapper.
       Three exact 16px lines eliminate the fourth-line bleed on phones. */
    html body .csc-product-card .csc-product-card-title {
        display: block !important;
        box-sizing: border-box !important;
        width: 100% !important;
        height: 48px !important;
        min-height: 48px !important;
        max-height: 48px !important;
        margin: 0 0 8px !important;
        padding: 0 !important;
        overflow: hidden !important;
        font-family: 'Lato', Arial, sans-serif !important;
        font-size: 11.5px !important;
        line-height: 16px !important;
    }
    html body .csc-product-card .csc-product-card-title > a {
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 3 !important;
        line-clamp: 3;
        box-sizing: border-box !important;
        width: 100% !important;
        height: auto !important;
        max-height: 48px !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        font-family: 'Lato', Arial, sans-serif !important;
        font-size: 11.5px !important;
        font-weight: 800 !important;
        line-height: 16px !important;
        overflow-wrap: anywhere !important;
        white-space: normal !important;
        text-decoration: none !important;
    }
}
@media (max-width: 359px) {
    .csc-product-slider[data-csc-product-slider] .csc-product-slider-track {
        gap: 7px !important;
        grid-auto-columns: calc((100% - (var(--csc-product-slider-mobile, 2) - 1) * 7px) / var(--csc-product-slider-mobile, 2)) !important;
    }
}
