/* WooCommerce surfaces: notices, cart, checkout, order confirmation.

   WooCommerce's own stylesheets are dequeued in inc/enqueue.php, so this
   file is the entire visual contract for anything Woo renders that the
   theme does not template itself. Form primitives (.mw-input, .mw-field,
   .mw-btn) come from account.css and are reused here rather than restated. */

/* ------------------------------------------------ Suppress core furniture */

.woocommerce ul.products,
.woocommerce-page ul.products {
	margin: 0;
}

/* Badges, star rows and result counts are all re-rendered by the theme in
   its own idiom; these are the core versions that would duplicate them. */
.woocommerce span.onsale,
.woocommerce ul.products li.product .star-rating,
.woocommerce .star-rating,
.woocommerce-breadcrumb,
.woocommerce-result-count,
.woocommerce-ordering,
p.stars {
	display: none;
}

/* The PDP renders its own price row and low-stock line from the
   found_variation event (see product.js) - WooCommerce's default
   per-variation price/availability markup would just duplicate it. */
.woocommerce-variation-price,
.woocommerce-variation-availability {
	display: none;
}

.woocommerce div.product .woocommerce-tabs,
.woocommerce div.product .related.products {
	display: none;
}

.woocommerce table.shop_attributes,
.woocommerce #reviews #comments ol.commentlist {
	all: revert;
}

.woocommerce-Price-amount,
.amount {
	font-family: var(--font-mono);
	font-variant-numeric: tabular-nums;
}

del .woocommerce-Price-amount,
del .amount {
	color: var(--ink-dim);
}

/* ------------------------------------------------------------- Page shells */

.mw-page-title-band {
	padding: 44px var(--gutter-desktop) 36px;
	border-bottom: 1px solid var(--line);
}

.mw-page-title-band .mw-cat-header__title {
	font-size: 40px;
	margin-bottom: 0;
}

.mw-page-content {
	padding: var(--space-11) var(--gutter-desktop);
	max-width: 800px;
}

.mw-page-content p {
	font-size: 15px;
	line-height: 1.7;
	color: var(--ink-soft);
	margin-bottom: var(--space-5);
}

/* ---------------------------------------------------------------- Notices */

/* Woo prints notices as <ul class="woocommerce-message"> etc. They are flat
   bars with a coloured left rule - the only place in the design where a
   colour band carries meaning, so it stays deliberately quiet. */
.woocommerce-notices-wrapper:empty {
	display: none;
}

.woocommerce-message,
.woocommerce-error,
.woocommerce-info,
.woocommerce-noreviews,
.wc-block-components-notice-banner {
	list-style: none;
	margin: 0 0 var(--space-6);
	padding: var(--space-4) var(--space-5);
	background: var(--placeholder-2);
	border: 1px solid var(--line-strong);
	border-left-width: 3px;
	font-family: var(--font-body);
	font-size: 14px;
	line-height: 1.6;
	color: var(--ink-soft);
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--space-4);
}

.woocommerce-message {
	border-left-color: var(--olive);
}

.woocommerce-info {
	border-left-color: var(--ink);
}

.woocommerce-error {
	border-left-color: var(--alert);
	color: var(--alert);
}

.woocommerce-error li,
.woocommerce-message li,
.woocommerce-info li {
	list-style: none;
	margin: 0;
	flex: 1 1 auto;
	min-width: 0;
}

.woocommerce-message::before,
.woocommerce-error::before,
.woocommerce-info::before {
	display: none;
}

/* Notices carry inline actions ("View cart", "Confirm email address"). They
   are secondary to the message, so they take the outline treatment and sit
   at the end of the bar rather than leading it. */
.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button,
.woocommerce-message .wc-forward,
.woocommerce-info .wc-forward {
	order: 2;
	margin-left: auto;
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	color: var(--ink);
	border: 1px solid var(--ink);
	padding: 10px 18px;
	font-family: var(--font-body);
	font-weight: 500;
	font-size: 11px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	white-space: nowrap;
	transition: background var(--transition-fast), color var(--transition-fast);
}

.woocommerce-message .button:hover,
.woocommerce-info .button:hover,
.woocommerce-error .button:hover {
	background: var(--ink);
	color: var(--paper);
}

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

