/* ==========================================================================
   anetteleonoraandersen.dk by StayMain
   WooCommerce styles. Loaded only when the plugin is active.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Shop shell
   -------------------------------------------------------------------------- */

.section--shop {
	padding-block: var(--space-xl) var(--space-3xl);
}

.ala-shop__inner {
	min-width: 0;
}

.shop-description {
	max-width: 40rem;
	margin: 0 0 var(--space-l);
	color: var(--text-muted);
	font-size: var(--step-1);
	line-height: 1.6;
}

/* Toolbar: count left, sorting right, on a shared rule. */
.shop-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-s) var(--space-m);
	padding-bottom: var(--space-m);
	margin-bottom: var(--space-xl);
}

.shop-toolbar .woocommerce-result-count {
	order: 1;
	margin: 0;
}

.shop-toolbar .woocommerce-ordering {
	order: 2;
	margin: 0;
}

.woocommerce .woocommerce-ordering select {
	appearance: none;
	-webkit-appearance: none;
	max-width: 100%;
	padding: 0.65em 2.4em 0.65em 1em;
	border: 1px solid var(--line-strong);
	border-radius: 0;
	background-color: var(--paper-raised);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%235f5f5f' stroke-width='1.5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1em center;
	color: var(--text);
	font-family: var(--font-mono);
	font-size: var(--step--2);
	letter-spacing: 0.06em;
	text-transform: uppercase;
	cursor: pointer;
	transition: border-color 0.2s var(--ease);
}

.woocommerce .woocommerce-ordering select:hover,
.woocommerce .woocommerce-ordering select:focus {
	border-color: var(--gilt);
	outline: none;
}

.woocommerce ul.products {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(2.5rem, 4vw, 3.5rem) clamp(1.5rem, 3vw, 2.5rem);
	list-style: none;
	padding: 0;
	margin: 0 0 var(--space-2xl);
}

/* Woo ships a legacy float-clearfix (content:" ") on product lists. On a
   grid container the pseudos become grid items and shove the first product
   into column two — remove them. */
.woocommerce ul.products::before,
.woocommerce ul.products::after {
	content: none;
}

.woocommerce ul.products li.product {
	width: auto !important;
	float: none !important;
	margin: 0 !important;
	clear: none !important;
	min-width: 0;
	display: flex;
	flex-direction: column;
	text-align: left;
}

/* The whole card (except the cart button) is one link. */
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link {
	display: flex;
	flex-direction: column;
	text-decoration: none;
	color: inherit;
}

/* Fixed frame, full cover always visible, no matte: the page shows through. */
.product__media {
	position: relative;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	background: none;
}

.product__media a {
	display: block;
	height: 100%;
}

.product__media img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	aspect-ratio: auto;
	object-fit: contain;
	object-position: center;
	background: none;
	box-shadow: none;
	transition: transform 0.5s var(--ease-out);
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link:hover .product__media img {
	transform: scale(1.025);
}

.product__body {
	display: flex;
	flex-direction: column;
	gap: 0.3rem;
	padding-top: var(--space-s);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
	font-family: var(--font-display);
	font-size: var(--step-1);
	font-variation-settings: "SOFT" 16, "WONK" 1;
	line-height: 1.2;
	margin: 0;
	padding: 0;
	color: var(--ink);
	transition: color 0.2s var(--ease);
}

.woocommerce ul.products li.product a.woocommerce-LoopProduct-link:hover .woocommerce-loop-product__title {
	color: var(--gilt-deep);
}

.product__catalogue {
	margin: 0;
	color: var(--text-muted);
}

.woocommerce ul.products li.product .star-rating {
	margin-top: 0.35rem;
	font-size: 0.8125rem;
	color: var(--gilt-deep);
}

.woocommerce ul.products li.product .price,
.woocommerce div.product p.price {
	font-family: var(--font-mono);
	font-size: var(--step--1);
	letter-spacing: 0.04em;
	color: var(--text);
	margin: 0.35rem 0 0;
}

.woocommerce ul.products li.product .price del {
	color: var(--text-faint);
	opacity: 1;
	margin-right: 0.5em;
}

.woocommerce ul.products li.product .price ins {
	text-decoration: none;
	color: var(--gilt-deep);
}

.woocommerce ul.products li.product .button {
	margin-top: var(--space-s);
	align-self: flex-start;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	padding: 0.75em 1.4em;
	background: transparent;
	border: 1px solid var(--line-strong);
	border-radius: 0;
	color: var(--ink);
	font-family: var(--font-mono);
	font-size: var(--step--2);
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1.2;
	transition: color 0.25s var(--ease), border-color 0.25s var(--ease);
}

.woocommerce ul.products li.product .button:hover,
.woocommerce ul.products li.product .button:focus-visible {
	border-color: var(--ink);
	color: var(--paper);
}

.woocommerce ul.products li.product .button.loading {
	opacity: 0.65;
	pointer-events: none;
}

.woocommerce ul.products li.product .button.added::after {
	content: "✓";
	margin-left: 0.4em;
}

.woocommerce ul.products li.product .onsale {
	position: absolute;
	top: 0.75rem;
	left: 0.75rem;
	right: auto;
	z-index: 2;
	min-height: auto;
	min-width: auto;
	padding: 0.4em 0.75em;
	margin: 0;
	border-radius: 999px;
	background: var(--ink);
	color: var(--paper);
	font-family: var(--font-mono);
	font-size: var(--step--2);
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1;
}

/* Shop pagination in the theme's voice. */
.woocommerce nav.woocommerce-pagination {
	margin-top: var(--space-xl);
	padding-top: var(--space-m);
	border-top: 1px solid var(--line);
}

.woocommerce nav.woocommerce-pagination ul.page-numbers {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	list-style: none;
	margin: 0;
	padding: 0;
	border: 0;
}

.woocommerce nav.woocommerce-pagination ul.page-numbers li {
	border: 0;
}

.woocommerce nav.woocommerce-pagination ul.page-numbers a,
.woocommerce nav.woocommerce-pagination ul.page-numbers span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.5rem;
	min-height: 2.5rem;
	padding-inline: 0.5rem;
	border: 1px solid transparent;
	font-family: var(--font-mono);
	font-size: var(--step--1);
	text-decoration: none;
	color: var(--text-muted);
	transition: color 0.2s var(--ease), border-color 0.2s var(--ease);
}

.woocommerce nav.woocommerce-pagination ul.page-numbers a:hover {
	color: var(--ink);
	border-color: var(--line-strong);
}

.woocommerce nav.woocommerce-pagination ul.page-numbers span.current {
	color: var(--ink);
	border-color: var(--gilt);
	background: color-mix(in srgb, var(--gilt) 10%, transparent);
}

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

.woocommerce-notices-wrapper:empty {
	display: none;
}

/* Notices printed straight under <main> (single product) would span the
   full viewport — pin them to the container measure instead. Wrappers
   already inside a .container are untouched. */
