/**
 * Scan Accessibility: WooCommerce My Account area.
 *
 * Loaded only on account pages (inc/account.php). Every rule is scoped to .woocommerce-account,
 * and most also to .woocommerce (the shortcode wrapper), so they win over Astra's WooCommerce styles
 * without !important. Checkout, cart and the rest of the site are not affected.
 *
 * Sections: tokens · page container · logged-out section · cards · fields · password toggle ·
 * checkbox · logged-in layout · dashboard · account pages · buttons · links · notices · password strength meter.
 */

/* Tokens ------------------------------------------------------------------ */

.woocommerce-account {
	--sa-account-navy: #14213D;
	--sa-account-muted: #4A5573;
	--sa-account-blue: #2F5BEA;
	--sa-account-blue-dark: #2449C4;
	--sa-account-link: #1F3FA8;
	--sa-account-tint: #F3F6FF;
	--sa-account-tint-strong: #E3EAFF;
	--sa-account-mint: #3DDBB1;
	--sa-account-mint-soft: #DDF8F0;
	--sa-account-field-border: #8792AA; /* 3.2:1 on white (WCAG 1.4.11); the brief's #C9D2E3 is 1.5:1. */
	--sa-account-card-border: #E3E8F4;
	--sa-account-white: #FFFFFF;
	--sa-account-font-heading: 'Bricolage Grotesque', Georgia, serif;
	--sa-account-font-text: 'Atkinson Hyperlegible', system-ui, sans-serif;
	--sa-account-focus: 3px solid var(--sa-account-blue);
}

/* Page container ---------------------------------------------------------- */

/* The tint sections run edge to edge (100vw includes the scrollbar), so clip the sideways overflow. */
.woocommerce-account #page {
	overflow-x: clip;
}

/* No gap between the site header and the tint section or header band: drop the page's column padding. */
.woocommerce-account .entry-content .wp-block-columns:has(.sa-account-guest, .sa-account) {
	padding-top: 0;
	padding-bottom: 0;
}

/* Logged-out section: login, lost password, reset password ----------------- */

.woocommerce-account .woocommerce .sa-account-guest {
	position: relative;
	overflow: clip;
	margin-inline: calc(50% - 50vw);
	background: var(--sa-account-tint);
	color: var(--sa-account-navy);
	font-family: var(--sa-account-font-text);
	font-size: 18px;
	line-height: 1.55;
}

/* Decorative shapes: generated content with no text, so screen readers skip them. */
.woocommerce-account .woocommerce .sa-account-guest::before,
.woocommerce-account .woocommerce .sa-account-guest::after {
	content: "";
	position: absolute;
	pointer-events: none;
}

.woocommerce-account .woocommerce .sa-account-guest::before {
	width: 520px;
	height: 520px;
	left: -260px;
	top: -260px;
	border-radius: 50%;
	background: var(--sa-account-tint-strong);
}

.woocommerce-account .woocommerce .sa-account-guest::after {
	width: 300px;
	height: 300px;
	right: -100px;
	bottom: -100px;
	border-top-left-radius: 100%;
	background: var(--sa-account-mint-soft);
}

