/* ============================================================
   SIGNAL PACK — PRODUCT CARD SYSTEM
   ============================================================ */

.sp-product-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
@media (max-width:1080px){ .sp-product-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .sp-product-grid{ grid-template-columns:1fr; } }

.sp-pcard{
  background:var(--paper); border-radius:var(--radius-2xl); overflow:hidden; border:1px solid var(--line);
  display:flex; flex-direction:column; transition:box-shadow var(--duration-base) var(--ease), transform var(--duration-base) var(--ease);
}
.sp-pcard:hover{ box-shadow:var(--shadow-md); }

.sp-pcard .sp-pimg{ height:180px; background:var(--grey-bg); position:relative; overflow:hidden; }
.sp-pcard .sp-pimg img{ width:100%; height:100%; object-fit:cover; transition:transform var(--duration-slow) var(--ease); }
.sp-pcard:hover .sp-pimg img{ transform:scale(1.04); }

.sp-badge-row{ position:absolute; top:10px; left:10px; display:flex; gap:6px; flex-wrap:wrap; }
.sp-tag{ font-family:var(--font-display); font-weight:700; font-size:10px; text-transform:uppercase; padding:4px 9px; border-radius:var(--radius-sm); }
.sp-tag-customizable{ background:var(--yellow); color:var(--ink); }
.sp-tag-ready-stock{ background:var(--navy); color:#fff; }
.sp-tag-b2b{ background:var(--ink); color:#fff; }
.sp-tag-b2c{ background:var(--paper); color:var(--navy); border:1px solid var(--navy); }
.sp-tag-out-of-stock{ background:var(--color-disabled-text); color:#fff; }

.sp-pcard .sp-pbody{ padding:18px; display:flex; flex-direction:column; flex-grow:1; }
.sp-pcard .sp-pcategory{ font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:var(--grey-text); margin-bottom:4px; }
.sp-pcard h4{ font-size:14.5px; margin-bottom:6px; }
.sp-pcard .sp-pdesc{ font-size:12px; color:var(--grey-text); line-height:1.5; margin-bottom:10px; }
.sp-pcard .sp-stars{ color:var(--yellow); font-size:12px; margin-bottom:8px; }
.sp-pcard .sp-stars .sp-count{ color:var(--grey-text); font-size:11px; margin-left:4px; }
.sp-pcard .sp-price{ font-family:var(--font-display); font-weight:800; font-size:var(--fs-price); color:var(--navy); margin-bottom:2px; }
.sp-pcard .sp-price-request{ font-family:var(--font-display); font-weight:700; font-size:14px; color:var(--navy); margin-bottom:2px; }
.sp-pcard .sp-moq{ font-size:11.5px; color:var(--grey-text); margin-bottom:14px; }
.sp-pcard .sp-pactions{ display:flex; flex-direction:column; gap:8px; margin-top:auto; }
.sp-pcard .sp-pactions .sp-row2{ display:flex; gap:8px; }
.sp-pcard .sp-pactions .sp-row2 .sp-btn{ flex:1; padding:0 8px; font-size:10.5px; }

/* Variant: compact card (denser grid, e.g. bag category tiles) */
.sp-pcard.sp-pcard--compact .sp-pimg{ height:130px; }
.sp-pcard.sp-pcard--compact .sp-pbody{ padding:14px; }
.sp-pcard.sp-pcard--compact h4{ font-size:13px; min-height:34px; }

/* Variant: horizontal list card (search results, cart-adjacent listings) */
.sp-pcard.sp-pcard--horizontal{ flex-direction:row; }
.sp-pcard.sp-pcard--horizontal .sp-pimg{ width:140px; height:auto; flex-shrink:0; }
.sp-pcard.sp-pcard--horizontal .sp-pbody{ padding:16px; }
@media (max-width:480px){ .sp-pcard.sp-pcard--horizontal{ flex-direction:column; } .sp-pcard.sp-pcard--horizontal .sp-pimg{ width:100%; height:150px; } }

/* Variant: featured card (larger, homepage best-sellers) */
.sp-pcard.sp-pcard--featured .sp-pimg{ height:220px; }
.sp-pcard.sp-pcard--featured h4{ font-size:17px; }

/* Variant: ready-stock — Add to Cart is primary action */
.sp-pcard.sp-pcard--ready-stock .sp-pactions .sp-btn-primary{ order:1; }

/* Variant: custom-order — Request Quote is primary, single full-width action */
.sp-pcard.sp-pcard--custom-order .sp-pactions{ display:block; }
.sp-pcard.sp-pcard--custom-order .sp-pactions .sp-btn{ width:100%; }

/* Variant: related product (used in cart/product-detail rails) */
.sp-related-rail{ display:flex; gap:16px; overflow-x:auto; padding-bottom:8px; }
.sp-related-rail .sp-pcard{ min-width:200px; flex-shrink:0; }

/* ---------- States ---------- */
.sp-pcard.is-loading .sp-pimg{ background:linear-gradient(90deg, var(--grey-bg) 25%, var(--grey-alt) 37%, var(--grey-bg) 63%); background-size:400% 100%; animation:sp-skeleton 1.4s ease infinite; }
.sp-pcard.is-loading .sp-pbody *{ visibility:hidden; }

.sp-pcard.is-out-of-stock .sp-pimg::after{ content:""; position:absolute; inset:0; background:rgba(255,255,255,0.55); }
.sp-pcard.is-out-of-stock .sp-pactions .sp-btn{ pointer-events:none; opacity:0.5; }
.sp-pcard .sp-oos-label{ display:none; font-size:12px; font-weight:700; color:var(--color-error); margin-bottom:8px; }
.sp-pcard.is-out-of-stock .sp-oos-label{ display:block; }

@keyframes sp-skeleton{ 0%{ background-position:100% 50%; } 100%{ background-position:0 50%; } }