/* ==========================================================
   WooCommerce restyle — Vault Green tokens over default markup
   ========================================================== */

.woo-wrap { padding-block: var(--space-xl) var(--space-lg); }

.woocommerce-products-header__title.page-title {
  font-size: clamp(1.9rem, 1.5rem + 1.6vw, 2.6rem);
  margin-bottom: var(--space-sm);
}
.woocommerce-products-header { margin-bottom: var(--space-lg); }
.term-description,
.woocommerce-result-count { color: var(--ink-soft); font-size: 0.92rem; }

/* Toolbar (ordering / result count) */
.woocommerce-ordering { margin-bottom: 0; }
.woocommerce-ordering select {
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  padding: 0.5em 0.8em;
  background: var(--surface);
  font-family: var(--font-body);
  font-size: 0.9rem;
}
.woocommerce .woocommerce-result-count { margin: 0 0 var(--space-md); }

/* ---- Product grid (archive/shop) ---- */
.woocommerce ul.products {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-md);
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
@media (max-width: 1100px) { .woocommerce ul.products { grid-template-columns: repeat(3, 1fr) !important; } }
@media (max-width: 780px) { .woocommerce ul.products { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 480px) { .woocommerce ul.products { grid-template-columns: 1fr !important; } }

.woocommerce ul.products li.product {
  width: 100% !important;
  margin: 0 !important;
  float: none !important;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  overflow: hidden;
  padding: 0 !important;
  transition: border-color 150ms ease, transform 150ms ease;
  position: relative;
}
.woocommerce ul.products li.product:hover { border-color: var(--border-strong); transform: translateY(-3px); }

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.woocommerce ul.products li.product img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 0 !important;
  margin: 0 !important;
}
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 0.98rem;
  line-height: 1.3;
  color: var(--ink);
  padding: var(--space-md) var(--space-md) 0;
  margin: 0;
}
.woocommerce ul.products li.product .price {
  padding: 0.4em var(--space-md) var(--space-md);
  margin: auto 0 0;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.05rem;
  color: var(--ink);
}
.woocommerce ul.products li.product .price ins { text-decoration: none; color: var(--accent); }
.woocommerce ul.products li.product .price del { color: var(--ink-soft); opacity: 0.7; font-weight: 400; font-size: 0.85em; }

.woocommerce span.onsale {
  position: absolute;
  top: 12px; left: 12px;
  min-height: 0; min-width: 0;
  display: inline-flex;
  align-items: center;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: 0.68rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 0.35em 0.85em;
  border-radius: var(--radius-pill);
  background: var(--support);
  color: var(--support-ink);
  z-index: 2;
  margin: 0;
}

.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .added_to_cart {
  margin: 0.6em var(--space-md) var(--space-md);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 0.88rem;
  padding: 0.7em 1.2em;
  border-radius: var(--radius-sm);
  background: var(--accent);
  color: #fff !important;
  border: 1px solid var(--accent);
  transition: background-color 150ms ease;
}
.woocommerce ul.products li.product .button:hover { background: var(--accent-hover); border-color: var(--accent-hover); }

.woocommerce nav.woocommerce-pagination { margin-top: var(--space-xl); }
.woocommerce nav.woocommerce-pagination ul { border: none !important; display: flex; gap: 0.4em; }
.woocommerce nav.woocommerce-pagination ul li { border: none !important; }
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  border: 1px solid var(--border-strong) !important;
  border-radius: var(--radius-sm);
  color: var(--ink);
  padding: 0.5em 0.9em;
}
.woocommerce nav.woocommerce-pagination ul li span.current,
.woocommerce nav.woocommerce-pagination ul li a:hover {
  background: var(--accent);
  border-color: var(--accent) !important;
  color: #fff;
}

/* ---- Single product ---- */
.woocommerce div.product {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-xl);
}
.woocommerce div.product .woocommerce-product-gallery { grid-column: 1; }
.woocommerce div.product .woocommerce-product-gallery img {
  border-radius: var(--radius-md);
  border: 1px solid var(--border);
}
.woocommerce div.product .summary {
  grid-column: 2;
  float: none !important;
  width: 100% !important;
}
.woocommerce div.product .summary .product_title {
  font-size: clamp(1.6rem, 1.3rem + 1vw, 2.1rem);
  margin-bottom: var(--space-sm);
}
.woocommerce div.product .summary .price {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 1.5rem;
  color: var(--ink);
  margin-bottom: var(--space-md);
}
.woocommerce div.product .summary .price ins { text-decoration: none; color: var(--accent); }
.woocommerce div.product p.stock {
  display: inline-flex;
  align-items: center;
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--accent);
  margin-bottom: var(--space-md);
}
.woocommerce div.product form.cart {
  display: flex;
  align-items: center;
  gap: var(--space-md);
  margin-bottom: var(--space-lg);
}
.woocommerce div.product form.cart .quantity input {
  width: 64px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  padding: 0.75em;
  text-align: center;
  font-family: var(--font-body);
}
.woocommerce div.product form.cart button.single_add_to_cart_button {
  font-family: var(--font-display);
  font-weight: 700;
  background: var(--accent);
  color: #fff;
  border: 1px solid var(--accent);
  border-radius: var(--radius-sm);
  padding: 0.85em 1.8em;
  font-size: 0.98rem;
}
.woocommerce div.product form.cart button.single_add_to_cart_button:hover { background: var(--accent-hover); }

