/* =========================================================================
   woo.css — restyle WooCommerce's own templates to the MWAH system.
   We keep Woo's markup and default CSS (so nothing breaks) and override
   presentation here.
   ========================================================================= */

.woocommerce-page .site-main,
.woocommerce .site-main {
  max-width: var(--content-max);
  margin-inline: auto;
  padding: var(--sp-48) var(--content-pad);
}

@media (max-width: 768px) {
  .woocommerce-page .site-main,
  .woocommerce .site-main { padding-inline: var(--content-pad-mobile); }
}

/* ---- headings --------------------------------------------------------- */

.woocommerce-products-header__title,
.product_title,
.woocommerce h1,
.woocommerce h2 {
  font-weight: 800;
  letter-spacing: -0.02em;
}

.woocommerce-products-header__title {
  font-size: clamp(28px, 4.5vw, 44px);
  margin-bottom: var(--sp-24);
}

/* ---- shop loop -------------------------------------------------------- */

.woocommerce ul.products {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: var(--sp-24);
  margin: 0;
  padding: 0;
}

.woocommerce ul.products::before,
.woocommerce ul.products::after { content: none; }

.woocommerce ul.products li.product {
  width: auto !important;
  margin: 0 !important;
  float: none !important;
  padding: var(--sp-16);
  border: 1px solid var(--border);
  border-radius: var(--radius-card);
  background: var(--white);
  transition: box-shadow var(--transition-mid), transform var(--transition-mid);
}

.woocommerce ul.products li.product:hover {
  box-shadow: var(--shadow-card);
  transform: translateY(-2px);
}

.woocommerce ul.products li.product a img {
  margin-bottom: var(--sp-12);
  border-radius: var(--radius-btn);
  background: var(--paper-grey);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  padding: 0;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: -0.01em;
}

.woocommerce ul.products li.product .price {
  color: var(--ink);
  font-size: 14px;
  font-weight: 700;
}

.woocommerce ul.products li.product .price del { color: var(--text-soft); font-weight: 400; }
.woocommerce ul.products li.product .price ins { text-decoration: none; }

/* ---- buttons ---------------------------------------------------------- */

.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt {
  /* Matches .op-btn / .op-btn--primary in the parent's global.css:
     13px, 0.12em tracking, 16px 24px padding, black text on pink. */
  font: 700 13px/1.4 var(--font);
  letter-spacing: 0.12em;
  min-height: 44px;
  padding: 16px 24px;
  border: 0;
  border-radius: var(--radius-pill);
  background: var(--hot-pink);
  color: var(--ink);
  transition: background var(--transition-fast);
}

.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
  background: var(--hot-pink-hover);
  color: var(--ink);
}

/* ---- single product --------------------------------------------------- */

.woocommerce div.product .product_title {
  font-size: clamp(28px, 4vw, 42px);
  margin-bottom: var(--sp-12);
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: var(--ink);
  font-size: 22px;
  font-weight: 800;
}

.woocommerce div.product .woocommerce-product-details__short-description {
  color: var(--text-mid);
  line-height: 1.6;
}

.woocommerce div.product form.cart .variations {
  margin-bottom: var(--sp-24);
}

.woocommerce div.product form.cart .variations label {
  font: 600 11px/1 var(--font);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--text-soft);
}

.woocommerce div.product form.cart .variations select {
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-btn);
  font-family: var(--font);
  font-size: 14px;
  background: var(--white);
}

.woocommerce div.product .quantity .qty {
  padding: 12px 8px;
  border: 1px solid var(--border);
  border-radius: var(--radius-btn);
  font-family: var(--font);
}

/* Tabs */

.woocommerce div.product .woocommerce-tabs ul.tabs {
  padding: 0;
  margin-bottom: var(--sp-24);
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before { border-color: var(--line); }

.woocommerce div.product .woocommerce-tabs ul.tabs li {
  border: 1px solid var(--line);
  border-radius: var(--radius-btn) var(--radius-btn) 0 0;
  background: var(--paper-grey);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
  background: var(--white);
  border-bottom-color: var(--white);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  font: 600 11px/1 var(--font);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ink);
}

