/* ==========================================================================
   mutoumise — cart / checkout / order-received skin
   CSS-only port of design/pages/cart.html, checkout.html, confirmation.html
   over WooCommerce's classic shortcode markup. No template overrides.
   Loads on is_cart() and is_checkout() (incl. the order-received endpoint).
   ========================================================================== */

/* --------------------------------------------------------------------------
   shared frame — widen the plain-page column, quiet the prose link chrome
   -------------------------------------------------------------------------- */

.woocommerce-cart .page-plain,
.woocommerce-checkout .page-plain { max-width: var(--container); }

.woocommerce-cart .section-head h1,
.woocommerce-checkout .section-head h1 { font-size: var(--text-3xl); }

/* .prose decorates every link/paragraph; these pages restate their own voice */
.woocommerce-cart .prose a,
.woocommerce-checkout .prose a { border-bottom: none; }
.woocommerce-cart .prose a:hover,
.woocommerce-checkout .prose a:hover { color: inherit; }
.woocommerce-cart .prose a.button:hover,
.woocommerce-checkout .prose a.button:hover { color: var(--washi); }

/* notices sit inside the page column already — no second container gutter */
.woocommerce-cart .woocommerce-notices-wrapper:not(:empty),
.woocommerce-checkout .woocommerce-notices-wrapper:not(:empty),
.woocommerce-cart ul.woocommerce-error,
.woocommerce-checkout ul.woocommerce-error {
  max-width: none;
  padding-inline: 0;
  margin: 0 0 var(--sp-6);
}

/* required marks: quiet, never vermilion */
.woocommerce-cart abbr.required,
.woocommerce-checkout abbr.required {
  color: var(--sumi-faint);
  text-decoration: none;
  border-bottom: none;
}

/* native checks and the qty input, in the design's hand */
.woocommerce-cart input[type="checkbox"],
.woocommerce-checkout input[type="checkbox"] {
  width: 16px; height: 16px;
  flex: none;
  accent-color: var(--walnut);
}
.woocommerce-cart input[type="radio"],
.woocommerce-checkout input[type="radio"] {
  appearance: none;
  -webkit-appearance: none;
  width: 16px; height: 16px;
  flex: none;
  margin: 0;
  vertical-align: -2px;
  border: 1px solid var(--sumi-faint);
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  transition: border-color var(--dur) var(--ease-out);
}
.woocommerce-cart input[type="radio"]:hover,
.woocommerce-checkout input[type="radio"]:hover { border-color: var(--sumi); }
.woocommerce-cart input[type="radio"]:checked,
.woocommerce-checkout input[type="radio"]:checked { border: 5px solid var(--sumi); }

.woocommerce-cart .quantity,
.woocommerce-checkout .quantity { padding-inline: var(--sp-2); }
.woocommerce-cart .quantity .qty,
.woocommerce-checkout .quantity .qty { height: 44px; width: 56px; }
.quantity.hidden { display: none; }

/* checkbox sentences (terms, remember me, create account): not shouted */
.woocommerce-cart .woocommerce-form__label-for-checkbox,
.woocommerce-checkout .woocommerce-form__label-for-checkbox {
  display: flex;
  align-items: baseline;
  gap: var(--sp-3);
  font-size: var(--text-sm);
  font-weight: 400;
  letter-spacing: normal;
  text-transform: none;
  color: var(--sumi-soft);
}

/* shipping-method radios, shared by cart totals and checkout review */
ul#shipping_method { display: grid; gap: var(--sp-2); justify-items: end; }
ul#shipping_method li {
  display: flex;
  align-items: baseline;
  gap: var(--sp-2);
  margin: 0;
}
ul#shipping_method label {
  font-size: var(--text-sm);
  font-weight: 400;
  letter-spacing: normal;
  text-transform: none;
  color: var(--sumi-soft);
}
p.woocommerce-shipping-destination {
  margin-top: var(--sp-2);
  font-size: var(--text-xs);
  color: var(--sumi-faint);
}

/* variation lines under item names — the .label voice */
.woocommerce-cart dl.variation,
.woocommerce-checkout dl.variation {
  display: block;
  margin: var(--sp-1) 0 0;
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--sumi-faint);
}
.woocommerce-cart dl.variation dt,
.woocommerce-checkout dl.variation dt,
.woocommerce-cart dl.variation dd,
.woocommerce-checkout dl.variation dd { display: inline; margin: 0; }
.woocommerce-cart dl.variation dd,
.woocommerce-checkout dl.variation dd { margin-right: var(--sp-2); }
.woocommerce-cart dl.variation dd p,
.woocommerce-checkout dl.variation dd p { display: inline; margin: 0; color: inherit; }

