/*
 * The account page "Mijn account" (Theme 0.61.0; docs/ACCOUNT-PAGE.md). Loaded only on the account page (inc/account.php adds the body class
 * `bpal-is-account` there; `bpal-account-signed-in` when the page shows the menu and the banner, `bpal-account-dashboard` on the overview), so every
 * selector hangs on those classes and none can touch another page. The page, its endpoints and its forms are the classic markup of WooCommerce, and
 * so are its stylesheets (woocommerce-layout, -smallscreen and -general, which stay on this page); this file only changes how it looks. WooCommerce
 * sets its rules with up to four classes, so each rule here starts with `body.bpal-is-account` and, where WooCommerce is heavier, also names
 * `.bpal-entry__content` or `.woocommerce-MyAccount-content`; the order of the stylesheets does not decide. The classes are those of WooCommerce
 * 11.2.1 (tests/fixtures/woocommerce-account.html and the three stylesheets next to it); after a WooCommerce update rerun
 * tests/theme-account-browser.mjs and look at the page on staging.
 *
 * The design is the mockup the owner approved on 3 November 2026: a menu with icons on the left, a "Hallo" banner with the folded jeans on the right,
 * cards on a light background, and one font in the content: Montserrat, the font of the menu (the header and the footer keep theirs).
 */

body.bpal-is-account {
	--bpal-acc-muted: #56616c;
	--bpal-acc-line: rgba(14, 39, 66, 0.12);
	--bpal-acc-line-strong: rgba(14, 39, 66, 0.28);
	--bpal-acc-field: #6b7783; /* the border of a field: 4.5 : 1 on white (WCAG 1.4.11 asks 3 : 1) */
	--bpal-acc-accent-hover: #ff9140;
	--bpal-acc-font: Montserrat, "Segoe UI", Arial, sans-serif;
	--bpal-acc-radius: 4px;
	--bpal-acc-radius-card: 8px;
	--bpal-acc-ok-bg: #e3f3ea;
	--bpal-acc-ok-fg: #14583a;
	--bpal-acc-busy-bg: #e4edf8;
	--bpal-acc-busy-fg: #0e2742;
	--bpal-acc-warn-bg: #fdecd6;
	--bpal-acc-warn-fg: #6d3b00;
	--bpal-acc-off-bg: #eceef0;
	--bpal-acc-off-fg: #3d464f;
	--bpal-acc-error-bg: #fbe9e9;
	--bpal-acc-error-fg: #7a1f1f;
	--bpal-acc-icon-home: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='1.75'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M4%2011l8-6.5%208%206.5'/%3E%3Cpath%20d='M6%2010v9h12v-9'/%3E%3Cpath%20d='M10%2019v-5h4v5'/%3E%3C/svg%3E");
	--bpal-acc-icon-bag: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='1.75'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M5%208h14l-1%2012H6L5%208z'/%3E%3Cpath%20d='M9%208V6.5a3%203%200%200%201%206%200V8'/%3E%3C/svg%3E");
	--bpal-acc-icon-pin: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='1.75'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M12%2021s-6.5-5.6-6.5-11a6.5%206.5%200%200%201%2013%200c0%205.4-6.5%2011-6.5%2011z'/%3E%3Ccircle%20cx='12'%20cy='10'%20r='2.3'/%3E%3C/svg%3E");
	--bpal-acc-icon-card: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='1.75'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='3.5'%20y='5'%20width='17'%20height='14'%20rx='2'/%3E%3Ccircle%20cx='9'%20cy='11'%20r='2'/%3E%3Cpath%20d='M6%2016c.5-1.6%201.6-2.4%203-2.4s2.5.8%203%202.4M14.5%2010H18M14.5%2013.5H18'/%3E%3C/svg%3E");
	--bpal-acc-icon-exit: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='1.75'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M10%204H5.5A1.5%201.5%200%200%200%204%205.5v13A1.5%201.5%200%200%200%205.5%2020H10'/%3E%3Cpath%20d='M15%208l4%204-4%204M19%2012H9'/%3E%3C/svg%3E");
	--bpal-acc-icon-wallet: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='1.75'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20x='3.5'%20y='6'%20width='17'%20height='12'%20rx='2'/%3E%3Cpath%20d='M3.5%2010h17M7%2014.5h3'/%3E%3C/svg%3E");
	--bpal-acc-icon-arrow: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='1.75'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M5%2012h14M13%206l6%206-6%206'/%3E%3C/svg%3E");
	--bpal-acc-icon-check: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='1.75'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M5%2012.5l4.5%204.5L19%207.5'/%3E%3C/svg%3E");
	--bpal-acc-icon-box: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='1.75'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M3.5%207.5L12%203l8.5%204.5v9L12%2021l-8.5-4.5z'/%3E%3Cpath%20d='M3.5%207.5L12%2012l8.5-4.5M12%2012v9'/%3E%3C/svg%3E");
	--bpal-acc-icon-download: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='1.75'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M12%204v11M7.5%2010.5L12%2015l4.5-4.5M5%2019h14'/%3E%3C/svg%3E");
}

/* The page: a light background behind white cards, as wide as the other pages of the shop, and the font of the menu in the content. */
body.bpal-is-account main.bpal-page-content {
	--bpal-container: 1200px;
	padding: 20px 0 64px;
	background: var(--bpal-neutral);
}

body.bpal-is-account .bpal-prose {
	max-width: none;
}

body.bpal-is-account main,
body.bpal-is-account main * {
	font-family: var(--bpal-acc-font);
}

body.bpal-is-account :is(.select2-container--open, .select2-container--open *, .select2-dropdown, .select2-dropdown *) {
	font-family: var(--bpal-acc-font);
}