/* Anything Woo renders that the theme has not explicitly templated. */
.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 {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: var(--ink);
	color: var(--paper);
	font-family: var(--font-body);
	font-weight: 500;
	font-size: 12px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	border: 1px solid var(--ink);
	padding: 16px 28px;
	line-height: 1;
	transition: background var(--transition-fast), border-color var(--transition-fast);
}

.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
	background: var(--olive);
	border-color: var(--olive);
	color: var(--paper);
}

.woocommerce a.button.disabled,
.woocommerce button.button:disabled {
	background: var(--ink-dim-2);
	border-color: var(--ink-dim-2);
	cursor: not-allowed;
}

/* --------------------------------------------------------------- Cart page */

.mw-cart {
	display: grid;
	grid-template-columns: 1fr 380px;
	align-items: start;
	flex: 1 0 auto;
}

.mw-cart__items {
	padding: var(--space-9) var(--gutter-desktop) var(--space-12);
	min-width: 0;
}

/* Column headers echo the shop archive's mono meta line. */
.mw-cart__head {
	display: grid;
	grid-template-columns: 1fr 140px 120px;
	gap: var(--space-5);
	border-bottom: 1px solid var(--ink);
	padding-bottom: var(--space-3);
	font-size: 11px;
	color: var(--ink-mute);
}

.mw-cart__head span:nth-child(2) {
	text-align: center;
}

.mw-cart__head span:last-child {
	text-align: right;
}

.mw-cart__row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 140px 120px;
	gap: var(--space-5);
	align-items: start;
	border-bottom: 1px solid var(--line);
	padding: var(--space-6) 0;
}

.mw-cart__row > *,
.mw-cart__detail > * {
	min-width: 0;
}

.mw-cart__name,
.mw-cart__meta {
	overflow-wrap: anywhere;
}

/* The item cell is itself a two-up: 4:5 thumbnail, then the detail stack. */
.mw-cart__row {
	grid-template-areas: 'item qty subtotal';
}

.mw-cart__media {
	grid-area: item;
	width: 88px;
	flex-shrink: 0;
}

.mw-cart__detail {
	grid-area: item;
	margin-left: calc(88px + var(--space-5));
	min-width: 0;
}

.mw-cart__name {
	font-family: var(--font-body);
	font-weight: 500;
	font-size: 15px;
	line-height: 1.3;
	color: var(--ink);
	margin-bottom: var(--space-2);
}

.mw-cart__meta {
	font-size: 10px;
	color: var(--ink-mute);
	margin-bottom: var(--space-2);
}

.mw-cart__meta dl,
.mw-cart__meta p {
	margin: 0;
	display: inline;
}

.mw-cart__meta dt,
.mw-cart__meta dd {
	display: inline;
	margin: 0;
}

.mw-cart__meta dt::after {
	content: ' ';
}

.mw-cart__meta dd::after {
	content: ' · ';
}

.mw-cart__meta dd:last-child::after {
	content: '';
}

.mw-cart__unit {
	font-size: 11px;
	color: var(--ink-mute);
	margin-bottom: var(--space-4);
}

.mw-cart__remove {
	display: inline-block;
	font-size: 10px;
	color: var(--ink-mute);
	border-bottom: 1px solid var(--line-strong);
	padding-bottom: 1px;
	transition: color var(--transition-fast), border-color var(--transition-fast);
}

.mw-cart__remove:hover {
	color: var(--alert);
	border-bottom-color: var(--alert);
}

.mw-cart__qty {
	grid-area: qty;
	display: flex;
	justify-content: center;
}

.mw-cart__subtotal {
	grid-area: subtotal;
	text-align: right;
	font-family: var(--font-mono);
	font-size: 15px;
	color: var(--ink);
}

.mw-cart__actions {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--space-8);
	flex-wrap: wrap;
	padding-top: var(--space-8);
}

.mw-cart__coupon label {
	display: block;
	font-size: 11px;
	color: var(--ink-mute);
	margin-bottom: var(--space-2);
}

.mw-cart__coupon-row {
	display: flex;
	gap: var(--space-3);
}

.mw-cart__coupon-row .mw-input {
	width: 200px;
	height: 44px;
}

