/* ═══════════════════════════════════════════════════════════════════
   MORGAN BOOK — WooCommerce page styling.
   Loaded only on store pages. Inherits every value from tokens.css.

   Approach: WooCommerce's own markup is left alone and styled from the
   outside. Only two templates are overridden in this theme (thankyou.php
   and cart-empty.php); cart.php and form-checkout.php are deliberately
   NOT overridden so WooCommerce updates never break the checkout.
   ═══════════════════════════════════════════════════════════════════ */

.woocommerce, .woocommerce-page { font-family: var(--f-body); color: var(--ink); }

.woocommerce h1, .woocommerce h2, .woocommerce h3,
.woocommerce-checkout h3,
.woocommerce-cart h1,
.woocommerce-order-received h1 {
  font-family: var(--f-display);
  font-weight: var(--fw-display);
  line-height: var(--lh-head);
  letter-spacing: var(--ls-display);
  color: var(--ink);
}

/* ── Buttons ────────────────────────────────────────────────────── */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce-page a.button,
.woocommerce-page button.button,
.woocommerce-page input.button,
.wc-block-components-button {
  min-height: 47px;
  padding: var(--s3) var(--s5);
  border: none;
  border-radius: var(--r-pill);
  background: var(--accent-alt);
  color: var(--alt-ink);
  font-family: var(--f-body);
  font-weight: var(--fw-heavy);
  transition: filter var(--dur), transform var(--dur-fast);
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.wc-block-components-button:hover {
  background: var(--accent-alt);
  color: var(--alt-ink);
  filter: brightness(1.06);
  transform: translateY(-1px);
}

/* Primary actions */
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
#place_order,
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
  background: var(--accent);
  color: var(--accent-ink);
  font-weight: var(--fw-heavy);
}
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
#place_order:hover {
  background: var(--accent);
  color: var(--accent-ink);
  filter: brightness(1.06);
}

/* ── Fields ─────────────────────────────────────────────────────── */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce .select2-container .select2-selection,
.wc-block-components-text-input input {
  min-height: 47px;
  padding: var(--s3) var(--s4);
  border: 1.5px solid var(--line);
  border-radius: var(--r-md);
  font-family: var(--f-body);
  font-size: var(--t-body);
  color: var(--ink);
  background: var(--paper);
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.wc-block-components-text-input input:focus {
  border-color: var(--accent);
  outline: 2px solid var(--focus);
  outline-offset: 1px;
  box-shadow: none;
}
.woocommerce form .form-row label {
  display: block;
  margin-bottom: var(--s1);
  font-size: var(--t-small);
  color: var(--muted);
}
.woocommerce form .form-row .required { color: var(--accent); }

/* ── Prices ─────────────────────────────────────────────────────── */
.woocommerce .price,
.woocommerce .amount,
.woocommerce-Price-amount {
  font-family: var(--f-display);
  font-weight: var(--fw-display);
  color: var(--ink);
}

/* ── Notices ────────────────────────────────────────────────────── */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  border-top-color: var(--accent);
  border-radius: var(--r-md);
  font-size: var(--t-small);
}
.woocommerce-message::before,
.woocommerce-info::before { color: var(--accent); }

/* ── Single product ─────────────────────────────────────────────── */
.mb-product-wrap { padding-block: calc(var(--header-h) + var(--s7)) var(--s8); }
.single-product div.product { display: grid; gap: var(--s7); }
@media (min-width: 900px) {
  .single-product div.product { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
  .single-product div.product .woocommerce-product-gallery { grid-column: 1; }
  .single-product div.product .summary { grid-column: 2; }
  .single-product div.product .woocommerce-tabs,
  .single-product div.product .related { grid-column: 1 / -1; }
}
.single-product .product_title {
  font-family: var(--f-display);
  font-weight: var(--fw-display);
  font-size: var(--t-h1);
  line-height: var(--lh-head);
  text-wrap: balance;
}
.single-product .summary .price { font-size: var(--t-h2); }
.single-product .cart { display: flex; flex-wrap: wrap; gap: var(--s3); align-items: center; }
.single-product .quantity input.qty {
  min-height: 47px;
  width: 5rem;
  padding: var(--s2);
  border: 1.5px solid var(--line);
  border-radius: var(--r-md);
  text-align: center;
}

/* ── Cart ───────────────────────────────────────────────────────── */
.woocommerce-cart table.cart img { width: 72px; box-shadow: var(--sh-1); }
.woocommerce-cart table.shop_table {
  border: none;
  border-radius: var(--r-md);
}
.woocommerce-cart table.shop_table th {
  font-size: var(--t-micro);
  letter-spacing: var(--ls-caps);
  text-transform: uppercase;
  color: var(--muted);
}
.woocommerce-cart .cart_totals h2 {
  padding-bottom: var(--s3);
  border-bottom: 2px solid var(--ink);
  font-size: var(--t-h3);
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  display: block;
  width: 100%;
  text-align: center;
  background: var(--accent);
  color: var(--accent-ink);
}
.mb-cart-empty { text-align: center; }
.mb-cart-empty .return-to-shop { margin-top: var(--s5); }

/* ── Checkout ───────────────────────────────────────────────────── */
body.woocommerce-checkout .pg-body,
body.woocommerce-cart .pg-body,
body.woocommerce-account .pg-body { max-width: var(--wrap-wide); }

@media (min-width: 900px) {
  .woocommerce-checkout form.checkout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    column-gap: var(--s6);
    align-items: start;
  }
  .woocommerce-checkout form.checkout #customer_details { grid-column: 1; grid-row: 1 / span 2; }
  .woocommerce-checkout form.checkout #order_review_heading { grid-column: 2; grid-row: 1; margin-top: 0; }
  .woocommerce-checkout form.checkout #order_review {
    grid-column: 2;
    grid-row: 2;
    position: sticky;
    inset-block-start: calc(var(--header-h) + var(--s3));
  }
}

