/* ==========================================================================
   Cart & Checkout — brand restyle (classic shortcode templates).
   Loaded only on is_cart() / is_checkout() (see functions.php enqueue).
   Restyle only — never restructure Woo markup/fields/hooks (CLAUDE.md rule #3).
   --------------------------------------------------------------------------
   DOM served through page.php:
     main.ps-main.ps-prose > article > h1.ps-page-title + .ps-prose-body
       > div.woocommerce  (shortcode wrapper)
   Aesthetic: flat, square (0 radius), clinical, #0076B8 accents on white.
   All values reference tokens.css. Body-class scoping (.woocommerce-cart /
   .woocommerce-checkout) out-specifies WooCommerce's own frontend stylesheets,
   which are NOT dequeued in this theme.
   ========================================================================== */

/* --------------------------------------------------------------------------
   0 · Container — centre the page at --ps-col with --ps-gutter, so cart/checkout
   are no longer edge-to-edge. .ps-prose is otherwise full-bleed.
   -------------------------------------------------------------------------- */
.woocommerce-cart .ps-main.ps-prose > article,
.woocommerce-checkout .ps-main.ps-prose > article {
	width: min(var(--ps-col), 100% - 2 * var(--ps-gutter));
	margin-inline: auto;
}

/* The "My Cart" masthead is a full-bleed page-head — sit it flush under the
   announce bar by removing .ps-prose's 2.5rem top padding (only when the masthead
   is present, so the empty-cart / checkout keep their normal top spacing). */
.woocommerce-cart .ps-main.ps-prose:has(.ps-cart-head) {
	padding-top: 0;
}

.woocommerce-cart .ps-page-title,
.woocommerce-checkout .ps-page-title {
	font-size: 1.75rem;
	margin-bottom: 1.5rem;
}

/* Neutralise prose paragraph defaults bleeding into Woo markup. */
.woocommerce-cart .ps-prose-body,
.woocommerce-checkout .ps-prose-body {
	color: var(--ps-ink);
}
.woocommerce-cart .ps-prose-body p,
.woocommerce-checkout .ps-prose-body p {
	line-height: 1.5;
}

/* ===== CART/CHECKOUT (v2 refresh) ===== Figma 1336-6093
   0b · Ambient blue glow — the page sits on a faint blue-white wash with two
   soft radial washes (upper-right near the summary, lower-left near the upsell),
   matching the new artboards. Pure light: the ::before is pinned behind the
   content, and the centred <article> is lifted above it. No markup touched. */
.woocommerce-cart .ps-main,
.woocommerce-checkout .ps-main {
	position: relative;
	background: var(--ps-wash);
}
.woocommerce-cart .ps-main::before,
.woocommerce-checkout .ps-main::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	background:
		radial-gradient(48% 36% at 88% 30%, rgba(0, 118, 184, 0.16), transparent 72%),
		radial-gradient(42% 32% at 3% 74%, rgba(0, 118, 184, 0.12), transparent 70%);
}
.woocommerce-cart .ps-main > article,
.woocommerce-checkout .ps-main > article {
	position: relative;
	z-index: 1;
}

/* --------------------------------------------------------------------------
   1 · Woo notices — quiet, square, brand accent.
   -------------------------------------------------------------------------- */
.woocommerce-cart .woocommerce-notices-wrapper,
.woocommerce-checkout .woocommerce-notices-wrapper {
	width: 100%;
	margin: 0 0 1.5rem;
}
.woocommerce-cart .woocommerce-message,
.woocommerce-cart .woocommerce-info,
.woocommerce-cart .woocommerce-error,
.woocommerce-checkout .woocommerce-message,
.woocommerce-checkout .woocommerce-info,
.woocommerce-checkout .woocommerce-error {
	border: 1px solid var(--ps-line);
	border-left: 3px solid var(--ps-blue);
	border-radius: 0;
	background: var(--ps-wash);
	color: var(--ps-ink);
	font-size: 0.875rem;
	padding: 0.9rem 1.1rem;
	list-style: none;
}
.woocommerce-cart .woocommerce-error,
.woocommerce-checkout .woocommerce-error {
	border-left-color: #c0392b;
}
.woocommerce-cart .woocommerce-message a.button,
.woocommerce-checkout .woocommerce-message a.button {
	float: none;
	margin-left: 0.75rem;
}
/* Woo prints a webfont glyph via ::before; unloaded here it renders as tofu. */
.woocommerce-cart .woocommerce-message::before,
.woocommerce-cart .woocommerce-info::before,
.woocommerce-cart .woocommerce-error::before,
.woocommerce-checkout .woocommerce-message::before,
.woocommerce-checkout .woocommerce-info::before,
.woocommerce-checkout .woocommerce-error::before {
	display: none;
}

/* --------------------------------------------------------------------------
   2 · Empty cart — brand state (woocommerce/cart/cart-empty.php override).
   The default `wc_empty_cart_message` notice fires (hook preserved) but is
   visually suppressed here; .ps-cart-empty is the visible state.
   -------------------------------------------------------------------------- */
.woocommerce-cart .cart-empty.woocommerce-info,
.woocommerce-cart p.cart-empty {
	display: none;
}

.ps-cart-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	padding: 3.5rem 1.5rem 4.5rem;
	border: 1px solid var(--ps-line);
	background: var(--ps-wash);
}
.ps-cart-empty__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 96px;
	height: 96px;
	margin-bottom: 1.5rem;
	color: var(--ps-blue);
	background: var(--ps-paper);
	border: 1px solid var(--ps-line);
	border-radius: 50%;
}
.ps-cart-empty__title {
	font-size: 1.375rem;
	font-weight: 500;
	color: var(--ps-navy);
	margin: 0 0 0.5rem;
}
.ps-cart-empty__text {
	font-size: 0.9375rem;
	color: var(--ps-muted);
	max-width: 34ch;
	margin: 0 0 1.75rem;
	line-height: 1.5;
}
.ps-cart-empty__cta {
	padding: 0.9rem 2rem;
}