.mw-cart__coupon-row .mw-btn-outline {
	height: 44px;
}

.mw-cart__update button {
	background: none;
	border: none;
	border-bottom: 1px solid currentColor;
	padding: 0 0 2px;
	font-size: 11px;
	color: var(--ink-mute);
	transition: color var(--transition-fast);
}

.mw-cart__update button:hover {
	color: var(--olive);
}

/* Summary rail: same 1px vertical rule as the shop sidebar, mirrored. */
.mw-cart__summary {
	border-left: 1px solid var(--line);
	padding: var(--space-9) var(--gutter-desktop) var(--space-12) 32px;
	position: sticky;
	top: 0;
}

.mw-cart__props {
	border-top: 1px solid var(--line);
	margin-top: var(--space-8);
	padding-top: var(--space-5);
	font-size: 10px;
	line-height: 2.2;
	color: var(--ink-mute);
}

/* ------------------------------------------------------------ Totals block */

.mw-totals__title {
	font-size: 12px;
	color: var(--ink);
	border-bottom: 1px solid var(--ink);
	padding-bottom: var(--space-3);
	margin-bottom: var(--space-2);
}

.mw-totals__list {
	margin: 0;
}

.mw-totals__row,
.mw-totals .shipping,
.woocommerce-checkout-review-order-table .cart-subtotal,
.woocommerce-checkout-review-order-table .order-total {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--space-4);
	border-bottom: 1px solid var(--line);
	padding: var(--space-4) 0;
	font-size: 14px;
}

.mw-totals__row dt {
	color: var(--ink-soft);
	margin: 0;
	/* The amount beside it is nowrap, so the label is the half that has to
	   give on a narrow screen. */
	min-width: 0;
	overflow-wrap: anywhere;
}

.mw-totals__row dd {
	margin: 0;
	font-family: var(--font-mono);
	color: var(--ink);
	text-align: right;
	/* Long fee labels (bundle discounts carry the look's full name) must
	   wrap in the term, never push the amount onto its own line. */
	flex-shrink: 0;
	white-space: nowrap;
}

.mw-totals__row.is-credit dd {
	color: var(--olive);
}

/* The order total is the figure the customer is actually deciding on. */
.mw-totals__row.is-total {
	border-bottom: none;
	border-top: 1px solid var(--ink);
	padding-top: var(--space-5);
	margin-top: var(--space-2);
	align-items: baseline;
}

.mw-totals__row.is-total dt {
	font-family: var(--font-display);
	font-size: 22px;
	color: var(--ink);
}

.mw-totals__row.is-total dd {
	font-size: 22px;
}

/* The itemised tax note is a sentence, not a figure. It sits inside the
   amount cell, which is nowrap so prices never break mid-number, so it has
   to opt back out or it pushes the summary rail wider than its column. */
.mw-totals__row small,
.mw-totals__row .includes_tax {
	display: block;
	white-space: normal;
	overflow-wrap: anywhere;
	font-family: var(--font-mono);
	font-size: 10px;
	line-height: 1.5;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--ink-mute);
	margin-top: 4px;
}

/* The label must keep a readable minimum; without this the amount cell
   claimed the whole row and "Total" was squeezed to zero width. */
.mw-totals__row.is-total dt {
	flex: 0 0 auto;
}

.mw-totals__row.is-total dd {
	flex: 1 1 auto;
	min-width: 0;
}

/* Woo's shipping rows come through wc_cart_totals_shipping_html() as <tr>. */
.mw-totals .woocommerce-shipping-totals,
.mw-totals tr.shipping {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--space-4);
	border-bottom: 1px solid var(--line);
	padding: var(--space-4) 0;
	font-size: 14px;
}

.mw-totals tr.shipping th {
	font-weight: 400;
	text-align: left;
	color: var(--ink-soft);
}

.mw-totals ul#shipping_method {
	text-align: right;
}

.mw-totals ul#shipping_method li {
	margin-bottom: var(--space-2);
}

.mw-totals .woocommerce-shipping-destination {
	font-family: var(--font-mono);
	font-size: 10px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ink-mute);
	margin-top: var(--space-2);
}

.mw-totals__cta {
	margin-top: var(--space-6);
}