.woocommerce-account .woocommerce .sa-account-guest__inner {
	position: relative;
	z-index: 1;
	box-sizing: border-box;
	max-width: 560px;
	margin: 0 auto;
	padding: 80px 24px 96px;
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.woocommerce-account .woocommerce .sa-account-guest__header {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	text-align: center;
}

.woocommerce-account .woocommerce .sa-account-guest__title {
	margin: 0;
	font-family: var(--sa-account-font-heading);
	font-weight: 800;
	font-size: clamp(2.3rem, 4vw, 3.2rem);
	line-height: 1.05;
	letter-spacing: -0.03em;
	color: var(--sa-account-navy);
}

.woocommerce-account .woocommerce .sa-account-guest__intro {
	margin: 0;
	font-size: 19px;
	color: var(--sa-account-muted);
}

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

.woocommerce-account .woocommerce .sa-account-back {
	margin: 0;
	text-align: center;
	font-size: 16px;
}

/* Cards ------------------------------------------------------------------- */

/* Form card (also beats Astra's "body .woocommerce form.login" border and padding). */
.woocommerce-account .woocommerce .sa-account-card,
.woocommerce-account .woocommerce form.sa-account-card {
	box-sizing: border-box;
	margin: 0;
	padding: 36px;
	display: flex;
	flex-direction: column;
	gap: 20px;
	background: var(--sa-account-white);
	border: 0;
	border-radius: 24px;
	box-shadow: 0 2px 4px rgba(20, 33, 61, .05), 0 24px 56px rgba(20, 33, 61, .12);
	color: var(--sa-account-navy);
	text-align: left;
}

.woocommerce-account .woocommerce .sa-account-card > p,
.woocommerce-account .woocommerce .sa-account-card__text {
	margin: 0;
}

.woocommerce-account .woocommerce .sa-account-note {
	padding: 22px 26px;
	display: flex;
	flex-direction: column;
	gap: 6px;
	background: var(--sa-account-white);
	border: 1px solid var(--sa-account-card-border);
	border-radius: 20px;
}

.woocommerce-account .woocommerce .sa-account-note p {
	margin: 0;
}

.woocommerce-account .woocommerce .sa-account-note__title {
	font-weight: 700;
}

.woocommerce-account .woocommerce .sa-account-note__text {
	font-size: 16px;
	color: var(--sa-account-muted);
}

/* Fields ------------------------------------------------------------------ */

.woocommerce-account .woocommerce .sa-account-required-note {
	margin: 0;
	font-size: 15px;
	color: var(--sa-account-muted);
}

.woocommerce-account .woocommerce .sa-account-field {
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.woocommerce-account .woocommerce .sa-account-field label {
	display: block;
	margin: 0;
	font-weight: 700;
	font-size: 16px;
	line-height: 1.4;
	color: var(--sa-account-navy);
}

.woocommerce-account .woocommerce .sa-account-field .required,
.woocommerce-account .woocommerce .sa-account-required-note__mark {
	color: inherit;
	font-weight: 700;
	text-decoration: none;
}

.woocommerce-account .woocommerce .sa-account-label-row {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: baseline;
	gap: 4px 12px;
}

/* .sa-account-field + input: beats the Elementor kit's ".elementor-kit-6 input:not([type=button]):not([type=submit])". */
.woocommerce-account .woocommerce .sa-account-field input.sa-account-input {
	box-sizing: border-box;
	width: 100%;
	min-height: 52px;
	margin: 0;
	padding: 0 16px;
	font-family: inherit;
	font-size: 17px;
	line-height: 1.4;
	color: var(--sa-account-navy);
	background: var(--sa-account-white);
	border: 2px solid var(--sa-account-field-border);
	border-radius: 12px;
	box-shadow: none;
}

.woocommerce-account .woocommerce .sa-account-field input.sa-account-input:focus {
	border: 2px solid var(--sa-account-blue);
	outline: var(--sa-account-focus);
	outline-offset: 2px;
}

/* Password show/hide toggle ----------------------------------------------- */

/* WooCommerce's woocommerce.js wraps password inputs in .password-input and adds .show-password-input;
   assets/js/account.js gives the button its "Show"/"Hide" text and aria-pressed. */
.woocommerce-account .woocommerce .sa-account-field .password-input {
	position: relative;
	display: block;
}

.woocommerce-account .woocommerce .sa-account-field .password-input input.sa-account-input {
	padding-right: 88px;
}

.woocommerce-account .woocommerce .sa-account-field .show-password-input {
	position: absolute;
	top: 50%;
	right: 4px;
	translate: 0 -50%;
	transform: none;
	min-height: 44px;
	min-width: 64px;
	margin: 0;
	padding: 0 12px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 8px;
	background: var(--sa-account-tint);
	color: var(--sa-account-link);
	font-family: inherit;
	font-weight: 700;
	font-size: 14px;
	line-height: 1;
	box-shadow: none;
	cursor: pointer;
}

.woocommerce-account .woocommerce .sa-account-field .show-password-input:hover {
	background: var(--sa-account-tint-strong);
	color: var(--sa-account-link);
}

.woocommerce-account .woocommerce .sa-account-field .show-password-input:focus-visible {
	outline: var(--sa-account-focus);
	outline-offset: 2px;
}

/* Hide WooCommerce's eye icon; the button has text instead. */
.woocommerce-account .woocommerce .sa-account-field .show-password-input::after {
	content: none;
	display: none;
}

/* Checkbox ---------------------------------------------------------------- */

.woocommerce-account .woocommerce .sa-account-check {
	margin: 0;
}

.woocommerce-account .woocommerce .sa-account-check label {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	margin: 0;
	font-size: 16px;
	font-weight: 400;
	color: var(--sa-account-navy);
	cursor: pointer;
}

.woocommerce-account .woocommerce .sa-account-check input[type="checkbox"] {
	flex: none;
	width: 20px;
	height: 20px;
	margin: 0;
	accent-color: var(--sa-account-blue);
}

.woocommerce-account .woocommerce .sa-account-check input[type="checkbox"]:focus-visible {
	outline: var(--sa-account-focus);
	outline-offset: 3px;
}

/* Logged-in layout: header band, menu, content ---------------------------- */

/* Full width like the logged-out section; the band and body centre their own 1200px content. */
.woocommerce-account .woocommerce .sa-account {
	margin-inline: calc(50% - 50vw);
	color: var(--sa-account-navy);
	font-family: var(--sa-account-font-text);
	font-size: 18px;
	line-height: 1.55;
}

.woocommerce-account .woocommerce .sa-account-band {
	background: var(--sa-account-tint);
	border-bottom: 1px solid var(--sa-account-card-border);
}

.woocommerce-account .woocommerce .sa-account-band__inner {
	box-sizing: border-box;
	max-width: 1200px;
	margin: 0 auto;
	padding: 48px 24px 40px;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px;
}

.woocommerce-account .woocommerce .sa-account-band__text {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-width: 0;
}

.woocommerce-account .woocommerce .sa-account-eyebrow {
	margin: 0;
	font-weight: 700;
	font-size: 13px;
	line-height: 1.4;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--sa-account-link);
}

.woocommerce-account .woocommerce .sa-account-band__title {
	margin: 0;
	font-family: var(--sa-account-font-heading);
	font-weight: 800;
	font-size: clamp(2.2rem, 3.8vw, 3rem);
	line-height: 1.05;
	letter-spacing: -0.03em;
	color: var(--sa-account-navy);
	overflow-wrap: anywhere;
}

.woocommerce-account .woocommerce .sa-account-body {
	box-sizing: border-box;
	max-width: 1200px;
	margin: 0 auto;
	padding: 48px 24px 96px;
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr);
	align-items: start;
	gap: 32px 48px;
}

/* Menu card. Also undoes Astra's floats and widths (30% / 68%). */
.woocommerce-account .woocommerce .sa-account-nav {
	box-sizing: border-box;
	float: none;
	width: auto;
	margin: 0;
	padding: 10px;
	background: var(--sa-account-white);
	border: 1px solid var(--sa-account-card-border);
	border-radius: 20px;
}

