/* ==========================================================================
   MOJE KONTO + logowanie / rejestracja — Humee (ADR-0031)

   Klasyczne endpointy WooCommerce (myaccount/*.php), stylowane hook/CSS-first na
   tokenach theme.json. ZERO override szablonów Woo — natywny markup jest już
   semantyczny/dostępny (label/autocomplete/aria, `role=alert`), a legacy CSS Woo
   jest OFF (inc/woo/foundation.php), więc ubieramy stabilne klasy klasyczne
   (`.woocommerce-MyAccount-*`, `.woocommerce-Input`, `.form-row`) od zera.

   Prymitywy: `.field`/`.input`/`.radio` = components/forms.css (warunkowy, ADR-0032;
   ładowany przed tym plikiem); `.btn` (przyciski — `.woocommerce-account .button`
   zmapowane), `.pill`, `.breadcrumb` = components.css. Ten plik = layout par pól /
   kolumny / przełącznik hasła (nadpisania prymitywu przez specyficzność).
   Enqueue warunkowy `is_account_page()` (inc/woo/account.php, dep -components).
   Zakładkę WPLoyalty „punkty & rewards" koloruje loyalty.css (nie dublujemy).
   ========================================================================== */

/* ----------------------------------------------------------------------------
   Rama strony + nagłówek (breadcrumb-kicker + H1). Wstrzykiwane przez
   `the_content` (account.php), bo page.php renderuje sam shortcode.
   ---------------------------------------------------------------------------- */
.account-page {
	padding-block: var(--wp--preset--spacing--md) var(--wp--preset--spacing--xl);
}

.account-header {
	margin-block-end: var(--wp--preset--spacing--lg);
	padding-block-end: var(--wp--preset--spacing--md);
	border-block-end: 1px solid var(--wp--preset--color--line);
}

.account-header__kicker {
	margin-block-end: var(--wp--preset--spacing--sm);
}

.account-header__title {
	font-size: var(--wp--preset--font-size--h-1);
	font-weight: var(--wp--custom--font-weight--regular);
	line-height: var(--wp--custom--line-height--tight);
	letter-spacing: var(--wp--custom--letter-spacing--wide);
	color: var(--wp--preset--color--dark);
}

/* Komunikaty (błędy/info/sukces) — przeniesione do WSPÓLNEGO prymitywu notice
   w components.css (sekcja NOTICES, ADR-0033). Konto nie ma już własnej wersji:
   klasyczny i blokowy notice wyglądają identycznie na całej witrynie. */

/* ----------------------------------------------------------------------------
   LOGOWANIE / REJESTRACJA — dwie kolumny na tokenach (natywny #customer_login).
   ---------------------------------------------------------------------------- */
.account-login__intro {
	margin-block-end: var(--wp--preset--spacing--md);
	max-width: 46ch;
	font-size: var(--wp--preset--font-size--lead);
	line-height: var(--wp--custom--line-height--body);
	color: var(--wp--preset--color--dark);
}

#customer_login {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--wp--preset--spacing--lg);
	align-items: start;
}

#customer_login > .u-column1,
#customer_login > .u-column2 {
	padding: var(--wp--preset--spacing--md);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--modal);
	background: var(--wp--preset--color--bg-alt);
}

#customer_login h2 {
	margin-block-end: var(--wp--preset--spacing--md);
	padding-block-end: var(--wp--preset--spacing--sm);
	border-block-end: 1px solid var(--wp--preset--color--line);
	font-size: var(--wp--preset--font-size--heading);
	font-weight: var(--wp--custom--font-weight--regular);
	letter-spacing: var(--wp--custom--letter-spacing--wide);
	color: var(--wp--preset--color--dark);
}

@media (max-width: 48rem) {
	#customer_login {
		grid-template-columns: 1fr;
	}
}

/* ----------------------------------------------------------------------------
   Odzyskiwanie / reset hasła — wąska karta spójna z logowaniem. Natywny formularz
   ma klasę `.woocommerce-ResetPassword` (NIE `.woocommerce-form`), więc rytm/kartę
   nadajemy osobno. Ta sama klasa obsługuje „podaj e-mail" oraz „ustaw nowe hasło".
   ---------------------------------------------------------------------------- */
.woocommerce-ResetPassword {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--sm);
	max-inline-size: 32rem;
	padding: var(--wp--preset--spacing--md);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--modal);
	background: var(--wp--preset--color--bg-alt);
}