/* --------------------------------------------------------------------------
   3 · CART — Figma 12812:5519 (desktop) / 12812:5775 (mobile).
   Markup emitted by woocommerce/cart/cart.php:
     div.woocommerce (plain block)
       .ps-page-head.ps-cart-head          full-bleed masthead
       .ps-cart-progress                   "Order Summary" + step rail
       .ps-cart-layout (grid 1fr | aside)
         .ps-cart-main > form.woocommerce-cart-form > table.cart   items
         .cart-collaterals > .cart_totals  "Cart Summary" card
       .ps-upsell                          "You May Also Like"
       .ps-cart-ruo                        "Research Use Only"
   -------------------------------------------------------------------------- */
.woocommerce-cart {
	--ps-cart-aside: 387px;
	--ps-cart-gap: 1.5rem;
}
/* the shortcode wrapper is a plain block; the 2-col grid lives on .ps-cart-layout */
.woocommerce-cart .ps-prose-body .woocommerce {
	display: block;
}
/* hide page.php's default <h1> only when our masthead renders (the empty-cart
   state has no .ps-cart-head, so it keeps its "Cart" title). */
.woocommerce-cart .ps-main:has(.ps-cart-head) > article > .ps-page-title {
	display: none;
}

/* --- masthead (breadcrumb + "My Cart" + DNA), full-bleed wash band --------- */
.woocommerce-cart .ps-cart-head {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	margin-bottom: 2.5rem;
}
.woocommerce-cart .ps-cart-head .ps-page-head-title {
	font-size: 1.75rem;
}
.woocommerce-cart .ps-cart-head .ps-breadcrumb a,
.woocommerce-cart .ps-cart-head .ps-breadcrumb span {
	font-size: 0.8125rem;
}

/* --- "Order Summary" + step rail (Items · Details · Shipping · Payment) ----- */
.ps-cart-progress {
	margin: 0 0 2rem;
}
.ps-cart-progress__title {
	font-size: 1.375rem;
	font-weight: 700;
	color: var(--ps-navy);
	margin: 0 0 1.15rem;
}
.ps-steps {
	display: flex;
	align-items: center;
	list-style: none;
	margin: 0;
	padding: 0;
	max-width: calc(100% - var(--ps-cart-aside) - var(--ps-cart-gap));
}
.ps-step {
	display: inline-flex;
	align-items: baseline;
	gap: 0.35rem;
	flex: 0 0 auto;
}
/* Flat text stepper (Figma 1336-6093): "1 Items" — number + label inline, no
   badge; the active + completed steps are brand blue, the rest muted grey. */
.ps-step__num,
.ps-step__label {
	font-size: 0.875rem;
	font-weight: 500;
	letter-spacing: 0;
	text-transform: none;
	line-height: 1;
	color: var(--ps-soft);
}
.ps-step.is-active .ps-step__num,
.ps-step.is-active .ps-step__label,
.ps-step.is-done .ps-step__num,
.ps-step.is-done .ps-step__label {
	color: var(--ps-blue);
}
.ps-step__sep {
	flex: 1 1 auto;
	min-width: 24px;
	height: 1px;
	margin: 0 1rem;
	background: var(--ps-line);
	align-self: center;
}
/* the connector leaving a completed step is brand blue (Figma: on the checkout
   steps the Items→Details line is blue up to the current step). */
.ps-step.is-done + .ps-step__sep {
	height: 2px;
	background: var(--ps-blue);
}

/* --- Checkout chrome: reuse the cart masthead + stepper (added via hooks) ---- */
.woocommerce-checkout { --ps-cart-aside: 387px; --ps-cart-gap: 1.5rem; }
.woocommerce-checkout .ps-main.ps-prose:has(.ps-checkout-head) { padding-top: 0; }
.woocommerce-checkout .ps-main:has(.ps-checkout-head) > article > .ps-page-title { display: none; }
.woocommerce-checkout .ps-checkout-head {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	margin-bottom: 2rem;
}
.woocommerce-checkout .ps-checkout-head .ps-page-head-title { font-size: 1.75rem; }
.woocommerce-checkout .ps-checkout-head .ps-breadcrumb a,
.woocommerce-checkout .ps-checkout-head .ps-breadcrumb span { font-size: 0.8125rem; }
/* SSL trust block under Place Order — pale-blue fill + blue lock (Figma). */
.ps-checkout-trust {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	margin-top: 1rem;
	padding: 1rem 1.1rem;
	border: 0;
	background: var(--ps-pale);
}
.ps-checkout-trust .ps-trust-ico { color: var(--ps-blue); flex: 0 0 auto; margin-top: 1px; }
.ps-checkout-trust .ps-trust-copy { display: flex; flex-direction: column; gap: 0.1875rem; }
.ps-checkout-trust strong { font-size: 0.875rem; font-weight: 700; color: var(--ps-navy); }
.ps-checkout-trust span { font-size: 0.75rem; line-height: 1.4; color: var(--ps-muted); }

/* --- two-column layout ----------------------------------------------------- */
.ps-cart-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) var(--ps-cart-aside);
	gap: var(--ps-cart-gap);
	align-items: start;
	margin: 0 0 3.5rem;
}
.ps-cart-main {
	grid-column: 1;
	min-width: 0;
}
.ps-cart-items__title {
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--ps-navy);
	margin: 0 0 1rem;
}
.woocommerce-cart .cart-collaterals {
	grid-column: 2;
	width: auto;
	float: none;
	margin: 0;
}
.woocommerce-cart .cart-collaterals .cart_totals {
	width: auto;
	float: none;
}
.woocommerce-cart .cart-collaterals .cross-sells {
	display: none; /* upsell handled by the branded "You May Also Like" row */
}