/* "× 2" quantity marks inside name cells */
.woocommerce-checkout strong.product-quantity {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 400;
  letter-spacing: 0.18em;
  color: var(--sumi-faint);
  white-space: nowrap;
}

/* --------------------------------------------------------------------------
   coupon / login toggles — quiet lines, not toasts
   -------------------------------------------------------------------------- */

.woocommerce-form-coupon-toggle .woocommerce-info,
.woocommerce-form-login-toggle .woocommerce-info {
  background: transparent;
  color: var(--sumi-soft);
  box-shadow: none;
  border-radius: 0;
  border-bottom: var(--hairline);
  padding: var(--sp-3) 0;
  font-size: var(--text-sm);
  letter-spacing: 0.04em;
}
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info a,
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info a {
  color: var(--sumi);
  border-bottom: 1px solid var(--washi-line);
  transition: color var(--dur) var(--ease-out), border-color var(--dur) var(--ease-out);
}
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info a:hover,
.woocommerce-checkout .woocommerce-form-login-toggle .woocommerce-info a:hover {
  color: var(--walnut-warm);
  border-color: var(--walnut-warm);
}

/* the coupon form the toggle reveals (JS controls display) */
.woocommerce-checkout form.checkout_coupon {
  padding: var(--sp-6) 0;
  border-bottom: var(--hairline);
  margin-bottom: var(--sp-2);
}
.woocommerce-checkout form.checkout_coupon > p:first-child {
  font-size: var(--text-sm);
  color: var(--sumi-soft);
  margin: 0 0 var(--sp-3);
}
.woocommerce-checkout form.checkout_coupon .form-row {
  display: inline-block;
  vertical-align: bottom;
  margin: 0 var(--sp-4) 0 0;
}
.woocommerce-checkout form.checkout_coupon .form-row-first { width: min(280px, 100%); }

/* the returning-customer login form */
.woocommerce-checkout form.woocommerce-form-login {
  max-width: 480px;
  padding: var(--sp-4) 0 var(--sp-8);
  border-bottom: var(--hairline);
  margin-bottom: var(--sp-6);
}
.woocommerce-checkout form.woocommerce-form-login > p { margin: 0 0 var(--sp-4); }
.woocommerce-checkout form.woocommerce-form-login > p:first-child {
  font-size: var(--text-sm);
  color: var(--sumi-soft);
}
.woocommerce-checkout form.woocommerce-form-login .lost_password {
  font-size: var(--text-sm);
  margin-bottom: 0;
}
.woocommerce-checkout form.woocommerce-form-login .lost_password a {
  border-bottom: 1px solid var(--washi-line);
}
.woocommerce-checkout form.woocommerce-form-login .lost_password a:hover {
  color: var(--walnut-warm);
  border-color: var(--walnut-warm);
}

/* quiet underline buttons for secondary actions (apply coupon, update cart) */
.woocommerce-cart td.actions .button,
.woocommerce-checkout form.checkout_coupon .button {
  background: transparent;
  color: var(--sumi);
  border: none;
  border-bottom: 1px solid var(--sumi);
  border-radius: 0;
  padding: 0.25rem 0;
}
.woocommerce-cart td.actions .button:hover,
.woocommerce-checkout form.checkout_coupon .button:hover {
  background: transparent;
  color: var(--walnut-warm);
  border-color: var(--walnut-warm);
}
.woocommerce-cart td.actions .button:disabled {
  background: transparent;
  color: var(--sumi-faint);
  border-color: var(--washi-line);
}

/* --------------------------------------------------------------------------
   selectWoo / select2 — Woo's stylesheet is dequeued, so carry the
   functional minimum here, skinned to the hairline input voice
   -------------------------------------------------------------------------- */

