/* WUB Shop — the storefront layer.
 *
 * Every colour and font resolves to an Elementor Site Settings global
 * (--e-global-*), so changing a global in the kit changes the shop too.
 * The design's token names are kept as aliases so the rules below read like
 * the handoff's styles.css.
 *
 * Specificity: the kit paints `.elementor-kit-4 button` (0,1,1) and inputs
 * at (0,3,1); WooCommerce's buttons reach (0,3,1). Rules here start from
 * `body.wub-shop` and double a component class where they must win —
 * never !important.
 */

body.wub-shop {
	--wub-cream: var(--e-global-color-wcream, #f5ead8);
	--wub-sand: var(--e-global-color-wsand, #ebddc5);
	--wub-ink: var(--e-global-color-text, #201e1d);
	--wub-blue-100: var(--e-global-color-wbl100, #e9f4f6);
	--wub-blue-200: var(--e-global-color-wbl200, #cfe7ec);
	--wub-blue-300: var(--e-global-color-wbl300, #a4d0da);
	--wub-blue-500: var(--e-global-color-wbl500, #3f8b9d);
	--wub-blue-600: var(--e-global-color-primary, #2f7386);
	--wub-blue-700: var(--e-global-color-accent, #245c6c);
	--wub-blue-800: var(--e-global-color-wbl800, #1a4351);
	--wub-blue-900: var(--e-global-color-wbl900, #122d37);
	--wub-clay-100: var(--e-global-color-wcl100, #fff2eb);
	--wub-clay-200: var(--e-global-color-wcl200, #ffe1d0);
	--wub-clay-300: var(--e-global-color-wcl300, #ffc6a5);
	--wub-clay-500: var(--e-global-color-secondary, #d67f48);
	--wub-clay-600: var(--e-global-color-wcl600, #b2622d);
	--wub-clay-700: var(--e-global-color-wcl700, #8c491a);
	--wub-clay-800: var(--e-global-color-wcl800, #643312);
	--wub-neutral-100: var(--e-global-color-wondrk, #faf6ee);
	--wub-neutral-200: var(--e-global-color-wnt200, #efe8db);
	--wub-neutral-300: var(--e-global-color-wnt300, #ded5c4);
	--wub-neutral-700: var(--e-global-color-wmuted, #57524a);
	--wub-neutral-800: var(--e-global-color-wnt800, #3c3934);

	--color-bg: var(--wub-cream);
	--color-surface: var(--wub-sand);
	--color-surface-raised: var(--e-global-color-wraise, #fdf7ec);
	--color-text: var(--wub-ink);
	--color-text-muted: var(--wub-neutral-700);
	--color-accent: var(--wub-blue-600);
	--color-accent-hover: var(--wub-blue-500);
	--color-accent-press: var(--wub-blue-700);
	--color-accent-text: var(--wub-blue-700);
	--color-accent-tint: var(--wub-blue-100);
	--color-accent-2: var(--wub-clay-500);
	--color-accent-2-text: var(--wub-clay-700);
	--color-accent-2-tint: var(--wub-clay-100);
	--color-ink-deep: var(--wub-blue-900);
	--color-divider: var(--e-global-color-wdivid, rgba(32, 30, 29, 0.16));

	--font-display: var(--e-global-typography-primary-font-family, "Caprasimo"), Georgia, serif;
	--font-body: var(--e-global-typography-text-font-family, "Figtree"), system-ui, sans-serif;
	--text-h1: var(--e-global-typography-wh1-font-size, 56px);
	--text-h2: var(--e-global-typography-wh2-font-size, 38px);
	--text-h3: var(--e-global-typography-wh3-font-size, 28px);
	--text-h4: var(--e-global-typography-wh4-font-size, 22px);
	--text-lead: var(--e-global-typography-wlead-font-size, 19px);
	--text-small: 14px;
	--text-micro: 12px;

	--space-1: 4px; --space-2: 9px; --space-3: 13px; --space-4: 18px; --space-5: 22px;
	--space-6: 26px; --space-8: 35px; --space-10: 44px; --space-12: 53px; --space-16: 70px;
	/* Content lines up with the header and every Elementor page: the kit's
	   content width (written over this from Elementor's setting), plus the gutters. */
	--content-max: 1200px;
	--page-gutter: var(--space-8);
	--page-max: calc(var(--content-max) + 2 * var(--page-gutter));
	--radius-sm: 8px; --radius-md: 12px; --radius-lg: 18px; --radius-xl: 26px; --radius-pill: 999px;
	--shadow-sm: 0 1px 2px rgba(74, 58, 34, 0.12);
	--shadow-md: 0 4px 12px rgba(74, 58, 34, 0.14);
	--shadow-lg: 0 14px 34px rgba(74, 58, 34, 0.18);
	--ease-soft: cubic-bezier(0.32, 0.72, 0.28, 1);
}

/* ── page frame (cart, checkout, account — Hello's page template) ───────── */

body.wub-shop main.site-main {
	max-width: var(--page-max);
	margin-inline: auto;
	padding: var(--space-10) var(--page-gutter) var(--space-16);
	box-sizing: border-box;
	width: 100%;
}
body.wub-shop .page-content > .woocommerce { margin: 0; }

body.wub-shop .wub-page-title {
	font-family: var(--font-display);
	font-weight: 400;
	font-size: var(--text-h2);
	line-height: 1.1;
	color: var(--color-text);
	margin: 0 0 var(--space-6);
}
body.wub-shop .wub-section-title,
body.wub-shop .wub-totals__title,
body.wub-shop .wub-card .wub-card__title,
body.wub-shop .wub-cards__title {
	font-family: var(--font-display);
	font-weight: 400;
	font-size: var(--text-h4);
	line-height: 1.2;
	color: var(--color-text);
	margin: 0 0 var(--space-4);
}
body.wub-shop .wub-muted { color: var(--color-text-muted); font-size: var(--text-small); margin: 0; }
body.wub-shop .wub-lead { font-size: var(--text-lead); margin: 0 0 var(--space-5); }
body.wub-shop .wub-kicker {
	font-family: var(--font-display);
	font-size: 13px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--color-accent-text);
	margin: 0 0 var(--space-4);
}
body.wub-shop .wub-row { display: flex; gap: var(--space-2); flex-wrap: wrap; align-items: center; }
body.wub-shop .is-end { text-align: right; }
body.wub-shop .wub-hidden-field { display: none; }

/* ── buttons ────────────────────────────────────────────────────────────── */

body.wub-shop .wub-btn.wub-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
	font-family: var(--font-body); font-size: var(--text-small); font-weight: 600; line-height: 1.2;
	padding: 10px 20px; border: 1px solid transparent; border-radius: var(--radius-pill);
	cursor: pointer; text-decoration: none; white-space: nowrap;
	background: var(--color-accent); color: #fff;
	transition: background 120ms var(--ease-soft), color 120ms var(--ease-soft), border-color 120ms var(--ease-soft);
}
body.wub-shop .wub-btn.wub-btn:hover { text-decoration: none; }
body.wub-shop .wub-btn.wub-btn:disabled,
body.wub-shop .wub-btn.wub-btn.disabled { opacity: 0.45; cursor: not-allowed; }
body.wub-shop .wub-btn--lg.wub-btn--lg { font-size: 16px; padding: 13px 26px; }
body.wub-shop .wub-btn--sm.wub-btn--sm { font-size: var(--text-micro); padding: 7px 14px; }
body.wub-shop .wub-btn--block.wub-btn--block { width: 100%; }

body.wub-shop .wub-btn--primary.wub-btn--primary { background: var(--color-accent); color: #fff; }
body.wub-shop .wub-btn--primary.wub-btn--primary:hover { background: var(--color-accent-hover); color: #fff; }
body.wub-shop .wub-btn--secondary.wub-btn--secondary { background: transparent; color: var(--color-text); border-color: var(--color-divider); }
body.wub-shop .wub-btn--secondary.wub-btn--secondary:hover { background: rgba(47, 115, 134, 0.1); border-color: var(--color-accent); color: var(--color-accent-text); }
body.wub-shop .wub-btn--ghost.wub-btn--ghost { background: transparent; color: var(--color-accent-text); padding-inline: var(--space-3); border-color: transparent; }
body.wub-shop .wub-btn--ghost.wub-btn--ghost:hover { background: rgba(47, 115, 134, 0.1); }
body.wub-shop .wub-btn--inverse.wub-btn--inverse { background: var(--wub-neutral-100); color: var(--color-ink-deep); }
body.wub-shop .wub-btn--inverse.wub-btn--inverse:hover { background: #fff; }
body.wub-shop .wub-btn--outline-inverse.wub-btn--outline-inverse { background: transparent; color: var(--wub-neutral-100); border-color: rgba(255, 255, 255, 0.55); }
body.wub-shop .wub-btn--outline-inverse.wub-btn--outline-inverse:hover { background: rgba(255, 255, 255, 0.14); color: #fff; }

/* The money button: clay, one per page. */
body.wub-shop .ec-btn-go.ec-btn-go,
body.wub-shop #place_order.ec-btn-go {
	background: var(--wub-clay-700); color: #fff; border-color: transparent;
}
body.wub-shop .ec-btn-go.ec-btn-go:hover,
body.wub-shop #place_order.ec-btn-go:hover { background: var(--wub-clay-600); color: #fff; }
body.wub-shop .ec-btn-go.ec-btn-go:active,
body.wub-shop #place_order.ec-btn-go:active { background: var(--wub-clay-800); }
body.wub-shop #place_order.ec-btn-go {
	width: 100%; font-family: var(--font-body); font-size: 16px; font-weight: 600;
	padding: 14px 26px; border-radius: var(--radius-pill); float: none; margin: 0;
}

/* ── tags ───────────────────────────────────────────────────────────────── */

body.wub-shop .wub-tag {
	display: inline-flex; align-items: center; gap: 6px;
	font-size: var(--text-micro); font-weight: 600; letter-spacing: 0.02em; line-height: 1.4;
	padding: 4px 12px; border-radius: var(--radius-pill); white-space: nowrap;
}
body.wub-shop .wub-tag--blue { background: var(--color-accent-tint); color: var(--wub-blue-800); }
body.wub-shop .wub-tag--clay { background: var(--color-accent-2-tint); color: var(--wub-clay-800); }
body.wub-shop .wub-tag--neutral { background: var(--wub-neutral-200); color: var(--wub-neutral-800); }

/* ── cards ──────────────────────────────────────────────────────────────── */

body.wub-shop .wub-card {
	display: flex; flex-direction: column; gap: var(--space-2);
	background: var(--color-surface); border-radius: var(--radius-xl);
	padding: var(--space-6); box-sizing: border-box;
}
body.wub-shop .wub-card--raised { background: var(--color-surface-raised); box-shadow: var(--shadow-sm); }
body.wub-shop .wub-card--dark { background: var(--wub-blue-800); color: var(--wub-neutral-100); }
body.wub-shop .wub-card p { margin: 0; }
body.wub-shop .wub-card .wub-card__title { margin-bottom: var(--space-2); }
body.wub-shop .wub-card__kicker {
	font-family: var(--font-display); font-size: 13px; letter-spacing: 0.12em; text-transform: uppercase;
	color: var(--color-accent-text); margin: 0;
}
body.wub-shop .wub-card__meta { font-size: var(--text-small); color: var(--color-text-muted); margin: var(--space-3) 0 0; }
/* The terms line under Place order needs more room than a card's usual meta line. */
body.wub-shop #place_order ~ .wub-card__meta { margin-top: var(--space-5); }
body.wub-shop .wub-card__actions { margin-top: auto; padding-top: var(--space-3); }

/* ── notices: success blue, problem clay, info neutral — no red ─────────── */

body.wub-shop .woocommerce-message,
body.wub-shop .woocommerce-info,
body.wub-shop .woocommerce-error,
body.wub-shop .ec-notice {
	display: block; overflow: hidden;
	padding: var(--space-3) var(--space-4); margin: 0 0 var(--space-6);
	border-radius: var(--radius-md); border: 1px solid transparent; border-top-width: 1px;
	font-size: var(--text-small); line-height: 1.5; list-style: none;
}
body.wub-shop .woocommerce-message::before,
body.wub-shop .woocommerce-info::before,
body.wub-shop .woocommerce-error::before { content: none; display: none; }
body.wub-shop .woocommerce-message,
body.wub-shop .ec-notice--ok { background: var(--color-accent-tint); border-color: var(--wub-blue-300); color: var(--wub-blue-800); }
body.wub-shop .woocommerce-error,
body.wub-shop .ec-notice--warn { background: var(--color-accent-2-tint); border-color: var(--wub-clay-300); color: var(--wub-clay-800); }
body.wub-shop .woocommerce-info,
body.wub-shop .ec-notice--info { background: var(--wub-neutral-200); border-color: var(--wub-neutral-300); color: var(--wub-neutral-800); }
body.wub-shop .woocommerce-error { display: block; }
body.wub-shop .woocommerce-error li { margin: 0; padding: 2px 0; }
body.wub-shop .woocommerce-message .button,
body.wub-shop .woocommerce-info .button {
	float: right; margin: -3px 0 -3px var(--space-3);
	background: transparent; color: var(--color-accent-text); border: 1px solid currentColor;
	border-radius: var(--radius-pill); padding: 6px 14px; font-size: var(--text-micro); font-weight: 600;
}
/* A notice with a button: WooCommerce prints the button first and floats it, so the
   text wrapped around it. Text left, button right; stacked under the text on a phone.
   !important: My Account HQ restyles every .button on account pages with !important. */
body.wub-shop .woocommerce-message:has(> .button),
body.wub-shop .woocommerce-info:has(> .button) {
	display: flex; flex-direction: row-reverse; justify-content: space-between; align-items: center; gap: var(--space-3);
}
body.wub-shop .woocommerce-message > .button,
body.wub-shop .woocommerce-info > .button {
	flex: none; float: none !important; margin: 0 !important;
	background: transparent !important; color: var(--color-accent-text) !important;
	border: 1px solid currentColor !important; border-radius: var(--radius-pill) !important;
	padding: 6px 14px !important; font-size: var(--text-micro) !important;
}
/* WooCommerce's clearfix ::after would be a third flex item and push the text to the middle. */
body.wub-shop .woocommerce-message:has(> .button)::after,
body.wub-shop .woocommerce-info:has(> .button)::after { content: none; display: none; }
@media (max-width: 600px) {
	body.wub-shop .woocommerce-message:has(> .button),
	body.wub-shop .woocommerce-info:has(> .button) { flex-direction: column-reverse; align-items: flex-start; }
}
body.wub-shop .woocommerce-message a:not(.button),
body.wub-shop .woocommerce-info a:not(.button) { color: inherit; text-decoration: underline; text-underline-offset: 3px; }

/* ── quantity stepper ───────────────────────────────────────────────────── */

body.wub-shop .quantity.ec-qty {
	display: inline-flex; align-items: center; margin: 0;
	border: 1px solid var(--color-divider); border-radius: var(--radius-pill);
	background: var(--color-surface-raised); overflow: hidden; height: 42px;
}
body.wub-shop .quantity.ec-qty .ec-qty__btn {
	width: 38px; height: 40px; border: 0; padding: 0; margin: 0; border-radius: 0;
	background: transparent; color: var(--color-text); font: 500 16px/1 var(--font-body); cursor: pointer;
}
body.wub-shop .quantity.ec-qty .ec-qty__btn:hover:not(:disabled) { background: rgba(47, 115, 134, 0.1); }
body.wub-shop .quantity.ec-qty .ec-qty__btn:disabled { opacity: 0.35; cursor: default; }
body.wub-shop .quantity.ec-qty input.qty.qty {
	width: 30px; min-width: 30px; height: 40px; padding: 0; margin: 0;
	border: 0; border-radius: 0; background: transparent; box-shadow: none;
	text-align: center; font: 600 var(--text-small) var(--font-body); color: var(--color-text);
	-moz-appearance: textfield; appearance: textfield;
}
body.wub-shop .quantity.ec-qty input.qty::-webkit-outer-spin-button,
body.wub-shop .quantity.ec-qty input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* ── two-column pages ───────────────────────────────────────────────────── */

body.wub-shop .ec-checkout {
	display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
	gap: var(--space-8); align-items: start;
}
body.wub-shop .ec-checkout > aside,
body.wub-shop .ec-checkout > .wub-summary-col,
body.wub-shop .ec-checkout > .cart-collaterals,
body.wub-shop .wub-received__side { position: sticky; top: var(--space-4); }
body.wub-shop .ec-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-6); align-items: start; }

/* ── cart ───────────────────────────────────────────────────────────────── */

body.wub-shop .ec-cartrow {
	display: grid; grid-template-columns: 76px minmax(0, 1fr) 96px 120px 90px 28px;
	gap: var(--space-4); align-items: center;
	padding: var(--space-4) 0; border-top: 1px solid var(--color-divider);
	font-size: var(--text-small);
}
body.wub-shop .ec-cartrow:last-child { border-bottom: 1px solid var(--color-divider); }
body.wub-shop .ec-carthead {
	border-top: 0; padding: 0 0 var(--space-2);
	font-size: var(--text-micro); text-transform: uppercase; letter-spacing: 0.06em; color: var(--color-text-muted);
}
body.wub-shop .ec-cartrow .product-thumbnail img {
	display: block; width: 76px; height: 76px; object-fit: cover;
	border-radius: var(--radius-sm); background: var(--wub-neutral-300);
}
body.wub-shop .wub-cart__name { margin: 0; font-weight: 600; font-size: 16px; }
body.wub-shop .wub-cart__name a { color: var(--color-text); text-decoration: none; }
body.wub-shop .wub-cart__name a:hover { color: var(--color-accent-text); }
body.wub-shop .wub-cart__sub { margin: 2px 0 0; color: var(--color-text-muted); }
body.wub-shop .ec-cartrow .product-subtotal { text-align: right; font-weight: 600; font-size: 16px; }
/* WooCommerce paints a.remove red with !important — the one place this file
   has to answer in kind, because the design allows no red anywhere. */
body.wub-shop .ec-cartrow .product-remove a.remove.remove {
	display: grid; place-items: center; width: 28px; height: 28px;
	border-radius: 50%; font-size: 16px; font-weight: 400; background: transparent;
	color: var(--color-text) !important;
}
body.wub-shop .ec-cartrow .product-remove a.remove.remove:hover { background: var(--color-accent-2-tint) !important; color: var(--wub-clay-800) !important; }

body.wub-shop .wub-cart__actions {
	display: flex; gap: var(--space-3); flex-wrap: wrap; align-items: center; margin-top: var(--space-6);
}
body.wub-shop .wub-cart__actions .coupon { display: flex; gap: var(--space-3); flex: 1 1 320px; }
body.wub-shop .wub-cart__actions .coupon input#coupon_code.wub-input { flex: 1 1 auto; width: auto; min-width: 0; }
body.wub-shop .wub-update-cart { display: none; }

/* Inputs — the pill. Kit's own input rule is (0,3,1). */
body.wub-shop .woocommerce .wub-input.wub-input,
body.wub-shop form .form-row .input-text.input-text,
body.wub-shop form .form-row select,
body.wub-shop .wpsess-credit-form input:not([type="radio"]),
body.wub-shop .wpsess-credit-form textarea {
	width: 100%; min-height: 44px; box-sizing: border-box;
	padding: 10px 16px; font: 400 var(--text-small) var(--font-body); color: var(--color-text);
	background: var(--color-surface-raised); border: 1px solid var(--color-divider);
	border-radius: var(--radius-pill); box-shadow: none;
}
body.wub-shop form .form-row textarea.input-text.input-text,
body.wub-shop .wpsess-credit-form textarea { min-height: 110px; border-radius: var(--radius-lg); resize: vertical; }
body.wub-shop form .form-row .input-text.input-text:focus,
body.wub-shop .woocommerce .wub-input.wub-input:focus,
body.wub-shop .wpsess-credit-form input:focus,
body.wub-shop .wpsess-credit-form textarea:focus { border-color: var(--color-accent); outline: 2px solid var(--wub-blue-500); outline-offset: 0; }

/* WooCommerce floats the totals box at 48% — it has its own column here. */
body.wub-shop .cart-collaterals .cart_totals.cart_totals { width: auto; float: none; }
body.wub-shop .cart-collaterals { width: auto; }

/* Totals card. */
body.wub-shop .wub-totals .wub-totals__title { margin-bottom: var(--space-2); }
body.wub-shop .ec-line {
	display: flex; justify-content: space-between; gap: var(--space-4);
	font-size: var(--text-small); padding: 7px 0;
}
body.wub-shop .ec-line--discount { color: var(--color-accent-2-text); }
body.wub-shop .ec-line--discount a { color: inherit; font-size: var(--text-micro); }
body.wub-shop .ec-line--total {
	font-family: var(--font-display); font-size: var(--text-h4);
	border-top: 1px solid var(--color-divider); margin-top: var(--space-2); padding-top: var(--space-4);
}
body.wub-shop .ec-line--total .woocommerce-Price-amount { font-family: var(--font-display); }
body.wub-shop .ec-line--total small { display: none; }
body.wub-shop .wc-proceed-to-checkout { padding: var(--space-4) 0 0; }
body.wub-shop .wc-proceed-to-checkout a.checkout-button { margin: 0; }

/* Empty cart. */
body.wub-shop .wub-empty { position: relative; overflow: hidden; }
body.wub-shop .wub-empty__blob { position: absolute; width: 260px; height: 260px; background: var(--wub-blue-200); top: -80px; right: -70px; opacity: 0.6; }
body.wub-shop .wub-empty__intro { position: relative; z-index: 1; text-align: center; padding: var(--space-10) 0 var(--space-8); }
body.wub-shop .wub-empty__intro .wub-lead { max-width: 52ch; margin-inline: auto; margin-bottom: var(--space-6); }
body.wub-shop .wub-empty__actions { display: flex; gap: var(--space-3); justify-content: center; flex-wrap: wrap; }
body.wub-shop .wub-empty__row { position: relative; z-index: 1; border-top: 1px solid var(--color-divider); padding-top: var(--space-6); }

/* ── product cards (shop, upsells, featured row) ────────────────────────── */

body.wub-shop ul.products.products {
	display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-4);
	margin: 0; padding: 0;
}
body.wub-shop ul.products::before,
body.wub-shop ul.products::after { content: none; display: none; }
body.wub-shop ul.products li.product.product {
	width: auto; float: none; margin: 0; padding: 0;
	background: var(--color-surface-raised); border-radius: var(--radius-xl);
	box-shadow: var(--shadow-sm); overflow: hidden; display: flex; flex-direction: column;
}
body.wub-shop ul.products li.product a img {
	aspect-ratio: 1 / 1; object-fit: cover; margin: 0; border-radius: 0; background: var(--wub-neutral-300);
}
body.wub-shop ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--font-body); font-weight: 600; font-size: var(--text-small);
	color: var(--color-text); padding: var(--space-4) var(--space-4) 2px; margin: 0;
}
body.wub-shop ul.products li.product .price {
	display: block; padding: 0 var(--space-4) var(--space-4); margin: 0;
	font-size: var(--text-small); color: var(--color-accent-text);
}
body.wub-shop ul.products li.product .button,
body.wub-shop ul.products li.product .added_to_cart { display: none; }
body.wub-shop ul.products li.product .onsale { display: none; }
body.wub-shop .up-sells > h2,
body.wub-shop .related > h2 {
	font-family: var(--font-display); font-weight: 400; font-size: var(--text-h4); margin: 0 0 var(--space-6);
}

/* Shop listing: count and sort. */
body.wub-shop .woocommerce-result-count { font-size: var(--text-small); color: var(--color-text-muted); }
body.wub-shop .woocommerce-ordering select.orderby {
	min-height: 40px; padding: 8px 36px 8px 16px; border: 1px solid var(--color-divider); border-radius: var(--radius-pill);
	background-color: var(--color-surface-raised); font: 600 var(--text-small) var(--font-body); color: var(--color-text);
}

/* ── category pages (design "WUB Product Category", 2026-10-22) ─────────────
   Scoped to archives so the cart's "While you're here" row keeps its small cards. */

body.wub-shop .woocommerce-breadcrumb {
	display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 var(--space-2);
	font-size: var(--text-small); color: var(--color-text-muted); margin: 0 0 var(--space-4);
}
/* Woo's clearfix ::before/::after would be flex items and push "Home" in by a gap. */
body.wub-shop .woocommerce-breadcrumb::before,
body.wub-shop .woocommerce-breadcrumb::after { content: none; display: none; }
body.wub-shop .woocommerce-breadcrumb a { color: var(--color-text-muted); }
body.wub-shop .woocommerce-breadcrumb a:hover { color: var(--color-accent-text); }
body.wub-shop .woocommerce-breadcrumb .wub-crumb:last-child { color: var(--color-text); }

body.wub-shop.archive .woocommerce-products-header { margin: 0; }
body.wub-shop.archive .woocommerce-products-header__title { margin: 0 0 var(--space-3); }
body.wub-shop.archive .term-description { margin: 0 0 var(--space-6); }
body.wub-shop.archive .term-description p { font-size: var(--text-lead); line-height: 1.5; margin: 0; text-wrap: pretty; }

body.wub-shop .wub-catalog-bar {
	display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); flex-wrap: wrap;
	padding: var(--space-4) 0; border-top: 1px solid var(--color-divider); margin: 0 0 var(--space-8);
}
body.wub-shop .wub-catalog-bar .woocommerce-result-count,
body.wub-shop .wub-catalog-bar .woocommerce-ordering { float: none; margin: 0; }
body.wub-shop .wub-catalog-bar .woocommerce-ordering { display: flex; align-items: center; gap: var(--space-3); }
body.wub-shop .wub-catalog-bar .woocommerce-ordering label { font-size: var(--text-small); color: var(--color-text-muted); margin: 0; white-space: nowrap; }
body.wub-shop .wub-catalog-bar .woocommerce-ordering select.orderby { min-width: 200px; }

body.wub-shop.archive ul.products.products { gap: var(--space-6) var(--space-4); }
body.wub-shop.archive ul.products li.product.product { transition: transform var(--dur-base, 200ms) var(--ease-soft, ease); }
body.wub-shop.archive ul.products li.product.product:hover { transform: translateY(-3px); }
body.wub-shop.archive ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--font-display); font-weight: 400; font-size: var(--text-h4); line-height: 1.15;
	padding: var(--space-6) var(--space-6) var(--space-1); text-wrap: pretty;
}
body.wub-shop.archive ul.products li.product .price {
	font-size: var(--text-body, 16px); font-weight: 600; padding: 0 var(--space-6) var(--space-6);
}

@media (max-width: 520px) {
	body.wub-shop.archive ul.products.products { grid-template-columns: minmax(0, 1fr); }
}

/* ── product page pieces (shortcodes in the Elementor template) ─────────── */

body.wub-shop .wub-badges { display: flex; gap: var(--space-2); flex-wrap: wrap; }
body.wub-shop .wub-stock { font-size: var(--text-small); margin: 0; }
body.wub-shop .ec-scarce { color: var(--color-accent-2-text); font-weight: 600; }
body.wub-shop .wub-note--box {
	padding: var(--space-3) var(--space-4); border-radius: var(--radius-md);
	background: var(--wub-neutral-200); border: 1px solid var(--wub-neutral-300);
	color: var(--wub-neutral-800); font-size: var(--text-small);
}
body.wub-shop .wub-note--plain { font-size: var(--text-small); color: var(--color-text-muted); margin: 0; }
body.wub-shop .wub-files {
	background: var(--color-surface); border-radius: var(--radius-lg); padding: var(--space-4);
}
body.wub-shop .wub-files__title { font-weight: 700; font-size: var(--text-small); margin: 0 0 var(--space-2); }
body.wub-shop .wub-files ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
body.wub-shop .wub-files li {
	display: flex; justify-content: space-between; gap: var(--space-4);
	font: 13px/1.6 ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--wub-neutral-800);
}
body.wub-shop .wub-specs { margin: 0; border-top: 1px solid var(--color-divider); padding-top: var(--space-4); display: grid; gap: 6px; font-size: var(--text-small); }
body.wub-shop .wub-specs > div { display: flex; justify-content: space-between; gap: var(--space-4); }
body.wub-shop .wub-specs dt { color: var(--color-text-muted); font-weight: 400; margin: 0; }
body.wub-shop .wub-specs dd { margin: 0; text-align: right; }

/* Add to cart row: stepper beside a full-width button. */
body.wub-shop form.cart:not(.variations_form),
body.wub-shop .woocommerce-variation-add-to-cart {
	display: flex; gap: var(--space-3); align-items: center; flex-wrap: wrap; margin: 0;
}
body.wub-shop form.cart .single_add_to_cart_button.single_add_to_cart_button {
	flex: 1 1 200px; float: none; margin: 0;
	font-family: var(--font-body); font-size: 16px; font-weight: 600;
	padding: 13px 26px; border-radius: var(--radius-pill); border: 0;
	background: var(--color-accent); color: #fff;
}
body.wub-shop form.cart .single_add_to_cart_button.single_add_to_cart_button:hover { background: var(--color-accent-hover); }
body.wub-shop form.cart .single_add_to_cart_button.disabled { opacity: 0.45; }
body.wub-shop form.cart .quantity.ec-qty { float: none; margin: 0; }

/* Elementor Pro's Add to Cart widget forces form.cart into ONE row that never wraps
   (flex-wrap: nowrap, specificity 0,6,2). Once Google Pay arrived — Apple Pay will
   too — that squeezed the form into a column. These outrank it (0,7,2) and stack:
   fields / [qty][Add to cart] / wallet buttons, each full width. */
body.wub-shop.single-product :is(.elementor-widget-woocommerce-product-add-to-cart, .elementor-widget-wc-add-to-cart) form.cart.cart:not(.grouped_form):not(.variations_form),
body.wub-shop.single-product :is(.elementor-widget-woocommerce-product-add-to-cart, .elementor-widget-wc-add-to-cart) form.cart.variations_form .woocommerce-variation-add-to-cart { flex-wrap: wrap; }
body.wub-shop.single-product :is(.elementor-widget-woocommerce-product-add-to-cart, .elementor-widget-wc-add-to-cart) form.cart.cart:has(.wpsess-credit-form) { display: block; }
/* Elementor also gives the button a left margin meant for the quantity box; the
   form's gap already spaces them, and on a gift certificate (no quantity) the
   margin pushed the full-width button past the edge. */
body.wub-shop.single-product :is(.elementor-widget-woocommerce-product-add-to-cart, .elementor-widget-wc-add-to-cart) form.cart .single_add_to_cart_button.single_add_to_cart_button { margin: 0; flex: 1 1 140px; min-width: 0; }
body.wub-shop form.cart .wc-stripe-clear { display: none; }
body.wub-shop form.cart .wc-stripe-product-checkout-container { flex: 1 1 100%; width: 100%; margin: 0; }
body.wub-shop form.cart:has(.wpsess-credit-form) .wc-stripe-product-checkout-container { margin-top: var(--space-3); }

/* Variations: attribute rows become button groups (shop.js). */
body.wub-shop table.variations { border: 0; margin: 0 0 var(--space-3); width: 100%; }
body.wub-shop table.variations tr { display: block; margin: 0 0 var(--space-4); }
body.wub-shop table.variations th,
body.wub-shop table.variations td { display: block; padding: 0; border: 0; background: none; text-align: left; line-height: 1.4; }
body.wub-shop table.variations th label { font-weight: 600; font-size: var(--text-small); margin: 0 0 var(--space-2); display: block; }
body.wub-shop table.variations td select.wub-select-replaced { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
body.wub-shop .wub-opts { display: flex; flex-wrap: wrap; gap: var(--space-2); }
body.wub-shop .wub-opts--radio { gap: var(--space-2) var(--space-4); }
body.wub-shop .wub-opt.wub-opt {
	font: 600 var(--text-small) var(--font-body); line-height: 1.2; cursor: pointer;
	padding: 9px 16px; border-radius: var(--radius-pill);
	border: 1px solid var(--color-accent); background: transparent; color: var(--color-accent-text);
}
body.wub-shop .wub-opt.wub-opt:hover { background: rgba(47, 115, 134, 0.12); color: var(--color-accent-text); }
body.wub-shop .wub-opt.wub-opt[aria-pressed="true"] { background: var(--color-accent); color: #fff; }
body.wub-shop .wub-opt.wub-opt:disabled { opacity: 0.35; cursor: not-allowed; text-decoration: line-through; }
body.wub-shop .wub-opts--radio .wub-opt.wub-opt {
	border: 0; padding: 4px 0; border-radius: 0; color: var(--color-text); font-weight: 400;
	display: inline-flex; align-items: center; gap: var(--space-2);
}
body.wub-shop .wub-opts--radio .wub-opt.wub-opt::before {
	content: ""; width: 20px; height: 20px; flex: none; box-sizing: border-box;
	border-radius: 50%; border: 1.5px solid var(--wub-neutral-700); background: var(--color-surface-raised);
}
body.wub-shop .wub-opts--radio .wub-opt.wub-opt[aria-pressed="true"] { background: transparent; color: var(--color-text); }
body.wub-shop .wub-opts--radio .wub-opt.wub-opt[aria-pressed="true"]::before {
	background: var(--color-accent); border-color: var(--color-accent); box-shadow: inset 0 0 0 4px var(--color-surface-raised);
}
body.wub-shop .wub-opts--radio .wub-opt.wub-opt:hover { background: transparent; }
body.wub-shop .reset_variations { font-size: var(--text-micro); font-weight: 600; color: var(--color-accent-text); margin-top: var(--space-2); display: inline-block; }
body.wub-shop .single_variation_wrap .woocommerce-variation-price { display: none; }
body.wub-shop .wub-varbox {
	margin: 0 0 var(--space-4); padding: var(--space-3) var(--space-4); border-radius: var(--radius-md);
	background: var(--color-accent-tint); border: 1px solid var(--wub-blue-300); color: var(--wub-blue-800);
	font-size: var(--text-small);
}

/* Gift certificate fields (WP Events HQ markup). */
body.wub-shop .wpsess-credit-form { gap: var(--space-4); width: 100%; }
body.wub-shop .wpsess-credit-label,
body.wub-shop .wpsess-credit-field label { font-weight: 600; font-size: var(--text-small); margin: 0 0 6px; padding: 0; }
body.wub-shop .wpsess-credit-choice { font-size: var(--text-small); }
body.wub-shop .wpsess-credit-choice input { position: absolute; opacity: 0; width: 0; height: 0; }
body.wub-shop .wpsess-credit-box {
	width: 20px; height: 20px; border-radius: 50%; box-sizing: border-box;
	border: 1.5px solid var(--wub-neutral-700); background: var(--color-surface-raised);
}
body.wub-shop .wpsess-credit-choice input:checked + .wpsess-credit-box {
	background: var(--color-accent); border-color: var(--color-accent); box-shadow: inset 0 0 0 4px var(--color-surface-raised);
}
body.wub-shop .wpsess-credit-choice input:focus-visible + .wpsess-credit-box { outline: 2px solid var(--wub-blue-500); outline-offset: 2px; }
body.wub-shop .wpsess-credit-hint { font-size: var(--text-micro); color: var(--color-text-muted); opacity: 1; }
body.wub-shop form.cart.cart:has(.wpsess-credit-form) { display: block; }
body.wub-shop form.cart.cart:has(.wpsess-credit-form) .quantity { display: none; }
body.wub-shop form.cart.cart:has(.wpsess-credit-form) .single_add_to_cart_button.single_add_to_cart_button { width: 100%; margin-top: var(--space-5); }

/* Template widgets with nothing to say take no space (no price on a gift
   certificate, no stock line on a download). */
body.wub-shop .elementor-widget-woocommerce-product-price:has(.price:empty),
body.wub-shop .elementor-widget-shortcode:has(.elementor-shortcode:empty) { display: none; }

/* Product tabs as pills. WooCommerce's own tab rules are (0,4,3), hence the doubled classes. */
body.wub-shop.wub-shop div.product .woocommerce-tabs ul.tabs.tabs,
body.wub-shop .woocommerce-tabs ul.tabs.tabs {
	display: flex; gap: var(--space-2); flex-wrap: wrap; padding: 0; margin: 0 0 var(--space-6); border: 0;
}
body.wub-shop .woocommerce-tabs ul.tabs::before,
body.wub-shop .woocommerce-tabs ul.tabs li::before,
body.wub-shop .woocommerce-tabs ul.tabs li::after { content: none; display: none; border: 0; }
body.wub-shop.wub-shop div.product .woocommerce-tabs ul.tabs.tabs li {
	margin: 0; padding: 0; border: 1px solid var(--color-accent); border-radius: var(--radius-pill); background: transparent;
}
body.wub-shop.wub-shop div.product .woocommerce-tabs ul.tabs.tabs li a {
	display: block; padding: 7px 16px; font: 600 var(--text-small) var(--font-body); color: var(--color-accent-text);
}
body.wub-shop.wub-shop div.product .woocommerce-tabs ul.tabs.tabs li.active { background: var(--color-accent); }
body.wub-shop.wub-shop div.product .woocommerce-tabs ul.tabs.tabs li.active a { color: #fff; }
body.wub-shop.wub-shop div.product .woocommerce-tabs .panel.panel { margin: 0 0 var(--space-10); padding: 0; border: 0; box-shadow: none; }
body.wub-shop.wub-shop div.product .woocommerce-tabs .panel p { margin: 0 0 var(--space-3); }

/* Store header: Account + Cart (n). */
body.wub-shop .wub-cartlink.wub-cartlink { gap: 0; }
body.wub-shop .wub-cartlink .wub-cart-count { font-weight: inherit; }
body.wub-shop .wub-headerlink--dark.wub-headerlink--dark { color: var(--wub-neutral-100); }
body.wub-shop .wub-cartlink.wub-headerlink--dark { border-color: rgba(255, 255, 255, 0.55); }

/* ── checkout ───────────────────────────────────────────────────────────── */

body.wub-shop .wub-checkout__main { display: grid; gap: var(--space-8); min-width: 0; padding-top: 25px; }
body.wub-shop .wub-checkout__details,
body.wub-shop .wub-checkout__details .woocommerce-billing-fields { display: grid; gap: var(--space-8); }
body.wub-shop .wub-checkout__details .woocommerce-billing-fields > h3 { display: none; }
body.wub-shop .wub-checkout__details::before,
body.wub-shop .wub-checkout__details::after,
body.wub-shop .wub-checkout__details .woocommerce-billing-fields::before,
body.wub-shop .wub-checkout__details .woocommerce-billing-fields::after { content: none; }
/* Zero-height things in a grid still take a row and a gap — that was the space
   above "Your details". The attribution element only holds hidden inputs. */
body.wub-shop .wub-checkout__details > wc-order-attribution-inputs { display: none; }
body.wub-shop .wub-checkout__section { display: grid; gap: var(--space-4); }
body.wub-shop .wub-checkout .wub-section-title { margin: 0; }
body.wub-shop .wub-express:empty { display: none; }

body.wub-shop .wub-fields {
	display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--space-4);
}
body.wub-shop .wub-fields::before,
body.wub-shop .wub-fields::after { content: none; }
body.wub-shop .wub-fields .form-row { grid-column: 1 / -1; margin: 0; padding: 0; width: auto; float: none; }
body.wub-shop .wub-fields .form-row-first { grid-column: 1 / 4; }
body.wub-shop .wub-fields .form-row-last { grid-column: 4 / -1; }
body.wub-shop .wub-fields .form-row-third { grid-column: span 2; }
body.wub-shop .wub-fields .form-row.wub-hidden-field { display: none; }

/* Account details: names, display name, email; then the password card; then Save. */
body.wub-shop .wub-account-form { display: grid; gap: var(--space-6); margin: 0; }
body.wub-shop .wub-field-help { display: block; margin-top: 6px; font-size: var(--text-micro); color: var(--color-text-muted); }
body.wub-shop fieldset.wub-password-card { border: 0; margin: 0; min-width: 0; padding: var(--space-6); gap: var(--space-4); }
body.wub-shop .wub-password-card .wub-card__title { margin: 0; }
body.wub-shop .wub-password-card > .wub-muted { margin-top: calc(var(--space-2) - var(--space-4)); font-size: var(--text-small); }
body.wub-shop .wub-password-card .form-row { margin: 0; padding: 0; width: auto; float: none; }
body.wub-shop .wub-account-form__save { margin: 0; }

/* Show / Hide as words, not WooCommerce's eye icon (every Woo password field). */
body.wub-shop form .password-input .show-password-input {
	background: transparent; border: 0; padding: 0; right: 18px; min-height: 0; box-shadow: none;
	color: var(--color-accent-text); font: 600 var(--text-micro)/1 var(--font-body);
}
body.wub-shop form .password-input .show-password-input::before,
body.wub-shop form .password-input .show-password-input.display-password::before {
	content: "Show"; background: none; width: auto; height: auto; display: inline;
}
body.wub-shop form .password-input .show-password-input.display-password::before { content: "Hide"; }
body.wub-shop form .password-input input[type="password"],
body.wub-shop form .password-input input[type="text"] { padding-right: 64px; }
body.wub-shop form .form-row label {
	display: block; font-weight: 600; font-size: var(--text-small); line-height: 1.4; margin: 0 0 6px;
}
body.wub-shop form .form-row .required { color: inherit; text-decoration: none; border: 0; }
body.wub-shop form .form-row .optional { color: var(--color-text-muted); font-weight: 400; }
body.wub-shop form .form-row .description,
body.wub-shop form .form-row span.description {
	display: block; position: static; background: none; color: var(--color-text-muted);
	padding: 0; margin: 5px 0 0; font-size: var(--text-micro); border-radius: 0;
}
body.wub-shop form .form-row .description::before { content: none; }

/* Inline errors: clay border and clay text under the field. No red. */
body.wub-shop form .form-row.woocommerce-invalid .input-text,
body.wub-shop form .form-row.woocommerce-invalid select { border-color: var(--wub-clay-500); }
body.wub-shop form .form-row.woocommerce-invalid label { color: inherit; }
body.wub-shop form .form-row.woocommerce-validated .input-text { border-color: var(--color-divider); }
body.wub-shop .checkout-inline-error-message { color: var(--wub-clay-700); font-size: var(--text-micro); margin: 5px 0 0; }

/* Checkboxes styled like the design's choice box. */
body.wub-shop .wub-choice,
body.wub-shop form .form-row label.wub-choice { display: inline-flex; align-items: flex-start; gap: var(--space-2); cursor: pointer; font-size: var(--text-small); font-weight: 400; margin: 0; }
body.wub-shop .wub-choice input { position: absolute; opacity: 0; width: 0; height: 0; margin: 0; }
body.wub-shop .wub-choice__box {
	width: 20px; height: 20px; flex: none; box-sizing: border-box; border-radius: 7px; margin-top: 1px;
	border: 1.5px solid var(--wub-neutral-700); background: var(--color-surface-raised);
	display: grid; place-items: center;
}
body.wub-shop .wub-choice input:checked + .wub-choice__box { background: var(--color-accent); border-color: var(--color-accent); }
body.wub-shop .wub-choice input:checked + .wub-choice__box::after {
	content: ""; width: 10px; height: 5px; border: 2px solid #fff; border-top: 0; border-right: 0;
	transform: translateY(-1px) rotate(-45deg);
}
body.wub-shop .wub-choice input:focus-visible + .wub-choice__box { outline: 2px solid var(--wub-blue-500); outline-offset: 2px; }
body.wub-shop .woocommerce-account-fields .create-account { margin: var(--space-4) 0 0; }

/* Delivery cards. */
body.wub-shop .wub-delivery { display: grid; gap: var(--space-3); }
body.wub-shop .wub-delivery[hidden] { display: none; }
body.wub-shop .wub-delivery__options { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3); }
body.wub-shop .wub-delivery__option {
	position: relative; margin: 0; padding: 0;
	border: 1px solid var(--color-divider); border-radius: var(--radius-xl);
	background: var(--color-surface-raised);
}
body.wub-shop .wub-delivery__option.is-chosen,
body.wub-shop .wub-delivery__option:has(input:checked) {
	border: 2px solid var(--color-accent); background: var(--color-accent-tint);
}
body.wub-shop .wub-delivery__option input {
	position: absolute; left: var(--space-4); top: calc(var(--space-4) + 3px); margin: 0; accent-color: var(--color-accent);
}
body.wub-shop .wub-delivery__option label {
	display: grid; gap: 2px; margin: 0; padding: var(--space-4) var(--space-4) var(--space-4) calc(var(--space-4) + 28px);
	cursor: pointer;
}
body.wub-shop .wub-delivery__title { font-weight: 700; font-size: 16px; }
body.wub-shop .wub-delivery__detail { font-size: var(--text-small); color: var(--color-text-muted); font-weight: 400; }
body.wub-shop .wub-shipto[hidden] { display: none; }
body.wub-shop .wub-shipto__toggle { margin: 0 0 var(--space-4); }
body.wub-shop .wub-shipto h3 { display: none; }

/* WooCommerce's province picker (selectWoo) in the same pill. */
body.wub-shop .select2-container--default .select2-selection--single {
	height: 44px; border: 1px solid var(--color-divider); border-radius: var(--radius-pill);
	background: var(--color-surface-raised);
}
body.wub-shop form .form-row .select2-container--default .select2-selection--single .select2-selection__rendered {
	display: block; height: 42px; line-height: 42px; padding: 0 40px 0 16px; margin: 0;
	font: 400 var(--text-small) / 42px var(--font-body); color: var(--color-text);
}
body.wub-shop .select2-container--default .select2-selection--single .select2-selection__arrow { height: 42px; right: 12px; }
body.wub-shop .select2-dropdown { border-color: var(--color-divider); border-radius: var(--radius-md); overflow: hidden; }
body.wub-shop .select2-results__option--highlighted[aria-selected],
body.wub-shop .select2-container--default .select2-results__option--highlighted[data-selected] { background: var(--color-accent); }

/* Payment. */
body.wub-shop .wub-checkout__payment { display: grid; gap: var(--space-4); }
body.wub-shop #payment.woocommerce-checkout-payment { background: transparent; border-radius: 0; }
body.wub-shop #payment ul.payment_methods.wub-card {
	margin: 0; padding: var(--space-6); border: 0; list-style: none; display: grid; gap: var(--space-4);
}
body.wub-shop #payment ul.payment_methods li { margin: 0; line-height: 1.4; }
body.wub-shop #payment ul.payment_methods li > label { font-weight: 700; font-size: var(--text-small); }
body.wub-shop #payment div.payment_box {
	background: transparent; padding: var(--space-3) 0 0; margin: 0; font-size: var(--text-small); color: var(--color-text);
}
body.wub-shop #payment div.payment_box::before { content: none; }
/* Saved cards (Stripe plugin's picker): the site's cards, the chosen one outlined in teal, not Stripe blue. */
body.wub-shop #payment ul.wc-saved-payment-methods { display: grid; gap: var(--space-2); margin: 0 0 var(--space-3); padding: 0; list-style: none; border: 0; }
body.wub-shop #payment ul.wc-saved-payment-methods > li {
	margin: 0; padding: 12px 16px; background: var(--color-surface-raised);
	border: 1px solid var(--color-divider); border-radius: var(--radius-lg); box-shadow: none; outline: 0;
}
body.wub-shop #payment ul.wc-saved-payment-methods > li.selected { border: 2px solid var(--color-accent); padding: 11px 15px; box-shadow: none; }
body.wub-shop #payment ul.wc-saved-payment-methods .wc-stripe-saved-method__title { font-size: var(--text-small); font-weight: 600; color: var(--color-text); }
/* Stripe's "Save to account" sat 4px under the card fields (its frame has a negative margin);
   the same gap as between the payment methods below it. */
body.wub-shop #payment div.payment_box .woocommerce-SavedPaymentMethods-saveNew {
	display: flex; align-items: center; gap: 8px; margin: var(--space-4) 0 0; padding: 0;
}
body.wub-shop #payment div.payment_box .woocommerce-SavedPaymentMethods-saveNew input { margin: 0; }
body.wub-shop #payment div.payment_box .woocommerce-SavedPaymentMethods-saveNew label { margin: 0; }
body.wub-shop .wub-checkout__notes .form-row { margin: 0; padding: 0; }

/* Summary. */
body.wub-shop .wub-summary .wub-totals__title { margin-bottom: var(--space-2); }
body.wub-shop .wub-review__items {
	display: grid; gap: var(--space-3); padding-bottom: var(--space-3); margin-bottom: var(--space-2);
	border-bottom: 1px solid var(--color-divider);
}
body.wub-shop .wub-review__item { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); font-size: var(--text-small); }
body.wub-shop .wub-review__item > .wub-review__name { flex: 1 1 auto; min-width: 0; }
body.wub-shop .wub-review__thumb { flex: none; width: 52px; height: 52px; border-radius: var(--radius-sm); overflow: hidden; background: var(--color-surface); }
body.wub-shop .wub-review__thumb img { display: block; width: 100%; height: 100%; object-fit: cover; margin: 0; }
body.wub-shop .wub-review__sub { display: block; color: var(--color-text-muted); }
body.wub-shop .wub-place-order { padding: var(--space-4) 0 0; margin: 0; }
body.wub-shop .wub-place-order .woocommerce-terms-and-conditions-wrapper { margin: 0 0 var(--space-3); }
body.wub-shop .woocommerce-form-coupon-toggle .woocommerce-info { margin-bottom: var(--space-6); }
body.wub-shop form.checkout_coupon { border: 1px solid var(--color-divider); border-radius: var(--radius-lg); padding: var(--space-4); margin: 0 0 var(--space-6); }
/* Field and Apply on one line, as in the cart; an error from checkout.js lands under the field. */
body.wub-shop .wub-coupon__row { display: flex; gap: var(--space-3); align-items: flex-start; }
body.wub-shop form.checkout_coupon .wub-coupon__field { flex: 1 1 auto; min-width: 0; margin: 0; padding: 0; float: none; width: auto; }
body.wub-shop .wub-coupon__field .wub-input { width: 100%; }
body.wub-shop .wub-coupon__row > .wub-btn.wub-btn { flex: none; min-height: 44px; }
body.wub-shop .wub-coupon .coupon-error-notice { margin: 6px 0 0; font-size: var(--text-small); color: var(--wub-clay-800); }
body.wub-shop .blockUI.blockOverlay { border-radius: var(--radius-xl); }

/* Booking summary: the session block, and the code field. */
body.wub-shop .wub-review__session { display: grid; gap: 2px; padding-bottom: var(--space-3); border-bottom: 1px solid var(--color-divider); margin-bottom: var(--space-2); }
body.wub-shop .wub-review__session strong { font-size: 16px; }
body.wub-shop .wub-review__session span { font-size: var(--text-small); color: var(--color-text-muted); }
body.wub-shop .wub-code { display: grid; gap: 6px; margin: 0 0 var(--space-4); }
body.wub-shop .wub-code__label { font-weight: 600; font-size: var(--text-small); }
body.wub-shop .wub-code__row { display: flex; gap: var(--space-2); }
body.wub-shop .wub-code__row .wub-input.wub-input { flex: 1 1 auto; min-width: 0; }
body.wub-shop .wub-code.is-working { opacity: 0.6; pointer-events: none; }

/* ── order received ─────────────────────────────────────────────────────── */

body.wub-shop .wub-received__hero {
	position: relative; overflow: hidden; background: var(--color-surface); border-radius: var(--radius-xl);
	padding: var(--space-12) var(--space-8) var(--space-10); text-align: center;
}
body.wub-shop .wub-received__blob-a { position: absolute; width: 300px; height: 300px; background: var(--wub-blue-200); top: -110px; left: -90px; opacity: 0.7; }
body.wub-shop .wub-received__blob-b { position: absolute; width: 180px; height: 180px; background: var(--wub-clay-200); bottom: -70px; right: -40px; opacity: 0.7; }
body.wub-shop .wub-received__hero-inner { position: relative; z-index: 1; }
body.wub-shop .wub-received__title {
	font-family: var(--font-display); font-weight: 400; font-size: var(--text-h1); line-height: 1.05;
	max-width: 20ch; margin: 0 auto var(--space-4); text-wrap: balance;
}
body.wub-shop .wub-page-title,
body.wub-shop .wub-section-title,
body.wub-shop .wub-card__title { text-wrap: balance; }
body.wub-shop .wub-received__hero .wub-lead { margin: 0 auto var(--space-5); }
body.wub-shop .wub-received__actions { display: flex; gap: var(--space-3); justify-content: center; flex-wrap: wrap; }
body.wub-shop .wub-received__body { padding: var(--space-10) var(--space-8) 0; }
body.wub-shop .wub-received__main { display: grid; gap: var(--space-10); min-width: 0; }
body.wub-shop .wub-received__side { display: grid; gap: var(--space-4); }
body.wub-shop .wub-steps-list { list-style: none; margin: 0; padding: 0; }
body.wub-shop .ec-step { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: var(--space-3); align-items: start; padding-bottom: var(--space-5); margin: 0; }
body.wub-shop .ec-step:last-child { padding-bottom: 0; }
body.wub-shop .ec-bullet {
	width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center;
	font-size: var(--text-micro); font-weight: 700; background: var(--color-accent); color: #fff;
}
body.wub-shop .ec-bullet--clay { background: var(--color-accent-2); }
body.wub-shop .wub-step__title { margin: 0; font-weight: 700; }
body.wub-shop .wub-received__keep { margin-top: var(--space-3); }

body.wub-shop .wub-downloads { gap: var(--space-3); }
body.wub-shop .wub-downloads__row { display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); flex-wrap: wrap; }
body.wub-shop .wub-downloads__row + .wub-downloads__row { border-top: 1px solid var(--color-divider); padding-top: var(--space-3); }
body.wub-shop .wub-downloads__name { font-weight: 600; font-size: var(--text-small); margin: 0; word-break: break-word; }
body.wub-shop .wub-downloads__meta { font-size: var(--text-micro); color: var(--color-text-muted); margin: 0; }
body.wub-shop .wub-side-card .wub-downloads { background: transparent; box-shadow: none; padding: 0; }

body.wub-shop .wub-cert { gap: var(--space-3); }
/* The certificate picture (Events HQ draws it on the studio's background). */
body.wub-shop .wub-cert__pic { display: block; border-radius: 12px; overflow: hidden; line-height: 0; }
body.wub-shop .wub-cert__pic img { display: block; width: 100%; height: auto; }
body.wub-shop .wub-cert__meta { font-size: var(--text-small); color: var(--wub-neutral-300); }
body.wub-shop .wub-cert__code {
	font: 26px/1.2 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: 0.08em;
	color: var(--wub-clay-300); word-break: break-all; margin: 0;
}
body.wub-shop .wub-cert__code--plain { color: var(--color-text); font-size: 20px; letter-spacing: 0.06em; }
body.wub-shop .wub-cert__terms { font-size: var(--text-small); color: var(--wub-neutral-300); }
body.wub-shop .wub-cert .wub-row { margin-top: var(--space-2); }

body.wub-shop .ec-table { width: 100%; border-collapse: collapse; font-size: var(--text-small); margin: 0; border: 0; }
body.wub-shop .ec-table th {
	text-align: left; font-size: var(--text-micro); letter-spacing: 0.06em; text-transform: uppercase;
	color: var(--color-text-muted); font-weight: 600; padding: 0 0 var(--space-2); border: 0; background: none;
}
/* Hello's reset draws a line over the first header row (table thead:first-child tr:first-child th). */
body.wub-shop table.ec-table > thead > tr > th { border-block-start: 0; }
body.wub-shop .ec-table td { padding: var(--space-3) 0; border: 0; border-top: 1px solid var(--color-divider); vertical-align: middle; background: none; }
body.wub-shop .ec-table td + td,
body.wub-shop .ec-table th + th { padding-left: var(--space-3); }
body.wub-shop .ec-table .is-end { text-align: right; }
body.wub-shop .wub-orders-table__actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
body.wub-shop .wub-pagination { margin-top: var(--space-4); }
body.wub-shop .wub-orders-table__date-sm { display: none; }
body.wub-shop .wub-orders-table--all .wub-pill,
body.wub-shop .wub-orders-table--all td:nth-child(4) { white-space: nowrap; }
@media (max-width: 600px) {
	body.wub-shop .wub-orders-table--all .wub-orders-table__date { display: none; }
	body.wub-shop .wub-orders-table--all .wub-orders-table__date-sm { display: block; font-size: var(--text-micro); white-space: nowrap; }
	body.wub-shop .wub-orders-table--all .wub-orders-table__actions { flex-direction: column; align-items: flex-end; }
}
body.wub-shop .ec-table .is-discount { color: var(--color-accent-2-text); }
body.wub-shop .wub-summary-table__total td { font-weight: 700; }
body.wub-shop .wub-summary-table__total td.is-end { font-family: var(--font-display); font-size: var(--text-h4); font-weight: 400; }
body.wub-shop .wpsess-credit-codes { font-size: var(--text-micro); color: var(--color-text-muted); margin-top: 2px; }
body.wub-shop .wpsess-credit-codes code { background: none; padding: 0; font-size: inherit; }

body.wub-shop .wub-side-card { gap: var(--space-2); }
body.wub-shop .wub-side-card p { font-size: var(--text-small); }
body.wub-shop .wub-side-card--tint { background: var(--color-accent-tint); }

/* One order's page has no account menu: WooCommerce's own account CSS still
   floats the content right at 68% width, which pushed the whole page over. */
body.wub-shop .woocommerce-MyAccount-content.wub-order-page { float: none; width: auto; }

/* "Your class" from WP Events HQ, as a side card: its h2 reads as the card
   title, each class as a block, the calendar links as the site's small buttons. */
body.wub-shop .wub-class-card .wpsess-confirmation { display: grid; gap: var(--space-4); margin: 0; padding: 0; }
body.wub-shop .wub-class-card .wpsess-confirmation h2 {
	font-family: var(--font-display); font-weight: 400; font-size: var(--text-h4); line-height: 1.2;
	color: var(--color-text); margin: 0;
}
body.wub-shop .wub-class-card .wpsess-confirmation__item { display: grid; gap: var(--space-2); }
body.wub-shop .wub-class-card .wpsess-confirmation__item + .wpsess-confirmation__item { border-top: 1px solid var(--color-divider); padding-top: var(--space-4); }
body.wub-shop .wub-class-card .wpsess-confirmation h3 {
	font: 600 16px/1.35 var(--font-body); color: var(--color-text); margin: 0;
}
body.wub-shop .wub-class-card .wpsess-confirmation p { font-size: var(--text-small); line-height: 1.6; margin: 0; }
body.wub-shop .wub-class-card .wpsess-confirmation__when strong { font-weight: 600; }
body.wub-shop .wub-class-card .wpsess-confirmation__actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); margin-top: var(--space-2); }
body.wub-shop .wub-class-card .wpsess-confirmation__actions a {
	display: inline-flex; align-items: center; justify-content: center; margin: 0;
	font: 600 var(--text-micro)/1.2 var(--font-body); padding: 7px 14px; border-radius: var(--radius-pill);
	border: 1px solid transparent; background: transparent; color: var(--color-accent-text);
	text-decoration: none; white-space: nowrap; box-shadow: none; min-height: 0; width: auto;
}
body.wub-shop .wub-class-card .wpsess-confirmation__actions a:hover { background: rgba(47, 115, 134, 0.1); }
body.wub-shop .wub-class-card .wpsess-confirmation__actions a.wpsess-btn { color: var(--color-text); border-color: var(--color-divider); }
body.wub-shop .wub-class-card .wpsess-confirmation__actions a.wpsess-btn:hover { border-color: var(--color-accent); color: var(--color-accent-text); }
body.wub-shop .wub-hours {
	margin: var(--space-3) 0 0; padding: var(--space-3) 0 0; border-top: 1px solid var(--color-divider);
	display: grid; gap: 5px; font-size: var(--text-small);
}
body.wub-shop .wub-hours > div { display: flex; justify-content: space-between; gap: var(--space-4); }
body.wub-shop .wub-hours dt { color: var(--color-text-muted); font-weight: 400; margin: 0; }
body.wub-shop .wub-hours dd { margin: 0; }

/* Bought in the studio: the order number, big enough to read across a counter. */
body.wub-shop .wub-received__paid-number { font-family: var(--font-display); font-size: clamp(32px, 6vw, 48px); line-height: 1.1; margin: 0 0 var(--space-4); }

/* "While you're here" under a booking. */
body.wub-shop .wub-here { padding: var(--space-10) 0 0; }
body.wub-shop .wub-here__cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--space-4); }
body.wub-shop .wub-here__card { min-height: 200px; }
body.wub-shop .wub-here__text { font-size: 16px; }
body.wub-shop .wub-card__kicker.is-clay { color: var(--color-accent-2-text); }
body.wub-shop .wub-received__also { margin-top: var(--space-12); padding: 0; }

/* ── account ────────────────────────────────────────────────────────────── */

/* WC My Account HQ owns the tab list and styles it from these variables;
   pointing them at the WUB tokens here (body is nearer than its :root) keeps
   its menu in the design's colours. Its sidebar layout turns the account
   wrapper into a flex row and the content into a white card — the design
   has neither. */
body.wub-shop {
	--wlma-primary: var(--color-accent);
	--wlma-primary-text: #fff;
	--wlma-tab-bg: transparent;
	--wlma-tab-text: var(--color-text);
	--wlma-tab-active-bg: var(--color-accent);
	--wlma-tab-active-text: #fff;
	--wlma-tab-hover-bg: rgba(47, 115, 134, 0.1);
	--wlma-radius: var(--radius-md);
	--wlma-font-size: var(--text-small);
}
body.wub-shop.woocommerce-account .woocommerce { display: block; }
body.wub-shop.wub-shop .woocommerce-MyAccount-content {
	background: none; border: 0; border-radius: 0; box-shadow: none; padding: 0; max-width: none;
}
/* ...and on phones pads the content 20px/16px with !important, insetting every account page. */
body.wub-shop.wub-shop .woocommerce-MyAccount-content { padding: 0 !important; }
/* Same for the wrapper around it (16px, !important, up to 768px): the page already has its gutter. */
body.wub-shop.woocommerce-account .page-content > .woocommerce { padding: 0 !important; }
/* ...and squares off every account field and submit button (radius !important). The site's are pills. */
body.wub-shop.woocommerce-account .woocommerce-form-row input.input-text,
body.wub-shop.woocommerce-account button[type="submit"].wub-btn,
body.wub-shop.woocommerce-account .woocommerce-address-fields button[type="submit"],
body.wub-shop.woocommerce-account .woocommerce-MyAccount-content .button { border-radius: var(--radius-pill) !important; }

/* Add payment method: each method a card, the chosen one outlined; the card form under a rule inside it. */
body.wub-shop #add_payment_method #payment { background: transparent; border-radius: 0; }
body.wub-shop #add_payment_method #payment ul.payment_methods {
	list-style: none; margin: 0; padding: 0; border: 0; display: grid; gap: var(--space-3);
}
body.wub-shop #add_payment_method #payment ul.payment_methods li {
	margin: 0; padding: 18px 22px; line-height: 1.4;
	background: var(--color-surface-raised); border: 1px solid var(--color-divider); border-radius: var(--radius-lg);
}
body.wub-shop #add_payment_method #payment ul.payment_methods li:has(> input:checked) { border: 2px solid var(--color-accent); padding: 17px 21px; }
body.wub-shop #add_payment_method #payment ul.payment_methods li > input[type="radio"] { accent-color: var(--color-accent); width: 18px; height: 18px; margin: 0 10px 0 0; vertical-align: middle; }
body.wub-shop #add_payment_method #payment ul.payment_methods li > label {
	display: inline-flex; align-items: center; justify-content: space-between; gap: var(--space-3);
	width: calc(100% - 32px); vertical-align: middle; font-weight: 700; font-size: var(--text-small); margin: 0;
}
body.wub-shop #add_payment_method #payment ul.payment_methods li > label img { margin: 0; max-height: 24px; width: auto; float: none; }
body.wub-shop #add_payment_method #payment div.payment_box {
	background: transparent; margin: 17px -21px 0; padding: 18px 21px 0; border-top: 1px solid var(--color-divider);
	font-size: var(--text-small); color: var(--color-text);
}
body.wub-shop #add_payment_method #payment div.payment_box::before { content: none; }
body.wub-shop #add_payment_method #payment div.form-row { padding: 0; margin: var(--space-5) 0 0; border: 0; display: flex; justify-content: flex-end; }
body.wub-shop #add_payment_method #payment #place_order { float: none; margin: 0; }

/* Saved cards. */
body.wub-shop .wub-saved-cards { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3); }
body.wub-shop .wub-saved-card {
	flex-direction: row; align-items: center; justify-content: space-between; flex-wrap: wrap;
	gap: var(--space-3); padding: 18px 22px; margin: 0;
}
body.wub-shop .wub-saved-card__name { display: flex; align-items: center; gap: var(--space-2); font-weight: 600; font-size: 16px; }
body.wub-shop .wub-saved-card .wub-muted { font-size: var(--text-small); margin-top: 2px; }
body.wub-shop .wub-saved-cards__add { margin: var(--space-5) 0 0; }

/* Addresses. */
body.wub-shop .wub-addresses__intro { margin: 0 0 var(--space-5); font-size: var(--text-small); }
body.wub-shop .wub-addresses { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--space-4); align-items: start; }
body.wub-shop .wub-address { padding: var(--space-6); gap: var(--space-3); margin: 0; }
body.wub-shop .wub-address.is-empty { background: transparent; border: 1px dashed rgba(32, 30, 29, 0.32); }
body.wub-shop .wub-address__head { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); min-height: 32px; }
body.wub-shop .wub-address address { font-style: normal; font-size: var(--text-small); line-height: 1.75; margin: 0; }
body.wub-shop .wub-address .wub-muted { font-size: var(--text-small); line-height: 1.6; }
body.wub-shop .wub-address__add { margin: var(--space-2) 0 0; }