.site-main > .woocommerce-notices-wrapper {
	max-width: calc(var(--container) + var(--gutter) * 2);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.site-main > .woocommerce-notices-wrapper:not(:empty) {
	margin-top: var(--space-m);
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
	list-style: none;
	display: flex;
	align-items: flex-start;
	gap: var(--space-s);
	padding: var(--space-m) var(--space-l);
	margin: 0 0 var(--space-xl);
	border: 1px solid var(--line);
	border-left: 2px solid var(--gilt);
	background: var(--paper-sunken);
	color: var(--text);
	font-size: var(--step-0);
	line-height: 1.55;
}

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

.woocommerce-error {
	border-left-color: #8c2f26;
}

.woocommerce-error li {
	margin: 0;
}

/* Success carries a gilt check medallion. Position and font are reset
   explicitly: Woo pins its own icon font here absolutely, which would lift
   the medallion out of flow and onto the text. */
.woocommerce-message::before {
	content: "✓";
	position: static;
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.75rem;
	height: 1.75rem;
	margin-top: 0.15em;
	border: 1px solid var(--gilt-deep);
	border-radius: 999px;
	color: var(--gilt-deep);
	font-family: var(--font-body);
	font-size: 0.8125rem;
	font-weight: 700;
	line-height: 1;
}

.woocommerce-message .button,
.woocommerce-info .button {
	order: 2;
	margin-left: auto !important;
	float: none;
	flex: 0 0 auto;
}

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */

.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce .cart .button,
.woocommerce .checkout .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	padding: 0.9em 1.7em;
	background: var(--ink);
	border: 1px solid var(--ink);
	border-radius: 0;
	color: var(--paper);
	font-family: var(--font-mono);
	font-size: var(--step--2);
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1.2;
	transition: color 0.25s var(--ease), border-color 0.25s var(--ease);
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce .cart .button:hover,
.woocommerce .checkout .button:hover {
	border-color: var(--gilt);
	color: var(--ink);
}

.woocommerce a.button.disabled,
.woocommerce button.button:disabled,
.woocommerce button.button.disabled,
.woocommerce a.button.alt.disabled,
.woocommerce button.button.alt:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

.woocommerce a.button.disabled:hover,
.woocommerce button.button:disabled:hover {
	background: var(--ink);
	border-color: var(--ink);
	color: var(--paper);
}

/* --------------------------------------------------------------------------
   Button wipe — the same bottom-to-top sweep as .btn
   -------------------------------------------------------------------------- */

/* Woo reuses ::after for its own button states (loading spinner, added
   check), so the sweep lives on ::before here. Negative z-index inside an
   isolated stacking context keeps bare-text labels readable. */
.woocommerce ul.products li.product .button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce .cart .button,
.woocommerce .checkout .button,
.woocommerce #reviews input#submit,
.hero--product form.cart .single_add_to_cart_button.button,
.wc-block-components-button:not(.is-link),
.wp-block-woocommerce-cart .wp-block-button__link,
.wp-block-woocommerce-empty-cart-block .wp-block-paragraph a,
.wc-block-grid__product-add-to-cart .wp-block-button__link {
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

.woocommerce ul.products li.product .button::before,
.woocommerce a.button::before,
.woocommerce button.button::before,
.woocommerce input.button::before,
.woocommerce #respond input#submit::before,
.woocommerce a.button.alt::before,
.woocommerce button.button.alt::before,
.woocommerce input.button.alt::before,
.woocommerce .cart .button::before,
.woocommerce .checkout .button::before,
.woocommerce #reviews input#submit::before,
.hero--product form.cart .single_add_to_cart_button.button::before,
.wc-block-components-button:not(.is-link)::before,
.wp-block-woocommerce-cart .wp-block-button__link::before,
.wp-block-woocommerce-empty-cart-block .wp-block-paragraph a::before,
.wc-block-grid__product-add-to-cart .wp-block-button__link::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--gilt);
	transform: scaleY(0);
	transform-origin: bottom center;
	transition: transform 0.32s var(--ease-out);
	z-index: -1;
}

/* The outline loop button fills with ink rather than gilt. */
.woocommerce ul.products li.product .button::before {
	background: var(--ink);
}

/* The single-product hero button fills with ink rather than gilt. */
.hero--product form.cart .single_add_to_cart_button.button::before {
	background: var(--ink);
}

.woocommerce ul.products li.product .button:hover::before,
.woocommerce ul.products li.product .button:focus-visible::before,
.woocommerce a.button:hover::before,
.woocommerce a.button:focus-visible::before,
.woocommerce button.button:hover::before,
.woocommerce button.button:focus-visible::before,
.woocommerce input.button:hover::before,
.woocommerce input.button:focus-visible::before,
.woocommerce #respond input#submit:hover::before,
.woocommerce #respond input#submit:focus-visible::before,
.woocommerce a.button.alt:hover::before,
.woocommerce a.button.alt:focus-visible::before,
.woocommerce button.button.alt:hover::before,
.woocommerce button.button.alt:focus-visible::before,
.woocommerce input.button.alt:hover::before,
.woocommerce input.button.alt:focus-visible::before,
.woocommerce .cart .button:hover::before,
.woocommerce .cart .button:focus-visible::before,
.woocommerce .checkout .button:hover::before,
.woocommerce .checkout .button:focus-visible::before,
.woocommerce #reviews input#submit:hover::before,
.woocommerce #reviews input#submit:focus-visible::before,
.hero--product form.cart .single_add_to_cart_button.button:hover::before,
.hero--product form.cart .single_add_to_cart_button.button:focus-visible::before,
.wc-block-components-button:not(.is-link):hover::before,
.wc-block-components-button:not(.is-link):focus-visible::before,
.wp-block-woocommerce-cart .wp-block-button__link:hover::before,
.wp-block-woocommerce-cart .wp-block-button__link:focus-visible::before,
.wp-block-woocommerce-empty-cart-block .wp-block-paragraph a:hover::before,
.wp-block-woocommerce-empty-cart-block .wp-block-paragraph a:focus-visible::before,
.wc-block-grid__product-add-to-cart .wp-block-button__link:hover::before,
.wc-block-grid__product-add-to-cart .wp-block-button__link:focus-visible::before {
	transform: scaleY(1);
}

/* No sweep on disabled buttons. */
.woocommerce a.button.disabled::before,
.woocommerce button.button:disabled::before,
.woocommerce button.button.disabled::before,
.woocommerce a.button.alt.disabled::before,
.woocommerce button.button.alt:disabled::before,
.wc-block-components-button:disabled::before {
	display: none;
}

/* Loop and single add-to-cart: the label lives in a span (loop via the
   woocommerce_loop_add_to_cart_link filter, single via
   woocommerce/single-product/add-to-cart/simple.php), so the sweep sits
   above the text exactly like .btn instead of behind it. The generic
   behind-text sweep is switched off here to avoid a double sweep — Woo's
   own ::after states (loading spinner, added check) keep working. */
.woocommerce ul.products li.product .button::before,
.woocommerce button.single_add_to_cart_button.button::before,
.hero--product form.cart .single_add_to_cart_button.button::before {
	display: none;
}

.woocommerce ul.products li.product .button::after {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--ink);
	transform: scaleY(0);
	transform-origin: bottom center;
	transition: transform 0.32s var(--ease-out);
	z-index: 0;
}

.woocommerce ul.products li.product .button > span {
	position: relative;
	z-index: 1;
}

.woocommerce ul.products li.product .button:hover::after,
.woocommerce ul.products li.product .button:focus-visible::after {
	transform: scaleY(1);
}

.single_add_to_cart_button::after {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--gilt);
	transform: scaleY(0);
	transform-origin: bottom center;
	transition: transform 0.32s var(--ease-out);
	z-index: 0;
}

.hero--product .single_add_to_cart_button::after {
	background: var(--ink);
}

.single_add_to_cart_button > span {
	position: relative;
	z-index: 1;
}

.single_add_to_cart_button:hover::after,
.single_add_to_cart_button:focus-visible::after {
	transform: scaleY(1);
}

/* --------------------------------------------------------------------------
   Single product
   -------------------------------------------------------------------------- */

/* Single product: a plain vertical stack (flash, detail grid, tabs,
   related). The two-column spread lives on .product-detail__grid alone, so
   Woo's floats and any grid-item surprises stay out of the picture. */
.woocommerce div.product {
	margin-bottom: var(--space-2xl);
}

.product-detail__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.02fr) minmax(0, 1fr);
	gap: clamp(2rem, 5vw, 4.5rem);
	align-items: start;
	margin-bottom: var(--space-2xl);
}

/* Woo's layout stylesheet floats the gallery at 48% width — revoked, so the
   cover takes the full gallery column. */
.product-detail__gallery div.images {
	float: none;
	width: auto;
	margin: 0;
}

.product-detail__gallery {
	position: sticky;
	top: calc(var(--header-height) + 2rem);
	min-width: 0;
}

/* The slider must fill the gallery column whatever Woo's gallery CSS says. */
.product-detail__gallery .woocommerce-product-gallery {
	width: 100%;
	margin: 0;
}

.product-detail__gallery .woocommerce-product-gallery__wrapper {
	margin: 0;
}

/* Plain single-image cover: nothing but the theme touches these classes. */
.product-detail__cover {
	background: var(--paper-sunken);
}

.product-detail__cover-link {
	display: block;
}

.product-detail__cover-img {
	display: block;
	width: 100%;
	height: auto;
	box-shadow:
		0 1px 1px rgba(0, 0, 0, 0.14),
		0 2px 4px rgba(0, 0, 0, 0.1),
		0 22px 40px -20px rgba(0, 0, 0, 0.55);
}

.product-detail__eyebrow {
	margin-bottom: var(--space-2xs);
	color: var(--gilt-deep);
}

.product-detail__title {
	font-size: var(--step-3);
	line-height: 1.02;
	letter-spacing: -0.02em;
	margin: 0 0 var(--space-s);
	text-wrap: balance;
}

.woocommerce div.product .woocommerce-product-details__short-description {
	font-size: var(--step-1);
	line-height: 1.6;
	color: var(--text-muted);
	margin-bottom: var(--space-l);
}