.select2-hidden-accessible {
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  height: 1px !important;
  width: 1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  white-space: nowrap !important;
}
.select2-container { box-sizing: border-box; margin: 0; }
.select2.select2-container {
  display: block;
  position: relative;
  width: 100% !important;
}
.select2-container .select2-selection {
  display: block;
  cursor: pointer;
  user-select: none;
  outline: none;
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--washi-line);
  border-radius: 0;
  padding: var(--sp-2) 0;
  transition: border-color var(--dur) var(--ease-out);
}
.select2-container--open .select2-selection,
.select2-container--focus .select2-selection { border-color: var(--sumi); }
.select2-selection__rendered {
  display: block;
  color: var(--sumi);
  line-height: 1.75;
  padding: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.select2-selection__placeholder { color: var(--sumi-faint); }
.select2-selection__arrow { display: none; }
.select2-selection__clear { float: right; cursor: pointer; color: var(--sumi-faint); }
.select2-dropdown {
  position: absolute;
  left: -100000px;
  z-index: 1051;
  display: block;
  box-sizing: border-box;
  width: 100%;
  background: var(--washi);
  border: 1px solid var(--sumi);
  border-radius: var(--radius);
}
.select2-container--open .select2-dropdown { left: 0; }
.select2-search--dropdown { display: block; padding: var(--sp-2) var(--sp-3); }
.select2-search--dropdown.select2-search--hide { display: none; }
.select2-search--dropdown .select2-search__field {
  width: 100%;
  font: inherit;
  color: var(--sumi);
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--washi-line);
  padding: var(--sp-1) 0;
  outline: none;
}
.select2-results { display: block; }
.select2-results__options {
  list-style: none;
  margin: 0;
  padding: var(--sp-1) 0;
  max-height: 260px;
  overflow-y: auto;
}
.select2-results__option {
  padding: var(--sp-2) var(--sp-3);
  font-size: var(--text-sm);
  color: var(--sumi-soft);
  cursor: pointer;
  user-select: none;
}
.select2-results__option--highlighted {
  background: var(--washi-deep);
  color: var(--sumi);
}
.select2-results__option[aria-selected="true"],
.select2-results__option--selected { color: var(--walnut-warm); }
.woocommerce-invalid .select2-selection { border-color: var(--shu); }

/* ==========================================================================
   cart — hairline rows left, sticky summary rail right
   ========================================================================== */

.woocommerce-cart .prose > .woocommerce {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 380px;
  column-gap: var(--sp-20);
  align-items: start;
}
.woocommerce-cart .prose > .woocommerce > .woocommerce-notices-wrapper { grid-column: 1 / -1; }
.woocommerce-cart form.woocommerce-cart-form {
  grid-column: 1;
  grid-row: 2;
  animation: rise 640ms var(--ease-out) backwards;
}
.woocommerce-cart .cart-collaterals { display: contents; }
.woocommerce-cart .cart_totals {
  grid-column: 2;
  grid-row: 2;
  position: sticky;
  top: var(--sp-8);
  border-top: var(--hairline);
  padding-top: var(--sp-6);
  animation: rise 640ms var(--ease-out) 90ms backwards;
}
.woocommerce-cart .cart_totals::before {
  content: "";
  position: absolute;
  top: -1px; left: 0;
  width: 40px;
  border-top: 1px solid var(--sumi);
}
.woocommerce-cart .cross-sells {
  grid-column: 1 / -1;
  grid-row: 3;
  margin-top: var(--sp-20);
}
.woocommerce-cart .cross-sells > h2 {
  font-size: var(--text-2xl);
  margin: 0 0 var(--sp-8);
}

/* empty cart — a calm sentence, not a toast */
.woocommerce-cart .wc-empty-cart-message,
.woocommerce-cart p.cart-empty,
.woocommerce-cart .return-to-shop { grid-column: 1 / -1; }
.woocommerce-cart .wc-empty-cart-message .woocommerce-info,
.woocommerce-cart p.cart-empty {
  background: transparent;
  color: var(--sumi);
  box-shadow: none;
  border-radius: 0;
  padding: var(--sp-8) 0 0;
  font-family: var(--font-display);
  font-size: var(--text-xl);
  letter-spacing: 0.01em;
}
.woocommerce-cart .return-to-shop { margin-top: var(--sp-8); }

/* the table, undressed */
.woocommerce-cart-form .shop_table,
.woocommerce-cart-form .shop_table tbody,
.woocommerce-cart-form .shop_table tr,
.woocommerce-cart-form .shop_table td { display: block; width: 100%; }
.woocommerce-cart-form .shop_table thead { display: none; }
.woocommerce-cart-form .shop_table tbody { border-top: var(--hairline); }

/* item rows: thumb · name/price · qty · total · remove */
.woocommerce-cart-form tr.cart_item {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr) auto 96px 24px;
  grid-template-areas:
    "thumb name  qty total remove"
    "thumb price qty total remove";
  column-gap: var(--sp-6);
  align-items: center;
  padding: var(--sp-6) 0;
  border-bottom: var(--hairline);
}
.woocommerce-cart-form td.product-remove    { grid-area: remove; width: auto; }
.woocommerce-cart-form td.product-thumbnail { grid-area: thumb; }
.woocommerce-cart-form td.product-name      { grid-area: name; align-self: end; }
.woocommerce-cart-form td.product-price     { grid-area: price; align-self: start; width: auto; }
.woocommerce-cart-form td.product-quantity  { grid-area: qty; width: auto; }
.woocommerce-cart-form td.product-subtotal  { grid-area: total; width: auto; }