/* ---- notices ---------------------------------------------------------- */

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  border-top-color: var(--hot-pink);
  border-radius: var(--radius-btn);
  background: var(--pink-wash);
  font-size: 14px;
}

.woocommerce-message::before,
.woocommerce-info::before { color: var(--hot-pink); }

/* ---- cart & checkout -------------------------------------------------- */

.woocommerce table.shop_table {
  border-radius: var(--radius-card);
  border-color: var(--border);
}

.woocommerce table.shop_table th {
  font: 600 11px/1 var(--font);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-soft);
}

.woocommerce-checkout #payment {
  border-radius: var(--radius-card);
  background: var(--paper-grey);
}

.woocommerce-checkout #payment div.payment_box {
  background: var(--pink-wash);
  color: var(--text-mid);
  font-size: 13px;
}

.woocommerce-checkout #payment div.payment_box::before {
  border-bottom-color: var(--pink-wash);
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select {
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-btn);
  font-family: var(--font);
  font-size: 14px;
}

.woocommerce form .form-row label {
  font-size: 13px;
  font-weight: 600;
}

/* =========================================================================
   Block cart & checkout (wc-block-*) — WooCommerce 11 renders these as
   blocks, not the legacy shortcode templates.
   ========================================================================= */

.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
  max-width: var(--content-max);
  margin-inline: auto;
  font-family: var(--font);
}

/* Section headings */
.wc-block-components-title,
.wc-block-cart__submit-container + *,
.wp-block-woocommerce-checkout .wc-block-components-checkout-step__title {
  font-family: var(--font);
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--ink);
}

.wc-block-components-checkout-step__description { color: var(--text-mid); }

/* Inputs */
.wc-block-components-text-input input[type="text"],
.wc-block-components-text-input input[type="email"],
.wc-block-components-text-input input[type="tel"],
.wc-block-components-text-input input[type="date"],
.wc-block-components-select__container,
.wc-block-components-textarea {
  border-radius: var(--radius-btn);
  border-color: var(--border);
  font-family: var(--font);
}

.wc-block-components-text-input.is-active label,
.wc-block-components-text-input label { color: var(--text-soft); }

/* Buttons */
.wc-block-components-button:not(.is-link) {
  border-radius: var(--radius-pill);
  background: var(--hot-pink);
  color: var(--ink);
  font-family: var(--font);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.12em;
  min-height: 44px;
  padding: 16px 24px;
}

.wc-block-components-button:not(.is-link):hover {
  background: var(--hot-pink-hover);
  color: var(--ink);
}

.wc-block-components-button.is-link { color: var(--ink); }

/* Totals + panels */
.wc-block-components-totals-wrapper,
.wc-block-components-panel {
  border-color: var(--line);
}

.wc-block-components-totals-item__value { font-weight: 700; color: var(--ink); }

.wc-block-components-order-summary__content { font-size: 14px; }

/* Radio controls (pickup option, payment method) */
.wc-block-components-radio-control__option {
  border-radius: var(--radius-btn);
}

.wc-block-components-radio-control-accordion-option--checked,
.wc-block-components-radio-control__option--checked-option-highlighted {
  border-color: var(--hot-pink);
  background: var(--pink-wash);
}

/* Notices */
.wc-block-components-notice-banner {
  border-radius: var(--radius-btn);
  font-family: var(--font);
}

.wc-block-components-notice-banner.is-error { border-color: var(--hot-pink-hover); }

/* Price */
.wc-block-formatted-money-amount,
.wc-block-components-product-price { font-weight: 700; color: var(--ink); }

/* Order received */
.woocommerce-order {
  max-width: var(--content-max);
  margin-inline: auto;
  font-family: var(--font);
}

.woocommerce-thankyou-order-received {
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--ink);
}