.mw-totals__cta .checkout-button,
.mw-totals__cta .button {
	display: flex;
	width: 100%;
	height: 56px;
	align-items: center;
	justify-content: center;
	background: var(--ink);
	color: var(--paper);
	border: 1px solid var(--ink);
	font-size: 12px;
}

/* ---------------------------------------------------------- Empty cart page */

.mw-cart-empty {
	padding: var(--space-12) var(--gutter-desktop);
	align-items: center;
}

.mw-empty__links {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: var(--space-5);
	border-top: 1px solid var(--line);
	margin-top: var(--space-8);
	padding-top: var(--space-5);
	font-size: 11px;
}

.mw-empty__links .mw-link {
	color: var(--ink-mute);
}

/* ------------------------------------------------------------ Checkout page */

.woocommerce-checkout .mw-woo-page > form.checkout,
form.woocommerce-checkout {
	display: grid;
	grid-template-columns: 1fr 380px;
	align-items: start;
	gap: 0;
}

#customer_details {
	padding: var(--space-9) var(--gutter-desktop) var(--space-12);
	min-width: 0;
}

#customer_details .col-1,
#customer_details .col-2 {
	width: 100%;
	float: none;
	margin-bottom: var(--space-8);
}

.woocommerce-billing-fields h3,
.woocommerce-shipping-fields h3,
.woocommerce-additional-fields h3,
#order_review_heading {
	font-family: var(--font-display);
	font-size: 24px;
	line-height: 1;
	color: var(--ink);
	border-bottom: 1px solid var(--line);
	padding-bottom: var(--space-4);
	margin-bottom: var(--space-6);
}

.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper,
.woocommerce-additional-fields__field-wrapper {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--space-5);
}

/* Checkout fields are rendered by woocommerce_form_field(), which emits
   .form-row with Woo's own width classes. Map those onto the grid. */
.woocommerce-checkout .form-row {
	display: flex;
	flex-direction: column;
	margin: 0;
	min-width: 0;
	padding: 0;
}

.woocommerce-checkout .form-row-wide,
.woocommerce-checkout .form-row.notes {
	grid-column: 1 / -1;
}

.woocommerce-checkout .form-row label {
	font-family: var(--font-mono);
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ink-mute);
	margin-bottom: var(--space-2);
}

.woocommerce-checkout .form-row .required {
	color: var(--olive);
	text-decoration: none;
	border: none;
}

.woocommerce-checkout .form-row .optional {
	color: var(--ink-dim);
}

.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .select2-selection {
	width: 100%;
	background: transparent;
	border: 1px solid var(--line-strong);
	padding: 0 var(--space-4);
	height: 52px;
	font-family: var(--font-body);
	font-size: 15px;
	color: var(--ink);
	transition: border-color var(--transition-fast);
	-webkit-appearance: none;
	appearance: none;
}

.woocommerce-checkout .form-row textarea {
	height: auto;
	min-height: 110px;
	padding: var(--space-4);
	line-height: 1.6;
	resize: vertical;
}

.woocommerce-checkout .form-row input:focus,
.woocommerce-checkout .form-row textarea:focus,
.woocommerce-checkout .form-row select:focus {
	outline: none;
	border-color: var(--ink);
}

/* select2 is bundled with Woo for the country/state pickers. */
.select2-container .select2-selection--single {
	height: 52px;
	border: 1px solid var(--line-strong);
	background: transparent;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 50px;
	padding-left: var(--space-4);
	color: var(--ink);
	font-family: var(--font-body);
	font-size: 15px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 50px;
}

.select2-dropdown {
	border-color: var(--line-strong);
	background: var(--paper);
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
	background: var(--ink);
	color: var(--paper);
}

.woocommerce-checkout .woocommerce-form__label-for-checkbox {
	flex-direction: row;
	align-items: center;
	gap: var(--space-2);
	font-family: var(--font-body);
	font-size: 13px;
	letter-spacing: 0;
	text-transform: none;
	color: var(--ink-soft);
	margin-top: var(--space-2);
}

/* Order review rail, mirroring the cart summary. */
.woocommerce-checkout #order_review {
	border-left: 1px solid var(--line);
	padding: var(--space-9) var(--gutter-desktop) var(--space-12) 32px;
	min-width: 0;
}