.woocommerce-account .woocommerce .sa-account-nav .sa-account-nav__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.woocommerce-account .woocommerce .sa-account-nav .sa-account-nav__item {
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
}

.woocommerce-account .woocommerce .sa-account-nav .sa-account-nav__item--logout {
	margin-top: 6px;
	padding-top: 6px;
	border-top: 1px solid var(--sa-account-card-border);
}

.woocommerce-account .woocommerce .sa-account-nav .sa-account-nav__link {
	box-sizing: border-box;
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 44px;
	padding: 12px 16px;
	border-radius: 12px;
	font-weight: 700;
	font-size: 16px;
	line-height: 1.3;
	color: var(--sa-account-navy);
	text-decoration: none;
}

.woocommerce-account .woocommerce .sa-account-nav .sa-account-icon {
	flex: none;
	color: var(--sa-account-muted);
}

.woocommerce-account .woocommerce .sa-account-nav .sa-account-nav__link:hover {
	background: var(--sa-account-tint);
	color: var(--sa-account-navy);
}

.woocommerce-account .woocommerce .sa-account-nav .sa-account-nav__link[aria-current="page"] {
	background: var(--sa-account-tint-strong);
	color: var(--sa-account-link);
}

.woocommerce-account .woocommerce .sa-account-nav .sa-account-nav__link[aria-current="page"] .sa-account-icon {
	color: var(--sa-account-link);
}

.woocommerce-account .woocommerce .sa-account-nav .sa-account-nav__link:focus-visible {
	outline: var(--sa-account-focus);
	outline-offset: 2px;
}

/* Content column. Also undoes Astra's float and 68% width. */
.woocommerce-account .woocommerce .sa-account-content {
	float: none;
	width: auto;
	min-width: 0;
	margin: 0;
}

.woocommerce-account .woocommerce .sa-account-content__title {
	margin: 0 0 24px;
	font-family: var(--sa-account-font-heading);
	font-weight: 700;
	font-size: 28px;
	line-height: 1.2;
	color: var(--sa-account-navy);
}

/* Links in the page content: underlined, so they don't rely on colour alone (axe link-in-text-block).
   Buttons keep their own styles. */
.woocommerce-account .woocommerce .sa-account-content a:where(:not(.button, .sa-account-btn)) {
	color: var(--sa-account-link);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.woocommerce-account .woocommerce .sa-account-content a:where(:not(.button, .sa-account-btn)):hover {
	color: var(--sa-account-navy);
}

.woocommerce-account .woocommerce .sa-account-content a:focus-visible {
	outline: var(--sa-account-focus);
	outline-offset: 3px;
}

@media (max-width: 767px) {
	.woocommerce-account .woocommerce .sa-account-band__inner {
		padding: 32px 16px 28px;
		align-items: flex-start;
	}

	.woocommerce-account .woocommerce .sa-account-body {
		grid-template-columns: minmax(0, 1fr);
		padding: 32px 16px 64px;
		gap: 24px;
	}
}

@media (min-width: 768px) and (max-width: 1023px) {
	.woocommerce-account .woocommerce .sa-account-body {
		gap: 32px;
	}
}

/* Dashboard: plan, usage, recent scans, shortcuts, help ------------------- */

.woocommerce-account .woocommerce .sa-account-dashboard {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.woocommerce-account .woocommerce .sa-account-dashboard__stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 20px;
}

.woocommerce-account .woocommerce .sa-account-panel {
	box-sizing: border-box;
	min-width: 0;
	padding: 24px;
	display: flex;
	flex-direction: column;
	gap: 12px;
	background: var(--sa-account-white);
	border: 1px solid var(--sa-account-card-border);
	border-radius: 20px;
}

/* Card titles: h3 for structure, styled as the small uppercase label. */
.woocommerce-account .woocommerce .sa-account-panel .sa-account-panel__label {
	margin: 0;
	padding: 0;
	font-family: var(--sa-account-font-text);
	font-weight: 700;
	font-size: 13px;
	line-height: 1.4;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--sa-account-muted);
}

.woocommerce-account .woocommerce .sa-account-panel .sa-account-panel__value {
	margin: 0;
	font-family: var(--sa-account-font-heading);
	font-weight: 700;
	font-size: 24px;
	line-height: 1.2;
	color: var(--sa-account-navy);
}

.woocommerce-account .woocommerce .sa-account-panel .sa-account-panel__meta {
	margin: 0;
	font-size: 16px;
	color: var(--sa-account-muted);
}

.woocommerce-account .woocommerce .sa-account-panel a.sa-account-panel__link {
	align-self: flex-start;
	margin-top: auto;
	padding: 11px 0;
	margin-bottom: -11px;
	font-weight: 700;
	font-size: 16px;
}

/* Usage bar (visual only, aria-hidden). */
.woocommerce-account .woocommerce .sa-account-meter {
	-webkit-appearance: none;
	appearance: none;
	display: block;
	width: 100%;
	height: 10px;
	margin: 0;
	border: 0;
	border-radius: 999px;
	overflow: hidden;
	background: var(--sa-account-tint-strong);
	color: var(--sa-account-blue);
}

.woocommerce-account .woocommerce .sa-account-meter::-webkit-progress-bar {
	background: var(--sa-account-tint-strong);
	border-radius: 999px;
}

.woocommerce-account .woocommerce .sa-account-meter::-webkit-progress-value {
	background: var(--sa-account-blue);
	border-radius: 999px;
}

.woocommerce-account .woocommerce .sa-account-meter::-moz-progress-bar {
	background: var(--sa-account-blue);
	border-radius: 999px;
}

