/*
 * Slim header and footer of the checkout flow (header-checkout.php, footer-checkout.php):
 * the checkout page and the cart prototype. Global, because the cart has its own route.
 */
/* ---- Slim checkout header (header-checkout.php) ---- */
.wa-checkout-header {
	border-bottom: var(--border-width) solid var(--nd-c-line);
	background: var(--nd-c-surface);
}

.wa-checkout-header__inner {
	display: flex;
	align-items: center;
	gap: var(--nd-sp-16);
	padding-block: var(--nd-sp-12);
}

.wa-checkout-header__logo {
	display: inline-flex;
	margin-right: auto;
}

.wa-checkout-header__logo-img {
	width: auto;
	height: var(--nd-logo-h-sm);
}

.wa-checkout-header__back {
	display: inline-flex;
	align-items: center;
	gap: var(--nd-sp-8);
	color: var(--nd-c-muted);
	font-size: var(--nd-fs-14);
	text-decoration: none;
	white-space: nowrap;
}

.wa-checkout-header__back:hover,
.wa-checkout-header__back:focus-visible {
	color: var(--nd-c-brand);
}

/* Narrow phones: logo, arrow and account icon only (the label stays for screen readers). */
@media (max-width: 479px) {
	.wa-checkout-header__inner {
		gap: var(--nd-sp-8);
	}

	.wa-checkout-header__logo {
		min-width: 0;
	}

	.wa-checkout-header__logo-img {
		max-width: 100%;
		height: auto;
		max-height: var(--nd-logo-h-sm);
	}

	.wa-checkout-header__back {
		justify-content: center;
		width: var(--nd-tap);
		height: var(--nd-tap);
		border-radius: var(--nd-radius-round);
		background-color: var(--nd-c-account-bg);
		font-size: var(--nd-fs-17);
	}

	.wa-checkout-header__back-label {
		position: absolute;
		width: var(--border-width);
		height: var(--border-width);
		overflow: hidden;
		clip-path: inset(50%);
		white-space: nowrap;
	}
}

@media (min-width: 721px) {
	.wa-checkout-header__inner {
		gap: var(--nd-sp-24);
		padding-block: var(--nd-sp-16);
	}

	.wa-checkout-header__logo-img {
		height: var(--nd-logo-h);
	}
}

/* ---- Slim checkout footer (footer-checkout.php) ---- */
.wa-checkout-footer {
	margin-top: var(--nd-sp-24);
	border-top: var(--border-width) solid var(--nd-c-line);
	color: var(--nd-c-muted);
	font-size: var(--nd-fs-12);
}

.wa-checkout-footer__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--nd-sp-8) var(--nd-sp-24);
	padding-block: var(--nd-sp-12);
}

.wa-checkout-footer__links {
	display: flex;
	flex-wrap: wrap;
	gap: var(--nd-sp-8) var(--nd-sp-16);
}

.wa-checkout-footer__links a {
	color: inherit;
}

.wa-checkout-footer__links a:hover,
.wa-checkout-footer__links a:focus-visible {
	color: var(--nd-c-brand);
}

.wa-checkout-footer__copy {
	margin: 0;
}