body.bpal-is-account .bpal-entry__content :is(h2, h3, h4, legend),
body.bpal-is-account .bpal-entry__header h1 {
	margin: 0;
	color: var(--bpal-primary);
	font-weight: 700;
	letter-spacing: -0.01em;
	line-height: 1.2;
}

body.bpal-is-account .bpal-entry__header {
	margin: 0;
}

body.bpal-is-account .bpal-entry__header h1 {
	font-size: clamp(1.625rem, 2.6vw, 2rem);
}

body.bpal-is-account .bpal-entry__content p {
	margin: 0;
}

body.bpal-is-account .bpal-entry__content .woocommerce-MyAccount-content > p + p {
	margin-top: 12px;
}

/* The breadcrumb and the title at the top, directly under the header. */
body.bpal-is-account .bpal-account-crumbs {
	margin: 0 0 10px;
	color: var(--bpal-acc-muted);
	font-size: 0.8125rem;
}

body.bpal-is-account .bpal-account-crumbs ol {
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
	list-style: none;
}

body.bpal-is-account .bpal-account-crumbs li + li::before {
	content: "/";
	content: "/" / "";
	margin: 0 6px;
}

body.bpal-is-account .bpal-account-crumbs a {
	color: var(--bpal-acc-muted);
}

/* Signed in: the banner, the menu and the content on one grid. The clearfixes of WooCommerce (`.woocommerce::before` and `::after`) would become
 * grid items, and its floats and percentage widths would stretch the two items they sit on, so they are switched off. */
body.bpal-account-signed-in .bpal-entry__content > .woocommerce {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	grid-template-areas: "banner" "side" "content";
	align-items: start;
	gap: 20px;
	padding-top: 20px;
}

body.bpal-account-signed-in .bpal-entry__content > .woocommerce::before,
body.bpal-account-signed-in .bpal-entry__content > .woocommerce::after {
	content: none;
	display: none;
}

body.bpal-account-signed-in .bpal-account-banner {
	grid-area: banner;
}

body.bpal-account-signed-in .bpal-account-side {
	grid-area: side;
}

body.bpal-account-signed-in .bpal-entry__content > .woocommerce > .woocommerce-MyAccount-content {
	grid-area: content;
	float: none;
	width: auto;
	min-width: 0;
}

@media (min-width: 900px) {
	body.bpal-account-signed-in .bpal-entry__content > .woocommerce {
		grid-template-columns: 280px minmax(0, 1fr);
		grid-template-areas: "side banner" "side content";
		grid-template-rows: auto 1fr;
		column-gap: 32px;
		row-gap: 20px;
		padding-top: 40px;
	}
}

/* The banner: a light rectangle with the greeting; the folded jeans (the photo of the owner) is enlarged, cut off at the right and at the bottom,
 * and sticks out above the top edge. The layer that holds it is clipped at the bottom only. */
body.bpal-account-signed-in .bpal-account-banner {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 150px;
	margin-top: 52px;
	padding: 20px 52% 20px 22px;
	color: var(--bpal-primary);
}