/* The hero already carries the product title as the page H1. */
.single-product .woocommerce div.product .product_title {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* The loop badge is positioned inside the card matte; the single-product
   flash is a direct child of the grid, so it takes a full row of its own
   instead of floating detached above the gallery. */
.woocommerce .product-detail__gallery span.onsale {
	position: absolute;
	top: 0.75rem;
	left: 0.75rem;
	z-index: 2;
	min-height: auto;
	min-width: auto;
	padding: 0.4em 0.75em;
	margin: 0;
	border-radius: 999px;
	background: var(--ink);
	color: var(--paper);
	font-family: var(--font-mono);
	font-size: var(--step--2);
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1;
}

.woocommerce div.product p.price {
	font-size: var(--step-2);
	color: var(--ink);
}

.woocommerce div.product p.price del {
	color: var(--text-faint);
	opacity: 1;
	margin-right: 0.5em;
}

.woocommerce div.product p.price ins {
	text-decoration: none;
	color: var(--ink);
	font-weight: 500;
}

/* Price with the sale badge riding beside it on the product hero. */
.hero__price-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--space-xs) var(--space-s);
	margin: var(--space-m) 0 0;
}

.hero__price-row span.onsale {
	position: static;
	min-height: auto;
	min-width: auto;
	padding: 0.4em 0.75em;
	margin: 0;
	border-radius: 999px;
	background: var(--ink);
	color: var(--paper);
	font-family: var(--font-mono);
	font-size: var(--step--2);
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1;
}

/* "Vigtig information" as a warning box before the description. */
.product-notice {
	border: 1px solid var(--gilt);
	border-left-width: 4px;
	background: color-mix(in srgb, var(--gilt) 9%, transparent);
	padding: var(--space-m) var(--space-m) var(--space-m) var(--space-l);
}

.product-notice__label {
	color: var(--gilt-deep);
	margin-bottom: var(--space-2xs);
}

.product-notice__body {
	overflow-wrap: break-word;
}

.product-notice__body > :last-child {
	margin-bottom: 0;
}

.product-notice__body a {
	color: var(--gilt-deep);
	/* Long bibliotek.dk URLs must wrap inside the box on small screens. */
	overflow-wrap: anywhere;
}

/* Stock line on the product page: mono caps with a status dot. */
.hero__cart .stock,
.single-product .stock {
	display: flex;
	align-items: center;
	gap: 0.6em;
	margin: var(--space-m) 0 var(--space-s);
	font-family: var(--font-mono);
	font-size: var(--step--2);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--text-muted);
}

.hero__cart .stock::before,
.single-product .stock::before {
	content: "";
	flex: 0 0 auto;
	width: 0.55em;
	height: 0.55em;
	border-radius: 999px;
	background: currentColor;
}

.hero__cart .stock.available-on-backorder,
.single-product .stock.available-on-backorder {
	color: var(--gilt-deep);
}

.hero__cart .stock.out-of-stock,
.single-product .stock.out-of-stock {
	color: #8c2f26;
}

/* Stock line on loop cards: same voice, tighter rhythm. */
.woocommerce ul.products li.product .stock {
	display: flex;
	align-items: center;
	gap: 0.6em;
	margin: var(--space-2xs) 0 var(--space-xs);
	font-family: var(--font-mono);
	font-size: var(--step--2);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--text-muted);
}

.woocommerce ul.products li.product .stock::before {
	content: "";
	flex: 0 0 auto;
	width: 0.55em;
	height: 0.55em;
	border-radius: 999px;
	background: currentColor;
}

.woocommerce ul.products li.product .stock.available-on-backorder {
	color: var(--gilt-deep);
}

.woocommerce ul.products li.product .stock.out-of-stock {
	color: #8c2f26;
}

.woocommerce div.product form.cart {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--space-s);
	margin-bottom: var(--space-m);
}

/* Full-width CTA under the quantity, capped at the hero lead measure. */
.woocommerce div.product form.cart .single_add_to_cart_button {
	flex: 1 1 100%;
	max-width: 36rem;
}

.woocommerce div.product form.cart .quantity {
	width: 5rem;
}

.woocommerce div.product .product_meta {
	margin-top: var(--space-l);
	padding-top: var(--space-m);
	border-top: 1px solid var(--line);
	font-family: var(--font-mono);
	font-size: var(--step--2);
	letter-spacing: 0.06em;
	color: var(--text-muted);
}

.woocommerce div.product .product_meta > span {
	display: block;
	margin-bottom: 0.3rem;
}

.woocommerce div.product .woocommerce-tabs {
	grid-column: 1 / -1;
	margin-top: var(--space-2xl);
	padding-top: var(--space-l);
	border-top: 1px solid var(--line);
}

/* Tabs */
.woocommerce div.product .woocommerce-tabs ul.tabs {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-m);
	margin: 0 0 var(--space-l);
	padding: 0;
	list-style: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs::after {
	display: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
	margin: 0;
	padding: 0;
	background: none;
	border-radius: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
	display: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
	display: inline-block;
	padding-bottom: 0.4rem;
	border-bottom: 1px solid transparent;
	font-family: var(--font-mono);
	font-size: var(--step--2);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--text-muted);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
	color: var(--ink);
	border-bottom-color: var(--gilt);
}

.woocommerce div.product .woocommerce-tabs .woocommerce-Tabs-panel {
	font-size: var(--step-0);
	max-width: 42rem;
}

/* Gallery */
.woocommerce div.product .woocommerce-product-gallery__image img {
	display: block;
	width: 100%;
	background: var(--paper-sunken);
	box-shadow: 0 18px 40px -24px rgba(0, 0, 0, 0.55);
}

.woocommerce div.product .woocommerce-product-gallery__wrapper {
	border: 0;
}

.woocommerce div.product .woocommerce-product-gallery__trigger {
	position: absolute;
	top: 1rem;
	right: 1rem;
	z-index: 5;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	background: var(--paper);
	color: var(--ink);
	font-size: 1rem;
	box-shadow: 0 6px 16px -10px rgba(0, 0, 0, 0.6);
	opacity: 0;
	transition: opacity 0.25s var(--ease), background 0.25s var(--ease);
}

.woocommerce div.product div.images:hover .woocommerce-product-gallery__trigger {
	opacity: 1;
}

/* Gallery thumbnails: small bone plates in a row. */
.woocommerce div.product .flex-control-thumbs {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2xs);
	margin-top: var(--space-s);
	list-style: none;
	padding: 0;
}

.woocommerce div.product .flex-control-thumbs li {
	flex: 0 0 4.5rem;
}

.woocommerce div.product .flex-control-thumbs img {
	display: block;
	width: 100%;
	background: var(--paper-sunken);
	border: 1px solid transparent;
	opacity: 0.75;
	transition: opacity 0.2s var(--ease), border-color 0.2s var(--ease);
}

.woocommerce div.product .flex-control-thumbs img.flex-active,
.woocommerce div.product .flex-control-thumbs img:hover {
	opacity: 1;
	border-color: var(--gilt);
}

/* Quiet note under the cart button (signed copies, contact). */
.product__note {
	margin-top: var(--space-s);
	max-width: 26rem;
}

.product__note a {
	color: var(--gilt-deep);
}

/* Reviews: the default headings and stars stay, the form reads as theme. */
.woocommerce #reviews h2,
.woocommerce #reviews .comment-reply-title {
	font-size: var(--step-2);
	margin-bottom: var(--space-m);
}

.woocommerce #reviews .comment-form-rating label,
.woocommerce #reviews .comment-form label {
	font-family: var(--font-mono);
	font-size: var(--step--2);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--text-muted);
}

.woocommerce #reviews input#submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.9em 1.7em;
	background: var(--ink);
	border: 1px solid var(--ink);
	border-radius: 0;
	color: var(--paper);
	font-family: var(--font-mono);
	font-size: var(--step--2);
	font-weight: 500;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1.2;
	transition: color 0.25s var(--ease), border-color 0.25s var(--ease);
}

.woocommerce #reviews input#submit:hover {
	border-color: var(--gilt);
	color: var(--ink);
}

/* Related products get a full section head with the theme's eyebrow. The
   section spans edge to edge by default, so it is pulled back onto the
   container measure like every other section. */
.related.products,
.upsells.products {
	max-width: calc(var(--container) + var(--gutter) * 2);
	margin: var(--space-2xl) auto 0;
	padding: var(--space-xl) var(--gutter) 0;
}

/* On a product page the description section above already closes with its own
   padding, so the related block sets itself off with its padding alone — a
   top margin on top of that stacks a second gap. Cross-sells on the cart page
   have no section above them and keep theirs. */
.related.products {
	margin-top: 0;
}

.related.products::before,
.upsells.products::before {
	content: "";
	display: block;
	width: 3rem;
	height: 1px;
	background: var(--gilt);
	margin-bottom: var(--space-2xs);
}

.related.products > h2,
.upsells.products > h2 {
	font-size: var(--step-2);
	margin-bottom: var(--space-l);
}