.woocommerce-checkout-review-order-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
	display: block;
}

.woocommerce-checkout-review-order-table thead {
	display: none;
}

.woocommerce-checkout-review-order-table tbody,
.woocommerce-checkout-review-order-table tfoot {
	display: block;
}

.woocommerce-checkout-review-order-table tr {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--space-4);
	border-bottom: 1px solid var(--line);
	padding: var(--space-4) 0;
}

.woocommerce-checkout-review-order-table th,
.woocommerce-checkout-review-order-table td {
	border: none;
	padding: 0;
	text-align: left;
	font-weight: 400;
	color: var(--ink-soft);
	min-width: 0;
	overflow-wrap: anywhere;
}

.woocommerce-checkout-review-order-table td:last-child,
.woocommerce-checkout-review-order-table th:last-child {
	text-align: right;
	font-family: var(--font-mono);
	color: var(--ink);
	white-space: nowrap;
	min-width: 0;
}

/* The itemised tax note ("includes ₹1,946 GST 12%, ₹1,216 GST 18%") is a
   sentence, not a figure, so it must wrap. Inheriting nowrap from the cell
   above pushed the checkout 259px wider than a phone. */
.woocommerce-checkout-review-order-table .includes_tax,
.woocommerce-checkout-review-order-table small {
	display: block;
	white-space: normal;
	font-family: var(--font-mono);
	font-size: 10px;
	line-height: 1.5;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--ink-mute);
	margin-top: 4px;
}

.woocommerce-checkout-review-order-table .product-name {
	flex: 1 1 auto;
	min-width: 0;
}

.woocommerce-checkout-review-order-table .product-quantity {
	font-family: var(--font-mono);
	font-size: 11px;
	color: var(--ink-mute);
}

.woocommerce-checkout-review-order-table .order-total {
	border-bottom: none;
	border-top: 1px solid var(--ink);
	padding-top: var(--space-5);
}

.woocommerce-checkout-review-order-table .order-total th {
	font-family: var(--font-display);
	font-size: 22px;
	color: var(--ink);
}

.woocommerce-checkout-review-order-table .order-total td {
	font-size: 22px;
}

.woocommerce-checkout-review-order-table .variation {
	font-family: var(--font-mono);
	font-size: 10px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ink-mute);
	margin: 4px 0 0;
}

.woocommerce-checkout-review-order-table .variation dt,
.woocommerce-checkout-review-order-table .variation dd,
.woocommerce-checkout-review-order-table .variation p {
	display: inline;
	margin: 0;
}

/* Payment methods */
#payment {
	margin-top: var(--space-6);
}

#payment ul.payment_methods {
	border-top: 1px solid var(--line);
	padding: 0;
	margin: 0 0 var(--space-5);
}

#payment ul.payment_methods li {
	border-bottom: 1px solid var(--line);
	padding: var(--space-4) 0;
	list-style: none;
}

#payment ul.payment_methods label {
	display: inline-flex;
	align-items: center;
	gap: var(--space-2);
	font-family: var(--font-body);
	font-weight: 500;
	font-size: 13px;
	letter-spacing: 0.04em;
	color: var(--ink);
	cursor: pointer;
}

#payment ul.payment_methods input[type='radio'] {
	width: 14px;
	height: 14px;
	margin: 0;
	border: 1px solid var(--line-strong);
	background: transparent;
	-webkit-appearance: none;
	appearance: none;
	display: grid;
	place-content: center;
	flex-shrink: 0;
}

#payment ul.payment_methods input[type='radio']:checked {
	background: var(--ink);
	border-color: var(--ink);
	box-shadow: inset 0 0 0 3px var(--paper);
}

#payment .payment_box {
	background: var(--placeholder-2);
	padding: var(--space-4);
	margin-top: var(--space-3);
	font-size: 13px;
	line-height: 1.6;
	color: var(--ink-soft);
}

#payment .payment_box p:last-child {
	margin-bottom: 0;
}

.woocommerce-privacy-policy-text p,
#payment .woocommerce-terms-and-conditions-wrapper {
	font-size: 12px;
	line-height: 1.6;
	color: var(--ink-mute);
}