/* Downloads tab: one group per thing bought. */
body.wub-shop .wub-dl-groups { display: grid; gap: var(--space-8); }
body.wub-shop .wub-dl-group .wub-section-title a { color: inherit; text-decoration: none; }
body.wub-shop .wub-dl-group .wub-section-title a:hover { color: var(--color-accent-text); }
/* My Account HQ draws a divider under every tab with !important. */
body.wub-shop.wub-shop .woocommerce-MyAccount-navigation ul li { border: 0 !important; }
body.wub-shop.wub-shop .woocommerce-MyAccount-navigation ul li a { border-radius: var(--radius-md); font-weight: 600; }

body.wub-shop .ec-acct { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: var(--space-8); align-items: start; }
body.wub-shop .ec-acct .woocommerce-MyAccount-navigation,
body.wub-shop .ec-acct .woocommerce-MyAccount-content { width: auto; float: none; margin: 0; padding: 0; }
body.wub-shop .woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; background: none; border: 0; }
body.wub-shop .woocommerce-MyAccount-navigation ul li { margin: 0; padding: 0; border: 0; background: none; }
body.wub-shop .woocommerce-MyAccount-navigation ul li a {
	display: block; padding: 10px var(--space-4); border-radius: var(--radius-md);
	font: 600 var(--text-small) var(--font-body); color: var(--color-text); text-decoration: none; background: none;
}
body.wub-shop .woocommerce-MyAccount-navigation ul li a::before { content: none; display: none; }
body.wub-shop .woocommerce-MyAccount-navigation ul li a:hover { background: rgba(47, 115, 134, 0.1); color: var(--color-text); }
body.wub-shop .woocommerce-MyAccount-navigation ul li.is-active a { background: var(--color-accent); color: #fff; }

body.wub-shop .wub-dash { display: grid; gap: var(--space-8); }
body.wub-shop .wub-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--space-4); }
body.wub-shop a.wub-stat { color: inherit; text-decoration: none; transition: transform 200ms var(--ease-soft); }
body.wub-shop a.wub-stat:hover { transform: translateY(-2px); }
body.wub-shop .wub-stat__num { font-family: var(--font-display); font-size: var(--text-h2); line-height: 1.1; margin: 0; }
body.wub-shop .wub-stat--clay { background: var(--color-accent-2-tint); }
body.wub-shop .wub-stat--clay .wub-card__kicker,
body.wub-shop .wub-stat--clay .wub-stat__num { color: var(--color-accent-2-text); }
body.wub-shop .wub-section-head { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-4); margin-bottom: var(--space-3); }
body.wub-shop .wub-section-head .wub-section-title { margin: 0; }
body.wub-shop .wub-section-head a { font-size: var(--text-small); }
body.wub-shop .wub-nextclass { flex-direction: row; align-items: center; gap: var(--space-4); flex-wrap: wrap; }
body.wub-shop .wub-nextclass__photo img,
body.wub-shop .wub-nextclass__ph { width: 96px; height: 96px; object-fit: cover; border-radius: var(--radius-lg); display: block; }
body.wub-shop .wub-nextclass__ph { background: var(--wub-neutral-300); }
body.wub-shop .wub-nextclass__text { flex: 1 1 200px; }