body.bpal-account-signed-in .bpal-account-banner__bg {
	position: absolute;
	inset: 0;
	border-radius: var(--bpal-acc-radius-card);
	background:
		radial-gradient(ellipse 70% 120% at 8% 118%, rgba(255, 255, 255, 0.95) 0 46%, transparent 47%),
		radial-gradient(ellipse 46% 110% at 88% 100%, rgba(255, 255, 255, 0.7) 0 50%, transparent 51%),
		linear-gradient(135deg, #e9ecef, #dde2e7);
}

body.bpal-account-signed-in .bpal-account-banner__text {
	position: relative;
}

body.bpal-account-signed-in .bpal-account-banner__hello {
	font-size: clamp(1.375rem, 6.4vw, 1.625rem);
	font-weight: 700;
	letter-spacing: -0.01em;
	line-height: 1.1;
	overflow-wrap: anywhere;
}

body.bpal-account-signed-in .bpal-entry__content .bpal-account-banner__sub {
	max-width: 40ch;
	margin-top: 8px;
	color: #3d4852;
	font-size: 0.8125rem;
	line-height: 1.45;
}

body.bpal-account-signed-in .bpal-account-banner__pop {
	position: absolute;
	inset: 0;
	overflow-x: clip;
	clip-path: inset(-120px 0 0 0);
	border-radius: 0 0 var(--bpal-acc-radius-card) 0;
	pointer-events: none;
}

body.bpal-account-signed-in .bpal-account-banner__jeans {
	position: absolute;
	top: -28px;
	right: -6%;
	width: 64%;
	height: auto;
	max-width: none;
	border-radius: 0;
	filter: drop-shadow(0 8px 12px rgba(14, 39, 66, 0.32));
}

@media (min-width: 900px) {
	body.bpal-account-signed-in .bpal-account-banner {
		/* The width of the jeans is also what the text leaves free on the right: the text box ends 10% of the photo inside it (its left edge is empty),
		 * so a long name cannot run under the jeans, whatever the width of the text. Both percentages are of the width of the banner. */
		--bpal-acc-jeans-width: clamp(360px, 62%, 560px);
		min-height: 184px;
		margin-top: 0;
		padding: 24px calc(1% + 0.9 * var(--bpal-acc-jeans-width)) 24px 36px;
	}

	body.bpal-account-signed-in .bpal-account-banner__hello {
		font-size: clamp(1.625rem, 3vw, 2.375rem);
	}

	body.bpal-account-signed-in .bpal-entry__content .bpal-account-banner__sub {
		font-size: 1rem;
		line-height: 1.5;
	}

	body.bpal-account-signed-in .bpal-account-banner__jeans {
		top: -46px;
		right: 1%;
		width: var(--bpal-acc-jeans-width);
	}
}

/* The side column: the profile card and the menu are one box. On a phone the menu is a row of pills under the banner. */
body.bpal-account-signed-in .bpal-account-side {
	overflow: hidden;
	background: #fff;
	border: 1px solid var(--bpal-acc-line);
	border-radius: var(--bpal-acc-radius-card);
}

body.bpal-account-signed-in .bpal-account-profile {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px 16px;
}

body.bpal-account-signed-in .bpal-account-profile__avatar {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background: var(--bpal-primary);
	color: #fff;
	font-size: 1rem;
	font-weight: 700;
	letter-spacing: 0.02em;
}

body.bpal-account-signed-in .bpal-account-profile__text {
	min-width: 0;
}

body.bpal-account-signed-in .bpal-entry__content .bpal-account-profile__name {
	color: var(--bpal-primary);
	font-weight: 700;
	line-height: 1.25;
	overflow-wrap: anywhere;
}

body.bpal-account-signed-in .bpal-entry__content .bpal-account-profile__mail {
	color: var(--bpal-acc-muted);
	font-size: 0.8125rem;
	line-height: 1.35;
	overflow-wrap: anywhere;
}

body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation {
	float: none;
	width: auto;
}

body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation ul {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 12px;
	border-top: 1px solid var(--bpal-acc-line);
	list-style: none;
}

body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation li {
	margin: 0;
	padding: 0;
	border: 0;
}

body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation li a {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 10px 14px;
	border: 1px solid var(--bpal-acc-line);
	border-radius: 999px;
	background: none;
	color: var(--bpal-primary);
	font-size: 0.875rem;
	font-weight: 600;
	text-decoration: none;
}

body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation li a::before {
	content: "";
	flex: none;
	width: 1.1rem;
	height: 1.1rem;
	background: currentcolor;
	-webkit-mask: var(--bpal-acc-icon-arrow) center / contain no-repeat;
	mask: var(--bpal-acc-icon-arrow) center / contain no-repeat;
}

body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--dashboard a::before {
	-webkit-mask-image: var(--bpal-acc-icon-home);
	mask-image: var(--bpal-acc-icon-home);
}

body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--payment-methods a::before {
	-webkit-mask-image: var(--bpal-acc-icon-wallet);
	mask-image: var(--bpal-acc-icon-wallet);
}

body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--orders a::before {
	-webkit-mask-image: var(--bpal-acc-icon-bag);
	mask-image: var(--bpal-acc-icon-bag);
}

body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--downloads a::before {
	-webkit-mask-image: var(--bpal-acc-icon-download);
	mask-image: var(--bpal-acc-icon-download);
}

body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--edit-address a::before {
	-webkit-mask-image: var(--bpal-acc-icon-pin);
	mask-image: var(--bpal-acc-icon-pin);
}

body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--edit-account a::before {
	-webkit-mask-image: var(--bpal-acc-icon-card);
	mask-image: var(--bpal-acc-icon-card);
}

body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation .woocommerce-MyAccount-navigation-link--customer-logout a::before {
	-webkit-mask-image: var(--bpal-acc-icon-exit);
	mask-image: var(--bpal-acc-icon-exit);
}

body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation li a:hover {
	background: var(--bpal-neutral);
}

body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation li.is-active a {
	border-color: var(--bpal-primary);
	background: var(--bpal-primary);
	color: #fff;
}

body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout {
	margin-left: auto;
}

body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout a {
	color: var(--bpal-acc-muted);
	font-weight: 500;
}

/* The page that asks to confirm logging out is the active item: then it is white on dark blue like every active item, not grey on dark blue. */
body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout.is-active a {
	color: #fff;
	font-weight: 600;
}

@media (min-width: 900px) {
	body.bpal-account-signed-in .bpal-account-profile {
		padding: 18px 18px 16px;
	}

	body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation ul {
		display: block;
		padding: 0;
	}

	body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation li + li {
		border-top: 1px solid var(--bpal-acc-line);
	}

	body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation li.woocommerce-MyAccount-navigation-link--customer-logout {
		border-top-color: var(--bpal-acc-line-strong);
	}

	body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation li a {
		gap: 12px;
		min-height: 0;
		padding: 14px 18px;
		border: 0;
		border-left: 3px solid transparent;
		border-radius: 0;
		font-size: 0.9375rem;
	}

	body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation li a::before {
		width: 1.25rem;
		height: 1.25rem;
	}

	body.bpal-account-signed-in .bpal-account-side .woocommerce-MyAccount-navigation li.is-active a {
		border-left-color: var(--bpal-accent);
	}
}

/* The content: one white card; the overview has cards of its own, so there it is a plain column. */
body.bpal-account-signed-in .woocommerce-MyAccount-content {
	padding: 20px;
	background: #fff;
	border: 1px solid var(--bpal-acc-line);
	border-radius: var(--bpal-acc-radius-card);
}

body.bpal-account-signed-in.bpal-account-dashboard .woocommerce-MyAccount-content {
	padding: 0;
	background: none;
	border: 0;
}

@media (min-width: 720px) {
	body.bpal-account-signed-in .woocommerce-MyAccount-content {
		padding: 28px;
	}

	body.bpal-account-signed-in.bpal-account-dashboard .woocommerce-MyAccount-content {
		padding: 0;
	}
}

body.bpal-account-signed-in .bpal-entry__content h2.bpal-account-heading {
	margin: 0 0 18px;
	font-size: 1.125rem;
}

/* The overview. */
body.bpal-account-dashboard .bpal-account-dash {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 20px;
}

body.bpal-account-dashboard .bpal-account-card,
body.bpal-account-dashboard .bpal-account-tile,
body.bpal-account-dashboard .bpal-account-help {
	background: #fff;
	border: 1px solid var(--bpal-acc-line);
	border-radius: var(--bpal-acc-radius-card);
}

body.bpal-account-dashboard .bpal-account-card {
	padding: 20px;
}

@media (min-width: 720px) {
	body.bpal-account-dashboard .bpal-account-card {
		padding: 28px;
	}
}

body.bpal-account-dashboard .bpal-account-card__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 6px 16px;
	margin-bottom: 18px;
}