.woocommerce-cart-form td.product-thumbnail a {
  display: block;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: var(--radius);
  background: var(--washi-deep);
}
.woocommerce-cart-form td.product-thumbnail img {
  width: 100%; height: 100%;
  object-fit: cover;
}
.woocommerce-cart-form td.product-name {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  line-height: 1.4;
}
.woocommerce-cart .woocommerce-cart-form td.product-name a:hover { color: var(--walnut-warm); }
.woocommerce-cart-form td.product-name .backorder_notification {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  color: var(--sumi-faint);
  margin: var(--sp-1) 0 0;
}
.woocommerce-cart-form td.product-price {
  font-size: var(--text-sm);
  color: var(--sumi-faint);
}
.woocommerce-cart-form td.product-subtotal {
  font-family: var(--font-display);
  color: var(--sumi);
  text-align: right;
}
.woocommerce-cart-form a.remove {
  display: grid;
  place-items: center;
  width: 24px; height: 24px;
  font-size: var(--text-lg);
  line-height: 1;
  color: var(--sumi-faint);
  transition: color var(--dur) var(--ease-out);
}
.woocommerce-cart .woocommerce-cart-form a.remove:hover { color: var(--sumi); }

/* coupon + update row */
.woocommerce-cart td.actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-4);
  padding: var(--sp-6) 0 0;
}
.woocommerce-cart td.actions .coupon {
  display: flex;
  align-items: center;
  gap: var(--sp-4);
}
.woocommerce-cart td.actions .coupon #coupon_code { width: 200px; }
.woocommerce-cart td.actions > .button { margin-left: auto; }

/* summary rail */
.woocommerce-cart .cart_totals h2 {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--sumi-faint);
  margin: 0 0 var(--sp-2);
}
.woocommerce-cart .cart_totals table,
.woocommerce-cart .cart_totals tbody { display: block; width: 100%; }
.woocommerce-cart .cart_totals tr {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--sp-4);
  padding: var(--sp-2) 0;
  font-size: var(--text-sm);
  color: var(--sumi-soft);
}
.woocommerce-cart .cart_totals th {
  display: block;
  flex: none;
  font-weight: 400;
  text-align: left;
  padding: 0;
}
.woocommerce-cart .cart_totals td {
  display: block;
  margin-left: auto;
  text-align: right;
  padding: 0;
}
.woocommerce-cart .cart_totals td .amount {
  font-family: var(--font-display);
  color: var(--sumi);
}
.woocommerce-cart .cart_totals td small {
  display: block;
  font-size: var(--text-xs);
  color: var(--sumi-faint);
}
.woocommerce-cart .cart_totals tr.order-total {
  border-top: var(--hairline);
  margin-top: var(--sp-4);
  padding-top: var(--sp-4);
}
.woocommerce-cart .cart_totals tr.order-total th {
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--sumi);
}
.woocommerce-cart .cart_totals tr.order-total td .amount { font-size: var(--text-xl); }

.woocommerce-cart .shipping-calculator-button {
  display: inline-block;
  font-size: var(--text-sm);
  color: var(--sumi);
  border-bottom: 1px solid var(--washi-line);
  transition: color var(--dur) var(--ease-out), border-color var(--dur) var(--ease-out);
}
.woocommerce-cart .shipping-calculator-button:hover {
  color: var(--walnut-warm);
  border-color: var(--walnut-warm);
}
.woocommerce-cart .shipping-calculator-form {
  display: grid;
  gap: var(--sp-3);
  margin-top: var(--sp-3);
  text-align: left;
}

/* full-width walnut checkout button + the Stripe reassurance line */
.woocommerce-cart .wc-proceed-to-checkout { margin-top: var(--sp-8); }
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button { width: 100%; }
.woocommerce-cart .wc-proceed-to-checkout::after {
  content: "Secured by Stripe";
  display: block;
  margin-top: var(--sp-3);
  text-align: center;
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--sumi-faint);
}

/* ==========================================================================
   checkout — numbered sections left (7), order rail right (5)
   ========================================================================== */

.woocommerce-checkout form.checkout {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  column-gap: var(--sp-16);
  align-items: start;
}
.woocommerce-checkout form.checkout > .woocommerce-NoticeGroup {
  grid-column: 1 / -1;
  grid-row: 1;
  margin-bottom: var(--sp-6);
}
.woocommerce-checkout form.checkout > #customer_details {
  grid-column: 1;
  grid-row: 2 / 4;
  animation: rise 640ms var(--ease-out) backwards;
}
.woocommerce-checkout form.checkout > #order_review_heading {
  grid-column: 2;
  grid-row: 2;
  animation: rise 640ms var(--ease-out) 180ms backwards;
}
.woocommerce-checkout form.checkout > #order_review {
  grid-column: 2;
  grid-row: 3;
  animation: rise 640ms var(--ease-out) 180ms backwards;
}