/* Wstępny akapit („Zapomniałeś hasła? Podaj e-mail…") — czysty odstęp od pól. */
.woocommerce-ResetPassword > p:first-of-type {
	margin: 0;
	line-height: var(--wp--custom--line-height--body);
	color: var(--wp--preset--color--dark);
}

.woocommerce-ResetPassword .clear {
	display: none;
}

.woocommerce-ResetPassword .woocommerce-Button {
	inline-size: 100%;
	margin-block-start: var(--wp--preset--spacing--xs);
}

/* ----------------------------------------------------------------------------
   Formularze — rytm wierszy, przyciski, checkbox, linki, RODO.
   ---------------------------------------------------------------------------- */
.woocommerce-form {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--sm);
}

/* Przycisk submit = prymityw .btn (mapowany w components.css). Tu lowercase
   (natywny „Log in"/„Register" bywa Capitalized) + zejście ze skali CTA: bazowy
   `.btn` niesie font `button-1` (~26px) i min-height 3rem — na formularzu konta to
   za dużo. Sprowadzamy do rytmu pól (font body, wys. 2.75rem = próg dotyku 44px). */
.woocommerce-account .button {
	text-transform: lowercase;
	min-height: 2.75rem;
	font-size: var(--wp--preset--font-size--body);
}

/* Pole hasła z natywnym przełącznikiem „pokaż/ukryj" (`.show-password-input` Woo,
   dokładany JS-em). Legacy CSS Woo OFF, więc span renderuje się jako goły kwadracik
   pod polem — ubieramy go w ikonę oka wewnątrz pola (wrapper `.password-input`). */
.account-page .password-input {
	position: relative;
	display: block;
}

.account-page .password-input .input-text {
	padding-inline-end: 2.75rem;
}

.account-page .show-password-input {
	position: absolute;
	inset-block-start: 50%;
	inset-inline-end: var(--wp--preset--spacing--sm);
	transform: translateY(-50%);
	inline-size: 1.25rem;
	block-size: 1.25rem;
	cursor: pointer;
	background: var(--wp--preset--color--placeholder);
	-webkit-mask: var(--show-password-icon, url("../icons/eye.svg")) no-repeat center / contain;
	        mask: var(--show-password-icon, url("../icons/eye.svg")) no-repeat center / contain;
	transition: background-color 0.2s ease;
}

/* Hover — ciemniejszy (sygnał klikalności; span nie jest natywnie focusowalny w Woo). */
.account-page .show-password-input:hover {
	background: var(--wp--preset--color--dark);
}

/* Hasło widoczne (Woo dokłada `.display-password`) — akcent + ikona „przekreślone oko". */
.account-page .show-password-input.display-password {
	--show-password-icon: url("../icons/eye-off.svg");
	background: var(--wp--preset--color--accent);
}

.account-page .show-password-input.display-password:hover {
	background: var(--wp--preset--color--accent);
	filter: brightness(1.08);
}

/* CTA na pełną szerokość karty — mocna kotwica zamiast przycisku „pływającego" po
   lewej (fight „chaosu"). Dark pill = język CTA sklepu; spójne z resetem hasła. */
.woocommerce-form-login__submit,
.woocommerce-form-register__submit {
	inline-size: 100%;
	margin-block-start: var(--wp--preset--spacing--xs);
}

/* Checkbox „zapamiętaj mnie" / zgody — etykieta w rzędzie z kontrolką. */
.woocommerce-form__label-for-checkbox {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--sm);
	cursor: pointer;
}

.woocommerce-form__input-checkbox {
	inline-size: 1.15rem;
	block-size: 1.15rem;
	accent-color: var(--wp--preset--color--accent);
	cursor: pointer;
}

.woocommerce-form__input-checkbox:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
}

/* Link „nie pamiętasz hasła?" — wyśrodkowany pod CTA, podkreślany (język linków motywu). */
.woocommerce-LostPassword {
	margin: 0;
	text-align: center;
	font-size: var(--wp--preset--font-size--body);
}