body.bpal-account-dashboard .bpal-entry__content .bpal-account-card__head h2 {
	font-size: 1.125rem;
}

/* A link with an arrow behind it. */
body.bpal-account-signed-in .bpal-account-more {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	color: var(--bpal-primary);
	font-size: 0.875rem;
	font-weight: 600;
}

body.bpal-account-signed-in .bpal-account-more::after {
	content: "";
	width: 1rem;
	height: 1rem;
	background: currentcolor;
	-webkit-mask: var(--bpal-acc-icon-arrow) center / contain no-repeat;
	mask: var(--bpal-acc-icon-arrow) center / contain no-repeat;
	transition: transform 0.15s;
}

body.bpal-account-signed-in a:hover > .bpal-account-more::after,
body.bpal-account-signed-in a.bpal-account-more:hover::after {
	transform: translateX(3px);
}

body.bpal-account-dashboard .bpal-account-facts {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px 20px;
	margin: 0 0 24px;
}

@media (min-width: 720px) {
	body.bpal-account-dashboard .bpal-account-facts {
		grid-template-columns: repeat(4, auto);
		justify-content: space-between;
	}
}

body.bpal-account-dashboard .bpal-account-facts dt {
	color: var(--bpal-acc-muted);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

body.bpal-account-dashboard .bpal-account-facts dd {
	margin: 2px 0 0;
	color: var(--bpal-primary);
	font-weight: 600;
}

/* The status of an order as a pill: a dot and the name of the status. */
body.bpal-account-signed-in .bpal-account-pill {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 12px;
	border-radius: 999px;
	font-size: 0.8125rem;
	font-weight: 600;
	line-height: 1.3;
	white-space: nowrap;
}

body.bpal-account-dashboard .bpal-account-facts .bpal-account-pill {
	max-width: 100%;
	white-space: normal;
}

body.bpal-account-signed-in .bpal-account-pill::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: currentcolor;
}

body.bpal-account-signed-in .bpal-account-pill--ok {
	background: var(--bpal-acc-ok-bg);
	color: var(--bpal-acc-ok-fg);
}

body.bpal-account-signed-in .bpal-account-pill--busy {
	background: var(--bpal-acc-busy-bg);
	color: var(--bpal-acc-busy-fg);
}

body.bpal-account-signed-in .bpal-account-pill--warn {
	background: var(--bpal-acc-warn-bg);
	color: var(--bpal-acc-warn-fg);
}

body.bpal-account-signed-in .bpal-account-pill--off {
	background: var(--bpal-acc-off-bg);
	color: var(--bpal-acc-off-fg);
}

/* The progress of the last order: three steps joined by a line. */
body.bpal-account-dashboard .bpal-account-steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	margin: 0 0 26px;
	padding: 0;
	list-style: none;
}

body.bpal-account-dashboard .bpal-account-steps li {
	position: relative;
	margin: 0;
	padding: 0 4px;
	color: var(--bpal-acc-muted);
	font-size: 0.8125rem;
	line-height: 1.35;
	text-align: center;
}

body.bpal-account-dashboard .bpal-account-steps li::before {
	content: "";
	position: absolute;
	top: 15px;
	left: -50%;
	z-index: 0;
	width: 100%;
	height: 3px;
	background: var(--bpal-acc-line-strong);
}

body.bpal-account-dashboard .bpal-account-steps li:first-child::before {
	display: none;
}

body.bpal-account-dashboard .bpal-account-steps li.is-done::before,
body.bpal-account-dashboard .bpal-account-steps li.is-current::before {
	background: var(--bpal-primary);
}

body.bpal-account-dashboard .bpal-account-steps__dot {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	margin: 0 auto 8px;
	border: 2px solid var(--bpal-acc-line-strong);
	border-radius: 50%;
	background: #fff;
	color: var(--bpal-acc-muted);
}

body.bpal-account-dashboard .bpal-account-steps__dot::before {
	content: "";
	width: 1rem;
	height: 1rem;
	background: currentcolor;
	-webkit-mask: var(--bpal-acc-icon-bag) center / contain no-repeat;
	mask: var(--bpal-acc-icon-bag) center / contain no-repeat;
}

body.bpal-account-dashboard .bpal-account-steps__dot--2::before {
	-webkit-mask-image: var(--bpal-acc-icon-card);
	mask-image: var(--bpal-acc-icon-card);
}

body.bpal-account-dashboard .bpal-account-steps__dot--3::before {
	-webkit-mask-image: var(--bpal-acc-icon-box);
	mask-image: var(--bpal-acc-icon-box);
}

body.bpal-account-dashboard .bpal-account-steps li.is-done .bpal-account-steps__dot {
	border-color: var(--bpal-primary);
	background: var(--bpal-primary);
	color: #fff;
}

body.bpal-account-dashboard .bpal-account-steps li.is-done .bpal-account-steps__dot::before {
	-webkit-mask-image: var(--bpal-acc-icon-check);
	mask-image: var(--bpal-acc-icon-check);
}

body.bpal-account-dashboard .bpal-account-steps li.is-current .bpal-account-steps__dot {
	border-color: var(--bpal-accent);
	background: var(--bpal-accent);
	color: var(--bpal-primary);
}