/* Star ratings */
.woocommerce .star-rating,
.woocommerce .woocommerce-result-count {
	color: var(--gilt-deep);
}

.woocommerce .woocommerce-result-count {
	font-family: var(--font-mono);
	font-size: var(--step--2);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--text-muted);
}

/* --------------------------------------------------------------------------
   Cart and checkout
   -------------------------------------------------------------------------- */

.woocommerce table.shop_table,
.woocommerce-page table.shop_table {
	width: 100%;
	border-collapse: collapse;
	border: 0;
	margin: 0 0 var(--space-xl);
}

.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
	padding: var(--space-m) 0;
	border-bottom: 1px solid var(--line);
	text-align: left;
	font-size: var(--step-0);
	vertical-align: middle;
}

.woocommerce table.shop_table th {
	font-family: var(--font-mono);
	font-size: var(--step--2);
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--text-muted);
}

.woocommerce table.shop_table thead th {
	border-bottom-color: var(--ink);
}

.woocommerce table.shop_table td.product-name a {
	text-decoration: none;
	color: var(--ink);
	font-family: var(--font-display);
	font-size: var(--step-1);
}

.woocommerce table.shop_table td.product-name a:hover {
	color: var(--gilt-deep);
}

.woocommerce table.shop_table .product-remove a {
	font-family: var(--font-mono);
	font-size: var(--step--2);
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--text-faint);
}

.woocommerce table.shop_table .product-remove a:hover {
	color: #8c2f26;
}

.woocommerce .quantity input.qty {
	width: 5rem;
	padding: 0.5em 0.6em;
	border: 1px solid var(--line-strong);
	background: var(--paper-raised);
	font-family: var(--font-mono);
	font-size: var(--step--1);
	text-align: center;
}

.cart-collaterals,
.woocommerce-checkout-review-order,
.woocommerce-checkout-payment {
	margin-top: var(--space-xl);
}

.cart_totals h2,
.woocommerce-checkout-review-order h3,
#order_review_heading,
.woocommerce-billing-fields h3,
.woocommerce-additional-fields h3,
#order_review {
	font-family: var(--font-display);
	font-size: var(--step-2);
	font-variation-settings: "SOFT" 16, "WONK" 1;
	margin-bottom: var(--space-m);
}

.cart_totals .cart_totals_inner {
	justify-content: flex-end;
}

.woocommerce-checkout {
	grid-template-columns: minmax(0, 1fr);
	gap: var(--space-xl);
}

.woocommerce-checkout .col2-set {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(20rem, 100%), 1fr));
	gap: var(--space-xl);
}

.woocommerce form .form-row {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	margin: 0 0 var(--space-m);
	padding: 0;
}

.woocommerce form .form-row label {
	font-family: var(--font-mono);
	font-size: var(--step--2);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--text-muted);
}

.woocommerce form .form-row .required {
	color: var(--gilt-deep);
	text-decoration: none;
}

.woocommerce form .form-row-first,
.woocommerce form .form-row-last {
	width: 100%;
	float: none;
}

.woocommerce .select2-container .select2-selection--single {
	border: 1px solid var(--line-strong);
	border-radius: 0;
	background: var(--paper-raised);
	min-height: 2.9rem;
}

.woocommerce .select2-container .select2-selection--single .select2-selection__rendered {
	line-height: 2.9rem;
	padding-inline: 0.9em;
	font-size: var(--step-0);
}

/* --------------------------------------------------------------------------
   Account, orders, checkout placeholders
   -------------------------------------------------------------------------- */

.woocommerce-account .woocommerce-navigation ul,
.woocommerce-MyAccount-navigation ul {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-s) var(--space-l);
	border-bottom: 1px solid var(--line);
	padding-bottom: var(--space-m);
	margin-bottom: var(--space-xl);
}

.woocommerce-account .woocommerce-navigation a,
.woocommerce-MyAccount-navigation a {
	font-family: var(--font-mono);
	font-size: var(--step--2);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--text-muted);
}

.woocommerce-account .woocommerce-navigation a:hover,
.woocommerce-MyAccount-navigation a:hover,
.woocommerce-MyAccount-navigation .is-active a {
	color: var(--ink);
}

.woocommerce-AddressWidget-title,
.woocommerce-account h2 {
	font-size: var(--step-2);
}

.woocommerce-form-login,
.woocommerce-form-register {
	max-width: 28rem;
}

.woocommerce form.login,
.woocommerce form.checkout_customer_login {
	border: 0;
	padding: 0;
	margin: 0;
}

.woocommerce-checkout-placeholder {
	max-width: 44rem;
	padding: var(--space-l);
	border: 1px dashed var(--line-strong);
	background: var(--paper-sunken);
}

.woocommerce-checkout-placeholder h2 {
	margin-bottom: var(--space-s);
}

/* --------------------------------------------------------------------------
   Block-based cart and checkout — in the theme's voice
   -------------------------------------------------------------------------- */

/* The blocks paint their own type scale; bring it back to Poppins for
   headings, Newsreader for reading, Plex Mono for numbers and labels. */
.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout,
.wp-block-woocommerce-empty-cart-block {
	font-family: var(--font-body);
	color: var(--text);
}

/* The order summary is always fully visible: no collapsed state, no
   toggle chevron. */
.wp-block-woocommerce-checkout .wc-block-components-checkout-order-summary__content {
	display: block;
}

.wp-block-woocommerce-checkout .wc-block-components-checkout-order-summary__title {
	cursor: default;
}

.wp-block-woocommerce-checkout .wc-block-components-checkout-order-summary__title-icon {
	display: none;
}

/* Pensopay card icons get their own row under the method label instead of
   squeezing in at the label's right edge. */
.wc-block-components-radio-control .blocks-woocommerce-pensopay-inner {
	flex-wrap: wrap;
	row-gap: 0.5rem;
}

.wc-block-components-radio-control .blocks-woocommerce-pensopay-inner__icons {
	flex: 1 1 100%;
}

/* The cart/checkout blocks ship with alignwide, which is meant to break out
   of a narrow prose column. Inside the shop container they are already full
   measure, so the breakout overshoots the site grid by a gutter on each
   side. Neutralise it: the blocks align with header, hero and footer text. */
.ala-shop__inner > .alignwide {
	width: 100%;
	max-width: 100%;
	margin-inline: 0;
}

.wp-block-woocommerce-cart h2,
.wp-block-woocommerce-checkout h2,
.wc-block-components-title {
	font-family: var(--font-display) !important;
	font-weight: 500 !important;
	letter-spacing: -0.01em !important;
	color: var(--ink) !important;
}

/* Primary block buttons: ink, square, mono caps, gilt on hover. */
.wc-block-components-button:not(.is-link),
.wp-block-woocommerce-cart .wp-block-button__link,
.wc-block-grid__product-add-to-cart .wp-block-button__link {
	border-radius: 0 !important;
	background: var(--ink) !important;
	border: 1px solid var(--ink) !important;
	color: var(--paper) !important;
	font-family: var(--font-mono) !important;
	font-size: var(--step--2) !important;
	font-weight: 500 !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	padding: 0.9em 1.7em !important;
	transition: color 0.25s var(--ease), border-color 0.25s var(--ease) !important;
}

.wc-block-components-button:not(.is-link):hover,
.wp-block-woocommerce-cart .wp-block-button__link:hover,
.wc-block-grid__product-add-to-cart .wp-block-button__link:hover {
	border-color: var(--gilt) !important;
	color: var(--ink) !important;
}

.wc-block-components-button:not(.is-link):disabled {
	opacity: 0.45 !important;
}

/* Text links inside blocks read as catalogue links, not blue. */
.wp-block-woocommerce-cart a:not(.wp-block-button__link):not(.wc-block-components-button),
.wp-block-woocommerce-checkout a:not(.wp-block-button__link):not(.wc-block-components-button) {
	color: var(--gilt-deep);
}

.wp-block-woocommerce-cart a:not(.wp-block-button__link):hover,
.wp-block-woocommerce-checkout a:not(.wp-block-button__link):hover {
	color: var(--ink);
}

/* Inputs: square, hairline border, gilt focus — same as theme inputs. */
.wc-block-components-text-input input,
.wc-block-components-form .wc-blocks-components-text-input input,
.wc-block-components-form .wc-blocks-components-form__input,
.wc-block-components-combobox input,
.wc-block-components-select select {
	border: 1px solid var(--line-strong) !important;
	border-radius: 0 !important;
	background: var(--paper-raised) !important;
	color: var(--ink) !important;
	font-family: var(--font-body) !important;
	font-size: var(--step-0) !important;
}

.wc-block-components-text-input label {
	font-family: var(--font-mono) !important;
	color: var(--text-muted) !important;
}