/* Recent scans. */
.woocommerce-account .woocommerce .sa-account-panel--list {
	gap: 4px;
	padding: 8px 24px;
}

.woocommerce-account .woocommerce .sa-account-panel--list .sa-account-panel__label {
	padding: 16px 0 8px;
}

.woocommerce-account .woocommerce .sa-account-scans {
	list-style: none;
	margin: 0;
	padding: 0;
}

.woocommerce-account .woocommerce .sa-account-scans .sa-account-scans__row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 16px;
	margin: 0;
	padding: 14px 0;
	border-top: 1px solid var(--sa-account-card-border);
	list-style: none;
}

.woocommerce-account .woocommerce .sa-account-scans .sa-account-scans__row:last-child {
	padding-bottom: 18px;
}

.woocommerce-account .woocommerce .sa-account-scans__page {
	flex: 1 1 260px;
	min-width: 0;
	font-weight: 700;
	overflow-wrap: anywhere;
}

.woocommerce-account .woocommerce .sa-account-scans__date {
	font-size: 15px;
	color: var(--sa-account-muted);
}

.woocommerce-account .woocommerce .sa-account-scans__score {
	font-weight: 700;
}

.woocommerce-account .woocommerce .sa-account-scans a.sa-account-scans__link {
	padding: 11px 0;
	margin: -11px 0;
	font-weight: 700;
	font-size: 15px;
}

/* Shortcuts. */
.woocommerce-account .woocommerce .sa-account-shortcuts {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 12px;
}

.woocommerce-account .woocommerce .sa-account-shortcuts li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.woocommerce-account .woocommerce .sa-account-shortcuts a.sa-account-shortcut {
	box-sizing: border-box;
	height: 100%;
	min-height: 44px;
	padding: 18px 20px;
	display: flex;
	align-items: center;
	gap: 12px;
	background: var(--sa-account-white);
	border: 1px solid var(--sa-account-card-border);
	border-radius: 20px;
	font-weight: 700;
	color: var(--sa-account-navy);
	text-decoration: none;
}

.woocommerce-account .woocommerce .sa-account-shortcuts a.sa-account-shortcut:hover {
	background: var(--sa-account-tint);
	border-color: var(--sa-account-tint-strong);
	color: var(--sa-account-navy);
}

.woocommerce-account .woocommerce .sa-account-shortcut .sa-account-icon {
	flex: none;
	color: var(--sa-account-blue);
}

.woocommerce-account .woocommerce .sa-account-help {
	margin: 0;
	font-size: 16px;
	color: var(--sa-account-muted);
}

/* Account pages: orders, subscription, payment methods, address, details -- */

/* Section headings that WooCommerce and Subscriptions print inside a page ("Order details",
   "Subscription totals", "Related orders", ...), under the page's own h2. */
.woocommerce-account .woocommerce .sa-account-content h2:not(.sa-account-content__title) {
	margin: 32px 0 12px;
	font-family: var(--sa-account-font-heading);
	font-weight: 700;
	font-size: 22px;
	line-height: 1.25;
	color: var(--sa-account-navy);
}

/* Duplicates of the page h2 ("Billing address"): the address card title and the edit form title. */
.woocommerce-account .woocommerce .sa-account-content > .woocommerce-Address .woocommerce-Address-title h2,
.woocommerce-account .woocommerce .sa-account-content > form > h2:first-child {
	display: none;
}

.woocommerce-account .woocommerce .sa-account-content > p {
	margin: 0 0 20px;
}

.woocommerce-account .woocommerce .sa-account-content mark {
	padding: 0;
	background: transparent;
	color: var(--sa-account-navy);
	font-weight: 700;
}

/* Tables: white card, tint header row, 1px row lines. */
.woocommerce-account .woocommerce .sa-account-content table.shop_table {
	box-sizing: border-box;
	width: 100%;
	margin: 0 0 24px;
	border: 1px solid var(--sa-account-card-border);
	border-collapse: separate;
	border-spacing: 0;
	border-radius: 20px;
	overflow: hidden;
	background: var(--sa-account-white);
	font-size: 16px;
	line-height: 1.5;
	text-align: left;
	color: var(--sa-account-navy);
}

.woocommerce-account .woocommerce .sa-account-content table.shop_table th,
.woocommerce-account .woocommerce .sa-account-content table.shop_table td {
	padding: 14px 16px;
	border: 0;
	border-top: 1px solid var(--sa-account-card-border);
	background: transparent;
	color: var(--sa-account-navy);
	vertical-align: middle;
	font-weight: 400;
	/* Astra's word-break: break-word lets columns shrink until words split ("Comple ted"). */
	word-break: normal;
	overflow-wrap: break-word;
}

.woocommerce-account .woocommerce .sa-account-content table.shop_table thead th {
	border-top: 0;
	background: var(--sa-account-tint);
	font-size: 14px;
	font-weight: 700;
}

.woocommerce-account .woocommerce .sa-account-content table.shop_table tbody:first-child tr:first-child > * {
	border-top: 0;
}

.woocommerce-account .woocommerce .sa-account-content table.shop_table tbody th,
.woocommerce-account .woocommerce .sa-account-content table.shop_table tfoot th,
.woocommerce-account .woocommerce .sa-account-content table.subscription_details td:first-child {
	font-weight: 700;
}

.woocommerce-account .woocommerce .sa-account-content table.shop_table tfoot tr:last-child > * {
	background: var(--sa-account-tint);
}

/* Text links in table cells (order numbers, product names): a 44px tall hit area without moving the text. */
.woocommerce-account .woocommerce .sa-account-content table.shop_table a:not(.button) {
	display: inline-block;
	padding: 12px 0;
	margin: -12px 0;
}