body.bpal-account-dashboard .bpal-account-steps strong {
	display: block;
	color: var(--bpal-primary);
	font-weight: 600;
}

body.bpal-account-dashboard .bpal-account-steps li.is-todo strong {
	color: var(--bpal-acc-muted);
}

@media (max-width: 479px) {
	body.bpal-account-dashboard .bpal-account-steps li,
	body.bpal-account-dashboard .bpal-account-steps strong {
		font-size: 0.75rem;
	}
}

/* The first articles of the order. */
body.bpal-account-dashboard .bpal-account-items {
	margin: 0;
	padding: 0;
	border-top: 1px solid var(--bpal-acc-line);
	list-style: none;
}

body.bpal-account-dashboard .bpal-account-item {
	display: flex;
	align-items: center;
	gap: 14px;
	margin: 0;
	padding: 14px 0;
	border-bottom: 1px solid var(--bpal-acc-line);
}

body.bpal-account-dashboard .bpal-account-item--more {
	color: var(--bpal-acc-muted);
	font-size: 0.875rem;
}

body.bpal-account-dashboard .bpal-account-item > div {
	min-width: 0;
	overflow-wrap: anywhere;
}

body.bpal-account-dashboard .bpal-account-item__thumb {
	display: block;
	flex: none;
	width: 56px;
	height: 70px;
	overflow: hidden;
	border-radius: var(--bpal-acc-radius);
	background: linear-gradient(135deg, #e9edf2, #dde3ea);
}

body.bpal-account-dashboard .bpal-account-item__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

body.bpal-account-dashboard .bpal-entry__content .bpal-account-item__name {
	color: var(--bpal-primary);
	font-weight: 600;
	line-height: 1.35;
}

body.bpal-account-dashboard .bpal-entry__content .bpal-account-item__meta {
	color: var(--bpal-acc-muted);
	font-size: 0.8125rem;
}

body.bpal-account-dashboard .bpal-entry__content .bpal-account-item__price {
	margin-left: auto;
	padding-left: 8px;
	color: var(--bpal-primary);
	font-weight: 600;
	white-space: nowrap;
}

/* Buttons: the orange one for the main step, an outline for the other. WooCommerce's own buttons in the content take the same two looks. */
body.bpal-account-signed-in .bpal-account-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 22px;
}

body.bpal-account-signed-in .bpal-entry__content :is(.bpal-account-btn, a.button, button.button, input.button, :where(.woocommerce-Address-title) a.edit) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 46px;
	margin: 0;
	padding: 0 22px;
	border: 2px solid var(--bpal-primary);
	border-radius: var(--bpal-acc-radius);
	background: transparent;
	color: var(--bpal-primary);
	font-size: 0.9375rem;
	font-weight: 700;
	line-height: 1;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.15s, border-color 0.15s, color 0.15s;
}

body.bpal-account-signed-in .bpal-entry__content :is(.bpal-account-btn, a.button, button.button, input.button, :where(.woocommerce-Address-title) a.edit):hover {
	background: var(--bpal-primary);
	color: #fff;
}

body.bpal-account-signed-in .bpal-entry__content :is(.bpal-account-btn--primary, button.button[type="submit"], button.button.pay, a.button.pay) {
	border-color: var(--bpal-accent);
	background: var(--bpal-accent);
	color: var(--bpal-primary);
}

body.bpal-account-signed-in .bpal-entry__content :is(.bpal-account-btn--primary, button.button[type="submit"], button.button.pay, a.button.pay):hover {
	border-color: var(--bpal-acc-accent-hover);
	background: var(--bpal-acc-accent-hover);
	color: var(--bpal-primary);
}

@media (max-width: 479px) {
	body.bpal-account-signed-in .bpal-account-actions .bpal-account-btn {
		flex: 1 1 100%;
	}
}

/* Three tiles and the help block. */
body.bpal-account-dashboard .bpal-account-tiles {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 14px;
}