.woocommerce-LostPassword a {
	color: var(--wp--preset--color--dark);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.woocommerce-LostPassword a:hover,
.woocommerce-LostPassword a:focus-visible {
	color: var(--wp--preset--color--accent);
}

/* Zgoda RODO / polityka prywatności — drobny druk oddzielony hairline'em od pól
   (fight „ściany tekstu": legalny tekst schodzi do roli przypisu nad przyciskiem). */
.woocommerce-privacy-policy-text {
	padding-block-start: var(--wp--preset--spacing--sm);
	border-block-start: 1px solid var(--wp--preset--color--line);
	font-size: var(--wp--preset--font-size--body);
	line-height: var(--wp--custom--line-height--body);
	color: var(--wp--preset--color--placeholder);
}

/* Natywny miernik siły hasła Woo jest wyłączony (dequeue `wc-password-strength-meter`
   w account.php) — świadoma decyzja produktowa, nie stylujemy go tutaj. */

/* Honeypot — pole-pułapka anty-spam (poza ekranem, niewidoczne dla ludzi/SR). */
.account-honeypot {
	position: absolute;
	inline-size: 1px;
	block-size: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

/* ----------------------------------------------------------------------------
   ZALOGOWANY — layout nawigacja | treść. `:has` = współczesny WP/2026;
   fallback (brak :has) = kolumny stackują się naturalnie.
   ---------------------------------------------------------------------------- */
.account-page .woocommerce:has(.woocommerce-MyAccount-navigation) {
	display: grid;
	grid-template-columns: minmax(0, 15rem) minmax(0, 1fr);
	gap: var(--wp--preset--spacing--lg);
	align-items: start;
}

@media (max-width: 48rem) {
	.account-page .woocommerce:has(.woocommerce-MyAccount-navigation) {
		grid-template-columns: 1fr;
	}
}

/* Nawigacja — pionowa lista pigułek z ikoną. */
.woocommerce-MyAccount-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--xs);
}

.woocommerce-MyAccount-navigation-link a {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--sm);
	padding: var(--wp--preset--spacing--xs) var(--wp--preset--spacing--sm);
	border-radius: var(--wp--custom--radius--pill);
	color: var(--wp--preset--color--dark);
	text-decoration: none;
	transition: background-color 0.2s ease, color 0.2s ease;
}

.woocommerce-MyAccount-navigation-link a::before {
	content: "";
	flex: none;
	inline-size: 1.15em;
	block-size: 1.15em;
	background: currentColor;
	-webkit-mask: var(--account-nav-icon, none) no-repeat center / contain;
	        mask: var(--account-nav-icon, none) no-repeat center / contain;
}

.woocommerce-MyAccount-navigation-link--dashboard a { --account-nav-icon: url("../icons/dashboard.svg"); }
.woocommerce-MyAccount-navigation-link--orders a { --account-nav-icon: url("../icons/orders.svg"); }
.woocommerce-MyAccount-navigation-link--downloads a { --account-nav-icon: url("../icons/orders.svg"); }
.woocommerce-MyAccount-navigation-link--edit-address a { --account-nav-icon: url("../icons/address.svg"); }
.woocommerce-MyAccount-navigation-link--edit-account a { --account-nav-icon: url("../icons/edit.svg"); }
.woocommerce-MyAccount-navigation-link--customer-logout a { --account-nav-icon: url("../icons/logout.svg"); }
.woocommerce-MyAccount-navigation-link--loyalty_reward a { --account-nav-icon: url("../icons/gift.svg"); }

.woocommerce-MyAccount-navigation-link a:hover,
.woocommerce-MyAccount-navigation-link a:focus-visible {
	background: var(--wp--preset--color--bg-alt);
}

.woocommerce-MyAccount-navigation-link a:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
}

.woocommerce-MyAccount-navigation-link.is-active a {
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--white);
}

/* ----------------------------------------------------------------------------
   TREŚĆ endpointu.
   ---------------------------------------------------------------------------- */
.woocommerce-MyAccount-content {
	min-inline-size: 0;
}

.woocommerce-MyAccount-content > p {
	margin-block: 0 var(--wp--preset--spacing--md);
	line-height: var(--wp--custom--line-height--body);
}

.woocommerce-MyAccount-content h2,
.woocommerce-MyAccount-content h3 {
	margin-block: var(--wp--preset--spacing--md) var(--wp--preset--spacing--sm);
	font-size: var(--wp--preset--font-size--heading);
	font-weight: var(--wp--custom--font-weight--regular);
	color: var(--wp--preset--color--dark);
}

/* Dashboard — kafle szybkich linków (account.php). */
.account-dashboard__links {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
	gap: var(--wp--preset--spacing--sm);
}