/* WooCommerce's own account tables (Orders, Downloads) in the same dress. */
body.wub-shop .woocommerce-MyAccount-content table.shop_table {
	border: 0; border-radius: 0; border-collapse: collapse; margin: 0; font-size: var(--text-small);
}
body.wub-shop .woocommerce-MyAccount-content table.shop_table th {
	font-size: var(--text-micro); letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-text-muted);
	font-weight: 600; padding: 0 var(--space-3) var(--space-2) 0; border: 0;
}
body.wub-shop .woocommerce-MyAccount-content table.shop_table td {
	border: 0; border-top: 1px solid var(--color-divider); padding: var(--space-3) var(--space-3) var(--space-3) 0; background: none;
}
body.wub-shop .woocommerce-MyAccount-content table.shop_table .button {
	background: transparent; color: var(--color-text); border: 1px solid var(--color-divider);
	border-radius: var(--radius-pill); padding: 7px 14px; font-size: var(--text-micro); font-weight: 600;
}
body.wub-shop .woocommerce-MyAccount-content table.shop_table .button:hover { border-color: var(--color-accent); color: var(--color-accent-text); background: rgba(47, 115, 134, 0.1); }

/* One order. */
body.wub-shop .wub-back { font-size: var(--text-small); margin: 0 0 var(--space-3); }
body.wub-shop .wub-order-head { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--space-4); flex-wrap: wrap; margin-bottom: var(--space-6); }
body.wub-shop .wub-order-head .wub-page-title { margin: 0; }
body.wub-shop .wub-order-head .wub-muted { margin-top: 4px; }
body.wub-shop .wub-order-state { margin-bottom: var(--space-6); }
body.wub-shop .wub-order-side { display: grid; gap: var(--space-4); }
body.wub-shop .wub-order-actions { margin-top: var(--space-5); }
body.wub-shop .wub-updates { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3); font-size: var(--text-small); }