@media (min-width: 640px) {
	body.bpal-account-dashboard .bpal-account-tiles {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

body.bpal-account-dashboard .bpal-account-tile {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 14px;
	padding: 16px;
	color: var(--bpal-text);
	text-decoration: none;
	transition: border-color 0.15s, transform 0.15s;
}

body.bpal-account-dashboard .bpal-account-tile:hover {
	border-color: var(--bpal-primary);
	transform: translateY(-2px);
}

body.bpal-account-dashboard .bpal-account-tile::after {
	content: "›";
	margin-left: auto;
	color: var(--bpal-primary);
	font-size: 1.5rem;
	line-height: 1;
}

body.bpal-account-dashboard .bpal-account-tile .bpal-account-more {
	display: none;
}

@media (min-width: 640px) {
	body.bpal-account-dashboard .bpal-account-tile {
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
		padding: 20px;
	}

	body.bpal-account-dashboard .bpal-account-tile::after {
		display: none;
	}

	body.bpal-account-dashboard .bpal-account-tile .bpal-account-more {
		display: inline-flex;
		margin-top: auto;
		padding-top: 4px;
	}
}

body.bpal-account-dashboard .bpal-account-tile__icon {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--bpal-neutral);
	color: var(--bpal-primary);
}

body.bpal-account-dashboard .bpal-account-tile__icon::before {
	content: "";
	width: 1.25rem;
	height: 1.25rem;
	background: currentcolor;
	-webkit-mask: var(--bpal-acc-icon-bag) center / contain no-repeat;
	mask: var(--bpal-acc-icon-bag) center / contain no-repeat;
}

body.bpal-account-dashboard .bpal-account-icon--edit-address::before {
	-webkit-mask-image: var(--bpal-acc-icon-pin);
	mask-image: var(--bpal-acc-icon-pin);
}

body.bpal-account-dashboard .bpal-account-icon--edit-account::before {
	-webkit-mask-image: var(--bpal-acc-icon-card);
	mask-image: var(--bpal-acc-icon-card);
}

body.bpal-account-dashboard .bpal-entry__content .bpal-account-tile h2 {
	font-size: 1rem;
}

body.bpal-account-dashboard .bpal-entry__content .bpal-account-tile p {
	color: var(--bpal-acc-muted);
	font-size: 0.875rem;
}

body.bpal-account-dashboard .bpal-account-help {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 20px 24px;
	border-left: 4px solid var(--bpal-accent);
}

body.bpal-account-dashboard .bpal-entry__content .bpal-account-help h2 {
	font-size: 1.0625rem;
}

body.bpal-account-dashboard .bpal-entry__content .bpal-account-help p {
	margin-top: 4px;
	color: var(--bpal-acc-muted);
	font-size: 0.9375rem;
}

/* The list of orders: a table where the content is wide enough (760 px inside the card), else a card per order. The content card is the container, so
 * the switch follows the room the table has and not the screen: with the menu beside it (from 900 px) the content is narrow on a laptop too. */
body.bpal-account-signed-in .woocommerce-MyAccount-content {
	container: bpal-account-content / inline-size;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	border-radius: 0;
	font-size: 1rem;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table thead th {
	padding: 0 12px 12px;
	border: 0;
	border-bottom: 2px solid var(--bpal-acc-line);
	color: var(--bpal-acc-muted);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	line-height: 1.5;
	text-align: left;
	text-transform: uppercase;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table tbody :is(th, td) {
	padding: 16px 12px;
	border: 0;
	border-bottom: 1px solid var(--bpal-acc-line);
	background: none;
	font-weight: 400;
	line-height: 1.5;
	vertical-align: middle;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table tbody th a {
	color: var(--bpal-primary);
	font-weight: 700;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table :is(th, td):first-child {
	padding-left: 0;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table :is(th, td):last-child {
	padding-right: 0;
	text-align: right;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table tbody tr:last-child :is(th, td) {
	padding-bottom: 0;
	border-bottom: 0;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table td.woocommerce-orders-table__cell-order-total {
	font-weight: 600;
	white-space: nowrap;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table .button {
	min-height: 40px;
	padding: 0 16px;
	font-size: 0.8125rem;
	white-space: nowrap;
}

@container bpal-account-content (max-width: 760px) {
	body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table thead {
		display: none;
	}

	/* The rows are cards, so the table must not size itself to the widest row: block boxes as wide as the card, and a status that may wrap instead of pushing the row out. */
	body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table,
	body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table tbody {
		display: block;
		width: 100%;
	}

	body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table tbody tr {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		align-items: center;
		gap: 6px 12px;
		margin-bottom: 12px;
		padding: 14px 16px;
		border: 1px solid var(--bpal-acc-line);
		border-radius: var(--bpal-acc-radius-card);
	}

	body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table tbody tr:last-child {
		margin-bottom: 0;
	}

	body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table tbody :is(th, td),
	body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table tbody :is(th, td):first-child,
	body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table tbody :is(th, td):last-child,
	body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table tbody tr:last-child :is(th, td) {
		display: block;
		padding: 0;
		border: 0;
		text-align: left !important;
	}

	body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table tbody td::before {
		content: none;
	}

	body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table tbody th.woocommerce-orders-table__cell-order-number {
		grid-column: 1;
	}

	body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table tbody td.woocommerce-orders-table__cell-order-status {
		grid-column: 2;
		grid-row: 1;
		justify-self: end;
		min-width: 0;
	}

	body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table tbody td.woocommerce-orders-table__cell-order-status .bpal-account-pill {
		max-width: 100%;
		white-space: normal;
	}

	body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table tbody td.woocommerce-orders-table__cell-order-date {
		grid-column: 1 / -1;
		color: var(--bpal-acc-muted);
		font-size: 0.875rem;
	}

	body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table tbody td.woocommerce-orders-table__cell-order-total {
		grid-column: 1 / -1;
		white-space: normal;
	}

	body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table tbody td.woocommerce-orders-table__cell-order-actions {
		grid-column: 1 / -1;
		display: flex;
		flex-wrap: wrap;
		gap: 8px;
		margin-top: 6px;
	}

	body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table tbody td.woocommerce-orders-table__cell-order-actions .button {
		min-height: 44px;
		margin: 0;
	}
}

@container bpal-account-content (max-width: 480px) {
	body.bpal-account-signed-in .woocommerce-MyAccount-content table.woocommerce-orders-table tbody td.woocommerce-orders-table__cell-order-actions .button {
		flex: 1 1 100%;
	}
}

body.bpal-account-signed-in .woocommerce-MyAccount-content .woocommerce-pagination {
	display: flex;
	gap: 10px;
	margin-top: 20px;
}

/* Addresses: the two addresses are boxes inside the card. */
body.bpal-account-signed-in .woocommerce-MyAccount-content .woocommerce-Addresses {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 20px;
	margin-top: 20px;
}

@media (min-width: 720px) {
	body.bpal-account-signed-in .woocommerce-MyAccount-content .woocommerce-Addresses {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

body.bpal-account-signed-in .woocommerce-MyAccount-content .woocommerce-Addresses::before,
body.bpal-account-signed-in .woocommerce-MyAccount-content .woocommerce-Addresses::after {
	content: none;
	display: none;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content .woocommerce-Address {
	display: flex;
	flex-direction: column;
	float: none;
	width: auto;
	padding: 20px;
	border: 1px solid var(--bpal-acc-line);
	border-radius: var(--bpal-acc-radius-card);
}

/* The header of an address is only a wrapper: the name first, then the address, then the link to edit it as a button at the foot of the box. */
body.bpal-account-signed-in .woocommerce-MyAccount-content .woocommerce-Address-title {
	display: contents;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content .woocommerce-Address-title h2 {
	order: 1;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content :where(h2, h3):not(.bpal-account-heading) {
	font-size: 1.125rem;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content form > h2 {
	margin-bottom: 18px;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content .woocommerce-Address address {
	flex: 1;
	order: 2;
	margin: 14px 0 18px;
	font-style: normal;
	line-height: 1.7;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content .woocommerce-Address-title a.edit {
	order: 3;
	align-self: flex-start;
	float: none;
}

/* Forms: account details, an address, the password. Labels above the fields; two columns where WooCommerce says first and last. */
body.bpal-account-signed-in .woocommerce-MyAccount-content :is(.woocommerce-EditAccountForm, .woocommerce-address-fields__field-wrapper) {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 18px;
}

@media (min-width: 720px) {
	body.bpal-account-signed-in .woocommerce-MyAccount-content :is(.woocommerce-EditAccountForm, .woocommerce-address-fields__field-wrapper) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

body.bpal-account-signed-in .woocommerce-MyAccount-content :is(.woocommerce-EditAccountForm, .woocommerce-address-fields__field-wrapper) > :is(.form-row-wide, fieldset, p:not(.form-row), .clear, .woocommerce-form-row--wide) {
	grid-column: 1 / -1;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content :is(.woocommerce-EditAccountForm, .woocommerce-address-fields__field-wrapper) > .clear {
	display: none;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content .woocommerce-address-fields > p {
	margin: 18px 0 0;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content form .form-row {
	float: none;
	width: auto;
	margin: 0;
	padding: 0;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content form .form-row label {
	display: block;
	margin: 0 0 6px;
	color: var(--bpal-primary);
	font-size: 0.875rem;
	font-weight: 600;
	line-height: 1.4;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content form .form-row :is(input.input-text, select, textarea),
body.bpal-account-signed-in .woocommerce-MyAccount-content form .form-row .select2-container .select2-selection--single {
	box-sizing: border-box;
	width: 100%;
	height: 48px;
	padding: 0 14px;
	border: 1px solid var(--bpal-acc-field);
	border-radius: var(--bpal-acc-radius);
	background: #fff;
	color: var(--bpal-text);
	font-size: 1rem;
	line-height: 1.2;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content form .form-row .password-input input.input-text,
body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content form .form-row .password-input input.input-text {
	padding-right: 48px;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content form .form-row textarea {
	height: auto;
	min-height: 120px;
	padding: 12px 14px;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content form .form-row .select2-container .select2-selection--single .select2-selection__rendered {
	padding: 0;
	line-height: 46px;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content form .form-row .select2-container .select2-selection--single .select2-selection__arrow {
	top: 0;
	height: 46px;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content form .form-row :is(input.input-text, select, textarea):hover {
	border-color: var(--bpal-primary);
}

body.bpal-account-signed-in .woocommerce-MyAccount-content form .form-row :is(input.input-text, select, textarea):focus {
	border-color: var(--bpal-primary);
	outline: 3px solid var(--bpal-primary);
	outline-offset: 1px;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content form .form-row .description,
body.bpal-account-signed-in .woocommerce-MyAccount-content form .form-row span em {
	display: block;
	margin-top: 6px;
	color: var(--bpal-acc-muted);
	font-size: 0.8125rem;
	font-style: normal;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content form fieldset {
	min-width: 0;
	margin: 6px 0 0;
	padding: 24px 0 0;
	border: 0;
	border-top: 1px solid var(--bpal-acc-line);
}

body.bpal-account-signed-in .woocommerce-MyAccount-content form fieldset legend {
	float: left;
	width: 100%;
	margin: 0 0 16px;
	padding: 0;
	font-size: 1.125rem;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content form fieldset legend + .form-row {
	clear: both;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content form fieldset .form-row + .form-row {
	margin-top: 18px;
}

/* Messages of WooCommerce (saved, error, info): a quiet box with a coloured edge instead of the bar with an icon font. */
body.bpal-is-account .bpal-entry__content :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) {
	display: block;
	margin: 0 0 18px;
	padding: 14px 18px;
	border: 0;
	border-left: 4px solid var(--bpal-acc-busy-fg);
	border-radius: var(--bpal-acc-radius);
	background: var(--bpal-acc-busy-bg);
	color: var(--bpal-primary);
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.5;
	list-style: none;
}

body.bpal-is-account .bpal-entry__content :is(.woocommerce-message, .woocommerce-info, .woocommerce-error)::before {
	content: none;
	display: none;
}

body.bpal-is-account .bpal-entry__content .woocommerce-message {
	border-left-color: var(--bpal-acc-ok-fg);
	background: var(--bpal-acc-ok-bg);
	color: var(--bpal-acc-ok-fg);
}

body.bpal-is-account .bpal-entry__content .woocommerce-error {
	border-left-color: var(--bpal-acc-error-fg);
	background: var(--bpal-acc-error-bg);
	color: var(--bpal-acc-error-fg);
}

body.bpal-is-account .bpal-entry__content :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) li {
	margin: 0;
	padding: 0;
}

body.bpal-is-account .bpal-entry__content :is(.woocommerce-message, .woocommerce-info, .woocommerce-error) a:not(.button) {
	color: inherit;
}

/* A notice with a button (WooCommerce prints the button first and floats it right): text on the left, the button at the end. */
body.bpal-is-account .bpal-entry__content :is(.woocommerce-message, .woocommerce-info) {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 16px;
}

body.bpal-is-account .bpal-entry__content :is(.woocommerce-message, .woocommerce-info) .button {
	order: 2;
	float: none;
	margin: 0 0 0 auto;
}

/* One order (the endpoint view-order): the table of WooCommerce, quieter. */
body.bpal-account-signed-in .woocommerce-MyAccount-content table.shop_table:not(.woocommerce-orders-table) {
	margin: 0 0 24px;
	border: 1px solid var(--bpal-acc-line);
	border-radius: var(--bpal-acc-radius-card);
}

body.bpal-account-signed-in .woocommerce-MyAccount-content table.shop_table:not(.woocommerce-orders-table) :is(th, td) {
	padding: 12px 14px;
	border-color: var(--bpal-acc-line);
	font-size: 0.9375rem;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content .woocommerce-order-details__title,
body.bpal-account-signed-in .woocommerce-MyAccount-content .woocommerce-column__title {
	margin: 24px 0 12px;
	font-size: 1.125rem;
}

body.bpal-account-signed-in .woocommerce-MyAccount-content .woocommerce-customer-details address {
	padding: 16px;
	border: 1px solid var(--bpal-acc-line);
	border-radius: var(--bpal-acc-radius-card);
	font-style: normal;
	line-height: 1.7;
}

/* Signed out: the login and the register form as cards (WooCommerce puts them in two columns when registration is on), and the form to reset a
 * password. The page is a plain column, not the grid. */
body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content > .woocommerce {
	padding-top: 24px;
}

body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content #customer_login {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 20px;
	max-width: 900px;
	margin: 0 auto;
}

@media (min-width: 800px) {
	body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content #customer_login {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 28px;
	}
}

body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content #customer_login::before,
body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content #customer_login::after {
	content: none;
	display: none;
}

body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content #customer_login > :is(.u-column1, .u-column2) {
	float: none;
	width: auto;
}

body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content #customer_login > div > form {
	margin: 0;
}

body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content :is(#customer_login > div > form, .woocommerce > form.woocommerce-form-login, .woocommerce > form.woocommerce-ResetPassword) {
	padding: 20px;
	border: 1px solid var(--bpal-acc-line);
	border-radius: var(--bpal-acc-radius-card);
	background: #fff;
}

body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content .woocommerce > :is(form.woocommerce-form-login, form.woocommerce-ResetPassword) {
	max-width: 520px;
	margin: 0 auto;
}

/* Without registration WooCommerce prints one heading and one form (no #customer_login): the heading sits above the card, as wide as the card. */
body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content .woocommerce > h2 {
	max-width: 520px;
	margin: 0 auto 18px;
	font-size: 1.375rem;
}

@media (min-width: 720px) {
	body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content :is(#customer_login > div > form, .woocommerce > form.woocommerce-form-login, .woocommerce > form.woocommerce-ResetPassword) {
		padding: 28px;
	}
}

body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content #customer_login h2 {
	margin-bottom: 18px;
	font-size: 1.375rem;
}

body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content form .form-row {
	float: none;
	width: auto;
	margin: 0 0 18px;
	padding: 0;
}

body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content form .form-row label {
	display: block;
	margin: 0 0 6px;
	color: var(--bpal-primary);
	font-size: 0.875rem;
	font-weight: 600;
}

body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content form .form-row :is(input.input-text, input[type="password"]) {
	box-sizing: border-box;
	width: 100%;
	height: 48px;
	padding: 0 14px;
	border: 1px solid var(--bpal-acc-field);
	border-radius: var(--bpal-acc-radius);
	background: #fff;
	color: var(--bpal-text);
	font-size: 1rem;
}

body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content form .form-row :is(input.input-text, input[type="password"]):focus {
	border-color: var(--bpal-primary);
	outline: 3px solid var(--bpal-primary);
	outline-offset: 1px;
}

body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content form label.woocommerce-form__label-for-checkbox {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 14px;
	font-weight: 400;
}

body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content form input[type="checkbox"] {
	width: 20px;
	height: 20px;
	margin: 0;
	accent-color: var(--bpal-primary);
}

body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content :is(a.button, button.button) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 0 22px;
	border: 2px solid var(--bpal-accent);
	border-radius: var(--bpal-acc-radius);
	background: var(--bpal-accent);
	color: var(--bpal-primary);
	font-size: 0.9375rem;
	font-weight: 700;
	line-height: 1;
	text-decoration: none;
	cursor: pointer;
}

body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content :is(a.button, button.button):hover {
	border-color: var(--bpal-acc-accent-hover);
	background: var(--bpal-acc-accent-hover);
}

body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content form button.button {
	width: 100%;
}

body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content form > p:not(.form-row),
body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content form .woocommerce-privacy-policy-text {
	margin: 0 0 16px;
	line-height: 1.6;
}

body.bpal-is-account:not(.bpal-account-signed-in) .bpal-entry__content .lost_password {
	margin: 14px 0 0;
	font-size: 0.875rem;
}

/* Keyboard focus: a dark ring, a light one on the dark active item of the menu. */
body.bpal-is-account .bpal-entry__content :is(a, button, input, select, textarea, [tabindex]):focus-visible {
	outline: 3px solid var(--bpal-primary);
	outline-offset: 3px;
}

body.bpal-is-account .bpal-entry__content .woocommerce-MyAccount-navigation li a:focus-visible {
	outline-offset: -3px;
}

body.bpal-is-account .bpal-entry__content .woocommerce-MyAccount-navigation li.is-active a:focus-visible {
	outline-color: #fff;
}

@media (prefers-reduced-motion: reduce) {
	body.bpal-is-account main * {
		transition: none !important;
	}
}