.account-dashboard__card a {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--xs);
	block-size: 100%;
	padding: var(--wp--preset--spacing--md);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--modal);
	background: var(--wp--preset--color--bg-alt);
	color: var(--wp--preset--color--dark);
	text-decoration: none;
	transition: border-color 0.2s ease, transform 0.2s ease;
}

.account-dashboard__card a:hover,
.account-dashboard__card a:focus-visible {
	border-color: var(--wp--preset--color--accent);
	transform: translateY(-2px);
}

.account-dashboard__card a:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
}

.account-dashboard__icon {
	inline-size: 1.75rem;
	block-size: 1.75rem;
	background: var(--wp--preset--color--accent);
	-webkit-mask: var(--account-card-icon, none) no-repeat center / contain;
	        mask: var(--account-card-icon, none) no-repeat center / contain;
}

.account-dashboard__icon--orders { --account-card-icon: url("../icons/orders.svg"); }
.account-dashboard__icon--edit-address { --account-card-icon: url("../icons/address.svg"); }
.account-dashboard__icon--edit-account { --account-card-icon: url("../icons/edit.svg"); }
.account-dashboard__icon--loyalty_reward { --account-card-icon: url("../icons/gift.svg"); }

.account-dashboard__label {
	font-size: var(--wp--preset--font-size--lead);
}

.account-dashboard__desc {
	font-size: var(--wp--preset--font-size--body);
	color: var(--wp--preset--color--placeholder);
}

/* ----------------------------------------------------------------------------
   Tabele LISTOWE konta (zamówienia / pliki do pobrania) — responsywne
   (mobile = karty), natywny markup `.shop_table_responsive` z `data-title`.
   Celowo `.shop_table_responsive` (NIE `.shop_table`), bo tabela SZCZEGÓŁÓW
   zamówienia (`.woocommerce-table--order-details`, bez `_responsive`) jest
   stylowana wspólnym `components/order-details.css` (DRY z thank-you, ADR-0032)
   — te bazowe reguły nie mogą jej dotykać (inaczej biją kartę specyficznością).
   ---------------------------------------------------------------------------- */
.account-page .shop_table_responsive {
	inline-size: 100%;
	border-collapse: collapse;
	font-size: var(--wp--preset--font-size--body);
}

.account-page .shop_table_responsive th,
.account-page .shop_table_responsive td {
	padding: var(--wp--preset--spacing--sm);
	text-align: start;
	border-block-end: 1px solid var(--wp--preset--color--line);
	vertical-align: middle;
}

/* Nagłówki kolumn = wyciszone etykiety (rytm „dashboardowy", nie treść). */
.account-page .shop_table_responsive th {
	font-weight: var(--wp--custom--font-weight--medium);
	letter-spacing: var(--wp--custom--letter-spacing--wide);
	color: var(--wp--preset--color--placeholder);
}

/* Numer zamówienia — główny „uchwyt" wiersza (link do szczegółów). */
.account-page .woocommerce-orders-table__cell-order-number a {
	font-weight: var(--wp--custom--font-weight--medium);
	color: var(--wp--preset--color--dark);
	text-decoration: none;
}

.account-page .woocommerce-orders-table__cell-order-number a:hover,
.account-page .woocommerce-orders-table__cell-order-number a:focus-visible {
	text-decoration: underline;
	text-decoration-color: var(--wp--preset--color--accent);
	text-underline-offset: 3px;
}

/* Data i kwota — cyfry tabelaryczne (równe kolumny liczb przy skanowaniu). */
.account-page .woocommerce-orders-table__cell-order-date,
.account-page .woocommerce-orders-table__cell-order-total {
	font-variant-numeric: tabular-nums;
}

/* Delikatne podświetlenie wiersza na hover — skanowalność listy zamówień. */
.account-page .woocommerce-orders-table tbody tr:hover {
	background: var(--wp--preset--color--bg-alt);
}

/* --- Status zamówienia = badge stanu (hook `..._column_order-status`) --------
   Kolor niesie tokeny stanów (`--wp--custom--state--*`, ADR-0033); ton ustawia
   PHP (mapa status→ton). Konwencja jak `.humee-badge` (pill, tight, wide). */
.account-order-status {
	display: inline-block;
	padding: 2px 12px 4px;
	border-radius: var(--wp--custom--radius--pill);
	font-size: var(--wp--preset--font-size--body);
	font-weight: var(--wp--custom--font-weight--regular);
	line-height: var(--wp--custom--line-height--tight);
	letter-spacing: var(--wp--custom--letter-spacing--wide);
	color: var(--status-fg, var(--wp--preset--color--placeholder));
	background: var(--status-bg, var(--wp--preset--color--bg-alt));
}