/* Status as bold text (WooCommerce prints the status name, so it never relies on colour). */
.woocommerce-account .woocommerce .sa-account-content table.shop_table td.woocommerce-orders-table__cell-order-status {
	font-weight: 700;
}

.woocommerce-account .woocommerce .sa-account-content table.shop_table small {
	font-size: 14px;
	color: var(--sa-account-muted);
}

.woocommerce-account .woocommerce .sa-account-content .order-actions,
.woocommerce-account .woocommerce .sa-account-content .woocommerce-orders-table__cell-order-actions,
.woocommerce-account .woocommerce .sa-account-content .payment-method-actions {
	text-align: right;
}

/* Action links and secondary buttons: small outlined buttons. */
.woocommerce-account .woocommerce .sa-account-content .button:not(.sa-account-btn) {
	box-sizing: border-box;
	float: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	margin: 4px 8px 4px 0;
	padding: 0 18px;
	border: 2px solid var(--sa-account-navy);
	border-radius: 999px;
	background: var(--sa-account-white);
	color: var(--sa-account-navy);
	font-family: var(--sa-account-font-text);
	font-weight: 700;
	font-size: 15px;
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
	box-shadow: none;
	cursor: pointer;
}

.woocommerce-account .woocommerce .sa-account-content .order-actions .button:not(.sa-account-btn),
.woocommerce-account .woocommerce .sa-account-content .woocommerce-orders-table__cell-order-actions .button:not(.sa-account-btn),
.woocommerce-account .woocommerce .sa-account-content .payment-method-actions .button:not(.sa-account-btn) {
	margin: 4px 0 4px 8px;
}

.woocommerce-account .woocommerce .sa-account-content .button:not(.sa-account-btn):hover {
	background: var(--sa-account-tint);
	border-color: var(--sa-account-navy);
	color: var(--sa-account-navy);
}

.woocommerce-account .woocommerce .sa-account-content .button:not(.sa-account-btn):focus-visible {
	outline: var(--sa-account-focus);
	outline-offset: 3px;
}

/* Form submit buttons without theme classes ("Save address", "Add payment method"): primary blue. */
.woocommerce-account .woocommerce .sa-account-content button.button[name="save_address"],
.woocommerce-account .woocommerce .sa-account-content #payment #place_order {
	min-height: 52px;
	padding: 0 28px;
	border: 0;
	background: var(--sa-account-blue);
	color: var(--sa-account-white);
	font-size: 17px;
	box-shadow: 0 10px 24px rgba(47, 91, 234, .28);
}

.woocommerce-account .woocommerce .sa-account-content button.button[name="save_address"]:hover,
.woocommerce-account .woocommerce .sa-account-content #payment #place_order:hover {
	background: var(--sa-account-blue-dark);
	color: var(--sa-account-white);
}

.woocommerce-account .woocommerce .sa-account-content .woocommerce-pagination {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 24px;
}

/* Buttons inside notices ("Browse products") sit under the text. */
.woocommerce-account .woocommerce .sa-account-content .woocommerce-info .button:not(.sa-account-btn),
.woocommerce-account .woocommerce .sa-account-content .woocommerce-message .button:not(.sa-account-btn),
.woocommerce-account .woocommerce .sa-account-content .woocommerce-error .button:not(.sa-account-btn) {
	display: flex;
	width: fit-content;
	margin: 12px 0 0;
}

/* Addresses: white cards. */
.woocommerce-account .woocommerce .sa-account-content .woocommerce-Address,
.woocommerce-account .woocommerce .sa-account-content .woocommerce-customer-details address {
	box-sizing: border-box;
	float: none;
	width: auto;
	max-width: 560px;
	margin: 0 0 24px;
	padding: 24px;
	background: var(--sa-account-white);
	border: 1px solid var(--sa-account-card-border);
	border-radius: 20px;
}

.woocommerce-account .woocommerce .sa-account-content .woocommerce-Address {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.woocommerce-account .woocommerce .sa-account-content .woocommerce-Address address {
	order: 1;
	margin: 0;
	padding: 0;
	border: 0;
}

/* The "Edit Billing address" button goes under the address. Also drops Astra's bordered title box. */
.woocommerce-account .woocommerce .sa-account-content .woocommerce-Address .woocommerce-Address-title {
	order: 2;
	display: flex;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
}

.woocommerce-account .woocommerce .sa-account-content .woocommerce-Address-title::before,
.woocommerce-account .woocommerce .sa-account-content .woocommerce-Address-title::after {
	content: none;
}

.woocommerce-account .woocommerce .sa-account-content .woocommerce-Address-title a.edit {
	box-sizing: border-box;
	float: none;
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 18px;
	border: 2px solid var(--sa-account-navy);
	border-radius: 999px;
	background: var(--sa-account-white);
	color: var(--sa-account-navy);
	font-weight: 700;
	font-size: 15px;
	text-decoration: none;
}

.woocommerce-account .woocommerce .sa-account-content .woocommerce-Address-title a.edit:hover {
	background: var(--sa-account-tint);
}

.woocommerce-account .woocommerce .sa-account-content address {
	font-style: normal;
	line-height: 1.6;
	color: var(--sa-account-navy);
}

.woocommerce-account .woocommerce .sa-account-content .woocommerce-customer-details .woocommerce-column__title {
	margin-top: 32px;
	padding: 0;
	border: 0;
	background: none;
}

/* Forms: edit address, account details, add payment method. Fields match the login form. */
.woocommerce-account .woocommerce .sa-account-content .woocommerce-address-fields,
.woocommerce-account .woocommerce .sa-account-content .sa-account-fieldset {
	box-sizing: border-box;
	min-width: 0;
	margin: 0 0 24px;
	padding: 24px;
	background: var(--sa-account-white);
	border: 1px solid var(--sa-account-card-border);
	border-radius: 20px;
}

.woocommerce-account .woocommerce .sa-account-content .sa-account-fieldset__legend {
	float: left;
	width: 100%;
	margin: 0 0 16px;
	padding: 0;
	border: 0;
	font-family: var(--sa-account-font-heading);
	font-weight: 700;
	font-size: 22px;
	line-height: 1.25;
	color: var(--sa-account-navy);
}

.woocommerce-account .woocommerce .sa-account-content .sa-account-fieldset__legend + * {
	clear: both;
}

.woocommerce-account .woocommerce .sa-account-content .sa-account-required-note {
	margin: 0 0 20px;
}

.woocommerce-account .woocommerce .sa-account-content .sa-account-field__hint,
.woocommerce-account .woocommerce .sa-account-content .form-row .description {
	display: block;
	margin: 0;
	font-size: 15px;
	font-style: normal;
	color: var(--sa-account-muted);
}

.woocommerce-account .woocommerce .sa-account-content .sa-account-fieldset > .sa-account-field__hint {
	margin-bottom: 16px;
}

.woocommerce-account .woocommerce .sa-account-content .woocommerce-address-fields__field-wrapper,
.woocommerce-account .woocommerce .sa-account-content .sa-account-fieldset__row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	column-gap: 20px;
}