/* Sign in / register. */
body.wub-shop .woocommerce form.login,
body.wub-shop .woocommerce form.register,
body.wub-shop .woocommerce form.lost_reset_password {
	border: 0; border-radius: var(--radius-xl); background: var(--color-surface-raised); box-shadow: var(--shadow-sm);
	padding: var(--space-6); margin: 0;
}
/* Logged out (log in, lost and reset password): one narrow column in the middle of the page. */
body.wub-shop.woocommerce-account:not(.logged-in) .page-content > .woocommerce { max-width: 460px; margin-inline: auto; }
/* "Remember me" above the button; the button gets its own full-width line. */
body.wub-shop .woocommerce form.login .form-row:has(.woocommerce-form-login__submit) {
	display: flex; flex-direction: column; align-items: stretch; gap: var(--space-4); margin: var(--space-2) 0 0;
}
body.wub-shop .woocommerce form.login .woocommerce-form-login__rememberme { display: flex; align-items: center; gap: 8px; margin: 0; }
body.wub-shop .woocommerce form.login .woocommerce-form-login__submit { float: none; width: 100%; margin: 0; }
body.wub-shop .woocommerce form.login .lost_password { margin: var(--space-3) 0 0; text-align: center; }
/* Lost / reset password: Woo floats the fields at half width; here they take the full card. */
body.wub-shop .woocommerce form.lost_reset_password > p:first-child { margin: 0 0 var(--space-4); }
body.wub-shop .woocommerce form.lost_reset_password .form-row { float: none; width: 100%; padding: 0; margin: 0 0 var(--space-4); }
body.wub-shop .woocommerce form.lost_reset_password .form-row:last-of-type { margin: 0; }
body.wub-shop .woocommerce form.lost_reset_password .button { width: 100%; }
body.wub-shop .woocommerce form.login .button,
body.wub-shop .woocommerce form.lost_reset_password .button,
body.wub-shop .woocommerce form.register .button,
body.wub-shop .woocommerce-MyAccount-content form .button {
	background: var(--color-accent); color: #fff; border: 0; border-radius: var(--radius-pill);
	padding: 12px 24px; font: 600 var(--text-small) var(--font-body);
}

