/* ==========================================================================
   Verdant Style — WooCommerce styling
   Loaded only on Woo pages. Inherits design tokens from style.css :root.
   ========================================================================== */

.vs-shop .woocommerce-products-header,
.woocommerce-page .page-title {
  margin-bottom: clamp(2rem, 4vw, 3.5rem);
}
.woocommerce-products-header__title,
.vs-shop h1 {
  font-family: var(--vs-font-display);
  font-size: var(--vs-step-3);
  font-weight: 500;
  letter-spacing: -0.02em;
}

/* Result count + ordering row */
.woocommerce .woocommerce-result-count,
.woocommerce .woocommerce-ordering {
  font-family: var(--vs-font-util);
  font-size: var(--vs-step--1);
  color: var(--vs-ink-soft);
}
.woocommerce .woocommerce-ordering select {
  font-family: var(--vs-font-util);
  padding: .5rem 2rem .5rem .75rem;
  border: 1px solid var(--vs-line);
  border-radius: var(--vs-radius);
  background: var(--vs-surface);
}

/* Product loop grid — align Woo's ul.products to the theme grid */
.woocommerce ul.products {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: clamp(1.25rem, 2.5vw, 2.25rem);
  margin: 0 !important;
  padding: 0 !important;
  list-style: none;
}
.woocommerce ul.products li.product {
  width: auto !important;
  margin: 0 !important;
  float: none !important;
  text-align: left;
}
.woocommerce ul.products li.product a img { margin: 0; }

/* Add-to-cart buttons across Woo */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt {
  display: inline-flex; align-items: center; justify-content: center;
  font-family: var(--vs-font-util);
  font-size: var(--vs-step--1);
  letter-spacing: 0.08em; text-transform: uppercase; font-weight: 600;
  padding: .95rem 1.9rem;
  border-radius: var(--vs-radius);
  background: var(--vs-green); color: #fff;
  border: 1px solid var(--vs-green);
  transition: background .3s var(--vs-ease);
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover {
  background: var(--vs-green-deep); border-color: var(--vs-green-deep);
}
.woocommerce .added_to_cart {
  margin-left: .5rem; font-family: var(--vs-font-util);
  font-size: var(--vs-step--1); text-decoration: underline;
}

/* Price */
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price {
  color: var(--vs-ink-soft);
  font-family: var(--vs-font-util);
}
.woocommerce div.product p.price ins { color: var(--vs-green); font-weight: 600; }

/* Single product layout */
.woocommerce div.product { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 4vw, 4rem); }
.woocommerce div.product .woocommerce-product-gallery { margin: 0; }
.woocommerce div.product .product_title {
  font-family: var(--vs-font-display); font-size: var(--vs-step-3); font-weight: 500; letter-spacing: -0.02em;
}
.woocommerce div.product .woocommerce-tabs,
.woocommerce div.product .related,
.woocommerce div.product .upsells { grid-column: 1 / -1; }
@media (max-width: 860px) {
  .woocommerce div.product { grid-template-columns: 1fr; }
}

/* Quantity input */
.woocommerce .quantity .qty {
  border: 1px solid var(--vs-line);
  border-radius: var(--vs-radius);
  padding: .6rem;
  font-family: var(--vs-font-util);
}

/* Tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs { border: 0; padding: 0; }
.woocommerce div.product .woocommerce-tabs ul.tabs::before { border-color: var(--vs-line); }
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  background: transparent; border: 0; border-radius: 0; margin: 0 1.5rem 0 0;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  font-family: var(--vs-font-util); text-transform: uppercase; letter-spacing: 0.06em;
  font-size: var(--vs-step--1); padding: .75rem 0; font-weight: 600;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a { color: var(--vs-green); }

/* Cart table */
.woocommerce table.shop_table {
  border: 1px solid var(--vs-line); border-radius: var(--vs-radius-lg); border-collapse: separate;
}
.woocommerce table.shop_table th { font-family: var(--vs-font-util); text-transform: uppercase; letter-spacing: 0.06em; font-size: var(--vs-step--1); }
.woocommerce-cart table.cart img { border-radius: var(--vs-radius); }

/* Cart totals + checkout review */
.woocommerce .cart_totals h2,
.woocommerce-checkout #order_review_heading,
.woocommerce .cart-collaterals h2 {
  font-family: var(--vs-font-display); font-weight: 500;
}

/* Notices */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  border-top-color: var(--vs-green);
  border-radius: var(--vs-radius);
  font-family: var(--vs-font-util);
  font-size: var(--vs-step--1);
}
.woocommerce-message::before,
.woocommerce-info::before { color: var(--vs-green); }

/* Form fields on checkout / account */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-account .woocommerce input.input-text {
  border: 1px solid var(--vs-line);
  border-radius: var(--vs-radius);
  padding: .85rem 1rem;
  font-family: var(--vs-font-body);
  background: var(--vs-surface);
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus {
  outline: none; border-color: var(--vs-green);
}
.woocommerce form .form-row label { font-family: var(--vs-font-util); font-size: var(--vs-step--1); }

/* Breadcrumb */
.vs-breadcrumb {
  font-family: var(--vs-font-util);
  font-size: var(--vs-step--1);
  color: var(--vs-ink-soft);
  margin-bottom: 2rem;
}
.vs-breadcrumb__sep { opacity: .5; }