/* left column — sections carry a counter, like the mockup's 01 / 02 / 03 */
.woocommerce-checkout #customer_details { counter-reset: co-sec; }
.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 { float: none; width: auto; }
.woocommerce-checkout #customer_details h3 { font-size: var(--text-2xl); }
.woocommerce-checkout #customer_details h3::before {
  counter-increment: co-sec;
  content: "0" counter(co-sec) " — ";
  font-size: var(--text-lg);
  color: var(--sumi-faint);
  letter-spacing: 0.12em;
  margin-right: var(--sp-2);
}
.woocommerce-checkout .woocommerce-billing-fields { padding-bottom: var(--sp-12); }
.woocommerce-checkout .woocommerce-shipping-fields,
.woocommerce-checkout .woocommerce-additional-fields {
  position: relative;
  border-top: var(--hairline);
  padding-block: var(--sp-12);
  padding-bottom: var(--sp-8);
}
.woocommerce-checkout .woocommerce-shipping-fields::before,
.woocommerce-checkout .woocommerce-additional-fields::before {
  content: "";
  position: absolute;
  top: -1px; left: 0;
  width: 40px;
  border-top: 1px solid var(--sumi);
}
.woocommerce-checkout #ship-to-different-address label {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-3);
  cursor: pointer;
}

/* field grids: name row 2-col, wide rows span */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper,
.woocommerce-checkout .woocommerce-additional-fields__field-wrapper {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--sp-6);
  margin-top: var(--sp-8);
}
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .form-row,
.woocommerce-checkout .woocommerce-additional-fields__field-wrapper .form-row {
  grid-column: 1 / -1;
  margin: 0;
}
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row-first,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .form-row-first { grid-column: 1; }
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper .form-row-last,
.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper .form-row-last { grid-column: 2; }
.woocommerce-checkout .woocommerce-input-wrapper { display: block; }
.woocommerce-checkout form.checkout textarea {
  min-height: 96px;
  resize: vertical;
}
.woocommerce-checkout .woocommerce-account-fields { margin-top: var(--sp-6); }

/* right rail — hairline to its left, label-voice heading */
.woocommerce-checkout form.checkout > #order_review_heading {
  border-left: var(--hairline);
  padding: var(--sp-6) 0 var(--sp-4) var(--sp-12);
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--sumi-faint);
}
.woocommerce-checkout form.checkout > #order_review {
  border-left: var(--hairline);
  padding: 0 0 var(--sp-8) var(--sp-12);
}

/* review table: quiet item lines, then totals under a hairline */
.woocommerce-checkout #order_review .shop_table,
.woocommerce-checkout #order_review .shop_table tbody,
.woocommerce-checkout #order_review .shop_table tfoot { display: block; width: 100%; }
.woocommerce-checkout #order_review .shop_table thead { display: none; }
.woocommerce-checkout #order_review .shop_table tr {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--sp-4);
  padding: var(--sp-2) 0;
}
.woocommerce-checkout #order_review .shop_table th,
.woocommerce-checkout #order_review .shop_table td { display: block; padding: 0; }
.woocommerce-checkout #order_review .shop_table td { margin-left: auto; text-align: right; }
.woocommerce-checkout #order_review .shop_table tbody { padding-bottom: var(--sp-6); }
.woocommerce-checkout #order_review td.product-name {
  margin-left: 0;
  text-align: left;
  font-family: var(--font-display);
  font-size: var(--text-md);
  line-height: 1.5;
  color: var(--sumi);
}
.woocommerce-checkout #order_review td.product-total .amount {
  font-family: var(--font-display);
  color: var(--sumi);
}
.woocommerce-checkout #order_review .shop_table tfoot {
  border-top: var(--hairline);
  padding-top: var(--sp-4);
}
.woocommerce-checkout #order_review tfoot tr {
  font-size: var(--text-sm);
  color: var(--sumi-soft);
}
.woocommerce-checkout #order_review tfoot th { font-weight: 400; }
.woocommerce-checkout #order_review tfoot .amount {
  font-family: var(--font-display);
  color: var(--sumi);
}
.woocommerce-checkout #order_review tfoot td small {
  display: block;
  font-size: var(--text-xs);
  color: var(--sumi-faint);
}
.woocommerce-checkout #order_review tr.order-total {
  border-top: var(--hairline);
  margin-top: var(--sp-3);
  padding-top: var(--sp-4);
}
.woocommerce-checkout #order_review tr.order-total th {
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--sumi);
}
.woocommerce-checkout #order_review tr.order-total .amount { font-size: var(--text-xl); }