/* ── narrow ─────────────────────────────────────────────────────────────── */

@media (max-width: 1050px) {
	body.wub-shop .ec-checkout,
	body.wub-shop .ec-2,
	body.wub-shop .ec-acct { grid-template-columns: minmax(0, 1fr); }
	body.wub-shop .ec-checkout > aside,
	body.wub-shop .ec-checkout > .wub-summary-col,
	body.wub-shop .ec-checkout > .cart-collaterals,
	body.wub-shop .wub-received__side { position: static; }
	body.wub-shop ul.products.products { grid-template-columns: repeat(2, minmax(0, 1fr)); }

	body.wub-shop .ec-cartrow { grid-template-columns: 64px minmax(0, 1fr) auto; column-gap: var(--space-3); row-gap: var(--space-2); }
	body.wub-shop .ec-cartrow .product-thumbnail img { width: 64px; height: 64px; }
	body.wub-shop .ec-carthead { display: none; }
	body.wub-shop .ec-cartrow > .product-thumbnail { grid-row: 1 / span 3; grid-column: 1; align-self: start; }
	body.wub-shop .ec-cartrow > .product-name { grid-column: 2 / span 2; }
	body.wub-shop .ec-cartrow > .product-price { grid-column: 2; }
	body.wub-shop .ec-cartrow > .product-quantity { grid-column: 3; justify-self: end; }
	body.wub-shop .ec-cartrow > .product-subtotal { grid-column: 2; text-align: left; }
	body.wub-shop .ec-cartrow > .product-remove { grid-column: 3; justify-self: end; }
	body.wub-shop .ec-cartrow > .product-price::before { content: "Each "; color: var(--color-text-muted); }
	body.wub-shop .ec-cartrow > .product-subtotal::before { content: "Line total "; color: var(--color-text-muted); font-weight: 400; }

	body.wub-shop .woocommerce-MyAccount-navigation ul { flex-direction: row; flex-wrap: wrap; }
	body.wub-shop .wub-received__body { padding: var(--space-8) 0 0; }
	body.wub-shop .wub-received__hero { padding: var(--space-10) var(--space-5) var(--space-8); }
}

@media (max-width: 600px) {
	body.wub-shop main.site-main { padding: var(--space-6) 16px var(--space-12); }
	body.wub-shop .wub-fields .form-row-first,
	body.wub-shop .wub-fields .form-row-last,
	body.wub-shop .wub-fields .form-row-third { grid-column: 1 / -1; }
	body.wub-shop .wub-card { padding: var(--space-5); }
	body.wub-shop .wub-cert__code { font-size: 21px; }
}

/* Product page picture: 10px corners (her setting in template 477). Elementor
   prints that setting only on the slider frame (.flex-viewport), which a
   product with ONE photo doesn't have – so it's set on the picture itself. */
body.single-product .woocommerce-product-gallery__image { border-radius: 10px; overflow: hidden; }
body.single-product .woocommerce-product-gallery__image img { border-radius: 10px; }