.woocommerce-account .woocommerce .sa-account-content .woocommerce-address-fields__field-wrapper > .form-row:not(.form-row-first):not(.form-row-last) {
	grid-column: 1 / -1;
}

.woocommerce-account .woocommerce .sa-account-content .form-row {
	float: none;
	width: auto;
	margin: 0 0 20px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.woocommerce-account .woocommerce .sa-account-content .form-row label {
	display: block;
	margin: 0;
	font-weight: 700;
	font-size: 16px;
	line-height: 1.4;
	color: var(--sa-account-navy);
}

.woocommerce-account .woocommerce .sa-account-content .form-row .required {
	color: inherit;
	font-weight: 700;
	text-decoration: none;
	border: 0;
}

.woocommerce-account .woocommerce .sa-account-content .form-row .optional {
	font-weight: 400;
	color: var(--sa-account-muted);
}

.woocommerce-account .woocommerce .sa-account-content .form-row .woocommerce-input-wrapper {
	display: block;
	width: 100%;
}

/* Same as .sa-account-input; specific enough to beat the Elementor kit's input rule. */
.woocommerce-account .woocommerce .sa-account-content .form-row input.input-text,
.woocommerce-account .woocommerce .sa-account-content .form-row select,
.woocommerce-account .woocommerce .sa-account-content .form-row textarea {
	box-sizing: border-box;
	width: 100%;
	min-height: 52px;
	margin: 0;
	padding: 0 16px;
	font-family: inherit;
	font-size: 17px;
	line-height: 1.4;
	color: var(--sa-account-navy);
	background-color: var(--sa-account-white);
	border: 2px solid var(--sa-account-field-border);
	border-radius: 12px;
	box-shadow: none;
}

.woocommerce-account .woocommerce .sa-account-content .form-row textarea {
	padding: 12px 16px;
}

.woocommerce-account .woocommerce .sa-account-content .form-row input.input-text:focus,
.woocommerce-account .woocommerce .sa-account-content .form-row select:focus,
.woocommerce-account .woocommerce .sa-account-content .form-row textarea:focus {
	border: 2px solid var(--sa-account-blue);
	outline: var(--sa-account-focus);
	outline-offset: 2px;
}

/* Country and state dropdowns (select2). Astra's rule for these starts with "body #content", so this one does too. */
body.woocommerce-account #content .woocommerce .sa-account-content .select2-container--default .select2-selection--single {
	box-sizing: border-box;
	height: 52px;
	padding: 0;
	display: flex;
	align-items: center;
	border: 2px solid var(--sa-account-field-border);
	border-radius: 12px;
	background: var(--sa-account-white);
}

body.woocommerce-account #content .woocommerce .sa-account-content .select2-container--default .select2-selection--single .select2-selection__rendered {
	padding: 0 40px 0 16px;
	line-height: 1.4;
	font-size: 17px;
	color: var(--sa-account-navy);
}

body.woocommerce-account #content .woocommerce .sa-account-content .select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 48px;
	right: 10px;
}

body.woocommerce-account #content .woocommerce .sa-account-content .select2-container--focus .select2-selection--single,
body.woocommerce-account #content .woocommerce .sa-account-content .select2-container--open .select2-selection--single {
	border-color: var(--sa-account-blue);
	outline: var(--sa-account-focus);
	outline-offset: 2px;
}

.woocommerce-account .woocommerce .sa-account-content .sa-account-form__actions,
.woocommerce-account .woocommerce .sa-account-content .woocommerce-address-fields > p:last-child {
	margin: 0;
}

/* Add payment method. */
.woocommerce-account .woocommerce .sa-account-content #payment {
	padding: 24px;
	background: var(--sa-account-white);
	border: 1px solid var(--sa-account-card-border);
	border-radius: 20px;
}

.woocommerce-account .woocommerce .sa-account-content #payment ul.payment_methods {
	margin: 0 0 20px;
	padding: 0;
	border: 0;
	list-style: none;
}

.woocommerce-account .woocommerce .sa-account-content #payment ul.payment_methods li {
	margin: 0 0 12px;
	list-style: none;
}