.account-order-status--success {
	--status-fg: var(--wp--custom--state--success);
	--status-bg: var(--wp--custom--state--success-bg);
}

.account-order-status--info {
	--status-fg: var(--wp--custom--state--info);
	--status-bg: var(--wp--custom--state--info-bg);
}

.account-order-status--warning {
	--status-fg: var(--wp--custom--state--warning);
	--status-bg: var(--wp--custom--state--warning-bg);
}

.account-order-status--error {
	--status-fg: var(--wp--custom--state--error);
	--status-bg: var(--wp--custom--state--error-bg);
}

.account-page .woocommerce-orders-table__cell-order-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--xs);
}

/* Mniejsze przyciski akcji zamówienia niż główne CTA. */
.account-page .woocommerce-orders-table__cell-order-actions .button {
	min-height: 2.25rem;
	padding: var(--wp--custom--pill--pad-small);
	font-size: var(--wp--preset--font-size--body);
}

@media (max-width: 48rem) {
	.account-page .shop_table_responsive thead {
		position: absolute;
		inline-size: 1px;
		block-size: 1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
		white-space: nowrap;
	}

	.account-page .shop_table_responsive tr {
		display: block;
		margin-block-end: var(--wp--preset--spacing--sm);
		padding: var(--wp--preset--spacing--sm);
		border: 1px solid var(--wp--preset--color--line);
		border-radius: var(--wp--custom--radius--modal);
	}

	.account-page .shop_table_responsive td {
		display: flex;
		justify-content: space-between;
		gap: var(--wp--preset--spacing--sm);
		border-block-end: 0;
		padding: var(--wp--preset--spacing--xs) 0;
		text-align: end;
	}

	.account-page .shop_table_responsive td::before {
		content: attr(data-title);
		font-weight: var(--wp--custom--font-weight--medium);
		text-align: start;
	}

	.account-page .woocommerce-orders-table__cell-order-actions {
		justify-content: flex-end;
	}
}

/* Paginacja zamówień. */
.woocommerce-pagination ul {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--xs);
	margin: var(--wp--preset--spacing--md) 0 0;
	padding: 0;
}

/* Link „wróć do zamówień" nad widokiem pojedynczego zamówienia (hook, account.php). */
.account-back-link {
	display: inline-flex;
	align-items: center;
	gap: var(--wp--preset--spacing--xs);
	margin-block-end: var(--wp--preset--spacing--md);
	font-size: var(--wp--preset--font-size--body);
	color: var(--wp--preset--color--dark);
	text-decoration: none;
}

.account-back-link__arrow {
	display: inline-block;
	transition: transform 0.2s ease;
}

.account-back-link:hover,
.account-back-link:focus-visible {
	color: var(--wp--preset--color--accent);
}

.account-back-link:hover .account-back-link__arrow,
.account-back-link:focus-visible .account-back-link__arrow {
	transform: translateX(-3px);
}

.account-back-link:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
}

/* ----------------------------------------------------------------------------
   Adresy — dwie karty (rozliczeniowy / wysyłki).
   ---------------------------------------------------------------------------- */
.woocommerce-Addresses {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--wp--preset--spacing--md);
	margin-block-start: var(--wp--preset--spacing--sm);
}

@media (max-width: 48rem) {
	.woocommerce-Addresses {
		grid-template-columns: 1fr;
	}
}

.woocommerce-Address {
	padding: var(--wp--preset--spacing--md);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--modal);
	background: var(--wp--preset--color--bg-alt);
}

.woocommerce-Address-title {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--wp--preset--spacing--sm);
	margin-block-end: var(--wp--preset--spacing--sm);
}

/* Tytuł karty = natywny `<h2>` (BEZ klasy `.title` — ją nosi `<header>`), więc
   celujemy w element; `.account-page` prefiks bije `.woocommerce-MyAccount-content h2`
   (heading ~30px, który zawijał tytuł na 2 linie). */
.account-page .woocommerce-Address-title h2,
.account-page .woocommerce-Address-title h3 {
	margin: 0;
	font-size: var(--wp--preset--font-size--lead);
	line-height: var(--wp--custom--line-height--tight);
	color: var(--wp--preset--color--dark);
}