.woocommerce-checkout #customer_details h3,
.woocommerce-checkout #order_review_heading,
.woocommerce-billing-fields > h3,
.woocommerce-shipping-fields > h3,
.woocommerce-additional-fields > h3 {
  display: block;
  margin: 0 0 var(--s4);
  padding-bottom: var(--s3);
  border-bottom: 2px solid var(--ink);
  font-family: var(--f-display);
  font-weight: var(--fw-display);
  font-size: var(--t-h3);
}

.woocommerce-checkout #order_review {
  padding: var(--s5);
  border: 2px solid var(--ink);
  border-radius: var(--r-md);
  background: var(--paper);
}
.woocommerce-checkout .woocommerce-checkout-review-order-table { border: none; }
.woocommerce-checkout .woocommerce-checkout-review-order-table th,
.woocommerce-checkout .woocommerce-checkout-review-order-table td {
  border: none;
  padding: var(--s2) 0;
  font-size: var(--t-small);
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tbody tr td { border-bottom: 1px solid var(--line); }
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot .order-total th,
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot .order-total td {
  padding-top: var(--s3);
  border-top: 2px solid var(--ink);
  font-family: var(--f-display);
  font-size: var(--t-h3);
  color: var(--ink);
}
.woocommerce-checkout #payment {
  border-radius: var(--r-md);
  background: var(--paper-warm);
}
.woocommerce-checkout #payment div.payment_box { background: var(--paper); border-radius: var(--r-sm); }
.woocommerce-checkout #place_order {
  width: 100%;
  margin-top: var(--s4);
  padding: var(--s4);
  font-size: var(--t-lead);
}

/* ── MSCC member coupon prompt ──────────────────────────────────── */
.mb-member-note {
  margin-bottom: var(--s6);
  padding: var(--s5);
  border: 2px solid var(--accent-alt);
  border-radius: var(--r-md);
  background: color-mix(in srgb, var(--accent-alt) 10%, var(--paper));
}
.mb-member-note--applied {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 8%, var(--paper));
  font-weight: var(--fw-bold);
}
.mb-member-note__title {
  font-family: var(--f-display);
  font-weight: var(--fw-display);
  font-size: var(--t-h3);
  margin-bottom: var(--s1);
}
.mb-member-note__body { font-size: var(--t-small); color: var(--muted); margin-bottom: var(--s3); }
.mb-member-note__body code {
  padding: 2px 6px;
  border-radius: var(--r-sm);
  background: var(--ink);
  color: var(--paper);
  font-size: .95em;
  letter-spacing: .04em;
}
.mb-member-form { display: flex; flex-wrap: wrap; gap: var(--s2); }
.mb-member-form input {
  flex: 1 1 12rem;
  min-height: 47px;
  padding: var(--s3) var(--s4);
  border: 1.5px solid var(--line);
  border-radius: var(--r-md);
  font-family: var(--f-body);
}
.mb-member-form button { flex: 0 0 auto; }

/* Classic checkout hides its coupon form behind a link; the prompt replaces it. */
.woocommerce-checkout .woocommerce-form-coupon-toggle { display: none; }

/* ═══════════════════════════════════════════════════════════════════
   BLOCK CART & CHECKOUT (WooCommerce 8+ default)
   ───────────────────────────────────────────────────────────────────
   WooCommerce ships block-based Cart and Checkout pages by default. The
   classic selectors above only apply if the store has been switched back
   to the shortcode versions, so both are covered.
   ═══════════════════════════════════════════════════════════════════ */