.woocommerce div.product .woocommerce-product-details__short-description {
  color: var(--ink-soft);
  margin-bottom: var(--space-lg);
  padding-top: var(--space-md);
  border-top: 1px solid var(--border);
}

.woocommerce div.product .woocommerce-tabs {
  grid-column: 1 / -1;
  margin-top: var(--space-xl);
  border-top: 1px solid var(--border);
  padding-top: var(--space-lg);
}
.woocommerce div.product .woocommerce-tabs ul.tabs {
  display: flex;
  gap: var(--space-lg);
  border-bottom: 1px solid var(--border);
  margin-bottom: var(--space-lg);
  padding: 0;
  list-style: none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  margin: 0; padding: 0 0 0.8em;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--ink-soft);
  border: none !important;
  background: none !important;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active { color: var(--ink); border-bottom: 2px solid var(--accent) !important; }
.woocommerce div.product .woocommerce-tabs ul.tabs li a { color: inherit; }
.woocommerce div.product .woocommerce-Tabs-panel { color: var(--ink-soft); max-width: 70ch; }

.related.products {
  grid-column: 1 / -1;
  margin-top: var(--space-xl);
  padding-top: var(--space-lg);
  border-top: 1px solid var(--border);
}
.related.products > h2 { margin-bottom: var(--space-lg); }

@media (max-width: 900px) {
  .woocommerce div.product { grid-template-columns: 1fr; }
  .woocommerce div.product .summary { grid-column: 1; }
}

/* ---- Cart & checkout ---- */
.woocommerce table.shop_table {
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  border-collapse: separate;
  overflow: hidden;
}
.woocommerce table.shop_table th {
  background: var(--bg);
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--ink-soft);
  padding: var(--space-sm) var(--space-md);
}
.woocommerce table.shop_table td { padding: var(--space-sm) var(--space-md); border-top: 1px solid var(--border); }
.woocommerce-cart table.cart img { border-radius: var(--radius-sm); }
.woocommerce a.remove { color: var(--ink-soft) !important; }
.woocommerce a.remove:hover { color: var(--accent) !important; background: transparent !important; }

.woocommerce #content input.button,
.woocommerce-page #content input.button,
.woocommerce input.button,
.woocommerce-page input.button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce #respond input#submit {
  font-family: var(--font-display);
  font-weight: 700;
  background: var(--accent) !important;
  color: #fff !important;
  border: 1px solid var(--accent) !important;
  border-radius: var(--radius-sm) !important;
  padding: 0.75em 1.4em !important;
}
.woocommerce #content input.button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce #respond input#submit:hover {
  background: var(--accent-hover) !important;
  border-color: var(--accent-hover) !important;
}

.woocommerce-checkout #payment { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row select,
.woocommerce form .form-row textarea {
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  padding: 0.7em 0.9em;
  font-family: var(--font-body);
}
.woocommerce-billing-fields h3,
.woocommerce-additional-fields h3,
.woocommerce-checkout .cart_totals h2,
.cart-collaterals h2 {
  font-size: 1.2rem;
  margin-bottom: var(--space-md);
}

/* ---- Misc ---- */
.woocommerce .star-rating { color: var(--support); }
.woocommerce-message,
.woocommerce-info { border-top-color: var(--accent) !important; }
.woocommerce-message::before,
.woocommerce-info::before { color: var(--accent) !important; }
.woocommerce-error { border-top-color: #B3261E !important; }


/* ---- Block Cart & Checkout ----------------------------------------------
   These render inside page.php. They are app UI, not prose, so they get the
   full container and none of the reading-measure typography.               */
.entry__content--wc { font-size: 1rem; color: var(--ink); }
.entry__content--wc p { max-width: none; }
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout { max-width: none; }
.entry__content--wc .alignwide { max-width: none; margin-inline: 0; }

/* Give the sidebar a real floor so the summary never collapses to a sliver */
.wc-block-components-sidebar-layout .wc-block-components-main { min-width: 0; flex: 1 1 auto; }
.wc-block-components-sidebar-layout .wc-block-components-sidebar { flex: 0 0 380px; min-width: 340px; }

/* Never hyphenate or split product names and prices mid-word */
.wc-block-components-product-name,
.wc-block-components-product-metadata,
.wc-block-components-product-metadata__description,
.wc-block-components-product-price,
.wc-block-components-order-summary-item__description,
.wc-block-components-totals-item__label {
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: none;
}

/* Order summary line items: image left, text given room to breathe */
.wc-block-components-order-summary-item { grid-column-gap: var(--space-md); }
.wc-block-components-order-summary-item__description { min-width: 0; }
.wc-block-components-product-metadata__description { display: none; }

/* On-brand controls inside the blocks */
.wc-block-components-button:not(.is-link) {
  background: var(--accent);
  color: #fff;
  border-radius: var(--radius-sm);
  font-family: var(--font-display);
  font-weight: 700;
}
.wc-block-components-button:not(.is-link):hover { background: var(--accent-hover); }
.wc-block-components-sidebar .wc-block-components-panel,
.wc-block-components-sidebar .wc-block-components-totals-wrapper {
  background: var(--surface);
  border-radius: var(--radius-md);
}

@media (max-width: 1000px) {
  .wc-block-components-sidebar-layout .wc-block-components-sidebar { flex: 1 1 100%; min-width: 0; }
}