/* --- cart items — each row a card cell inside one bordered list ------------- */
.woocommerce-cart .woocommerce-cart-form {
	margin: 0;
}
.woocommerce-cart table.shop_table.cart {
	width: 100%;
	border: 1px solid var(--ps-line);
	border-collapse: collapse;
	border-radius: 0;
	margin: 0;
	background: #fff;
}
.woocommerce-cart table.cart thead {
	display: none; /* Figma line-items have no column header row */
}
.woocommerce-cart table.cart tbody {
	display: block;
}
.woocommerce-cart table.cart tr.woocommerce-cart-form__cart-item {
	position: relative;
	display: grid;
	grid-template-columns: 80px minmax(0, 1fr) auto minmax(96px, max-content);
	grid-template-areas:
		"thumb name qty subtotal"
		"thumb name qty price";
	column-gap: 1.25rem;
	align-items: center;
	padding: 1.5rem;
	border-top: 1px solid var(--ps-line);
}
.woocommerce-cart table.cart tr.woocommerce-cart-form__cart-item:first-child {
	border-top: 0;
}
.woocommerce-cart table.cart td {
	border: 0;
	padding: 0;
	background: transparent;
	vertical-align: middle;
}

.woocommerce-cart td.product-thumbnail {
	grid-area: thumb;
	align-self: center;
}
.woocommerce-cart td.product-thumbnail a,
.woocommerce-cart td.product-thumbnail img {
	display: block;
	width: 80px;
	height: 80px;
}
.woocommerce-cart td.product-thumbnail img {
	object-fit: contain;
	border: 1px solid var(--ps-line);
	background: #fff;
}

/* selector carries table.cart so it out-specifies Woo's smallscreen
   `table.shop_table_responsive tr td { display:block; text-align:right }` (≤768px). */
.woocommerce-cart table.cart td.product-name {
	grid-area: name;
	display: flex;
	flex-direction: column;
	gap: 0.15rem;
	min-width: 0;
	font-size: 1.0625rem;
	font-weight: 700;
	color: var(--ps-navy);
	line-height: 1.3;
	text-align: left;
}
.woocommerce-cart td.product-name > a {
	color: var(--ps-navy);
	text-decoration: none;
}
.woocommerce-cart td.product-name > a:hover {
	color: var(--ps-blue);
}
.woocommerce-cart td.product-name dl.variation,
.woocommerce-cart td.product-name .wc-item-meta {
	font-size: 0.8125rem;
	color: var(--ps-muted);
	font-weight: 400;
	margin: 0;
}
.ps-cart-item__cas {
	font-size: 0.8125rem;
	font-weight: 400;
	color: var(--ps-muted);
}
.ps-cart-item__stock {
	font-size: 0.6875rem;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--ps-blue);
	margin-top: 0.1rem;
}
.ps-cart-item__stock--out {
	color: #c0392b;
}

/* price block — line subtotal (large) stacked over unit price (small), right */
.woocommerce-cart td.product-subtotal {
	grid-area: subtotal;
	align-self: end;
	text-align: right;
	white-space: nowrap;
	font-size: 1.0625rem;
	font-weight: 700;
	color: var(--ps-navy);
}
.woocommerce-cart td.product-price {
	grid-area: price;
	align-self: start;
	text-align: right;
	white-space: nowrap;
	font-size: 0.75rem;
	font-weight: 400;
	color: var(--ps-muted);
}
.woocommerce-cart td.product-price::before {
	content: "Unit Price: ";
}

/* quantity stepper — bordered box with injected − / + controls (ps.js-free) */
.woocommerce-cart td.product-quantity {
	grid-area: qty;
	align-self: center;
}
.woocommerce-cart .quantity {
	display: inline-flex;
	align-items: center;
	height: 44px;
	border: 1px solid var(--ps-line-2);
	border-radius: 0;
	background: #fff;
	overflow: hidden;
}
.woocommerce-cart .quantity input.qty {
	width: 40px;
	height: 42px;
	padding: 0;
	text-align: center;
	font-family: var(--ps-font);
	font-size: 0.9375rem;
	color: var(--ps-ink);
	border: 0;
	border-radius: 0;
	background: transparent;
	-moz-appearance: textfield;
	appearance: textfield;
}
.woocommerce-cart .quantity input.qty::-webkit-outer-spin-button,
.woocommerce-cart .quantity input.qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}
.woocommerce-cart .quantity input.qty:focus {
	outline: none;
}
.ps-qty-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 42px;
	padding: 0;
	border: 0;
	background: transparent;
	font-family: var(--ps-font);
	font-size: 1.125rem;
	line-height: 1;
	color: var(--ps-ink);
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
}
.ps-qty-btn:hover {
	background: var(--ps-wash);
	color: var(--ps-blue);
}
.ps-qty-dec { border-right: 1px solid var(--ps-line); }
.ps-qty-inc { border-left: 1px solid var(--ps-line); }

/* remove × — subtle, top-right corner of the row (Figma omits it; kept for WC) */
.woocommerce-cart td.product-remove {
	position: absolute;
	top: 0.6rem;
	right: 0.6rem;
	width: auto;
	padding: 0;
	z-index: 2;
}
.woocommerce-cart table.cart a.remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	font-size: 18px;
	line-height: 1;
	color: var(--ps-soft) !important; /* beats WooCommerce's #a00 !important */
	background: transparent;
	border: 0;
	border-radius: 50%;
	text-decoration: none;
	transition: color 0.15s ease, background 0.15s ease;
}
.woocommerce-cart table.cart a.remove:hover {
	color: #fff !important;
	background: #c0392b;
}

/* actions row (nonce + update-cart) is retained for WC_Form_Handler but hidden;
   the quantity stepper submits update_cart programmatically. */
.woocommerce-cart table.cart td.actions {
	display: none;
}