.wc-block-components-text-input input:focus,
.wc-block-components-combobox input:focus {
	border-color: var(--gilt) !important;
	box-shadow: 0 0 0 1px var(--gilt) !important;
}

.wc-block-components-checkbox label,
.wc-block-components-radio-control label {
	font-size: var(--step--1) !important;
	color: var(--text) !important;
}

/* Notices: bone panel with a gilt rule, like theme notices. */
.wc-block-components-notice-banner {
	border: 0 !important;
	border-left: 2px solid var(--gilt) !important;
	border-radius: 0 !important;
	background: var(--paper-sunken) !important;
	color: var(--text) !important;
	gap: var(--space-s) !important;
}

.wc-block-components-notice-banner.is-error {
	border-left-color: #8c2f26 !important;
}

.wc-block-components-notice-banner__content {
	font-size: var(--step-0) !important;
}

/* --- Filled cart: line items + totals sidebar. --- */
.wc-block-cart {
	border: 0 !important;
}

.wc-block-cart-items {
	border-top: 1px solid var(--ink) !important;
}

.wc-block-cart-items__row {
	border-bottom: 1px solid var(--line) !important;
	padding-block: var(--space-m) !important;
}

.wc-block-cart-item__image img {
	background: var(--paper-sunken) !important;
}

.wc-block-cart-item__product a {
	font-family: var(--font-display) !important;
	font-size: var(--step-1) !important;
	text-decoration: none !important;
	color: var(--ink) !important;
}

.wc-block-cart-item__product a:hover {
	color: var(--gilt-deep) !important;
}

.wc-block-cart-item__prices,
.wc-block-cart-item__total .wc-block-formatted-money-amount {
	font-family: var(--font-mono) !important;
	font-size: var(--step--1) !important;
	letter-spacing: 0.04em !important;
}

.wc-block-cart-item__quantity .wc-block-components-quantity-selector {
	border: 1px solid var(--line-strong) !important;
	border-radius: 0 !important;
	background: var(--paper-raised) !important;
}

.wc-block-cart-item__quantity .wc-block-components-quantity-selector input {
	font-family: var(--font-mono) !important;
}

.wc-block-cart-item__remove-link {
	font-family: var(--font-mono) !important;
	font-size: var(--step--2) !important;
	letter-spacing: 0.08em !important;
	text-transform: uppercase !important;
	text-decoration: none !important;
	color: var(--text-faint) !important;
}

.wc-block-cart-item__remove-link:hover {
	color: #8c2f26 !important;
}

/* Woo prints the unit price twice on a sale item: once under the product
   name and again in the total column, where both lines carry the same figure.
   The total column is the one that is aligned and labelled, so drop the
   duplicate from the product cell. The checkout order summary reuses the same
   markup, hence the second selector. */
.wc-block-cart table.wc-block-cart-items .wc-block-cart-item__prices,
.wp-block-woocommerce-checkout .wc-block-cart-item__prices {
	display: none;
}

/* The short description is worth reading on a product page, not in a basket.
   Drop it from the cart line item and the checkout summary so both stay a
   list of titles, quantities and prices. */
.wp-block-woocommerce-cart .wc-block-components-product-metadata,
.wp-block-woocommerce-checkout .wc-block-components-product-metadata {
	display: none;
}

/* --- Narrow cart: re-flow the line item grid.
   Below 920px of cart width WooCommerce switches the cart table to a grid
   with fixed 80px / 132px tracks and lets the price spill into two more
   implicit tracks. On a phone those tracks add up to more than the cart is
   wide, so the row — and with it the whole page — scrolls sideways. Give the
   row a flexible middle column instead and drop the quantity underneath,
   which keeps the line item readable without a horizontal scrollbar. */
.wc-block-cart table.wc-block-cart-items {
	max-width: 100%;
}

@container (max-width: 560px) {
	.wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row {
		grid-template-columns: 4.5rem minmax(0, 1fr) auto;
		column-gap: var(--space-s);
		row-gap: var(--space-xs);
		min-width: 0;
	}

	.wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__image {
		grid-column: 1;
		grid-row: 1;
		padding-right: 0;
	}

	.wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__product {
		grid-column: 2 / auto;
		grid-row: 1;
		justify-self: stretch;
		min-width: 0;
	}

	.wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__total {
		grid-column: 3;
		grid-row: 1;
		align-self: baseline;
		justify-self: end;
		white-space: nowrap;
	}

.wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity {
		grid-column: 1 / -1;
		grid-row: 2;
		padding-right: 0;
		padding-top: 0;
		vertical-align: top;
	}
}

/* On a small phone even three tracks crowd the product name, so the price
   moves onto its own line and the quantity sits below the row. */
@container (max-width: 400px) {
	.wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row {
		grid-template-columns: 3.75rem minmax(0, 1fr);
	}

	.wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__image {
		grid-column: 1;
		grid-row: 1;
	}

	.wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__product {
		grid-column: 2;
		grid-row: 1;
	}

	.wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__total {
		grid-column: 2;
		grid-row: 2;
		justify-self: end;
	}

	.wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__total::before {
		content: "Sum";
		align-self: baseline;
		margin-right: var(--space-xs);
		font-family: var(--font-mono);
		font-size: var(--step--2);
		letter-spacing: 0.1em;
		text-transform: uppercase;
		color: var(--text-faint);
	}

	.wc-block-cart table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__quantity {
		grid-column: 1 / -1;
		grid-row: 3;
	}
}

/* --- Checkout order summary.
   Woo renders the summary line item as a flex row: thumbnail, description,
   total. The description has no min-width floor, so the moment its contents
   (product name, price, excerpt) ask for more room than the card has, the
   whole row spills out and gets clipped. Let the description shrink and wrap,
   and keep the total at its intrinsic width on the right. */
.wp-block-woocommerce-checkout-order-summary-block {
	container-type: inline-size;
	container-name: ala-ordre;
}

.wp-block-woocommerce-checkout .wc-block-components-order-summary-item__description {
	min-width: 0;
	flex: 1 1 auto;
}

.wp-block-woocommerce-checkout .wc-block-components-order-summary-item__total-price {
	flex: 0 0 auto;
	margin-left: auto;
}

/* The savings badge is a block below the price; on a phone it is wide enough
   to become the row's widest child, so let it wrap with the price. */
.wp-block-woocommerce-checkout .wc-block-components-order-summary-item__total-price .wc-block-components-sale-badge {
	white-space: normal;
}

/* The summary is a narrow column in the checkout sidebar even on a wide
   screen, so measure the card and not the window. Once the card can no
   longer fit thumbnail, description and total on one line, stack the total
   under the description rather than crushing the title into a letter stack. */
@container ala-ordre (max-width: 26rem) {
	.wp-block-woocommerce-checkout .wc-block-components-order-summary-item {
		display: grid;
		grid-template-columns: 3rem minmax(0, 1fr);
		gap: var(--space-2xs) var(--space-s);
	}

	.wp-block-woocommerce-checkout .wc-block-components-order-summary-item__image {
		grid-column: 1;
		grid-row: 1;
		width: 3rem;
		margin-top: 0;
		padding-bottom: 0;
	}

	.wp-block-woocommerce-checkout .wc-block-components-order-summary-item__image > img {
		max-width: 3rem;
		width: 3rem;
	}

	.wp-block-woocommerce-checkout .wc-block-components-order-summary-item__description {
		grid-column: 2;
		grid-row: 1;
	}

	.wp-block-woocommerce-checkout .wc-block-components-order-summary-item__total-price {
		grid-column: 2;
		grid-row: 2;
		justify-self: start;
	}
}

/* Totals sidebar reads as a quiet card on bone. */
.wp-block-woocommerce-cart-order-summary-block,
.wc-block-components-sidebar .wp-block-woocommerce-cart-order-summary-block {
	border: 1px solid var(--line) !important;
	background: var(--paper-sunken) !important;
	padding: var(--space-l) !important;
}

.wc-block-components-totals-item__label,
.wc-block-components-totals-coupon__label {
	font-family: var(--font-mono) !important;
	font-size: var(--step--2) !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	color: var(--text-muted) !important;
}

.wc-block-components-totals-item__value,
.wc-block-components-order-summary-item__total-price {
	font-family: var(--font-mono) !important;
	letter-spacing: 0.04em;
}

.wc-block-components-sidebar .wc-block-components-panel__button {
	font-family: var(--font-mono) !important;
	font-size: var(--step--2) !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
}

.wc-block-components-totals-coupon__button {
	border: 1px solid var(--line-strong) !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: var(--ink) !important;
	font-family: var(--font-mono) !important;
	font-size: var(--step--2) !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
}

.wc-block-components-totals-coupon__button:hover {
	background: var(--ink) !important;
	color: var(--paper) !important;
}