.woocommerce-account .woocommerce .sa-account-content #payment div.payment_box {
	margin: 12px 0 0;
	padding: 16px;
	border-radius: 12px;
	background: var(--sa-account-tint);
	color: var(--sa-account-navy);
	font-size: 16px;
}

.woocommerce-account .woocommerce .sa-account-content #payment div.payment_box::before {
	content: none;
}

.woocommerce-account .woocommerce .sa-account-content #payment .form-row {
	margin: 0;
	padding: 0;
}

/* Subscription and order notes ("Subscription updates"). */
.woocommerce-account .woocommerce .sa-account-content ol.commentlist.notes {
	margin: 0 0 24px;
	padding: 0;
	list-style: none;
}

.woocommerce-account .woocommerce .sa-account-content ol.commentlist.notes li {
	margin: 0 0 12px;
	padding: 16px 20px;
	border: 1px solid var(--sa-account-card-border);
	border-radius: 16px;
	background: var(--sa-account-white);
	list-style: none;
}

@media (max-width: 600px) {
	.woocommerce-account .woocommerce .sa-account-content .woocommerce-address-fields__field-wrapper,
	.woocommerce-account .woocommerce .sa-account-content .sa-account-fieldset__row {
		grid-template-columns: minmax(0, 1fr);
	}

	.woocommerce-account .woocommerce .sa-account-content .woocommerce-address-fields,
	.woocommerce-account .woocommerce .sa-account-content .sa-account-fieldset,
	.woocommerce-account .woocommerce .sa-account-content .woocommerce-Address,
	.woocommerce-account .woocommerce .sa-account-content #payment {
		padding: 20px;
	}
}

/* Phones and small tablets: WooCommerce's responsive tables (each row a card, cells labelled from
   data-title) at Astra's breakpoint, instead of sideways scrolling. Astra hides tbody th, which would
   hide the order number, so it is shown again here. Astra's text-align uses !important, so the two
   alignment overrides below need it too. */
@media (max-width: 921px) {
	.woocommerce-account .woocommerce .sa-account-content table.shop_table_responsive tbody tr {
		display: block;
		padding: 8px 20px;
		border-top: 1px solid var(--sa-account-card-border);
	}

	.woocommerce-account .woocommerce .sa-account-content table.shop_table_responsive tbody tr:first-child {
		border-top: 0;
	}

	.woocommerce-account .woocommerce .sa-account-content table.shop_table_responsive tbody th,
	.woocommerce-account .woocommerce .sa-account-content table.shop_table_responsive tbody td {
		display: block;
		padding: 8px 0;
		border: 0;
		text-align: right;
	}

	.woocommerce-account .woocommerce .sa-account-content table.shop_table_responsive tbody th[data-title]::before,
	.woocommerce-account .woocommerce .sa-account-content table.shop_table_responsive tbody td[data-title]::before {
		content: attr(data-title) ": ";
		float: left;
		margin-right: 12px;
		font-weight: 700;
		color: var(--sa-account-navy);
	}

	.woocommerce-account .woocommerce .sa-account-content table.shop_table_responsive tbody td.order-actions,
	.woocommerce-account .woocommerce .sa-account-content table.shop_table_responsive tbody td.woocommerce-orders-table__cell-order-actions,
	.woocommerce-account .woocommerce .sa-account-content table.shop_table_responsive tbody td.payment-method-actions {
		text-align: left !important;
	}

	.woocommerce-account .woocommerce .sa-account-content table.shop_table_responsive tbody td.order-actions::before,
	.woocommerce-account .woocommerce .sa-account-content table.shop_table_responsive tbody td.woocommerce-orders-table__cell-order-actions::before,
	.woocommerce-account .woocommerce .sa-account-content table.shop_table_responsive tbody td.payment-method-actions::before {
		display: none;
	}

	.woocommerce-account .woocommerce .sa-account-content .order-actions .button:not(.sa-account-btn),
	.woocommerce-account .woocommerce .sa-account-content .woocommerce-orders-table__cell-order-actions .button:not(.sa-account-btn),
	.woocommerce-account .woocommerce .sa-account-content .payment-method-actions .button:not(.sa-account-btn) {
		margin: 4px 8px 4px 0;
	}
}

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

.woocommerce-account .woocommerce .sa-account-btn {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 52px;
	margin: 0;
	padding: 0 28px;
	border-radius: 999px;
	font-family: var(--sa-account-font-text);
	font-weight: 700;
	font-size: 17px;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
}

.woocommerce-account .woocommerce .sa-account-btn--primary {
	background: var(--sa-account-blue);
	color: var(--sa-account-white);
	border: 0;
	box-shadow: 0 10px 24px rgba(47, 91, 234, .28);
}

.woocommerce-account .woocommerce .sa-account-btn--primary:hover,
.woocommerce-account .woocommerce .sa-account-btn--primary:focus {
	background: var(--sa-account-blue-dark);
	color: var(--sa-account-white);
}

.woocommerce-account .woocommerce .sa-account-btn--block {
	width: 100%;
}

.woocommerce-account .woocommerce .sa-account-btn:focus-visible {
	outline: var(--sa-account-focus);
	outline-offset: 3px;
}

/* Disabled while the password strength meter says the password is too weak. */
.woocommerce-account .woocommerce .sa-account-btn:disabled {
	opacity: .6;
	cursor: not-allowed;
}

/* Links ------------------------------------------------------------------- */