/* --- "Cart Summary" card --------------------------------------------------- */
.woocommerce-cart .cart_totals {
	border: 1px solid var(--ps-line);
	background: #eff8fb;
	padding: 1.5rem;
	position: sticky;
	top: 1.5rem;
}
.woocommerce-cart .cart_totals h2 {
	font-size: 1.125rem;
	font-weight: 700;
	color: var(--ps-navy);
	margin: 0 0 1.25rem;
	padding: 0;
	border: 0;
}
.woocommerce-cart .cart_totals table.shop_table {
	width: 100%;
	border: 0;
	border-collapse: collapse;
	margin: 0 0 1.25rem;
	border-radius: 0;
}
.woocommerce-cart .cart_totals table.shop_table th,
.woocommerce-cart .cart_totals table.shop_table td {
	border: 0;
	padding: 0.4rem 0;
	font-size: 0.9375rem;
	background: transparent;
	vertical-align: middle;
}
.woocommerce-cart .cart_totals table.shop_table th {
	font-weight: 400;
	color: var(--ps-muted);
	text-align: left;
}
.woocommerce-cart .cart_totals table.shop_table td {
	text-align: right;
	color: var(--ps-ink);
	font-weight: 500;
}
.woocommerce-cart .cart_totals tr.order-total th,
.woocommerce-cart .cart_totals tr.order-total td {
	padding-top: 1rem;
	border-top: 1px solid var(--ps-line);
}
.woocommerce-cart .cart_totals tr.order-total th {
	font-weight: 700;
	font-size: 1rem;
	color: var(--ps-navy);
}
.woocommerce-cart .cart_totals tr.order-total td {
	font-weight: 700;
	font-size: 1.25rem;
	color: var(--ps-blue);
}
.woocommerce-cart .cart_totals .cart-discount td {
	color: var(--ps-blue);
	font-weight: 700;
}
/* applied-coupon "Remove" control — the destructive red the Figma cart uses for
   its "Remove Discount" action (native WC remove link, restyled only). */
.woocommerce-cart .cart_totals .cart-discount .woocommerce-remove-coupon {
	color: #c0392b;
	font-weight: 500;
	text-decoration: none;
}
.woocommerce-cart .cart_totals .cart-discount .woocommerce-remove-coupon:hover {
	text-decoration: underline;
}
.woocommerce-cart .cart_totals .woocommerce-shipping-destination,
.woocommerce-cart .cart_totals .shipping-calculator-button {
	font-size: 0.8125rem;
	color: var(--ps-muted);
}
.woocommerce-cart .cart_totals ul#shipping_method {
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: right;
}
.woocommerce-cart .cart_totals ul#shipping_method li {
	margin: 0 0 0.25rem;
}

/* promo code (relocated from cart.php actions) */
.woocommerce-cart .cart_totals .ps-promo {
	display: flex;
	gap: 0.5rem;
	margin: 0 0 1.25rem;
}
.woocommerce-cart .cart_totals .ps-promo__input {
	flex: 1 1 auto;
	min-width: 0;
	height: 44px;
	padding: 0 0.9rem;
	font-family: var(--ps-font);
	font-size: 0.875rem;
	color: var(--ps-ink);
	border: 1px solid var(--ps-line);
	border-radius: 0;
	background: #fff;
}
.woocommerce-cart .cart_totals .ps-promo__input::placeholder {
	color: var(--ps-soft);
}
.woocommerce-cart .cart_totals .ps-promo__input:focus {
	outline: none;
	border-color: var(--ps-blue);
	box-shadow: 0 0 0 3px rgba(0, 118, 184, 0.15);
}
.woocommerce-cart .cart_totals .ps-promo__btn {
	flex: 0 0 auto;
	height: 44px;
	padding: 0 1.1rem;
	border: 1px solid var(--ps-blue);
	border-radius: 0;
	background: var(--ps-blue);
	color: #fff;
	font-family: var(--ps-font);
	font-weight: 700;
	font-size: 0.875rem;
	white-space: nowrap;
	cursor: pointer;
	transition: background 0.15s ease, border-color 0.15s ease;
}
.woocommerce-cart .cart_totals .ps-promo__btn:hover {
	background: var(--ps-blue-deep);
	border-color: var(--ps-blue-deep);
}

/* email + 21+/research-use consent (presentational) */
.ps-cart-consent {
	margin: 0 0 1.25rem;
}
.ps-cart-consent .ps-field-label {
	display: block;
	font-size: 0.8125rem;
	font-weight: 700;
	color: var(--ps-ink);
	margin: 0 0 0.5rem;
}
.ps-cart-consent .ps-req {
	color: var(--ps-blue);
}
.ps-input-icon {
	position: relative;
	margin: 0 0 0.9rem;
}
.ps-input-icon svg {
	position: absolute;
	left: 0.85rem;
	top: 50%;
	transform: translateY(-50%);
	color: var(--ps-muted);
	pointer-events: none;
}
.ps-cart-consent__email {
	width: 100%;
	height: 44px;
	padding: 0 0.9rem 0 2.4rem;
	font-family: var(--ps-font);
	font-size: 0.875rem;
	color: var(--ps-ink);
	border: 1px solid var(--ps-line);
	border-radius: 0;
	background: #fff;
}
.ps-cart-consent__email::placeholder {
	color: var(--ps-soft);
}
.ps-cart-consent__email:focus {
	outline: none;
	border-color: var(--ps-blue);
	box-shadow: 0 0 0 3px rgba(0, 118, 184, 0.15);
}
.ps-consent {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	font-size: 0.8125rem;
	color: var(--ps-ink);
	line-height: 1.4;
	cursor: pointer;
}
.ps-consent__box {
	flex: 0 0 auto;
	width: 20px;
	height: 20px;
	margin: 0;
	accent-color: var(--ps-blue);
}

/* proceed + continue buttons */
.woocommerce-cart .cart_totals .wc-proceed-to-checkout {
	padding: 0;
	margin: 0 0 0.75rem;
}
.woocommerce-cart .cart_totals .wc-proceed-to-checkout a.checkout-button {
	display: flex;
	width: 100%;
	align-items: center;
	justify-content: center;
	height: 48px;
	padding: 0 1.5rem;
	font-size: 0.9375rem;
	font-weight: 700;
	border: 1px solid var(--ps-blue);
	border-radius: 0;
	background: var(--ps-blue);
	color: #fff;
	text-decoration: none;
	text-shadow: none;
	transition: background 0.15s ease, border-color 0.15s ease;
}
.woocommerce-cart .cart_totals .wc-proceed-to-checkout a.checkout-button:hover {
	background: var(--ps-blue-deep);
	border-color: var(--ps-blue-deep);
	color: #fff;
}
.woocommerce-cart .cart_totals a.ps-continue-shopping {
	display: flex;
	width: 100%;
	align-items: center;
	justify-content: center;
	height: 48px;
	padding: 0 1.5rem;
	font-size: 0.9375rem;
	font-weight: 700;
	border: 1px solid var(--ps-blue);
	border-radius: 0;
	background: #fff;
	color: var(--ps-blue);
	text-decoration: none;
	transition: background 0.15s ease, color 0.15s ease;
}
.woocommerce-cart .cart_totals a.ps-continue-shopping:hover {
	background: var(--ps-blue);
	color: #fff;
}