/* --- Empty cart.
   The block ships a centred sad-face badge, a shouting heading and a dotted
   rule, none of which belong on this site. It now sets its own left alignment,
   type and button so an empty cart sits in the same voice as a full one. --- */
.wp-block-woocommerce-empty-cart-block {
	padding-top: var(--space-l);
}

.wp-block-woocommerce-empty-cart-block .wc-block-cart__empty-cart__title {
	font-family: var(--font-display) !important;
	font-size: var(--step-2) !important;
	font-weight: 500 !important;
	letter-spacing: -0.01em;
	color: var(--ink) !important;
	text-align: left !important;
}

/* Drop the sad-face badge Woo prints before the heading. */
.wp-block-woocommerce-empty-cart-block .wc-block-cart__empty-cart__title::before,
.wp-block-woocommerce-empty-cart-block .with-empty-cart-icon::before {
	display: none !important;
}

/* The count, set the way the site sets every other data label. */
.wp-block-woocommerce-empty-cart-block .wc-block-cart__empty-cart__title::after {
	content: "0 varer";
	display: block;
	margin-top: var(--space-2xs);
	font-family: var(--font-mono);
	font-size: var(--step--2);
	font-weight: 400;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--text-muted);
}

.wp-block-woocommerce-empty-cart-block .wp-block-paragraph {
	text-align: left !important;
}

/* The hero add-to-cart button is the site's primary action: gilt ground, ink
   label, filling with ink on hover. An empty cart offers exactly one action,
   so it wears the same button. The sweep itself comes from the shared
   block-button system earlier in this file — this link is already listed
   there — so only the colours are restated here. The block re-renders on the
   client when the cart changes, so the class cannot be added to the markup. */
.wp-block-woocommerce-empty-cart-block .wp-block-paragraph a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	margin-top: var(--space-m);
	padding: 0.9em 1.7em;
	border: 1px solid var(--gilt);
	background: var(--gilt);
	/* The block sits inside .wp-block-woocommerce-cart, whose "text links
	   read as catalogue links" rule outranks this one. Both the resting and
	   the hover colour need the weight to get past it. */
	color: var(--ink) !important;
	font-family: var(--font-mono);
	font-size: var(--step--2);
	font-weight: 500;
	letter-spacing: 0.1em;
	line-height: 1.2;
	text-transform: uppercase;
	text-decoration: none;
	transition: color 0.3s var(--ease), border-color 0.3s var(--ease);
}

/* The hero button fills with ink rather than gilt, so this one does too. */
.wp-block-woocommerce-empty-cart-block .wp-block-paragraph a::before {
	background: var(--ink);
}

.wp-block-woocommerce-empty-cart-block .wp-block-paragraph a:hover,
.wp-block-woocommerce-empty-cart-block .wp-block-paragraph a:focus-visible {
	color: var(--paper) !important;
	border-color: var(--ink);
}

/* An empty basket has nothing to sell, so the block's "Ny i webshop" grid —
   and the rule and heading that introduce it — stay on the shop page. */
.wp-block-woocommerce-empty-cart-block .wp-block-separator,
.wp-block-woocommerce-empty-cart-block > .wp-block-heading:not(.wc-block-cart__empty-cart__title),
.wp-block-woocommerce-empty-cart-block .wc-block-grid {
	display: none;
}

/* "New in store" grid: theme cards, not default blocks. */
.wc-block-grid__products {
	gap: clamp(1.5rem, 3vw, 2.5rem) !important;
}

.wc-block-grid__product {
	border: 0 !important;
	text-align: left !important;
}

.wc-block-grid__product-image {
	background: var(--paper-sunken) !important;
	margin-bottom: var(--space-s) !important;
}

.wc-block-grid__product-image img {
	object-fit: contain !important;
}

.wc-block-grid__product-onsale {
	top: 0.75rem !important;
	right: auto !important;
	left: 0.75rem !important;
	background: var(--ink) !important;
	border: 0 !important;
	border-radius: 999px !important;
	color: var(--paper) !important;
	font-family: var(--font-mono) !important;
	font-size: var(--step--2) !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	padding: 0.4em 0.75em !important;
}

.wc-block-grid__product-title {
	font-family: var(--font-display) !important;
	font-size: var(--step-1) !important;
	color: var(--ink) !important;
	margin-bottom: 0.3rem !important;
}

.wc-block-grid__product-price {
	font-family: var(--font-mono) !important;
	font-size: var(--step--1) !important;
	color: var(--text) !important;
}

.wc-block-grid__product-price del {
	color: var(--text-faint) !important;
	margin-right: 0.5em !important;
}

.wc-block-grid__product-price ins {
	text-decoration: none !important;
	color: var(--gilt-deep) !important;
}

/* --- Checkout: steps left, sticky summary right. --- */
.wc-block-checkout__main {
	gap: var(--space-l) !important;
}

.wc-block-components-checkout-step__title {
	font-size: var(--step-2) !important;
}

.wc-block-components-checkout-step__description {
	color: var(--text-muted) !important;
	font-size: var(--step--1) !important;
}

.wp-block-woocommerce-checkout-order-summary-block {
	border: 1px solid var(--line) !important;
	background: var(--paper-sunken) !important;
	padding: var(--space-l) !important;
}

.wc-block-components-order-summary-item__image img {
	background: var(--paper) !important;
	border: 1px solid var(--line) !important;
}

.wc-block-components-order-summary-item__title {
	font-family: var(--font-display) !important;
	color: var(--ink) !important;
}

.wc-block-components-order-summary-item__quantity {
	font-family: var(--font-mono) !important;
	color: var(--text-muted) !important;
}

.wc-block-components-payment-method {
	border: 1px solid var(--line) !important;
	border-radius: 0 !important;
	background: var(--paper-raised) !important;
}

.wc-block-components-payment-method--active {
	border-color: var(--gilt) !important;
	box-shadow: 0 0 0 1px var(--gilt) !important;
}

.wc-block-components-terms label a {
	color: var(--gilt-deep) !important;
}

.wc-block-checkout__actions .wc-block-components-checkout-place-order-button {
	width: 100% !important;
}

/* --- Order confirmation.
   The classic receipt arrives unstyled: a bare success line, a horizontal
   metadata list, a two-column table, action buttons, and two address blocks.
   Give it the same editorial grammar as the rest of the shop — a confirmation
   panel, mono labels, hairline rules, one readable measure per column — and
   keep every control on a real button. */
body.woocommerce-order-received .woocommerce-thankyou-order-received {
	margin: 0 0 var(--space-xl);
	padding: var(--space-m) var(--space-l);
	border: 1px solid var(--line);
	border-left: 2px solid var(--gilt);
	background: var(--paper-sunken);
	color: var(--ink);
	font-family: var(--font-display);
	font-size: var(--step-1);
	line-height: 1.35;
	max-width: 44rem;
}

body.woocommerce-order-received ul.order_details {
	list-style: none;
	margin: 0 0 var(--space-xl);
	padding: var(--space-l) 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(11rem, 100%), 1fr));
	gap: var(--space-m) var(--space-xl);
	border-top: 1px solid var(--ink);
	border-bottom: 1px solid var(--line);
}

/* Woo's clearfix pseudo-elements would otherwise occupy grid tracks and push
   the real receipt items one column to the right. */
body.woocommerce-order-received ul.order_details::before,
body.woocommerce-order-received ul.order_details::after {
	content: none;
}

body.woocommerce-order-received ul.order_details li {
	display: flex;
	flex-direction: column;
	gap: 0.3rem;
	min-width: 0;
	font-family: var(--font-mono);
	font-size: var(--step--2);
	font-weight: 400;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--text-muted);
}

body.woocommerce-order-received ul.order_details li strong {
	display: block;
	font-family: var(--font-body);
	font-size: var(--step-0);
	font-weight: 400;
	letter-spacing: 0;
	text-transform: none;
	line-height: 1.5;
	color: var(--ink);
	overflow-wrap: anywhere;
}

body.woocommerce-order-received .woocommerce-order-details {
	margin-top: var(--space-xl);
}

body.woocommerce-order-received .woocommerce-order-details__title,
body.woocommerce-order-received .woocommerce-column__title {
	font-size: var(--step-2);
	margin-bottom: var(--space-m);
}

body.woocommerce-order-received .woocommerce-table--order-details tfoot th {
	white-space: normal;
}

body.woocommerce-order-received .woocommerce-table--order-details .order-actions-button {
	margin: 0 var(--space-xs) var(--space-2xs) 0;
}

body.woocommerce-order-received .woocommerce-table--order-details .order-actions-button:last-child {
	margin-right: 0;
}

body.woocommerce-order-received .woocommerce-customer-details {
	margin-top: var(--space-2xl);
}