.wc-block-checkout,
.wc-block-cart { font-family: var(--f-body); color: var(--ink); }

/* Widen the page measure so the two-column block checkout has room. */
body.woocommerce-checkout .pg-body,
body.woocommerce-cart .pg-body {
  max-width: var(--wrap-wide);
}
.wp-block-woocommerce-checkout.alignwide,
.wp-block-woocommerce-cart.alignwide { max-width: 100%; }

/* Headings */
.wc-block-components-title,
.wc-block-components-checkout-step__title {
  font-family: var(--f-display);
  font-weight: var(--fw-display);
  line-height: var(--lh-head);
  letter-spacing: var(--ls-display);
  color: var(--ink);
}

/* Fields */
.wc-block-components-text-input input,
.wc-block-components-textarea,
.wc-block-components-combobox-control input,
.wc-block-components-select__container {
  border: 1.5px solid var(--line);
  border-radius: var(--r-md);
  font-family: var(--f-body);
  color: var(--ink);
}
.wc-block-components-text-input.is-active label,
.wc-block-components-text-input label { color: var(--muted); }
.wc-block-components-text-input input:focus,
.wc-block-components-textarea:focus {
  border-color: var(--accent);
  outline: 2px solid var(--focus);
  outline-offset: 1px;
  box-shadow: none;
}

/* Buttons */
.wc-block-components-button:not(.is-link) {
  min-height: 47px;
  border-radius: var(--r-pill);
  background: var(--accent-alt);
  color: var(--alt-ink);
  font-family: var(--f-body);
  font-weight: var(--fw-heavy);
}
.wc-block-components-checkout-place-order-button,
.wc-block-cart__submit-button {
  background: var(--accent);
  color: var(--accent-ink);
}
.wc-block-components-button:not(.is-link):hover { filter: brightness(1.06); }

/* Totals and prices */
.wc-block-components-totals-item__value,
.wc-block-components-product-price,
.wc-block-components-formatted-money-amount {
  font-family: var(--f-display);
  font-weight: var(--fw-display);
  color: var(--ink);
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value {
  font-size: var(--t-h3);
}

/* Order summary panel */
.wc-block-components-sidebar .wc-block-components-totals-wrapper,
.wc-block-components-order-summary {
  border-radius: var(--r-md);
}

/* Coupon field — members need to find this, so give it weight. */
.wc-block-components-totals-coupon {
  padding: var(--s4);
  border: 2px solid var(--accent-alt);
  border-radius: var(--r-md);
  background: color-mix(in srgb, var(--accent-alt) 10%, var(--paper));
}
.wc-block-components-totals-coupon .wc-block-components-panel__button {
  font-weight: var(--fw-bold);
  color: var(--ink);
}

/* Notices */
.wc-block-components-notice-banner {
  border-radius: var(--r-md);
  font-size: var(--t-small);
}
.wc-block-components-notice-banner.is-error { border-color: var(--accent); }

/* ── Thank you ──────────────────────────────────────────────────── */
.mb-thankyou { text-align: center; }
.mb-thankyou__mark {
  display: grid;
  place-items: center;
  width: 74px; height: 74px;
  margin: 0 auto var(--s5);
  border-radius: 50%;
  background: var(--accent);
}
.mb-thankyou__mark svg { width: 38px; height: 38px; fill: var(--accent-ink); }
.mb-thankyou__title {
  font-family: var(--f-display);
  font-weight: var(--fw-display);
  font-size: var(--t-h1);
  line-height: var(--lh-head);
  margin-bottom: var(--s3);
  text-wrap: balance;
}
.mb-thankyou__lead { max-width: 30rem; margin: 0 auto var(--s6); color: var(--muted); }
.mb-thankyou .order_details {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--s5);
  margin: 0 0 var(--s7);
  padding: var(--s5);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
}
.mb-thankyou .order_details li {
  flex: 0 1 auto;
  padding: 0;
  border: none;
  font-size: var(--t-micro);
  letter-spacing: var(--ls-caps);
  text-transform: uppercase;
  color: var(--muted);
}
.mb-thankyou .order_details li strong {
  display: block;
  margin-top: var(--s1);
  font-family: var(--f-display);
  font-size: var(--t-h3);
  letter-spacing: 0;
  text-transform: none;
  color: var(--ink);
}
.mb-thankyou__back { margin-top: var(--s6); }

/* ── Block cart/checkout: keep the cover portrait ───────────────── */
.wc-block-components-order-summary-item__image,
.wc-block-components-order-summary-item__image img { width: 48px; }
.wc-block-components-order-summary-item__image img {
  aspect-ratio: auto;
  object-fit: contain;
  border-radius: 0;
}