/* ============================================================
   Alpha-parity category card styling v2 — Avata Labs
   Mirrors goalphalabs.com shop-loop card structure with
   Nova navy/cyan brand tokens.
   ============================================================ */

/* Grid + card shell */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product{
  background:#fff;
  border:1px solid #e7ecf3;
  border-radius:14px;
  padding:14px 14px 18px;
  text-align:center;
  transition:transform .25s ease, box-shadow .25s ease;
  display:flex;
  flex-direction:column;
  position:relative;
  overflow:visible;
}
.woocommerce ul.products li.product:hover{
  transform:translateY(-4px);
  box-shadow:0 12px 26px rgba(20,35,70,.12);
}

/* Product image backdrop */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link img,
.woocommerce ul.products li.product > a:first-of-type img{
  border-radius:10px;
  background:#f4f7fb;
  mix-blend-mode:multiply;
}

/* Sale badge — pill, brand navy */
.woocommerce ul.products li.product .onsale{
  background:#e2443b;
  color:#fff;
  border-radius:20px;
  font-weight:800;
  font-size:12px;
  padding:4px 12px;
  min-height:0;
  line-height:1.4;
  top:10px;
  left:10px;
  right:auto;
  margin:0;
  z-index:5;
}

/* Popular badge (existing hook) */
.nl2-badge--popular{
  position:absolute;
  top:10px;
  right:10px;
  background:#1b2a4a;
  color:#fff;
  font-size:11px;
  font-weight:800;
  padding:4px 10px;
  border-radius:20px;
  z-index:5;
}
.nl2-badge--popular::before{content:"\2605";color:#f5b52e;margin-right:4px}

/* Title */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
h2.woocommerce-loop-product__title{
  text-align:center;
  font-size:15px;
  font-weight:700;
  color:#22304e;
  line-height:1.35;
  min-height:42px;
  padding:8px 4px 2px;
}

/* Price */
.woocommerce ul.products li.product .price{
  color:#1b2a4a;
  font-weight:900;
  font-size:16px;
  margin:4px 0 10px;
}
.woocommerce ul.products li.product .price del{
  color:#9aa5ba;
  font-weight:600;
  font-size:13px;
  opacity:1;
}
.woocommerce ul.products li.product .price ins{
  text-decoration:none;
  color:#2aa9e0;
}

/* Quantity stepper */
.nl-loop-qty{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:0;
  margin:0 auto 10px;
  border:1px solid #dfe6ef;
  border-radius:30px;
  overflow:hidden;
}
.nl-qty-minus,.nl-qty-plus{
  background:#1b2a4a;
  color:#fff;
  border:none;
  width:34px;
  height:34px;
  font-size:17px;
  font-weight:800;
  cursor:pointer;
  transition:background .2s;
  line-height:1;
  padding:0;
}
.nl-qty-minus:hover,.nl-qty-plus:hover{background:#2aa9e0}
.nl-qty-input{
  width:46px;
  height:34px;
  border:none;
  text-align:center;
  font-weight:800;
  font-size:14px;
  color:#22304e;
  -moz-appearance:textfield;
  appearance:textfield;
}
.nl-qty-input::-webkit-outer-spin-button,
.nl-qty-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* Add to cart — full-width rounded, navy -> cyan hover */
.woocommerce ul.products li.product .button.add_to_cart_button{
  display:block;
  margin:0 12px 8px;
  background:#1b2a4a;
  color:#fff;
  border-radius:30px;
  font-weight:800;
  font-size:13.5px;
  padding:10px 8px;
  text-align:center;
  transition:background .2s;
}
.woocommerce ul.products li.product .button.add_to_cart_button:hover{
  background:#2aa9e0;
  color:#fff;
}

/* Learn More — outlined pill */
.nl-learn-more-btn{
  display:block;
  margin:0 12px;
  background:#2aa9e0;
  text-align:center;
  border-radius:30px;
  padding:8px;
  text-decoration:none;
  color:#fff;
  font-weight:700;
  font-size:13px;
  transition:background .2s;
}
.nl-learn-more-btn:hover{background:#1b2a4a;color:#fff}

/* Push buttons to card bottom for even rows */
.woocommerce ul.products li.product .nl-loop-qty{margin-top:auto}

@media (max-width:768px){
  .woocommerce ul.products[class*=columns] li.product{
    width:48%;
    float:left;
    margin-right:4%;
  }
  .woocommerce ul.products[class*=columns] li.product:nth-child(2n){margin-right:0}
  .woocommerce ul.products li.product .woocommerce-loop-product__title{font-size:13.5px;min-height:54px}
  .woocommerce ul.products li.product .button.add_to_cart_button,
  .nl-learn-more-btn{margin:0 4px 8px;font-size:12.5px}
}