/* --- "You May Also Like" upsell row ---------------------------------------- */
.ps-upsell {
	margin: 0 0 2.5rem;
}
.ps-upsell__title {
	font-size: 1.125rem;
	font-weight: 700;
	color: var(--ps-navy);
	margin: 0 0 1.25rem;
}
.ps-upsell__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1.25rem;
}
.ps-upsell__tile {
	display: block;
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border: 1px solid var(--ps-line);
	background: var(--ps-wash);
	text-decoration: none;
}
.ps-upsell__tile img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.3s ease;
}
.ps-upsell__tile:hover img {
	transform: scale(1.03);
}

/* --- "Research Use Only" band ---------------------------------------------- */
.ps-cart-ruo {
	background: #f3f4fc;
	padding: 1.75rem 2rem;
	margin: 0 0 1rem;
}
.ps-cart-ruo__title {
	font-size: 1.125rem;
	font-weight: 700;
	color: var(--ps-navy);
	margin: 0 0 0.5rem;
}
.ps-cart-ruo__text {
	max-width: 82ch;
	margin: 0;
	font-size: 0.875rem;
	line-height: 1.5;
	color: var(--ps-muted);
}

/* --------------------------------------------------------------------------
   4 · CHECKOUT — single page: details (left) + sticky order summary (right).
   NOTE: the checkout PHP templates are intentionally NOT overridden — the money
   path stays on WooCommerce's stock markup so every field + gateway hook (now
   and after Woo updates) is preserved. Everything here is CSS-only (rule #3).
   -------------------------------------------------------------------------- */

/* before-form: coupon toggle + login toggle */
.woocommerce-checkout .woocommerce-form-coupon-toggle,
.woocommerce-checkout .woocommerce-form-login-toggle {
	margin: 0 0 1.5rem;
}
.woocommerce-checkout form.checkout_coupon,
.woocommerce-checkout form.login {
	border: 1px solid var(--ps-line);
	border-radius: 0;
	background: var(--ps-wash);
	padding: 1.25rem 1.5rem;
	margin: 0 0 1.75rem;
}

/* two-column layout */
.woocommerce-checkout form.checkout.woocommerce-checkout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) clamp(320px, 34%, 400px);
	grid-template-areas:
		"details heading"
		"details review";
	grid-template-rows: auto 1fr;
	column-gap: 2.5rem;
	row-gap: 0;
	align-items: start;
}
.woocommerce-checkout #customer_details {
	grid-area: details;
	width: auto;
	float: none;
}
.woocommerce-checkout #order_review_heading {
	grid-area: heading;
	font-size: 1.0625rem;
	font-weight: 700;
	color: var(--ps-navy);
	margin: 0;
	background: var(--ps-pale);
	border: 1px solid var(--ps-line);
	border-bottom: 0;
	padding: 1.5rem 1.5rem 0.25rem;
}
.woocommerce-checkout #order_review {
	grid-area: review;
	width: auto;
	float: none;
	position: sticky;
	top: 1.5rem;
}

/* customer details column: billing + shipping stacked, each a brand card */
.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 {
	width: 100%;
	float: none;
	max-width: none;
	margin: 0 0 1.5rem;
}
.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout .woocommerce-shipping-fields,
.woocommerce-checkout .woocommerce-additional-fields {
	border: 1px solid var(--ps-line);
	background: var(--ps-paper);
	padding: 1.5rem;
}
.woocommerce-checkout .woocommerce-shipping-fields,
.woocommerce-checkout .woocommerce-additional-fields {
	margin-top: 1.5rem;
}
/* Guest checkout with no separate shipping step renders an EMPTY
   .woocommerce-shipping-fields — an empty bordered card. Hide it (no heading
   inside means nothing to show). */
.woocommerce-checkout .woocommerce-shipping-fields:empty,
.woocommerce-checkout .woocommerce-shipping-fields:not(:has(h3)) {
	display: none;
}
.woocommerce-checkout .woocommerce-billing-fields > h3,
.woocommerce-checkout .woocommerce-shipping-fields h3,
.woocommerce-checkout .woocommerce-additional-fields h3 {
	font-size: 1.0625rem;
	font-weight: 500;
	color: var(--ps-navy);
	margin: 0 0 1.25rem;
	padding-bottom: 0.9rem;
	border-bottom: 1px solid var(--ps-line);
}
.woocommerce-checkout .woocommerce-shipping-fields h3 label {
	font-size: 1.0625rem;
	font-weight: 500;
	color: var(--ps-navy);
}

/* Billing fields — 2-up grid (first/last share the top row; country, address,
   city, state, ZIP, phone, email each span the row), matching the Figma
   "Details" artboard. Pure layout on the field WRAPPER — no field is reordered,
   renamed, or removed (rule #3). */
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper {
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 1.25rem;
}
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .form-row {
	grid-column: 1 / -1;
}
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .form-row.form-row-first {
	grid-column: 1;
}
.woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .form-row.form-row-last {
	grid-column: 2;
}