.woocommerce-account .woocommerce .sa-account-guest a {
	color: var(--sa-account-link);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.woocommerce-account .woocommerce .sa-account-guest a:hover {
	color: var(--sa-account-navy);
}

.woocommerce-account .woocommerce .sa-account-guest a:focus-visible {
	outline: var(--sa-account-focus);
	outline-offset: 3px;
	border-radius: 2px;
}

/* Standalone small links: a 44px tall hit area without moving the text. */
.woocommerce-account .woocommerce .sa-account-small-link {
	display: inline-block;
	padding: 11px 0;
	margin: -11px 0;
	font-size: 15px;
	font-weight: 400;
}

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

/* Rounded tint boxes with a text label ("Error", "Success", "Note"); colour is never the only signal.
   WooCommerce's own markup and role="alert" are kept. */
.woocommerce-account .woocommerce .woocommerce-error,
.woocommerce-account .woocommerce .woocommerce-message,
.woocommerce-account .woocommerce .woocommerce-info {
	display: block;
	position: static;
	box-sizing: border-box;
	width: auto;
	margin: 0 0 16px;
	padding: 16px 20px;
	border: 1px solid;
	border-radius: 16px;
	font-family: var(--sa-account-font-text);
	font-size: 16px;
	line-height: 1.5;
	color: var(--sa-account-navy);
	list-style: none;
	text-align: left;
}

.woocommerce-account .woocommerce .woocommerce-notices-wrapper > :last-child,
.woocommerce-account .woocommerce .sa-account-guest__inner > .woocommerce-error:last-of-type,
.woocommerce-account .woocommerce .sa-account-guest__inner > .woocommerce-message:last-of-type,
.woocommerce-account .woocommerce .sa-account-guest__inner > .woocommerce-info:last-of-type {
	margin-bottom: 0;
}

.woocommerce-account .woocommerce .woocommerce-error::before,
.woocommerce-account .woocommerce .woocommerce-message::before,
.woocommerce-account .woocommerce .woocommerce-info::before {
	display: block;
	position: static;
	margin: 0 0 2px;
	font-family: var(--sa-account-font-text);
	font-weight: 700;
	font-size: 16px;
}

.woocommerce-account .woocommerce .woocommerce-error::after,
.woocommerce-account .woocommerce .woocommerce-message::after,
.woocommerce-account .woocommerce .woocommerce-info::after {
	content: none;
}

.woocommerce-account .woocommerce .woocommerce-error {
	background: #FDEDED;
	border-color: #E59A9A;
}

.woocommerce-account .woocommerce .woocommerce-error::before {
	content: "Error";
	color: #A11B2B;
}

.woocommerce-account .woocommerce .woocommerce-message {
	background: #E7FAF4;
	border-color: var(--sa-account-mint);
}

.woocommerce-account .woocommerce .woocommerce-message::before {
	content: "Success";
	color: #0E6B52;
}

.woocommerce-account .woocommerce .woocommerce-info {
	background: var(--sa-account-tint);
	border-color: #B8C6F0;
}

.woocommerce-account .woocommerce .woocommerce-info::before {
	content: "Note";
	color: var(--sa-account-link);
}

.woocommerce-account .woocommerce .woocommerce-error li,
.woocommerce-account .woocommerce .woocommerce-message li,
.woocommerce-account .woocommerce .woocommerce-info li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.woocommerce-account .woocommerce .woocommerce-error a,
.woocommerce-account .woocommerce .woocommerce-message a,
.woocommerce-account .woocommerce .woocommerce-info a {
	color: var(--sa-account-link);
	text-decoration: underline;
}

/* Password strength meter (reset password form) ---------------------------- */

.woocommerce-account .woocommerce .sa-account-field .woocommerce-password-strength {
	margin: 0;
	padding: 8px 12px;
	border-radius: 8px;
	font-size: 15px;
	font-weight: 700;
	text-align: left;
	color: var(--sa-account-navy);
	background: var(--sa-account-tint);
}

.woocommerce-account .woocommerce .sa-account-field .woocommerce-password-strength.short,
.woocommerce-account .woocommerce .sa-account-field .woocommerce-password-strength.bad {
	background: #FDEDED;
}

.woocommerce-account .woocommerce .sa-account-field .woocommerce-password-strength.good {
	background: #FFF4E0;
}

.woocommerce-account .woocommerce .sa-account-field .woocommerce-password-strength.strong {
	background: #E7FAF4;
}

.woocommerce-account .woocommerce .sa-account-field .woocommerce-password-hint {
	display: block;
	font-size: 15px;
	color: var(--sa-account-muted);
}

/* Motion ------------------------------------------------------------------ */

@media (prefers-reduced-motion: no-preference) {
	.woocommerce-account .woocommerce .sa-account-btn,
	.woocommerce-account .woocommerce .sa-account-field .show-password-input {
		transition: background-color .15s ease;
	}
}

@media (prefers-reduced-motion: reduce) {
	.woocommerce-account .woocommerce .sa-account-btn,
	.woocommerce-account .woocommerce .sa-account-btn:hover,
	.woocommerce-account .woocommerce .sa-account-field .show-password-input {
		transition: none;
		transform: none;
	}
}

/* Phones ------------------------------------------------------------------ */

@media (max-width: 600px) {
	.woocommerce-account .woocommerce .sa-account-guest__inner {
		padding: 48px 16px 64px;
		gap: 20px;
	}

	.woocommerce-account .woocommerce .sa-account-guest__intro {
		font-size: 17px;
	}

	.woocommerce-account .woocommerce .sa-account-card,
	.woocommerce-account .woocommerce form.sa-account-card {
		padding: 24px 20px;
		border-radius: 20px;
	}

	.woocommerce-account .woocommerce .sa-account-note {
		padding: 20px;
	}
}