body.woocommerce-order-received .woocommerce-customer-details .col2-set.addresses {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(22rem, 100%), 1fr));
	gap: var(--space-xl);
	width: 100%;
}

/* Woo's clearfix pseudo-elements would otherwise occupy grid tracks and move
   the billing column out of place. */
body.woocommerce-order-received .woocommerce-customer-details .col2-set.addresses::before,
body.woocommerce-order-received .woocommerce-customer-details .col2-set.addresses::after {
	content: none;
}

body.woocommerce-order-received .woocommerce-customer-details .col-1,
body.woocommerce-order-received .woocommerce-customer-details .col-2 {
	float: none;
	width: auto;
	margin: 0;
}

body.woocommerce-order-received .woocommerce-customer-details address {
	margin-top: var(--space-s);
	padding: var(--space-l);
	border: 1px solid var(--line);
	background: var(--paper-sunken);
	font-style: normal;
	line-height: 1.65;
	overflow-wrap: anywhere;
}

body.woocommerce-order-received .woocommerce-customer-details address p {
	margin: 0.6em 0 0;
}

/* --------------------------------------------------------------------------
   Coming-soon screen (store visibility): on-theme while it lasts
   -------------------------------------------------------------------------- */

.woocommerce-coming-soon-store-only {
	max-width: 46rem;
	margin-inline: auto;
	padding-block: var(--space-xl) var(--space-2xl);
	text-align: center;
}

.woocommerce-coming-soon-store-only .wp-block-spacer {
	height: var(--space-l) !important;
}

.woocommerce-coming-soon-store-only .wp-block-heading {
	font-family: var(--font-display) !important;
	font-weight: 500 !important;
	letter-spacing: -0.02em !important;
	line-height: 1.05 !important;
	color: var(--ink) !important;
}

.woocommerce-coming-soon-store-only .has-cardo-font-family {
	font-family: var(--font-display) !important;
}

.woocommerce-coming-soon-store-only .wp-block-paragraph {
	font-family: var(--font-body) !important;
	font-size: var(--step-1) !important;
	color: var(--text-muted) !important;
}

.woocommerce-coming-soon-store-only .has-inter-font-family {
	font-family: var(--font-body) !important;
}

/* --------------------------------------------------------------------------
   Mini-cart and off-canvas
   -------------------------------------------------------------------------- */

.woocommerce-mini-cart {
	font-family: var(--font-body);
}

.woocommerce-mini-cart__buttons .button {
	flex: 1 1 auto;
}

.woocommerce-mini-cart__total {
	font-family: var(--font-mono);
	font-size: var(--step-0);
	letter-spacing: 0.04em;
}

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

@media (max-width: 1024px) {
	.woocommerce ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.product-detail__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.product-detail__gallery {
		position: static;
		max-width: 24rem;
	}
}

@media (max-width: 700px) {
	.shop-toolbar {
		flex-direction: column;
		align-items: stretch;
	}

	.shop-toolbar .woocommerce-ordering,
	.shop-toolbar .woocommerce-ordering select {
		width: 100%;
	}

	.woocommerce ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: var(--space-l) var(--space-s);
	}

	/* Customizer: a single stacked column for the archive and related
	   products on small screens. The .woocommerce class sits on the body
	   itself here, so it must be chained, not descended from. */
	body.ala-mcols-1.woocommerce ul.products {
		grid-template-columns: minmax(0, 1fr);
	}

	.woocommerce ul.products li.product .woocommerce-loop-product__title {
		font-size: var(--step-0);
	}

	.woocommerce ul.products li.product .button {
		width: 100%;
		padding: 0.7em 0.9em;
	}

	/* Block grids and summaries stack comfortably on phones. */
	.wc-block-grid.has-4-columns .wc-block-grid__products,
	.wc-block-grid.has-3-columns .wc-block-grid__products {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	}

	.wp-block-woocommerce-cart-order-summary-block,
	.wp-block-woocommerce-checkout-order-summary-block {
		padding: var(--space-m) !important;
	}

	.woocommerce table.shop_table thead {
		display: none;
	}

	.woocommerce table.shop_table,
	.woocommerce table.shop_table tbody,
	.woocommerce table.shop_table tr,
	.woocommerce table.shop_table td {
		display: block;
		width: 100%;
	}

	.woocommerce table.shop_table tr.cart_item {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 0 var(--space-m);
		padding-block: var(--space-m);
		border-bottom: 1px solid var(--line);
	}

	.woocommerce table.shop_table td::before {
		content: attr(data-title) ": ";
		font-family: var(--font-mono);
		font-size: var(--step--2);
		letter-spacing: 0.08em;
		text-transform: uppercase;
		color: var(--text-faint);
	}

	.woocommerce table.shop_table td.product-thumbnail,
	.woocommerce table.shop_table td.product-name,
	.woocommerce table.shop_table td.product-price {
		grid-column: 1;
	}

	.woocommerce table.shop_table td.product-subtotal,
	.woocommerce table.shop_table td.product-remove {
		grid-column: 2;
		grid-row: 2;
		text-align: right;
	}

	/* The confirmation table has no data-title attributes, so the cart's
	   generated labels would only print bare colons. Give its own rows an
	   explicit two-column shape instead. */
	body.woocommerce-order-received ul.order_details {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--space-m);
		padding: var(--space-m) 0;
	}

	body.woocommerce-order-received .woocommerce-table--order-details tr {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 0 var(--space-m);
		align-items: baseline;
	}

	body.woocommerce-order-received .woocommerce-table--order-details td::before {
		content: none;
	}

	body.woocommerce-order-received .woocommerce-table--order-details .woocommerce-table__product-total,
	body.woocommerce-order-received .woocommerce-table--order-details tfoot td {
		min-width: 0;
		text-align: right;
		overflow-wrap: anywhere;
	}

	body.woocommerce-order-received .woocommerce-table--order-details tr:has(.order-actions-button) td {
		grid-column: 1 / -1;
		display: flex;
		flex-wrap: wrap;
		gap: var(--space-xs);
		justify-content: flex-end;
		text-align: left;
	}

	body.woocommerce-order-received .woocommerce-table--order-details .order-actions-button {
		flex: 1 1 9rem;
		justify-content: center;
		margin: 0;
	}

	.woocommerce .cart-collaterals .cart_totals,
	.woocommerce-page .cart-collaterals .cart_totals {
		width: 100%;
	}

	/* Notices stack on a phone. The message is a bare text node with a floated
	   action sitting inside it, so neither a flex nor a grid stack can pull the
	   action out cleanly — the text and the action arrive as one anonymous
	   item. A block layout with the icon floated and the action clearing below
	   it reads correctly whatever the length of the message. */
	.woocommerce-message,
	.woocommerce-info,
	.woocommerce-error {
		display: block;
		padding: var(--space-m);
	}

	.woocommerce-message::before,
	.woocommerce-info::before,
	.woocommerce-error::before {
		float: left;
		margin: 0 var(--space-s) var(--space-2xs) 0;
	}

	.woocommerce .woocommerce-message > .button,
	.woocommerce .woocommerce-info > .button,
	.woocommerce .woocommerce-error > .button {
		display: flex !important;
		width: fit-content;
		float: none !important;
		clear: both;
		margin: var(--space-s) 0 0 !important;
	}
}

@media (max-width: 400px) {
	.woocommerce ul.products {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* --------------------------------------------------------------------------
   Order confirmation — editorial receipt (theme templates in
   woocommerce/checkout/thankyou.php + woocommerce/order/*).
   -------------------------------------------------------------------------- */

/* The legacy list is kept in the DOM for plugins, but visitors see the
   definition list in thankyou.php. */
body.woocommerce-order-received .ala-order-meta--legacy {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Confirmation panel: bone card, gilt spine, check medallion. */
.ala-thankyou-panel {
	display: flex;
	gap: var(--space-m);
	align-items: flex-start;
	padding: var(--space-l);
	margin: 0 0 var(--space-xl);
	border: 1px solid var(--line);
	border-left: 2px solid var(--gilt);
	background: var(--paper-sunken);
	max-width: 46rem;
}

.ala-thankyou-panel--error {
	border-left-color: #8c2f26;
}

.ala-thankyou-panel__check {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 3rem;
	height: 3rem;
	border: 1px solid var(--gilt-deep);
	border-radius: 999px;
	color: var(--gilt-deep);
	background: var(--paper);
}

.ala-thankyou-panel--error .ala-thankyou-panel__check {
	border-color: #8c2f26;
	color: #8c2f26;
}

/* The base stylesheet sets svg { fill: currentColor }, which overrides the
   fill="none" presentation attribute and turns stroked marks into blobs.
   Inline style already guards the panels, this locks it in. */
.ala-thankyou-panel__check svg {
	fill: none;
	stroke: currentColor;
	flex: 0 0 auto;
	display: block;
}

.ala-thankyou-panel__body {
	min-width: 0;
}

.ala-thankyou-panel__eyebrow {
	margin: 0 0 var(--space-2xs);
	color: var(--gilt-deep);
}

.ala-thankyou-panel__title {
	font-family: var(--font-display);
	font-size: var(--step-2);
	line-height: 1.1;
	letter-spacing: -0.01em;
	margin: 0 0 var(--space-xs);
	color: var(--ink);
	text-wrap: balance;
}

.ala-thankyou-panel__text {
	margin: 0;
	font-size: var(--step-1);
	line-height: 1.6;
	color: var(--text);
	max-width: 36rem;
}

.ala-thankyou-panel__note {
	margin: var(--space-s) 0 0;
	color: var(--text-muted);
}

.ala-thankyou-panel__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-xs);
	margin: var(--space-m) 0 0;
}

/* Order meta: five facts on one ruled band, no floats. */
.ala-order-meta {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(11rem, 100%), 1fr));
	gap: var(--space-m) var(--space-xl);
	margin: 0 0 var(--space-xl);
	padding: var(--space-l) 0;
	border-top: 1px solid var(--ink);
	border-bottom: 1px solid var(--line);
}