/* payment — hairline list with radios, walnut place-order block */
.woocommerce-checkout #payment { margin-top: var(--sp-8); }
.woocommerce-checkout #payment ul.wc_payment_methods {
  border-top: var(--hairline);
  margin: 0;
  padding: 0;
}
.woocommerce-checkout #payment li.wc_payment_method {
  padding: var(--sp-4) 0;
  border-bottom: var(--hairline);
}
.woocommerce-checkout #payment li.wc_payment_method > input[type="radio"] { margin-right: var(--sp-3); }
.woocommerce-checkout #payment li.wc_payment_method > label {
  font-family: var(--font-display);
  font-size: var(--text-lg);
  cursor: pointer;
}
.woocommerce-checkout #payment li.wc_payment_method > label img {
  display: inline-block;
  vertical-align: middle;
  max-height: 24px;
  width: auto;
  margin-left: var(--sp-2);
}
.woocommerce-checkout #payment div.payment_box {
  margin-top: var(--sp-3);
  padding: var(--sp-4);
  background: var(--washi-deep);
  border-radius: var(--radius);
  font-size: var(--text-sm);
  color: var(--sumi-soft);
}
.woocommerce-checkout #payment div.payment_box p { margin: 0 0 var(--sp-2); }
.woocommerce-checkout #payment div.payment_box p:last-child { margin-bottom: 0; }
.woocommerce-checkout #payment div.payment_box fieldset {
  border: none;
  padding: 0;
  display: grid;
  gap: var(--sp-4);
}

.woocommerce-checkout #payment .form-row.place-order {
  display: grid;
  gap: var(--sp-4);
  margin-top: var(--sp-8);
  padding: 0;
}
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper {
  font-size: var(--text-sm);
  color: var(--sumi-soft);
}
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper .form-row { padding: 0; margin: 0; }
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper a {
  border-bottom: 1px solid var(--washi-line);
  transition: color var(--dur) var(--ease-out), border-color var(--dur) var(--ease-out);
}
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper a:hover {
  color: var(--walnut-warm);
  border-color: var(--walnut-warm);
}
.woocommerce-checkout .woocommerce-privacy-policy-text p {
  font-size: var(--text-xs);
  color: var(--sumi-faint);
  margin: 0;
}
.woocommerce-checkout #place_order {
  width: 100%;
  padding: 1.1rem 3rem;
}
.woocommerce-checkout #payment .form-row.place-order::after {
  content: "Secured by Stripe";
  justify-self: center;
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--sumi-faint);
}

/* ==========================================================================
   order received — thanks lockup, hairline overview, quiet details
   ========================================================================== */

/* the page still prints its "Checkout" title; keep it for readers only */
.woocommerce-order-received .section-head {
  position: absolute;
  width: 1px; height: 1px;
  clip-path: inset(50%);
  overflow: hidden;
  white-space: nowrap;
  margin: 0;
}

.woocommerce-order-received .woocommerce-order {
  max-width: 720px;
  animation: rise 640ms var(--ease-out) backwards;
}

/* thanks lockup — the page's single vermilion mark */
.woocommerce-order-received .woocommerce-thankyou-order-received {
  font-family: var(--font-display);
  font-size: var(--text-3xl);
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: 0.01em;
  color: var(--sumi);
}
.woocommerce-order-received .woocommerce-thankyou-order-received::before {
  content: "木";
  display: grid;
  place-items: center;
  width: 56px; height: 56px;
  margin-bottom: var(--sp-6);
  background: var(--shu);
  color: var(--washi);
  font-size: 32px;
  font-weight: 600;
  border-radius: var(--radius);
  transform: rotate(-2deg);
}
.woocommerce-order-received .woocommerce-thankyou-order-failed {
  font-family: var(--font-display);
  font-size: var(--text-xl);
  color: var(--sumi);
}

/* overview — hairline label / value rows, ink tick on the opening rule */
.woocommerce-order-received ul.woocommerce-order-overview {
  position: relative;
  margin: var(--sp-12) 0 0;
  padding: 0;
  border-top: var(--hairline);
}
.woocommerce-order-received ul.woocommerce-order-overview::before {
  content: "";
  position: absolute;
  top: -1px; left: 0;
  width: 40px;
  border-top: 1px solid var(--sumi);
}
.woocommerce-order-received ul.woocommerce-order-overview li {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--sp-4);
  padding: var(--sp-3) 0;
  border-bottom: var(--hairline);
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--sumi-faint);
}
.woocommerce-order-received ul.woocommerce-order-overview li strong {
  margin-left: auto;
  font-family: var(--font-display);
  font-size: var(--text-md);
  font-weight: 500;
  letter-spacing: normal;
  text-transform: none;
  text-align: right;
  color: var(--sumi);
}