/* form fields */
.woocommerce-checkout .form-row {
	margin: 0 0 1.1rem;
	padding: 0;
}
.woocommerce-checkout .form-row label {
	display: block;
	font-size: 0.8125rem;
	font-weight: 500;
	color: var(--ps-ink);
	margin: 0 0 0.4rem;
}
.woocommerce-checkout .form-row .required {
	color: var(--ps-blue);
	border: 0;
	text-decoration: none;
}
.woocommerce-checkout .form-row .optional {
	color: var(--ps-soft);
}
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout .select2-container .select2-selection,
.woocommerce-checkout form.checkout_coupon input.input-text,
.woocommerce-checkout form.login input.input-text {
	width: 100%;
	height: 46px;
	padding: 0 0.9rem;
	font-family: var(--ps-font);
	font-size: 0.9375rem;
	color: var(--ps-ink);
	background: var(--ps-paper);
	border: 1px solid var(--ps-line);
	border-radius: 0;
	box-shadow: none;
	line-height: 1.4;
}
.woocommerce-checkout .form-row textarea {
	height: auto;
	min-height: 84px;
	padding: 0.7rem 0.9rem;
	resize: vertical;
}
.woocommerce-checkout .form-row input.input-text::placeholder,
.woocommerce-checkout .form-row textarea::placeholder {
	color: var(--ps-soft);
}
.woocommerce-checkout .form-row input.input-text:focus,
.woocommerce-checkout .form-row textarea:focus,
.woocommerce-checkout form.checkout_coupon input.input-text:focus,
.woocommerce-checkout form.login input.input-text:focus {
	outline: none;
	border-color: var(--ps-blue);
	box-shadow: 0 0 0 3px rgba(0, 118, 184, 0.15);
}
.woocommerce-checkout .form-row.woocommerce-invalid input.input-text {
	border-color: #c0392b;
}
.woocommerce-checkout .form-row.woocommerce-validated input.input-text {
	border-color: #2e8b57;
}

/* select2 (country/state) — match text inputs */
.woocommerce-checkout .select2-container--default .select2-selection--single {
	height: 46px;
	border: 1px solid var(--ps-line);
	border-radius: 0;
	background: var(--ps-paper);
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 44px;
	padding: 0 0.9rem;
	color: var(--ps-ink);
}
.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 44px;
	right: 6px;
}
.woocommerce-checkout .select2-container--open .select2-selection--single {
	border-color: var(--ps-blue);
	box-shadow: 0 0 0 3px rgba(0, 118, 184, 0.15);
}
/* native select fallback */
.woocommerce-checkout .form-row select {
	width: 100%;
	height: 46px;
	padding: 0 0.9rem;
	font-family: var(--ps-font);
	font-size: 0.9375rem;
	color: var(--ps-ink);
	border: 1px solid var(--ps-line);
	border-radius: 0;
	background: var(--ps-paper);
}

/* --------------------------------------------------------------------------
   4b · Field icons (Figma "Details" artboard) — muted left glyphs on the billing
   inputs + the country/state select2 boxes. CSS background-image only: no field
   is touched, so gateway hooks are unaffected (rule #3). Targeted by field id so
   only the intended inputs get an icon.
   -------------------------------------------------------------------------- */
.woocommerce-checkout #billing_first_name,
.woocommerce-checkout #billing_last_name,
.woocommerce-checkout #billing_email,
.woocommerce-checkout #billing_phone,
.woocommerce-checkout #billing_address_1,
.woocommerce-checkout #billing_city,
.woocommerce-checkout #billing_postcode {
	background-repeat: no-repeat;
	background-position: 0.85rem center;
	background-size: 17px 17px;
	padding-left: 2.55rem;
}
.woocommerce-checkout #billing_first_name,
.woocommerce-checkout #billing_last_name { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%239CA0AE%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%278%27%20r%3D%274%27%2F%3E%3Cpath%20d%3D%27M4%2021c0-4%203.6-7%208-7s8%203%208%207%27%2F%3E%3C%2Fsvg%3E"); }
.woocommerce-checkout #billing_email      { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%239CA0AE%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%273%27%20y%3D%275%27%20width%3D%2718%27%20height%3D%2714%27%20rx%3D%271%27%2F%3E%3Cpath%20d%3D%27m3%207%209%206%209-6%27%2F%3E%3C%2Fsvg%3E"); }
.woocommerce-checkout #billing_phone      { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%239CA0AE%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M6.6%2010.8a15%2015%200%200%200%206.6%206.6l2.2-2.2a1%201%200%200%201%201-.24%2011%2011%200%200%200%203.4.55%201%201%200%200%201%201%201V20a1%201%200%200%201-1%201A17%2017%200%200%201%203%204a1%201%200%200%201%201-1h3.5a1%201%200%200%201%201%201%2011%2011%200%200%200%20.55%203.4%201%201%200%200%201-.24%201Z%27%2F%3E%3C%2Fsvg%3E"); }
.woocommerce-checkout #billing_address_1  { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%239CA0AE%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%2021s6-5%206-10a6%206%200%200%200-12%200c0%205%206%2010%206%2010Z%27%2F%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2711%27%20r%3D%272.2%27%2F%3E%3C%2Fsvg%3E"); }
.woocommerce-checkout #billing_city       { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%239CA0AE%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Crect%20x%3D%275%27%20y%3D%273%27%20width%3D%2714%27%20height%3D%2718%27%20rx%3D%271%27%2F%3E%3Cpath%20d%3D%27M9%207h2M13%207h2M9%2011h2M13%2011h2M11%2021v-3h2v3%27%2F%3E%3C%2Fsvg%3E"); }
.woocommerce-checkout #billing_postcode   { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%239CA0AE%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M9%204%207%2020M17%204l-2%2016M4%209h16M3%2015h16%27%2F%3E%3C%2Fsvg%3E"); }

/* country + state select2 boxes — icon + matching left padding on the rendered text */
.woocommerce-checkout #billing_country_field .select2-selection--single,
.woocommerce-checkout #billing_state_field .select2-selection--single {
	background-repeat: no-repeat;
	background-position: 0.85rem center;
	background-size: 17px 17px;
}
.woocommerce-checkout #billing_country_field .select2-selection--single { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%239CA0AE%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%279%27%2F%3E%3Cpath%20d%3D%27M3%2012h18M12%203a15%2015%200%200%201%200%2018%2015%2015%200%200%201%200-18%27%2F%3E%3C%2Fsvg%3E"); }
.woocommerce-checkout #billing_state_field .select2-selection--single { background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27%239CA0AE%27%20stroke-width%3D%271.7%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%2021s6-5%206-10a6%206%200%200%200-12%200c0%205%206%2010%206%2010Z%27%2F%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2711%27%20r%3D%272.2%27%2F%3E%3C%2Fsvg%3E"); }
.woocommerce-checkout #billing_country_field .select2-selection__rendered,
.woocommerce-checkout #billing_state_field .select2-selection__rendered {
	padding-left: 2.55rem;
}