#place_order,
#payment #place_order {
	display: flex;
	width: 100%;
	height: 56px;
	align-items: center;
	justify-content: center;
	background: var(--ink);
	color: var(--paper);
	border: 1px solid var(--ink);
	font-family: var(--font-body);
	font-weight: 500;
	font-size: 12px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	margin-top: var(--space-5);
}

#place_order:hover {
	background: var(--olive);
	border-color: var(--olive);
}

/* Coupon / login toggles at the top of checkout */
.woocommerce-form-coupon-toggle,
.woocommerce-form-login-toggle {
	padding: var(--space-6) var(--gutter-desktop) 0;
	grid-column: 1 / -1;
}

form.checkout_coupon,
form.woocommerce-form-login {
	grid-column: 1 / -1;
	margin: var(--space-5) var(--gutter-desktop) 0;
	border: 1px solid var(--line);
	padding: var(--space-6);
}

form.checkout_coupon .form-row {
	display: inline-flex;
	margin-right: var(--space-3);
}

/* ------------------------------------------------------- Order confirmation */

.woocommerce-order {
	padding: var(--space-9) var(--gutter-desktop) var(--space-12);
	max-width: 900px;
}

.woocommerce-thankyou-order-received {
	font-family: var(--font-display);
	font-size: 34px;
	line-height: 1.1;
	color: var(--ink);
	margin-bottom: var(--space-8);
}

ul.woocommerce-order-overview,
ul.order_details {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 1px;
	background: var(--line);
	border: 1px solid var(--line);
	margin: 0 0 var(--space-12);
	padding: 0;
}

ul.woocommerce-order-overview li,
ul.order_details li {
	list-style: none;
	background: var(--paper);
	padding: 18px;
	font-family: var(--font-mono);
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ink-mute);
	border: none;
	margin: 0;
}

ul.woocommerce-order-overview li strong,
ul.order_details li strong {
	display: block;
	font-family: var(--font-mono);
	font-weight: 400;
	font-size: 13px;
	letter-spacing: 0.04em;
	text-transform: none;
	color: var(--ink);
	margin-top: 6px;
}

.woocommerce-order-details__title,
.woocommerce-column__title,
.woocommerce-customer-details h2 {
	font-family: var(--font-display);
	font-size: 24px;
	line-height: 1;
	color: var(--ink);
	border-bottom: 1px solid var(--line);
	padding-bottom: var(--space-4);
	margin: var(--space-12) 0 var(--space-6);
}

/* Order details table, shared by the confirmation page, the account order
   view and the customer emails' web rendering. */
table.woocommerce-table--order-details,
table.shop_table.order_details {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
	display: block;
}

table.woocommerce-table--order-details thead {
	display: block;
	border-bottom: 1px solid var(--ink);
}

table.woocommerce-table--order-details tbody,
table.woocommerce-table--order-details tfoot {
	display: block;
}

table.woocommerce-table--order-details tr {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--space-4);
	border-bottom: 1px solid var(--line);
	padding: var(--space-4) 0;
}

table.woocommerce-table--order-details th,
table.woocommerce-table--order-details td {
	border: none;
	padding: 0;
	text-align: left;
	font-weight: 400;
	color: var(--ink-soft);
}

table.woocommerce-table--order-details thead th {
	font-family: var(--font-mono);
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ink-mute);
}

table.woocommerce-table--order-details td:last-child,
table.woocommerce-table--order-details th:last-child {
	text-align: right;
	font-family: var(--font-mono);
	color: var(--ink);
	white-space: nowrap;
}

table.woocommerce-table--order-details .product-name {
	flex: 1 1 auto;
	min-width: 0;
}

table.woocommerce-table--order-details .product-name a {
	color: var(--ink);
	border-bottom: 1px solid var(--line-strong);
}

table.woocommerce-table--order-details .wc-item-meta {
	margin: 4px 0 0;
	padding: 0;
	font-family: var(--font-mono);
	font-size: 10px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--ink-mute);
	list-style: none;
}

table.woocommerce-table--order-details .wc-item-meta li,
table.woocommerce-table--order-details .wc-item-meta p {
	display: inline;
	margin: 0;
}

table.woocommerce-table--order-details tfoot tr:last-child {
	border-bottom: none;
	border-top: 1px solid var(--ink);
	padding-top: var(--space-5);
}