.woocommerce-Address-title .edit {
	font-size: var(--wp--preset--font-size--body);
	white-space: nowrap;
	color: var(--wp--preset--color--dark);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.woocommerce-Address-title .edit:hover,
.woocommerce-Address-title .edit:focus-visible {
	color: var(--wp--preset--color--accent);
}

/* Adres jako blok danych (lista adresów ORAZ widok zamówienia
   `.woocommerce-customer-details address`) — bez domyślnej kursywy `<address>`. */
.account-page address {
	font-style: normal;
	line-height: var(--wp--custom--line-height--body);
	color: var(--wp--preset--color--dark);
}

/* Znaczniki nr / data / status zamówienia (natywne `<mark>` Woo) — bez żółtego
   defaultu przeglądarki; wyróżnienie wagą, nie tłem (legacy CSS Woo OFF). */
.account-page mark {
	background: transparent;
	color: var(--wp--preset--color--dark);
	font-weight: var(--wp--custom--font-weight--medium);
}

/* „Zamów jeszcze raz" (natywny reorder Woo, `woocommerce_order_details_after_order_table`)
   po tabeli zamówienia — po wyłączeniu legacy CSS Woo `<p.order-again>` stracił margines
   i przyklejał się do wiersza „razem". Oddech od podsumowania; przycisk hugsuje treść. */
.account-page .order-again {
	margin-block-start: var(--wp--preset--spacing--md);
}

/* ----------------------------------------------------------------------------
   Edycja konta / adresu — wrapper pól jako FLEX-WRAP: rytm pionowy (gap) + pary
   pól obok siebie na desktopie. Poprzednio inline-flex 50% + vertical-align, ale
   whitespace między elementami inline-flex psuł układ (pary spadały pod siebie), a
   `.form-row { margin:0 }` odbierał odstęp między wierszami. Flex-wrap ignoruje
   whitespace i daje rytm gapem. Specyficzność/kolejność wygrywa z aliasem
   `.woocommerce form .form-row` (ADR-0011).
   ---------------------------------------------------------------------------- */
.account-page .woocommerce-EditAccountForm,
.account-page .woocommerce-address-fields__field-wrapper {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--sm);
	align-items: flex-start;
}

/* Adres: outer wrapper spina pola + przycisk „zapisz adres". */
.account-page .woocommerce-address-fields {
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--md);
}

/* Każdy wiersz/element (pole, fieldset, akapit przycisku) domyślnie na całą szerokość. */
.account-page .woocommerce-EditAccountForm > .form-row,
.account-page .woocommerce-EditAccountForm > fieldset,
.account-page .woocommerce-EditAccountForm > p,
.account-page .woocommerce-address-fields__field-wrapper > .form-row {
	flex: 1 1 100%;
	min-inline-size: 0;
	margin: 0;
}

/* Para pól (imię/nazwisko, kod/miasto…) — dwie kolumny na desktopie. Ta sama
   specyficzność co reguła 100% wyżej, ale PÓŹNIEJ w źródle → wygrywa. */
.account-page .woocommerce-EditAccountForm > .form-row-first,
.account-page .woocommerce-EditAccountForm > .form-row-last,
.account-page .woocommerce-address-fields__field-wrapper > .form-row-first,
.account-page .woocommerce-address-fields__field-wrapper > .form-row-last {
	flex: 1 1 calc(50% - (var(--wp--preset--spacing--sm) / 2));
}

@media (max-width: 40rem) {
	.account-page .woocommerce-EditAccountForm > .form-row-first,
	.account-page .woocommerce-EditAccountForm > .form-row-last,
	.account-page .woocommerce-address-fields__field-wrapper > .form-row-first,
	.account-page .woocommerce-address-fields__field-wrapper > .form-row-last {
		flex-basis: 100%;
	}
}

/* Fieldset „zmiana hasła" — karta; jest flex-itemem formularza (odstęp = gap formularza). */
.woocommerce-EditAccountForm fieldset {
	margin: 0;
	padding: var(--wp--preset--spacing--md);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--modal);
}

/* Rytm wierszy hasła w fieldsecie (nie są flex-itemami formularza → gap ich nie łapie). */
.woocommerce-EditAccountForm fieldset .form-row + .form-row {
	margin-block-start: var(--wp--preset--spacing--sm);
}

.woocommerce-EditAccountForm legend {
	padding-inline: var(--wp--preset--spacing--xs);
	font-size: var(--wp--preset--font-size--lead);
	color: var(--wp--preset--color--dark);
}