/* ==========================================================================
   KUMO SODA — woocommerce.css
   Scoped overrides so shop/cart/checkout/account pages share the same
   mobile-first, animated language as the rest of the site.
   ========================================================================== */

.kumo-shop-main{padding-block:40px 72px;}

/* Shop toolbar */
.kumo-shop-meta{display:flex; flex-wrap:wrap; gap:14px; align-items:center; justify-content:space-between; margin-bottom:26px; font-size:.9rem;}
.kumo-shop-meta .woocommerce-result-count{margin:0; color:rgba(24,20,15,.6);}
.kumo-shop-meta select{border:2px solid var(--kumo-ink); border-radius:99px; padding:.5em 1em; background:var(--kumo-paper);}

/* Shop archive grid reuses .kumo-product-card via content-product.php override */
ul.products{display:grid !important; grid-template-columns:repeat(2,1fr); gap:16px; margin:0 !important; padding:0 !important;}
ul.products li.product{list-style:none;}
@media (min-width:700px){ ul.products{grid-template-columns:repeat(3,1fr);} }
@media (min-width:960px){ ul.products{grid-template-columns:repeat(4,1fr);} }

/* Sale / stock badges inside media */
.kumo-product-card__media{display:flex; flex-direction:column;}
.kumo-product-card__media .kumo-badge{position:absolute; top:10px; left:10px; z-index:2;}
.kumo-product-card__media img{position:absolute; inset:0; width:100%; height:100%;}

/* Single product */
.single-product .kumo-shop-main{max-width:1120px; margin-inline:auto;}
.woocommerce div.product{display:grid; gap:36px;}
@media (min-width:900px){ .woocommerce div.product{grid-template-columns:1fr 1fr;} }
.woocommerce div.product .woocommerce-product-gallery{border-radius:24px; overflow:hidden; background:var(--kumo-fiber-light);}
.woocommerce div.product .summary{padding-top:4px;}
.woocommerce div.product .summary .product_title{font-size:clamp(1.8rem,5vw,2.6rem); margin-bottom:.2em;}
.woocommerce div.product p.price{font-family:'JetBrains Mono',monospace; font-size:1.3rem; color:var(--kumo-fiber); margin-bottom:1em;}
.woocommerce div.product .woocommerce-product-details__short-description{color:rgba(24,20,15,.75);}

.woocommerce div.product form.cart{display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin:24px 0;}
.woocommerce div.product form.cart .quantity{display:flex;}
.woocommerce div.product form.cart .qty{
  width:64px; padding:.8em .6em; text-align:center; border:2px solid var(--kumo-ink); border-radius:12px 0 0 12px; border-right:0; background:var(--kumo-paper);
}
.woocommerce div.product form.cart button.single_add_to_cart_button{
  border-radius:0 12px 12px 0 !important; background:var(--kumo-ink); color:#fff; padding:.8em 1.8em;
  font-family:'Baloo 2',sans-serif; font-weight:700; border:2px solid var(--kumo-ink); transition:transform .18s ease;
}
.woocommerce div.product form.cart button.single_add_to_cart_button:hover{transform:translateY(-2px);}

.woocommerce-tabs ul.tabs{display:flex; gap:8px; border-bottom:1px solid rgba(24,20,15,.15); margin:40px 0 20px; flex-wrap:wrap;}
.woocommerce-tabs ul.tabs li{margin:0;}
.woocommerce-tabs ul.tabs li a{display:inline-block; padding:.7em 1.1em; border-radius:99px 99px 0 0; font-family:'Baloo 2',sans-serif; font-weight:600;}
.woocommerce-tabs ul.tabs li.active a{background:var(--kumo-fiber-light); color:var(--kumo-fiber);}

.related.products{margin-top:64px;}
.related.products > h2{font-size:1.8rem; margin-bottom:24px;}

/* Cart page */
.woocommerce-cart table.shop_table{width:100%; border-collapse:collapse; margin-bottom:28px;}
.woocommerce-cart table.shop_table th{text-align:left; font-family:'JetBrains Mono',monospace; font-size:.72rem; text-transform:uppercase; letter-spacing:.06em; padding:10px 8px; border-bottom:2px solid var(--kumo-ink);}
.woocommerce-cart table.shop_table td{padding:14px 8px; border-bottom:1px solid rgba(24,20,15,.1); vertical-align:middle;}
.woocommerce-cart table.shop_table img{width:64px; border-radius:10px;}
.woocommerce-cart .quantity .qty{width:56px; padding:.5em; border:2px solid var(--kumo-ink); border-radius:8px; text-align:center;}
.woocommerce-cart .cart_totals{background:var(--kumo-paper); border-radius:20px; padding:24px; max-width:420px; margin-left:auto;}
.wc-proceed-to-checkout a.checkout-button{
  display:block; text-align:center; background:var(--kumo-ink); color:#fff; padding:.9em; border-radius:99px;
  font-family:'Baloo 2',sans-serif; font-weight:700; margin-top:14px; transition:transform .18s ease;
}
.wc-proceed-to-checkout a.checkout-button:hover{transform:translateY(-2px);}

/* Checkout */
.woocommerce-checkout form .form-row{margin-bottom:14px;}
.woocommerce-checkout input.input-text, .woocommerce-checkout select, .woocommerce-checkout textarea{
  width:100%; padding:.8em 1em; border:1px solid rgba(24,20,15,.2); border-radius:12px; background:var(--kumo-paper);
}
.woocommerce-checkout #payment{background:var(--kumo-paper); border-radius:20px; padding:20px; margin-top:20px;}
.woocommerce-checkout #payment .place-order .button{
  width:100%; background:var(--kumo-ink); color:#fff; padding:1em; border-radius:99px; font-family:'Baloo 2',sans-serif; font-weight:700;
}

/* My account */
.woocommerce-account .woocommerce-MyAccount-navigation ul{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:24px;}
.woocommerce-account .woocommerce-MyAccount-navigation li a{
  display:inline-block; padding:.6em 1.1em; border-radius:99px; background:var(--kumo-fiber-light); color:var(--kumo-fiber); font-size:.9rem;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a{background:var(--kumo-ink); color:#fff;}

/* Notices */
.woocommerce-message, .woocommerce-info, .woocommerce-error{
  border-radius:14px !important; border-top-color:var(--kumo-fiber) !important; background:var(--kumo-fiber-light) !important; color:var(--kumo-ink) !important;
  padding:14px 18px !important; list-style:none !important;
}
.woocommerce-error{background:#fbe6e6 !important; border-top-color:#c0392b !important;}

/* Star rating color */
.star-rating span::before, .star-rating::before{color:var(--kumo-mango) !important;}

/* Toast used by main.js on ajax add-to-cart */
.kumo-toast{
  position:fixed; left:50%; bottom:24px; transform:translate(-50%,120%);
  background:var(--kumo-ink); color:#fff; padding:.9em 1.4em; border-radius:99px;
  font-family:'Baloo 2',sans-serif; font-weight:600; font-size:.9rem; z-index:900;
  box-shadow:0 10px 30px rgba(0,0,0,.25); transition:transform .35s cubic-bezier(.2,.8,.2,1);
}
.kumo-toast.is-visible{transform:translate(-50%,0);}