table.woocommerce-table--order-details tfoot tr:last-child th {
	font-family: var(--font-display);
	font-size: 20px;
	color: var(--ink);
}

table.woocommerce-table--order-details tfoot tr:last-child td {
	font-size: 20px;
}

.woocommerce-customer-details address {
	font-style: normal;
	border: 1px solid var(--line);
	padding: var(--space-6);
	font-size: 14px;
	line-height: 1.8;
	color: var(--ink-soft);
}

.woocommerce-columns--addresses {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: var(--space-6);
}

.woocommerce-columns--addresses .woocommerce-column__title {
	margin-top: 0;
}

/* --------------------------------------------------------------- Responsive */

@media (max-width: 1024px) {
	/* minmax(0, 1fr), not 1fr: a plain fr track takes an automatic minimum
	   of its content's max-content width, so the single stacked column
	   resolved to 385px inside a 345px phone and dragged the page with it. */
	.mw-cart,
	form.woocommerce-checkout {
		grid-template-columns: minmax(0, 1fr);
	}

	.mw-cart > *,
	form.woocommerce-checkout > * {
		min-width: 0;
	}

	.mw-cart__summary,
	.woocommerce-checkout #order_review {
		border-left: none;
		border-top: 1px solid var(--line);
		padding: var(--space-8) var(--gutter-desktop) var(--space-12);
		position: static;
	}
}

@media (max-width: 720px) {
	.mw-cart__items,
	.mw-cart__summary,
	#customer_details,
	.woocommerce-checkout #order_review,
	.woocommerce-order,
	.mw-cart-empty {
		padding-left: var(--gutter-mobile);
		padding-right: var(--gutter-mobile);
	}

	.mw-cart__items {
		padding-top: var(--space-7);
	}

	/* Stack the row: media and detail side by side on the first line, then
	   quantity and subtotal on a second line so nothing is squeezed. */
	.mw-cart__head {
		display: none;
	}

	.mw-cart__row {
		grid-template-columns: 1fr auto;
		grid-template-areas:
			'item item'
			'qty subtotal';
		row-gap: var(--space-4);
	}

	.mw-cart__media {
		width: 72px;
	}

	.mw-cart__detail {
		margin-left: calc(72px + var(--space-4));
	}

	.mw-cart__qty {
		justify-content: flex-start;
	}

	.mw-cart__subtotal {
		align-self: center;
	}

	.mw-cart__actions {
		flex-direction: column;
		align-items: stretch;
		gap: var(--space-5);
	}

	.mw-cart__coupon-row .mw-input {
		width: 100%;
	}

	.woocommerce-billing-fields__field-wrapper,
	.woocommerce-shipping-fields__field-wrapper,
	.woocommerce-additional-fields__field-wrapper,
	.woocommerce-columns--addresses {
		grid-template-columns: 1fr;
	}

	.woocommerce-checkout .form-row {
		grid-column: 1 / -1;
	}

	.woocommerce-form-coupon-toggle,
	.woocommerce-form-login-toggle {
		padding-left: var(--gutter-mobile);
		padding-right: var(--gutter-mobile);
	}

	form.checkout_coupon,
	form.woocommerce-form-login {
		margin-left: var(--gutter-mobile);
		margin-right: var(--gutter-mobile);
	}

	.woocommerce-thankyou-order-received {
		font-size: 26px;
	}

	/* Below ~380px a product name, its variation line and a price cannot
	   share a row. Stack them rather than letting the table set a minimum
	   width the phone cannot honour. */
	.woocommerce-checkout-review-order-table tr.cart_item {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--space-2);
	}

	.woocommerce-checkout-review-order-table tr.cart_item td,
	.woocommerce-checkout-review-order-table tr.cart_item th {
		width: 100%;
		text-align: left;
	}

	.woocommerce-checkout-review-order-table tr.cart_item td:last-child {
		text-align: left;
	}

	.woocommerce-message,
	.woocommerce-error,
	.woocommerce-info {
		flex-direction: column;
		align-items: flex-start;
	}

	.woocommerce-message .button,
	.woocommerce-info .button,
	.woocommerce-error .button {
		margin-left: 0;
	}
}