/* order details — item rows with thumbs when present, totals below */
.woocommerce-order-received .woocommerce-order-details { margin-top: var(--sp-16); }
.woocommerce-order-received .woocommerce-order-details__title {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--sumi-faint);
  margin: 0 0 var(--sp-4);
}
.woocommerce-order-received .woocommerce-table--order-details,
.woocommerce-order-received .woocommerce-table--order-details tbody,
.woocommerce-order-received .woocommerce-table--order-details tfoot { display: block; width: 100%; }
.woocommerce-order-received .woocommerce-table--order-details thead { display: none; }
.woocommerce-order-received .woocommerce-table--order-details tbody { border-top: var(--hairline); }
.woocommerce-order-received .woocommerce-table--order-details tbody tr {
  display: flex;
  align-items: center;
  gap: var(--sp-6);
  padding: var(--sp-4) 0;
  border-bottom: var(--hairline);
}
.woocommerce-order-received .woocommerce-table--order-details td { padding: 0; }
.woocommerce-order-received .woocommerce-table--order-details td.product-name {
  flex: 1;
  min-width: 0;
  font-family: var(--font-display);
  font-size: var(--text-lg);
  line-height: 1.4;
  color: var(--sumi);
}
.woocommerce-order-received .woocommerce-table--order-details td.product-name img {
  width: 64px; height: 64px;
  object-fit: cover;
  border-radius: var(--radius);
  background: var(--washi-deep);
}
.woocommerce-order-received .woocommerce-table--order-details strong.product-quantity {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 400;
  letter-spacing: 0.18em;
  color: var(--sumi-faint);
  white-space: nowrap;
}
.woocommerce-order-received .woocommerce-table--order-details td.product-total {
  font-family: var(--font-display);
  color: var(--sumi);
  text-align: right;
}
.woocommerce-order-received .woocommerce-table--order-details tfoot tr {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--sp-4);
  padding: var(--sp-2) 0;
  font-size: var(--text-sm);
  color: var(--sumi-soft);
}
.woocommerce-order-received .woocommerce-table--order-details tfoot tr:first-child { padding-top: var(--sp-4); }
.woocommerce-order-received .woocommerce-table--order-details tfoot th {
  display: block;
  padding: 0;
  font-weight: 400;
  text-align: left;
}
.woocommerce-order-received .woocommerce-table--order-details tfoot td {
  margin-left: auto;
  text-align: right;
}
.woocommerce-order-received .woocommerce-table--order-details tfoot .amount {
  font-family: var(--font-display);
  color: var(--sumi);
}
.woocommerce-order-received .woocommerce-table--order-details tfoot tr:last-child {
  border-top: var(--hairline);
  margin-top: var(--sp-3);
  padding-top: var(--sp-4);
}
.woocommerce-order-received .woocommerce-table--order-details tfoot tr:last-child th {
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--sumi);
}
.woocommerce-order-received .woocommerce-table--order-details tfoot tr:last-child .amount {
  font-size: var(--text-xl);
}
.woocommerce-order-received .woocommerce-table--order-details tr.product-purchase-note td {
  font-size: var(--text-sm);
  color: var(--sumi-soft);
  text-align: left;
  margin-left: 0;
}

/* addresses — two quiet columns */
.woocommerce-order-received .woocommerce-customer-details { margin-top: var(--sp-16); }
.woocommerce-order-received .woocommerce-customer-details .col2-set {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--sp-12);
}
.woocommerce-order-received .woocommerce-customer-details .col-1,
.woocommerce-order-received .woocommerce-customer-details .col-2 { float: none; width: auto; }
.woocommerce-order-received .woocommerce-customer-details h2 {
  font-family: var(--font-body);
  font-size: var(--text-xs);
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--sumi-faint);
  margin: 0 0 var(--sp-3);
}
.woocommerce-order-received .woocommerce-customer-details address {
  font-style: normal;
  color: var(--sumi-soft);
  line-height: 1.9;
}
.woocommerce-order-received .woocommerce-customer-details address p {
  margin: var(--sp-2) 0 0;
  color: inherit;
}

/* ==========================================================================
   responsive — single-column stacks per the mobile cards
   ========================================================================== */