.ala-order-meta__item {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	min-width: 0;
	margin: 0;
}

.ala-order-meta__item dt {
	font-family: var(--font-mono);
	font-size: var(--step--2);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--text-muted);
}

.ala-order-meta__item dd {
	margin: 0;
	font-size: var(--step-0);
	line-height: 1.5;
	color: var(--ink);
	overflow-wrap: anywhere;
}

/* Receipt card. */
.ala-receipt {
	margin-top: var(--space-xl);
}

.ala-receipt__eyebrow {
	color: var(--gilt-deep);
	margin: 0 0 var(--space-2xs);
}

.ala-receipt__title {
	margin: 0 0 var(--space-m) !important;
	font-size: var(--step-2) !important;
	text-wrap: balance;
}

.ala-receipt__card {
	border: 1px solid var(--line);
	background: var(--paper-raised);
}

body.woocommerce-order-received .ala-receipt__card table.woocommerce-table--order-details,
body.woocommerce-order-received .ala-receipt__card .woocommerce-table--order-details {
	margin: 0;
}

body.woocommerce-order-received .ala-receipt__card thead th {
	padding: var(--space-s) var(--space-l);
	background: var(--paper-sunken);
}

body.woocommerce-order-received .ala-receipt__card tbody td,
body.woocommerce-order-received .ala-receipt__card tfoot th,
body.woocommerce-order-received .ala-receipt__card tfoot td {
	padding: var(--space-m) var(--space-l);
}

body.woocommerce-order-received .ala-receipt__card tbody tr + tr {
	border-top: 1px solid var(--line);
}

body.woocommerce-order-received .ala-receipt__card tfoot tr {
	border-top: 1px solid var(--line);
}

body.woocommerce-order-received .ala-receipt__card tfoot tr:first-child {
	border-top: 1px solid var(--ink);
}

.ala-receipt__product {
	display: flex;
	gap: var(--space-m);
	align-items: flex-start;
	min-width: 0;
}

.ala-receipt__thumb {
	flex: 0 0 auto;
	width: 3.5rem;
	height: auto;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	background: var(--paper-sunken);
	border: 1px solid var(--line);
}

.ala-receipt__product-body {
	min-width: 0;
}

.ala-receipt__name {
	font-family: var(--font-display);
	font-size: var(--step-1);
	line-height: 1.3;
	color: var(--ink);
}

a.ala-receipt__name:hover {
	color: var(--gilt-deep);
}

.ala-receipt__product .product-quantity {
	font-family: var(--font-mono);
	font-size: var(--step--1);
	font-weight: 400;
	color: var(--text-muted);
}

.ala-receipt__product .wc-item-meta {
	margin: var(--space-2xs) 0 0;
	padding: 0;
	list-style: none;
	font-size: var(--step--1);
	color: var(--text-muted);
}

.ala-receipt__product .wc-item-meta li {
	display: flex;
	gap: 0.4em;
	margin: 0;
}

body.woocommerce-order-received .ala-receipt__card tfoot th {
	font-family: var(--font-mono);
	font-size: var(--step--2);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--text-muted);
	font-weight: 500;
}

body.woocommerce-order-received .ala-receipt__card tfoot td {
	font-family: var(--font-mono);
	font-size: var(--step--1);
	text-align: right;
	overflow-wrap: anywhere;
}

body.woocommerce-order-received .ala-receipt__card tfoot .ala-receipt__total--order_total th,
body.woocommerce-order-received .ala-receipt__card tfoot .ala-receipt__total--order_total td {
	color: var(--ink);
	font-size: var(--step-0);
	border-top: 1px solid var(--ink);
}

/* Addresses: real cards in a real grid. The headings are h3s inside their
   own card, so the Danish words can never collide again. */
body.woocommerce-order-received .woocommerce-customer-details.ala-addresses {
	margin-top: var(--space-2xl);
}

.ala-addresses__eyebrow {
	color: var(--gilt-deep);
	margin: 0 0 var(--space-2xs);
}

.ala-addresses__title {
	font-family: var(--font-display);
	font-size: var(--step-2);
	margin: 0 0 var(--space-m);
	text-wrap: balance;
}

.ala-addresses__grid {
	display: grid !important;
	grid-template-columns: repeat(auto-fit, minmax(min(20rem, 100%), 1fr));
	gap: var(--space-l);
	width: 100%;
}

.ala-addresses__grid--single {
	grid-template-columns: minmax(0, 26rem);
}

/* Kill Woo's floats/clearfix inside our grid — this was the overlap. */
body.woocommerce-order-received .ala-addresses__grid::before,
body.woocommerce-order-received .ala-addresses__grid::after {
	content: none !important;
}

body.woocommerce-order-received .ala-addresses .woocommerce-column {
	float: none !important;
	width: auto !important;
	margin: 0 !important;
	min-width: 0;
}

.ala-address-card {
	border: 1px solid var(--line);
	background: var(--paper-raised);
	padding: var(--space-l);
	min-width: 0;
}

.ala-address-card__eyebrow {
	color: var(--gilt-deep);
	margin: 0 0 var(--space-2xs);
}

body.woocommerce-order-received .ala-address-card__title.woocommerce-column__title {
	font-family: var(--font-display);
	font-size: var(--step-1);
	line-height: 1.2;
	margin: 0 0 var(--space-s);
	color: var(--ink);
	overflow-wrap: break-word;
	hyphens: auto;
	text-wrap: balance;
}

.ala-address-card__body {
	margin: 0;
	padding-top: var(--space-s);
	border-top: 1px solid var(--line);
	font-style: normal;
	line-height: 1.65;
	overflow-wrap: anywhere;
}

.ala-address-card__body p {
	margin: 0.6em 0 0;
}

@media (max-width: 700px) {
	.ala-thankyou-panel {
		padding: var(--space-m);
	}

	.ala-order-meta {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--space-m);
	}

	body.woocommerce-order-received .ala-receipt__card thead {
		display: none;
	}

	body.woocommerce-order-received .ala-receipt__card tbody td,
	body.woocommerce-order-received .ala-receipt__card tfoot th,
	body.woocommerce-order-received .ala-receipt__card tfoot td {
		padding: var(--space-s) var(--space-m);
	}

	body.woocommerce-order-received .ala-receipt__card table,
	body.woocommerce-order-received .ala-receipt__card tbody,
	body.woocommerce-order-received .ala-receipt__card tr,
	body.woocommerce-order-received .ala-receipt__card td {
		display: block;
		width: 100%;
	}

	body.woocommerce-order-received .ala-receipt__card tr {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 0 var(--space-m);
		align-items: baseline;
		padding: var(--space-s) 0;
	}

	body.woocommerce-order-received .ala-receipt__card tbody td:first-child {
		grid-column: 1;
	}

	body.woocommerce-order-received .ala-receipt__card tbody td:last-child,
	body.woocommerce-order-received .ala-receipt__card tfoot td {
		grid-column: 2;
		text-align: right;
	}

	body.woocommerce-order-received .ala-receipt__card tfoot th {
		grid-column: 1;
	}

	body.woocommerce-order-received .ala-receipt__card tfoot tr {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
	}

	body.woocommerce-order-received .ala-receipt__card tr.ala-receipt__actions td {
		grid-column: 1 / -1;
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-end;
	}

	.ala-addresses__grid {
		grid-template-columns: minmax(0, 1fr);
	}
}