/* ship-to-different-address toggle */
.woocommerce-checkout #ship-to-different-address {
	display: flex;
	align-items: center;
	gap: 0.6rem;
}
.woocommerce-checkout #ship-to-different-address label {
	margin: 0;
	cursor: pointer;
}
.woocommerce-checkout #ship-to-different-address-checkbox {
	width: 18px;
	height: 18px;
	accent-color: var(--ps-blue);
}

/* --- order summary card (review + payment) ------------------------------ */
.woocommerce-checkout #order_review {
	border: 1px solid var(--ps-line);
	border-top: 0;
	background: var(--ps-pale);
	padding: 1rem 1.5rem 1.5rem;
}
.woocommerce-checkout table.woocommerce-checkout-review-order-table {
	width: 100%;
	border: 0;
	border-collapse: collapse;
	margin: 0 0 1.25rem;
	border-radius: 0;
}
/* Figma order summary has no "PRODUCT / SUBTOTAL" header row — the product line
   sits straight under the title. Hide the review thead (kept in the DOM). */
.woocommerce-checkout .woocommerce-checkout-review-order-table thead {
	display: none;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tbody td {
	padding: 0.85rem 0;
	border-top: 1px solid var(--ps-line);
	font-size: 0.9375rem;
	color: var(--ps-ink);
	vertical-align: top;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tbody tr:first-child td {
	border-top: 0;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-name {
	color: var(--ps-navy);
	font-weight: 500;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table td.product-total {
	text-align: right;
	white-space: nowrap;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table .product-quantity {
	color: var(--ps-muted);
	font-weight: 400;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot th,
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot td {
	padding: 0.6rem 0;
	font-size: 0.9375rem;
	border: 0;
	border-top: 1px solid var(--ps-line);
	background: transparent;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot th {
	font-weight: 400;
	color: var(--ps-muted);
	text-align: left;
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot td {
	text-align: right;
	color: var(--ps-ink);
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot tr.order-total th {
	font-weight: 500;
	color: var(--ps-navy);
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot tr.order-total td {
	font-weight: 700;
	font-size: 1.25rem;
	color: var(--ps-blue);
}
.woocommerce-checkout .woocommerce-checkout-review-order-table tfoot tr.cart-discount td {
	color: var(--ps-blue);
}

/* payment box */
.woocommerce-checkout #payment {
	background: transparent;
	border: 0;
	border-radius: 0;
}
.woocommerce-checkout #payment ul.wc_payment_methods {
	margin: 0 0 1.25rem;
	padding: 0;
	list-style: none;
	border: 1px solid var(--ps-line);
}
.woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method {
	padding: 0;
	border-bottom: 1px solid var(--ps-line);
}
.woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method:last-child {
	border-bottom: 0;
}
.woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method > label {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.9rem 1rem;
	margin: 0;
	font-size: 0.9375rem;
	font-weight: 500;
	color: var(--ps-navy);
	cursor: pointer;
}
.woocommerce-checkout #payment ul.wc_payment_methods li.wc_payment_method input[type="radio"] {
	accent-color: var(--ps-blue);
	width: 18px;
	height: 18px;
}
.woocommerce-checkout #payment div.payment_box {
	background: var(--ps-wash);
	border-radius: 0;
	margin: 0;
	padding: 1rem;
	font-size: 0.8125rem;
	color: var(--ps-muted);
}
.woocommerce-checkout #payment div.payment_box::before {
	display: none;
}

/* terms + place order */
.woocommerce-checkout #payment .place-order,
.woocommerce-checkout .form-row.place-order {
	padding: 1.25rem 0 0;
	margin: 0;
}
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper {
	margin: 0 0 1.1rem;
	font-size: 0.8125rem;
	color: var(--ps-muted);
}
.woocommerce-checkout .woocommerce-terms-and-conditions {
	border: 1px solid var(--ps-line);
	background: var(--ps-wash);
	border-radius: 0;
	box-shadow: none;
}
.woocommerce-checkout p.form-row.validate-required label.checkbox,
.woocommerce-checkout .woocommerce-form__label-for-checkbox {
	display: flex;
	align-items: flex-start;
	gap: 0.5rem;
	font-size: 0.8125rem;
	color: var(--ps-ink);
	font-weight: 400;
}
.woocommerce-checkout .woocommerce-form__input-checkbox {
	width: 18px;
	height: 18px;
	margin-top: 1px;
	accent-color: var(--ps-blue);
}

/* --------------------------------------------------------------------------
   5 · Buttons — map every Woo .button to the brand primary (square, flat).
   -------------------------------------------------------------------------- */
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
.woocommerce-checkout #place_order,
.woocommerce-cart td.actions button[name="apply_coupon"],
.woocommerce-cart td.actions button[name="update_cart"],
.woocommerce-checkout form.checkout_coupon button[type="submit"],
.woocommerce-checkout form.login button[type="submit"] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-family: var(--ps-font);
	font-weight: 500;
	letter-spacing: -0.01em;
	line-height: 1;
	border: 1px solid var(--ps-blue);
	border-radius: 0;
	background: var(--ps-blue);
	color: #fff;
	cursor: pointer;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
	text-shadow: none;
}
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover,
.woocommerce-checkout #place_order:hover,
.woocommerce-cart td.actions button[name="apply_coupon"]:hover,
.woocommerce-checkout form.checkout_coupon button[type="submit"]:hover,
.woocommerce-checkout form.login button[type="submit"]:hover {
	background: var(--ps-blue-deep);
	border-color: var(--ps-blue-deep);
	color: #fff;
}

/* primary full-width CTAs */
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
.woocommerce-checkout #place_order {
	width: 100%;
	padding: 1rem 1.5rem;
	font-size: 1rem;
	font-weight: 700;
}

/* coupon apply / login submit — compact primary */
.woocommerce-cart td.actions button[name="apply_coupon"],
.woocommerce-checkout form.checkout_coupon button[type="submit"],
.woocommerce-checkout form.login button[type="submit"] {
	height: 44px;
	padding: 0 1.25rem;
	font-size: 0.875rem;
}

/* update cart — secondary/ghost, pushed to the row's right edge */
.woocommerce-cart td.actions button[name="update_cart"] {
	background: transparent;
	color: var(--ps-ink);
	border: 1px solid var(--ps-line-2);
	height: 44px;
	padding: 0 1.25rem;
	font-size: 0.875rem;
	float: right;
}
.woocommerce-cart td.actions button[name="update_cart"]:hover {
	background: var(--ps-wash);
	border-color: var(--ps-ink);
	color: var(--ps-ink);
}
.woocommerce-cart td.actions button[name="update_cart"]:disabled,
.woocommerce-cart td.actions button[name="update_cart"][disabled] {
	opacity: 0.5;
	cursor: default;
}

/* --------------------------------------------------------------------------
   6 · Responsive.
   -------------------------------------------------------------------------- */

/* tablet / narrow desktop — collapse to a single column */
@media (max-width: 980px) {
	.ps-cart-layout {
		grid-template-columns: 1fr;
	}
	.woocommerce-cart .ps-cart-main,
	.woocommerce-cart .cart-collaterals {
		grid-column: 1;
	}
	.woocommerce-cart .cart_totals {
		position: static;
	}
	.ps-steps {
		max-width: 100%;
	}
	.woocommerce-checkout form.checkout.woocommerce-checkout {
		grid-template-columns: 1fr;
		grid-template-areas:
			"details"
			"heading"
			"review";
	}
	.woocommerce-checkout #order_review {
		position: static;
	}
	.woocommerce-checkout #order_review_heading {
		margin-top: 0.5rem;
	}
}

/* phone — stack cart rows into cards. Woo's woocommerce-smallscreen.css owns
   this breakpoint with !important rules (right-align every td, hide the
   thumbnail, zebra-stripe rows) — each is explicitly overridden below. */
/* phone + tablet — Woo's woocommerce-smallscreen.css activates at ≤768px
   (data-title ::before labels, zebra rows, forced right-align on every td). We
   suppress those and switch the line-items + summary to the mobile layout across
   the whole range Woo touches, so 601–768px is not left half-styled. */
@media (max-width: 768px) {
	/* kill Woo smallscreen forced right-align + zebra on the items table */
	.woocommerce-cart table.cart.shop_table_responsive tr td {
		text-align: left !important;
		background: transparent !important;
	}
	.woocommerce-cart table.cart td::before {
		display: none !important;
	}
	.woocommerce-cart table.cart td.product-thumbnail {
		display: block !important;
	}

	/* masthead + section headings */
	.woocommerce-cart .ps-cart-head .ps-page-head-title {
		font-size: 1.5rem;
	}
	.woocommerce-cart .ps-cart-head .ps-breadcrumb {
		flex-wrap: wrap;
	}
	.ps-cart-progress__title,
	.ps-cart-items__title,
	.ps-upsell__title,
	.ps-cart-ruo__title {
		font-size: 1.0625rem;
	}

	/* line items — thumb + name on top, stepper + price block below */
	.woocommerce-cart table.cart tr.woocommerce-cart-form__cart-item {
		grid-template-columns: 64px minmax(0, 1fr) auto;
		grid-template-areas:
			"thumb name     name"
			"qty   qty      subtotal"
			"qty   qty      price";
		column-gap: 0.9rem;
		row-gap: 0.3rem;
		padding: 1.25rem;
	}
	.woocommerce-cart td.product-thumbnail,
	.woocommerce-cart td.product-thumbnail a,
	.woocommerce-cart td.product-thumbnail img {
		width: 64px;
		height: 64px;
	}
	.woocommerce-cart td.product-thumbnail {
		align-self: start;
	}
	.woocommerce-cart table.cart td.product-name {
		align-self: start;
	}
	.woocommerce-cart td.product-quantity {
		justify-self: start;
		align-self: center;
		margin-top: 0.6rem;
	}
	.woocommerce-cart td.product-subtotal {
		align-self: end;
		margin-top: 0.6rem;
		text-align: right !important;
	}
	.woocommerce-cart td.product-price {
		align-self: start;
		text-align: right !important;
	}
	/* re-show the unit-price label (the generic td::before hide above + Woo's
	   data-title ::before both need overriding at this breakpoint). */
	.woocommerce-cart table.cart td.product-price::before {
		display: inline !important;
		content: "Unit:\00a0" !important;
	}

	/* summary totals — keep as a real 2-col table (Woo blocks + zebra + labels it) */
	.woocommerce-cart .cart_totals table.shop_table tr {
		display: table-row;
	}
	.woocommerce-cart .cart_totals table.shop_table th,
	.woocommerce-cart .cart_totals table.shop_table td {
		display: table-cell;
	}
	.woocommerce-cart .cart_totals table.shop_table td::before {
		display: none !important;
	}
	.woocommerce-cart .cart_totals table.shop_table tr td {
		background: transparent !important;
		text-align: right !important;
	}
	.woocommerce-cart .cart_totals table.shop_table tr th {
		background: transparent !important;
		text-align: left !important;
	}

	/* upsell — two per row */
	.ps-upsell__grid {
		grid-template-columns: repeat(2, 1fr);
	}

	/* RUO band */
	.ps-cart-ruo {
		padding: 1.5rem 1.25rem;
	}
}

/* phone — page title + checkout column padding */
@media (max-width: 600px) {
	.woocommerce-cart .ps-page-title,
	.woocommerce-checkout .ps-page-title {
		font-size: 1.5rem;
	}

	/* step rail — numbers only on phones (the labels fit fine on tablet ≥601) */
	.ps-step__label {
		display: none;
	}
	.ps-step__sep {
		margin: 0 0.6rem;
		min-width: 16px;
	}

	.woocommerce-checkout .woocommerce-billing-fields,
	.woocommerce-checkout .woocommerce-shipping-fields,
	.woocommerce-checkout .woocommerce-additional-fields,
	.woocommerce-checkout #order_review {
		padding: 1.25rem;
	}

	/* stack first/last name on phones so the labels don't wrap in a tight column */
	.woocommerce-checkout .woocommerce-billing-fields__field-wrapper {
		grid-template-columns: 1fr;
	}
	.woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .form-row.form-row-first,
	.woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .form-row.form-row-last {
		grid-column: 1 / -1;
	}
}