@media (max-width: 960px) {

  /* --- cart --- */
  .woocommerce-cart .section-head { margin-bottom: var(--sp-8); }
  .woocommerce-cart .prose > .woocommerce {
    grid-template-columns: minmax(0, 1fr);
    column-gap: 0;
  }
  .woocommerce-cart form.woocommerce-cart-form { grid-column: 1; grid-row: auto; }
  .woocommerce-cart .cart_totals {
    grid-column: 1;
    grid-row: auto;
    position: relative;
    top: auto;
    margin-top: var(--sp-12);
  }
  .woocommerce-cart .cross-sells { grid-column: 1; grid-row: auto; margin-top: var(--sp-16); }

  /* item rows stack: thumb + copy on top, qty · total · remove below */
  .woocommerce-cart-form tr.cart_item {
    grid-template-columns: 80px minmax(0, 1fr) auto minmax(44px, auto);
    grid-template-areas:
      "thumb name  name  name"
      "thumb price price price"
      "qty   qty   total remove";
    column-gap: var(--sp-4);
    align-items: start;
  }
  .woocommerce-cart-form td.product-name { align-self: start; }
  .woocommerce-cart-form td.product-quantity,
  .woocommerce-cart-form td.product-subtotal,
  .woocommerce-cart-form td.product-remove {
    align-self: center;
    margin-top: var(--sp-4);
  }
  .woocommerce-cart-form td.product-quantity { justify-self: start; }
  .woocommerce-cart-form td.product-remove { justify-self: end; }
  .woocommerce-cart-form a.remove { width: 44px; height: 44px; }

  /* --- checkout --- */
  .woocommerce-checkout form.checkout { grid-template-columns: minmax(0, 1fr); }
  .woocommerce-checkout form.checkout > #customer_details {
    grid-column: 1;
    grid-row: auto;
  }
  .woocommerce-checkout form.checkout > #order_review_heading {
    grid-column: 1;
    grid-row: auto;
    position: relative;
    border-left: none;
    border-top: var(--hairline);
    padding: var(--sp-8) 0 var(--sp-4);
    margin-top: var(--sp-2);
  }
  .woocommerce-checkout form.checkout > #order_review_heading::before {
    content: "";
    position: absolute;
    top: -1px; left: 0;
    width: 40px;
    border-top: 1px solid var(--sumi);
  }
  .woocommerce-checkout form.checkout > #order_review {
    grid-column: 1;
    grid-row: auto;
    border-left: none;
    padding-left: 0;
  }
  .woocommerce-checkout .woocommerce-billing-fields { padding-bottom: var(--sp-8); }
  .woocommerce-checkout .woocommerce-shipping-fields,
  .woocommerce-checkout .woocommerce-additional-fields { padding-block: var(--sp-8); }
  .woocommerce-checkout #customer_details h3 { font-size: var(--text-xl); }
  .woocommerce-checkout #customer_details h3::before { font-size: var(--text-md); }

  /* --- order received --- */
  .woocommerce-order-received .woocommerce-thankyou-order-received { font-size: var(--text-2xl); }
  .woocommerce-order-received .woocommerce-thankyou-order-received::before {
    width: 48px; height: 48px;
    font-size: 27px;
    margin-bottom: var(--sp-4);
  }
  .woocommerce-order-received ul.woocommerce-order-overview { margin-top: var(--sp-8); }
  .woocommerce-order-received .woocommerce-order-details,
  .woocommerce-order-received .woocommerce-customer-details { margin-top: var(--sp-12); }
  .woocommerce-order-received .woocommerce-table--order-details td.product-name { font-size: var(--text-md); }
  .woocommerce-order-received .woocommerce-customer-details .col2-set {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--sp-8);
  }
  /* the second address block sits inset, like the mobile card */
  .woocommerce-order-received .woocommerce-customer-details .col-2 {
    margin-left: 12%;
    padding-left: var(--sp-4);
    border-left: var(--hairline);
  }
}

@media (max-width: 560px) {
  .woocommerce-cart td.actions { flex-direction: column; align-items: stretch; }
  .woocommerce-cart td.actions .coupon { width: 100%; }
  .woocommerce-cart td.actions .coupon #coupon_code { flex: 1; width: auto; }
  .woocommerce-cart td.actions > .button { margin-left: 0; align-self: flex-start; }

  .woocommerce-checkout form.checkout_coupon .form-row {
    display: block;
    margin: 0 0 var(--sp-4);
  }
  .woocommerce-checkout form.checkout_coupon .form-row-first { width: 100%; }
  .woocommerce-checkout #payment li.wc_payment_method > label { font-size: var(--text-md); }

  .woocommerce-order-received ul.woocommerce-order-overview li strong { overflow-wrap: anywhere; }
}
