
/* Kapray Product Grid v1.1 — isolated from theme/WooCommerce global styles */
.kpg-section,
.kpg-section *,
.kpg-section *::before,
.kpg-section *::after{box-sizing:border-box}

.kpg-section{
  --kpg-cols-d:4;
  --kpg-cols-t:3;
  --kpg-cols-m:2;
  --kpg-gap:24px;
  width:min(100%,var(--kpg-max-width,1500px)) !important;
  max-width:var(--kpg-max-width,1500px) !important;
  margin:var(--kpg-mt,20px) auto var(--kpg-mb,20px) !important;
  padding-left:var(--kpg-side-padding,20px) !important;
  padding-right:var(--kpg-side-padding,20px) !important;
  position:relative;
  display:block !important;
  clear:both;
  font-family:inherit;
  line-height:1.4;
  color:#111;
}

.kpg-section .kpg-head{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:14px !important;
  margin:0 0 18px !important;
  padding:0 !important;
}
.kpg-section .kpg-head h2{
  margin:0 !important;
  padding:0 !important;
  font:700 28px/1.15 inherit !important;
  color:var(--kpg-title,#111) !important;
  text-transform:none !important;
  letter-spacing:0 !important;
}
.kpg-section .kpg-nav{display:flex !important;gap:8px !important}
.kpg-section .kpg-nav button{
  appearance:none !important;-webkit-appearance:none !important;
  width:38px !important;height:38px !important;min-width:38px !important;
  padding:0 !important;margin:0 !important;
  border:1px solid #ddd !important;border-radius:999px !important;
  background:#fff !important;color:#111 !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  font:400 24px/1 Arial,sans-serif !important;
  box-shadow:none !important;cursor:pointer !important;
}

.kpg-section .kpg-viewport{
  width:100% !important;
  max-width:100% !important;
  overflow:hidden !important;
  margin:0 !important;padding:0 !important;
}
.kpg-section .kpg-products{
  width:100% !important;
  max-width:100% !important;
  display:grid !important;
  grid-template-columns:repeat(var(--kpg-cols-d,4),minmax(0,1fr)) !important;
  gap:var(--kpg-gap,24px) !important;
  margin:0 !important;
  padding:0 !important;
  list-style:none !important;
  align-items:start !important;
}
.kpg-section.kpg-mode-slider .kpg-products{
  display:flex !important;
  flex-wrap:nowrap !important;
  gap:var(--kpg-gap,24px) !important;
  transition:transform .45s ease !important;
  will-change:transform;
}
.kpg-section.kpg-mode-slider .kpg-card{
  flex:0 0 calc((100% - (var(--kpg-gap,24px) * (var(--kpg-cols-d,4) - 1))) / var(--kpg-cols-d,4)) !important;
}

.kpg-section .kpg-card{
  display:block !important;
  position:relative !important;
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  background:var(--kpg-card-bg,#fff) !important;
  border:0 !important;
  border-radius:var(--kpg-card-radius,12px) !important;
  box-shadow:none !important;
  overflow:visible !important;
}
.kpg-section.kpg-border .kpg-card{
  border:1px solid #e8e8e8 !important;
  overflow:hidden !important;
}

.kpg-section .kpg-media{
  position:relative !important;
  width:100% !important;
  max-width:100% !important;
  aspect-ratio:var(--kpg-ratio-d,4 / 5) !important;
  min-height:0 !important;
  margin:0 !important;padding:0 !important;
  overflow:hidden !important;
  border-radius:var(--kpg-img-radius,12px) !important;
  background:#f7f7f7 !important;
}
.kpg-section .kpg-media-link{
  position:absolute !important;inset:0 !important;
  display:block !important;width:100% !important;height:100% !important;
  margin:0 !important;padding:0 !important;border:0 !important;
  text-decoration:none !important;
}
.kpg-section .kpg-img{
  position:absolute !important;inset:0 !important;
  display:block !important;
  width:100% !important;height:100% !important;
  max-width:none !important;max-height:none !important;
  margin:0 !important;padding:0 !important;border:0 !important;
  object-fit:var(--kpg-fit,cover) !important;
  object-position:center center !important;
  border-radius:0 !important;
  transition:opacity .32s ease,transform .4s ease !important;
}
.kpg-section .kpg-primary{opacity:1 !important;z-index:1}
.kpg-section .kpg-secondary{opacity:0 !important;z-index:2}
.kpg-section .kpg-card:hover .kpg-secondary{opacity:1 !important}
.kpg-section .kpg-card.kpg-has-secondary:hover .kpg-primary{opacity:0 !important}
.kpg-section .kpg-card.kpg-no-secondary:hover .kpg-primary{opacity:1 !important}
.kpg-section.kpg-zoom .kpg-card:hover .kpg-img{transform:scale(1.035) !important}

.kpg-section .kpg-badge{
  position:absolute !important;top:12px !important;left:12px !important;z-index:10 !important;
  display:inline-flex !important;align-items:center !important;justify-content:center !important;
  width:auto !important;height:auto !important;min-width:0 !important;
  margin:0 !important;padding:7px 12px !important;
  border:0 !important;border-radius:999px !important;
  background:var(--kpg-badge-bg,#f57f8a) !important;
  color:var(--kpg-badge,#fff) !important;
  font:700 13px/1 inherit !important;
  text-decoration:none !important;
  box-shadow:none !important;
}

.kpg-section .kpg-eye{
  position:absolute !important;top:12px !important;right:12px !important;z-index:11 !important;
  width:40px !important;height:40px !important;min-width:40px !important;
  padding:0 !important;margin:0 !important;
  border:0 !important;border-radius:999px !important;
  background:#fff !important;color:#111 !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  text-decoration:none !important;
  box-shadow:0 3px 14px rgba(0,0,0,.12) !important;
  opacity:0 !important;transform:translateY(-5px) !important;
  transition:.22s ease !important;
  font:600 14px/1 Arial,sans-serif !important;
}
.kpg-section .kpg-card:hover .kpg-eye{opacity:1 !important;transform:none !important}

.kpg-section .kpg-quick{
  appearance:none !important;-webkit-appearance:none !important;
  position:absolute !important;left:50% !important;bottom:48px !important;z-index:12 !important;
  transform:translate(-50%,10px) !important;
  width:auto !important;min-width:0 !important;height:auto !important;
  margin:0 !important;padding:11px 18px !important;
  border:0 !important;border-radius:999px !important;
  background:#fff !important;color:#111 !important;
  box-shadow:0 5px 18px rgba(0,0,0,.16) !important;
  font:700 12px/1 inherit !important;
  text-transform:uppercase !important;letter-spacing:.02em !important;
  white-space:nowrap !important;text-decoration:none !important;
  opacity:0 !important;cursor:pointer !important;
  transition:.22s ease !important;
}
.kpg-section .kpg-card:hover .kpg-quick{opacity:1 !important;transform:translate(-50%,0) !important}
.kpg-section .kpg-quick:disabled{opacity:.55 !important;cursor:wait !important}

.kpg-section .kpg-offer{
  position:absolute !important;left:0 !important;right:0 !important;bottom:0 !important;z-index:8 !important;
  width:100% !important;height:34px !important;
  margin:0 !important;padding:0 !important;
  overflow:hidden !important;
  display:flex !important;align-items:center !important;
  background:var(--kpg-offer-bg,#000) !important;
  color:var(--kpg-offer-color,#fff) !important;
}
.kpg-section .kpg-offer-track{
  display:flex !important;align-items:center !important;flex-wrap:nowrap !important;
  width:max-content !important;min-width:max-content !important;
  gap:9px !important;white-space:nowrap !important;
  margin:0 !important;padding:0 !important;
  color:var(--kpg-offer-color,#fff) !important;
  font:800 11px/1 inherit !important;
  animation:kpg-offer-scroll var(--kpg-offer-speed,18s) linear infinite !important;
}
.kpg-section .kpg-pill{
  display:inline-flex !important;align-items:center !important;
  margin:0 !important;padding:5px 10px !important;
  border-radius:999px !important;
  background:var(--kpg-offer-accent,#f7838d) !important;
  color:#fff !important;
  font:800 11px/1 inherit !important;
}
@keyframes kpg-offer-scroll{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}

.kpg-section .kpg-body{
  width:100% !important;
  display:block !important;
  margin:0 !important;padding:13px 0 2px !important;
  background:transparent !important;
}
.kpg-section.kpg-border .kpg-body{padding:13px !important}

.kpg-section .kpg-title{
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:var(--kpg-title-lines,1) !important;
  line-clamp:var(--kpg-title-lines,1) !important;
  width:100% !important;
  margin:0 0 8px !important;padding:0 !important;
  color:var(--kpg-title,#111) !important;
  font:500 var(--kpg-title-d,16px)/1.35 inherit !important;
  letter-spacing:0 !important;text-transform:none !important;
  text-decoration:none !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  word-break:break-word !important;
  min-height:calc(var(--kpg-title-lines,1) * 1.35 * var(--kpg-title-d,16px)) !important;
}
.kpg-section .kpg-title:hover{text-decoration:none !important;color:var(--kpg-title,#111) !important}

.kpg-section .kpg-sizes{
  display:flex !important;flex-wrap:wrap !important;align-items:center !important;
  gap:7px !important;margin:8px 0 10px !important;padding:0 !important;
}
.kpg-section .kpg-sizes button{
  appearance:none !important;-webkit-appearance:none !important;
  display:inline-flex !important;align-items:center !important;justify-content:center !important;
  min-width:38px !important;width:auto !important;height:32px !important;
  margin:0 !important;padding:0 10px !important;
  border:1px solid #222 !important;border-radius:4px !important;
  background:#fff !important;color:#111 !important;
  box-shadow:none !important;
  font:500 11px/1 inherit !important;
  text-transform:none !important;cursor:pointer !important;
}
.kpg-section .kpg-sizes button.is-selected{background:#111 !important;color:#fff !important}
.kpg-section .kpg-sizes button:disabled{opacity:.35 !important;cursor:not-allowed !important}

.kpg-section .kpg-rating-row{
  display:flex !important;align-items:center !important;flex-wrap:wrap !important;
  gap:4px !important;min-height:18px !important;
  margin:0 0 8px !important;padding:0 !important;
}
.kpg-section .kpg-stars{
  display:inline-block !important;margin:0 !important;padding:0 !important;
  color:var(--kpg-rating,#e45b64) !important;
  font:400 var(--kpg-rating-size,14px)/1 inherit !important;
  letter-spacing:1px !important;white-space:nowrap !important;
}
.kpg-section .kpg-reviews{
  margin:0 !important;padding:0 !important;
  color:#222 !important;font:400 12px/1.2 inherit !important;
}
.kpg-section .kpg-price{
  display:flex !important;align-items:baseline !important;flex-wrap:wrap !important;
  gap:7px !important;
  margin:0 !important;padding:0 !important;
  color:var(--kpg-price,#e11d24) !important;
  font:700 var(--kpg-price-d,14px)/1.3 inherit !important;
}
.kpg-section .kpg-price del{
  margin:0 !important;padding:0 !important;
  color:var(--kpg-old,#777) !important;
  font-weight:400 !important;opacity:.9 !important;
}
.kpg-section .kpg-price ins{
  margin:0 !important;padding:0 !important;
  color:var(--kpg-price,#e11d24) !important;
  font-weight:700 !important;text-decoration:none !important;
}

.kpg-section .kpg-dots{
  display:flex !important;justify-content:center !important;align-items:center !important;
  gap:7px !important;margin:14px 0 0 !important;padding:0 !important;
}
.kpg-section .kpg-dot{
  appearance:none !important;
  width:8px !important;height:8px !important;min-width:8px !important;
  margin:0 !important;padding:0 !important;border:0 !important;border-radius:999px !important;
  background:#ccc !important;box-shadow:none !important;
}
.kpg-section .kpg-dot.is-active{width:22px !important;background:#111 !important}

.kpg-toast{
  position:fixed !important;right:18px !important;bottom:18px !important;z-index:999999 !important;
  background:#111 !important;color:#fff !important;padding:12px 16px !important;border-radius:8px !important;
  box-shadow:0 6px 25px rgba(0,0,0,.2) !important;font:500 13px/1.3 Arial,sans-serif !important;
}
.kpg-toast.err{background:#b42318 !important}

@media(max-width:1024px){
  .kpg-section .kpg-products{
    grid-template-columns:repeat(var(--kpg-cols-t,3),minmax(0,1fr)) !important;
  }
  .kpg-section.kpg-mode-slider .kpg-card{
    flex-basis:calc((100% - (var(--kpg-gap,24px) * (var(--kpg-cols-t,3) - 1))) / var(--kpg-cols-t,3)) !important;
  }
}
@media(max-width:749px){
  .kpg-section{
    width:100% !important;max-width:100% !important;
    padding-left:var(--kpg-mobile-side-padding,12px) !important;
    padding-right:var(--kpg-mobile-side-padding,12px) !important;
  }
  .kpg-section .kpg-head{margin-bottom:12px !important}
  .kpg-section .kpg-head h2{font-size:20px !important}
  .kpg-section .kpg-products{
    grid-template-columns:repeat(var(--kpg-cols-m,2),minmax(0,1fr)) !important;
    gap:14px !important;
  }
  .kpg-section.kpg-mode-slider .kpg-products{gap:14px !important}
  .kpg-section.kpg-mode-slider .kpg-card{
    flex-basis:calc((100% - (14px * (var(--kpg-cols-m,2) - 1))) / var(--kpg-cols-m,2)) !important;
  }
  .kpg-section .kpg-media{aspect-ratio:var(--kpg-ratio-m,4 / 5) !important}
  .kpg-section .kpg-title{font-size:var(--kpg-title-m,13px) !important;margin-bottom:6px !important;min-height:calc(var(--kpg-title-lines,1) * 1.35 * var(--kpg-title-m,13px)) !important}
  .kpg-section .kpg-price{font-size:var(--kpg-price-m,12px) !important}
  .kpg-section .kpg-badge{top:8px !important;left:8px !important;padding:6px 9px !important;font-size:10px !important}
  .kpg-section .kpg-eye{top:8px !important;right:8px !important;width:34px !important;height:34px !important;min-width:34px !important;opacity:1 !important;transform:none !important}
  .kpg-section .kpg-quick{display:none !important}
  .kpg-section .kpg-offer{height:28px !important}
  .kpg-section .kpg-offer-track{font-size:9px !important;gap:6px !important}
  .kpg-section .kpg-pill{font-size:9px !important;padding:4px 7px !important}
  .kpg-section .kpg-body{padding-top:9px !important}
  .kpg-section .kpg-stars{font-size:12px !important}
  .kpg-section .kpg-reviews{font-size:10px !important}
  .kpg-section .kpg-sizes{gap:5px !important;margin:6px 0 8px !important}
  .kpg-section .kpg-sizes button{min-width:30px !important;height:28px !important;padding:0 6px !important;font-size:9px !important}
}
