/* ==========================================================================
   Bronisze online — koszyk (Figma 152:992)
   ========================================================================== */

/* `bo-cartpage`, nie `bo-cart` — patrz komentarz w woocommerce/cart/cart.php:
   klasę `bo-cart` zajmuje przycisk koszyka w nagłówku. */
.bo-cartpage { background: var(--bo-white); }

.bo-cartpage__inner {
	display: flex;
	flex-direction: column;
	gap: var(--bo-space-6);
	padding-block: 28px var(--bo-space-12);
}

.bo-cartpage__heading { display: flex; flex-direction: column; gap: 4px; }
.bo-cartpage__title { font-size: var(--bo-text-2xl); color: var(--bo-ink); }
.bo-cartpage__count { color: var(--bo-muted); }

.bo-cartpage__body {
	display: grid;
	/*
	 * `minmax(0, 1fr)`, nie samo `1fr`: ścieżka siatki ma domyślnie
	 * `min-width: auto`, więc dobierała szerokość do najszerszej pozycji
	 * koszyka zamiast do okna. Przy 390 px dawało to 468 px kolumny i cała
	 * strona jechała w bok o blisko 100 px.
	 */
	grid-template-columns: minmax(0, 1fr);
	gap: var(--bo-space-6);
	align-items: start;
}

@media (min-width: 1024px) {
	/* Makieta: pozycje 856 px, podsumowanie 400 px, odstęp 24 px. */
	.bo-cartpage__body { grid-template-columns: minmax(0, 1fr) 400px; }
}

.bo-cartpage__groups { display: flex; flex-direction: column; gap: var(--bo-space-5); }
.bo-cartpage__actions { display: flex; justify-content: flex-end; }

/* --- grupa sprzedawcy ----------------------------------------------------- */

.bo-cartgroup {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 18px var(--bo-space-6);
	background: var(--bo-white);
	border: 1px solid var(--bo-stroke);
	border-radius: var(--bo-radius-lg);
}

/*
 * Nagłówek grupy nie zawijał się, więc przy 390 px nazwa sprzedawcy razem
 * z plakietką „zweryfikowany" (175 px) rozpychała CAŁĄ stronę koszyka
 * o 78 px w bok. Zawijanie i zgoda na zwężenie nazwy trzymają wiersz
 * w oknie, a plakietka schodzi do drugiej linii, zamiast wypychać treść.
 */
.bo-cartgroup__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--bo-space-3);
	padding-bottom: 6px;
	border-bottom: 1px solid var(--bo-stroke);
}

/* Sprzedawca zawieszony: grupa przygaszona, blokada widoczna przy niej. */
.bo-cartgroup.is-blocked { border-color: rgb(217 40 47 / 0.35); }
/*
 * Pozycje sprzedawcy, który nie przyjmuje zamówień, gasły przezroczystością
 * całej grupy — a to sprowadzało nazwy ofert i kwoty poniżej wymaganego
 * kontrastu 4,5:1. Każde kolejne podnoszenie wartości tylko przesuwało
 * granicę, bo dotyczyło TEKSTU, który trzeba przeczytać, żeby wiedzieć, co
 * usunąć z koszyka. Zamiast tego gasimy samą miniaturę; o stanie grupy mówi
 * czerwona obwódka i komunikat nad pozycjami.
 */
.bo-cartgroup.is-blocked .bo-cartitem__media { opacity: 0.55; }

.bo-cartgroup__blocked {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--bo-space-3) var(--bo-space-4);
	padding: 10px 14px;
	border-radius: var(--bo-radius-sm);
	background: var(--bo-tint-danger);
	color: var(--bo-tint-danger-ink, var(--bo-sale));
}

.bo-cartgroup__blocked-text {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0;
	font-size: var(--bo-text-sm);
	font-weight: 600;
}

.bo-cartgroup__blocked .bo-btn {
	flex: 0 0 auto;
	padding: 7px 14px;
	font-size: var(--bo-text-sm);
	color: var(--bo-tint-danger-ink, var(--bo-sale));
	border-color: currentColor;
}

.bo-cartgroup__seller {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	min-width: 0;
	color: var(--bo-green-contrast);
}

/* Ikona przy pierwszym wierszu nazwy (16 px przy interlinii 24 px). */
.bo-cartgroup__seller > .bo-icon { flex: 0 0 auto; margin-top: 4px; }

.bo-cartgroup__who {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px 10px;
	min-width: 0;
}

.bo-cartgroup__name { min-width: 0; font-weight: 700; }

/* --- pozycja -------------------------------------------------------------- */

.bo-cartgroup__items { display: flex; flex-direction: column; }

.bo-cartitem {
	display: flex;
	align-items: center;
	gap: var(--bo-space-4);
	padding-block: var(--bo-space-4);
	border-bottom: 1px solid var(--bo-stroke);
}

.bo-cartitem:last-child { border-bottom: 0; }

.bo-cartitem__media {
	width: 80px;
	height: 80px;
	flex: 0 0 auto;
	border-radius: 10px;
	overflow: hidden;
	background: var(--bo-green-50);
}

.bo-cartitem__media img { width: 100%; height: 100%; object-fit: cover; }

.bo-cartitem__body { display: flex; flex-direction: column; gap: 4px; flex: 1 0 0; min-width: 0; }
.bo-cartitem__title { font-weight: 700; color: var(--bo-ink); }
.bo-cartitem__title a:hover { color: var(--bo-green-contrast); }

.bo-cartitem__meta,
.bo-cartitem__unitprice { font-size: var(--bo-text-sm); font-weight: 500; }

.bo-cartitem__meta { color: var(--bo-muted); }
.bo-cartitem__unitprice { color: var(--bo-text-soft); }

.bo-cartitem__total {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
	width: 110px;
	flex: 0 0 auto;
	text-align: right;
}

.bo-cartitem__sum,
.bo-cartitem__sum .woocommerce-Price-amount {
	font-family: var(--bo-font-heading);
	font-size: var(--bo-text-lg);
	font-weight: 600;
	line-height: var(--bo-leading-heading);
	color: var(--bo-green-contrast);
}

.bo-cartitem__basis { font-size: var(--bo-text-sm); font-weight: 500; color: var(--bo-muted); }

/*
 * Usunięcie pozycji to sama ikona 16 px — za mało, żeby trafić palcem
 * i zbyt blisko steppera ilości, żeby pomyłka była niegroźna. Ikona zostaje
 * tej samej wielkości, powiększamy pole wokół niej.
 */
.bo-cartitem__remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	flex: 0 0 auto;
	border-radius: var(--bo-radius-pill);
	color: var(--bo-text-soft);
	transition: color var(--bo-transition), background-color var(--bo-transition);
}

.bo-cartitem__remove:hover { background: var(--bo-green-50); }

.bo-cartitem__remove:hover { color: var(--bo-sale); }

/*
 * Wariant zwarty steppera — w koszyku jest niższy niż na karcie oferty.
 * Pole zostaje przy tym SZERSZE niż wysokie: minimum zakupu bywa
 * trzycyfrowe, a w 44 px nie mieściła się nawet dwucyfrowa ilość.
 */
.bo-qty--sm .bo-qty__step { width: 38px; height: 40px; }
.bo-qty--sm .bo-qty__input { width: 60px; height: 40px; }

/* --- wybór dostawy -------------------------------------------------------- */

.bo-shipopts {
	display: flex;
	flex-direction: column;
	gap: var(--bo-space-2);
	padding-block: 10px 4px;
}

.bo-shipopts__label {
	font-size: 0.8125rem;
	font-weight: 600;
	line-height: 1.4;
	color: var(--bo-muted);
}

/* Trzy sztywne kolumny zostawiały pojedynczą opcję dostawy na jednej trzeciej
   szerokości — „Dostawa ustalana ze sprzedawcą" łamała się na dwie linie,
   a obok zostawało pół kolumny pustki. Kafle rosną do wygodnej szerokości
   i zwężają się dopiero, gdy sprzedawca wystawi ich kilka. */
.bo-shipopts__list {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.bo-shipopts__list > li {
	flex: 1 1 260px;
	max-width: 340px;
}

.bo-shipopt {
	display: flex;
	/*
	 * Do górnej linii, nie do środka: przy kilkuwierszowym opisie warunków
	 * dostawy kropka i kwota wisiały w połowie wysokości karty, z dala od
	 * nazwy, której dotyczą.
	 */
	align-items: flex-start;
	gap: 10px;
	height: 100%;
	padding: var(--bo-space-3) 14px;
	background: var(--bo-white);
	border: 1px solid var(--bo-border);
	border-radius: 10px;
	cursor: pointer;
	transition: border-color var(--bo-transition), background-color var(--bo-transition);
}

.bo-shipopt:hover { border-color: var(--bo-verified); }

.bo-shipopt:has(.bo-shipopt__radio:checked) {
	background: var(--bo-tint-success);
	border: 1.5px solid var(--bo-verified);
	padding: 11.5px 13.5px; /* kompensacja grubszej ramki */
}

.bo-shipopt__radio { position: absolute; opacity: 0; pointer-events: none; }

.bo-shipopt__dot {
	width: 18px;
	height: 18px;
	flex: 0 0 auto;
	margin-top: 1px; /* środek pierwszej linii nazwy (14 px × 1,4) */
	border: 1.5px solid var(--bo-border);
	border-radius: 99px;
	background: var(--bo-white);
}

.bo-shipopt:has(.bo-shipopt__radio:checked) .bo-shipopt__dot {
	border: 5px solid var(--bo-verified);
}

.bo-shipopt__body { display: flex; flex-direction: column; gap: 2px; flex: 1 0 0; min-width: 0; }

.bo-shipopt__name {
	font-size: var(--bo-text-sm);
	font-weight: 600;
	line-height: 1.4;
	color: var(--bo-ink);
}

.bo-shipopt__note { font-size: 0.75rem; line-height: 1.4; color: var(--bo-muted); }

.bo-shipopt__cost {
	font-size: 0.9375rem;
	font-weight: 700;
	line-height: 1.4;
	color: var(--bo-ink);
	white-space: nowrap;
}

.bo-shipopt:has(.bo-shipopt__radio:checked) .bo-shipopt__cost { color: var(--bo-green-contrast); }

.bo-shipopts__note { font-size: 0.75rem; line-height: 1.4; color: var(--bo-muted); }

.bo-cartgroup__subtotal {
	display: flex;
	align-items: baseline;
	justify-content: flex-end;
	gap: var(--bo-space-2);
	padding-top: var(--bo-space-2);
}

.bo-cartgroup__subtotal span { font-size: var(--bo-text-sm); font-weight: 500; color: var(--bo-text-soft); }

.bo-cartgroup__subtotal strong,
.bo-cartgroup__subtotal .woocommerce-Price-amount {
	font-family: var(--bo-font-heading);
	font-size: var(--bo-text-lg);
	font-weight: 600;
	color: var(--bo-green-contrast);
}

/* --- podsumowanie --------------------------------------------------------- */

.bo-summary { display: flex; flex-direction: column; gap: var(--bo-space-5); }

@media (min-width: 1024px) {
	.bo-summary { position: sticky; top: calc(var(--bo-sticky-top) + var(--bo-space-4)); }
}

.bo-summary__box {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 22px var(--bo-space-6);
	background: var(--bo-white);
	border: 1px solid var(--bo-stroke);
	border-radius: var(--bo-radius-lg);
}

/* Kwoty kasy odświeżane fragmentem — ten sam rytm co reszta pudełka. */
.bo-summary__amounts {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.bo-summary__title { font-size: 1.375rem; /* 22px */ color: var(--bo-ink); }

.bo-summary__row {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: var(--bo-space-3);
	font-weight: 500;
}

.bo-summary__row > span:first-child { color: var(--bo-text-soft); }
.bo-summary__row > span:last-child { color: var(--bo-ink); white-space: nowrap; }

.bo-summary__shipnote { font-size: 0.75rem; line-height: 1.4; color: var(--bo-muted); }

.bo-summary__rule { width: 100%; height: 1px; border: 0; background: var(--bo-stroke); margin: 0; }

.bo-summary__total {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--bo-space-3);
}

.bo-summary__total span { font-size: var(--bo-text-lg); font-weight: 700; color: var(--bo-ink); }

.bo-summary__total strong,
.bo-summary__total .woocommerce-Price-amount {
	font-family: var(--bo-font-heading);
	font-size: 1.75rem;
	font-weight: 600;
	line-height: var(--bo-leading-heading);
	color: var(--bo-green-contrast);
}

.bo-summary__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--bo-space-2);
	padding-block: var(--bo-space-4);
	/* Bez wcięcia bocznego „Zamawiam i płacę · 442,80 zł" dotykało przy
	   320 px krawędzi przycisku. Tekst zawija się na środku. */
	padding-inline: var(--bo-space-4);
	text-align: center;
	border-radius: 10px;
	background: var(--bo-green-contrast);
	color: var(--bo-white);
	font-weight: 700;
}

.bo-summary__cta:hover { background: var(--bo-green-dark); color: var(--bo-white); }

.bo-summary__back {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	/* Cel dotknięcia 24 px (WCAG 2.5.8) — sam tekst dawał 21 px. */
	min-height: 24px;
	gap: var(--bo-space-2);
	font-size: var(--bo-text-sm);
	font-weight: 700;
	color: var(--bo-green-contrast);
}

.bo-summary__split {
	display: flex;
	flex-direction: column;
	gap: var(--bo-space-2);
	padding: var(--bo-space-4) var(--bo-space-5);
	border-radius: 14px;
	background: var(--bo-green-50);
}

.bo-summary__split-head {
	display: flex;
	align-items: center;
	gap: 6px;
	font-weight: 700;
	color: var(--bo-green-contrast);
}

.bo-summary__split-body { font-size: var(--bo-text-sm); color: var(--bo-text-soft); }

.bo-summary__facts {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: var(--bo-space-4) var(--bo-space-5);
	border: 1px solid var(--bo-stroke);
	border-radius: 14px;
	background: var(--bo-white);
}

.bo-summary__facts li {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: var(--bo-text-sm);
	font-weight: 500;
	color: var(--bo-text-soft);
}

.bo-summary__facts .bo-icon { color: var(--bo-green-contrast); }

/* ==========================================================================
   Checkout (Figma 154:1002)
   ========================================================================== */

.bo-checkout { background: var(--bo-white); }

.bo-checkout__inner {
	display: flex;
	flex-direction: column;
	gap: var(--bo-space-6);
	padding-block: 28px var(--bo-space-12);
}

/* --- kroki ---------------------------------------------------------------- */

.bo-steps { display: flex; align-items: center; gap: var(--bo-space-3); flex-wrap: wrap; }

.bo-step { display: inline-flex; align-items: center; gap: var(--bo-space-3); }

.bo-step__mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: var(--bo-radius-pill);
	border: 1px solid var(--bo-stroke);
	background: var(--bo-white);
	color: var(--bo-muted);
	font-weight: 700;
}

.bo-step--done .bo-step__mark,
.bo-step--current .bo-step__mark {
	background: var(--bo-green-contrast);
	border-color: var(--bo-green-contrast);
	color: var(--bo-white);
}

.bo-step__label { font-weight: 500; color: var(--bo-muted); }
.bo-step--current .bo-step__label { font-weight: 700; color: var(--bo-ink); }
.bo-step--done .bo-step__label { color: var(--bo-ink); }

.bo-steps__rule { width: 40px; height: 2px; background: var(--bo-stroke); }

/*
 * Telefon: trzy kroki z podpisami nie mieszczą się w wierszu i „3 Gotowe"
 * spadało do drugiego, z kreską łącznika na początku. Podpis zostaje przy
 * kroku bieżącym; pozostałe mają sam numer — podpis czyta czytnik ekranu
 * (ten sam wzorzec co `.bo-sr-only`).
 */
@media (max-width: 479px) {
	.bo-steps { flex-wrap: nowrap; gap: var(--bo-space-2); }
	.bo-step { gap: var(--bo-space-2); }
	.bo-steps__rule { width: auto; min-width: 12px; flex: 1 1 0; }

	.bo-step:not(.bo-step--current) .bo-step__label {
		position: absolute;
		width: 1px;
		height: 1px;
		margin: -1px;
		overflow: hidden;
		clip: rect(0 0 0 0);
		white-space: nowrap;
	}
}

/* --- układ ---------------------------------------------------------------- */

.bo-checkout__form {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--bo-space-6);
	align-items: start;
}

@media (min-width: 1024px) {
	.bo-checkout__form { grid-template-columns: minmax(0, 1fr) 400px; }
}

/*
 * Blok błędów walidacji WooCommerce wstrzykuje SIĘ SAM jako pierwsze dziecko
 * formularza. Siatka miała dwie kolumny i dwoje dzieci, więc trzecie
 * przestawiało wszystko o jedno miejsce: komunikat zajmował lewą kolumnę,
 * formularz wpadał do prawej — czterystupikselowej — a podsumowanie spadało
 * do następnego wiersza. Kasa wyglądała na rozsypaną dokładnie wtedy, gdy
 * kupujący najbardziej potrzebuje się w niej odnaleźć.
 *
 * Komunikat należy do CAŁEGO formularza, więc zajmuje cały wiersz.
 */
.bo-checkout__form > .woocommerce-NoticeGroup,
.bo-checkout__form > .woocommerce-error,
.bo-checkout__form > .woocommerce-info,
.bo-checkout__form > .woocommerce-message { grid-column: 1 / -1; }

.bo-checkout__main { display: flex; flex-direction: column; gap: var(--bo-space-5); }

.bo-copanel {
	display: flex;
	flex-direction: column;
	gap: var(--bo-space-4);
	padding: 22px var(--bo-space-6) var(--bo-space-6);
	background: var(--bo-white);
	border: 1px solid var(--bo-stroke);
	border-radius: var(--bo-radius-lg);
}

.bo-copanel__title {
	font-family: var(--bo-font-body);
	font-size: var(--bo-text-lg);
	font-weight: 700;
	color: var(--bo-ink);
}

.bo-copanel__lead { font-size: var(--bo-text-sm); color: var(--bo-muted); }

/* --- dostawa per sprzedawca ----------------------------------------------- */

.bo-codelivery { display: flex; flex-direction: column; gap: var(--bo-space-4); }
.bo-codelivery__group { display: flex; flex-direction: column; gap: var(--bo-space-2); }

.bo-codelivery__seller {
	display: flex;
	align-items: center;
	gap: var(--bo-space-2);
	font-weight: 700;
	color: var(--bo-green-contrast);
}

/* --- dokumenty ------------------------------------------------------------ */

.bo-codoc {
	display: flex;
	align-items: flex-start;
	gap: var(--bo-space-3);
	padding: var(--bo-space-3) 14px;
	border: 1px solid var(--bo-border);
	border-radius: 10px;
}

.bo-codoc__body { display: flex; flex-direction: column; gap: 4px; flex: 1 0 0; min-width: 0; }

.bo-codoc__head { display: flex; align-items: center; flex-wrap: wrap; gap: var(--bo-space-2); }

.bo-codoc__seller {
	font-size: 0.9375rem;
	font-weight: 600;
	line-height: 1.45;
	color: var(--bo-ink);
}

.bo-codoc__badge {
	padding: 2px var(--bo-space-2);
	border-radius: var(--bo-radius-pill);
	background: var(--bo-tint-success);
	color: var(--bo-green-contrast);
	font-size: 0.6875rem;
	font-weight: 700;
	line-height: 1.45;
	text-transform: uppercase;
}

/* Rolnik ryczałtowy — inny kolor, bo to inna ścieżka dokumentu. */
.bo-codoc__badge--rr { background: var(--bo-tint-warn); color: var(--bo-tint-warn-ink); }

.bo-codoc__choice {
	/* Cała etykieta jest celem dotyku (pole wyboru jest niewidoczne):
	   wiersz tekstu ma 21 px, a opcje stoją 4 px od siebie — bez minimum
	   cel nie spełniał WCAG 2.5.8 (24 px). */
	position: relative;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--bo-space-2);
	min-height: 24px;
	cursor: pointer;
}

.bo-codoc__choice input { position: absolute; opacity: 0; pointer-events: none; }

.bo-codoc__box {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 18px;
	height: 18px;
	flex: 0 0 auto;
	border: 1px solid var(--bo-field);
	border-radius: 5px;
	background: var(--bo-white);
	color: transparent;
}

.bo-codoc__choice input:checked + .bo-codoc__box {
	background: var(--bo-verified);
	border-color: var(--bo-verified);
	color: var(--bo-white);
}

.bo-codoc__choice-label { font-size: var(--bo-text-sm); font-weight: 600; color: var(--bo-ink); }
.bo-codoc__choice-note { font-size: 0.8125rem; color: var(--bo-muted); }
.bo-codoc__choice-note::before { content: "· "; }

/*
 * Telefon: dopisek pod etykietą, wyrównany do niej, a nie do pola wyboru.
 * Zawijanie flexa zrzucało go na początek wiersza — pod kwadrat pola,
 * z kropką na początku linii.
 */
@media (max-width: 599px) {
	.bo-codoc__choice {
		display: grid;
		grid-template-columns: 18px minmax(0, 1fr);
		column-gap: var(--bo-space-2);
		row-gap: 0;
	}

	.bo-codoc__choice-note { grid-column: 2; }
	.bo-codoc__choice-note::before { content: none; }

	/*
	 * Kwota stoi przy nazwie sprzedawcy, a wybór dokumentu i objaśnienia
	 * biegną pod nimi przez całą szerokość karty. Obok kwoty kolumna opisu
	 * była za wąska na plakietkę „Dokument wystawia sprzedawca" i karta
	 * rozpychała stronę kasy w bok.
	 */
	.bo-codoc {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 4px var(--bo-space-3);
	}

	.bo-codoc__body { display: contents; }
	.bo-codoc__body > * { grid-column: 1 / -1; }
	.bo-codoc__body > .bo-codoc__head { grid-column: 1; grid-row: 1; }
	.bo-codoc__amount { grid-column: 2; grid-row: 1; }

	/* Długa plakietka („Rolnik ryczałtowy · fakturę VAT RR…") łamie się
	   w obrębie karty; przy dwóch wierszach pigułka wyglądałaby jak owal. */
	.bo-codoc__badge { border-radius: var(--bo-radius-sm); }
}

/* Najwęższy telefon: obok kwoty nazwa sprzedawcy łamała się po słowie —
   kwota schodzi pod nazwę, a plakietka może się złamać zamiast wystawać
   poza kartę. */
@media (max-width: 359px) {
	.bo-codoc { grid-template-columns: minmax(0, 1fr); }
	.bo-codoc__amount { grid-column: 1; grid-row: 2; }
}
.bo-codoc__note { font-size: 0.8125rem; line-height: 1.45; color: var(--bo-muted); }

.bo-codoc__amount {
	font-size: var(--bo-text-sm);
	font-weight: 600;
	color: var(--bo-ink);
	white-space: nowrap;
}

.bo-codocs__subhead {
	font-size: var(--bo-text-sm);
	font-weight: 600;
	color: var(--bo-muted);
}

/*
 * Dane do faktury — osobny blok w „Danych do zamówienia", odsłaniany dopiero
 * wtedy, gdy faktura wchodzi w grę. Kreska u góry oddziela go od kontaktu:
 * to inny zestaw danych i inny adresat (sprzedawca wystawiający dokument),
 * choć formularz jest jeden.
 */
.bo-cofields__invoice {
	margin-top: var(--bo-space-4);
	padding-top: var(--bo-space-4);
	border-top: 1px solid var(--bo-stroke);
}

.bo-cofields__invoice[hidden] { display: none; }

.bo-cofields__subhead {
	margin: 0;
	font-size: var(--bo-text-sm);
	font-weight: 700;
	color: var(--bo-ink);
}

.bo-cofields__hint {
	margin: 2px 0 var(--bo-space-3);
	font-size: 0.8125rem;
	line-height: 1.45;
	color: var(--bo-muted);
}

/* Wskazówka przy wyborze dokumentu — prowadzi do pól stojących wyżej. */
.bo-codocs__pointer[hidden] { display: none; }

/* Ta sama notka informacyjna pod dokumentami i pod listą sprzedawców. */
.bo-codocs__info,
.bo-codocs__pointer,
.bo-copanel__note {
	display: flex;
	align-items: flex-start;
	gap: var(--bo-space-2);
	font-size: 0.8125rem;
	line-height: 1.45;
	color: var(--bo-muted);
}

.bo-codocs__info .bo-icon,
.bo-codocs__pointer .bo-icon,
.bo-copanel__note .bo-icon { flex: 0 0 auto; margin-top: 2px; }

/* Wybór dokumentu jest jednokrotny — okrągły znacznik, nie kwadratowy. */
.bo-codoc__choice input[type="radio"] + .bo-codoc__box { border-radius: 50%; }

/* --- dopłata dla rolnika ryczałtowego (VAT RR) ----------------------------
 *
 * Blok pojawia się w kasie, w szczegółach zamówienia i w e-mailu (WF-107),
 * dlatego style stoją na samym `.bo-rr`, bez zależności od kontekstu kasy.
 * -------------------------------------------------------------------------- */

.bo-rr {
	margin-top: var(--bo-space-2);
	padding: var(--bo-space-3) 14px;
	border: 1px solid var(--bo-tint-warn-line);
	border-radius: 10px;
	background: var(--bo-tint-warn);
}

.bo-rr__heading {
	margin: var(--bo-space-6) 0 var(--bo-space-2);
	font-size: var(--bo-text-base);
	color: var(--bo-ink);
}

.bo-rr__lead {
	margin: 0 0 var(--bo-space-3);
	font-size: 0.8125rem;
	line-height: 1.5;
	color: var(--bo-tint-warn-ink);
}

.bo-rr__list { display: flex; flex-direction: column; gap: var(--bo-space-2); margin: 0; }

.bo-rr__row {
	display: flex;
	flex-wrap: wrap;
	gap: 2px var(--bo-space-3);
}

.bo-rr__row dt {
	flex: 0 0 190px;
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--bo-ink);
}

.bo-rr__row dd {
	flex: 1 1 220px;
	margin: 0;
	font-size: 0.8125rem;
	line-height: 1.5;
	color: var(--bo-text);
}

.bo-rr__amount { font-weight: 700; }
.bo-rr__hint { color: var(--bo-muted); font-weight: 400; }

.bo-rr__iban,
.bo-rr__title {
	display: inline-block;
	padding: 1px 6px;
	border-radius: 6px;
	background: var(--bo-white);
	border: 1px solid var(--bo-tint-warn-line);
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 0.8125rem;
}

.bo-rr__missing { color: var(--bo-danger); }

/* Dane do faktury VAT RR — zakres tabeli 60 (WF-107). */
.bo-rr__data { margin: var(--bo-space-4) 0 0; padding-top: var(--bo-space-3); border-top: 1px solid var(--bo-tint-warn-line); }
.bo-rr__subtitle { margin: 0 0 var(--bo-space-2); font-size: 0.875rem; color: var(--bo-ink); }
.bo-rr__minor { margin: var(--bo-space-3) 0 var(--bo-space-2); font-size: 0.8125rem; color: var(--bo-ink); }
/* Na telefonie karta rolnika (jak każda karta dokumentu) układa dane do
   faktury na całą szerokość — patrz siatka `.bo-codoc` przy 599 px. */

/* Szerokość 0 + min. 100 %: tabela przewija się w swoim pudełku i nie rozpycha siatki kasy na telefonie. */
.bo-rr__scroll { width: 0; min-width: 100%; overflow-x: auto; }
/* Obszar przewijany przyjmuje fokus (2.1.1) — obrys pokazuje, gdzie jest. */
.bo-rr__scroll:focus-visible { outline: 2px solid var(--bo-green-contrast); outline-offset: 2px; }
.bo-rr__items { width: 100%; border-collapse: collapse; font-size: 0.75rem; }
.bo-rr__items th,
.bo-rr__items td { padding: 4px 6px; border-bottom: 1px solid var(--bo-tint-warn-line); text-align: left; vertical-align: top; }
.bo-rr__items th { font-weight: 600; color: var(--bo-ink); }
/* Nagłówki kolumn w jednym wierszu — tabela przewija się w swoim pudełku,
   zamiast ściskać „Cena jedn. bez zwrotu" do słowa w linii. */
.bo-rr__items th { white-space: nowrap; }
/* Nazwa towaru dostaje szerokość czytelnego wiersza, nie resztkę po liczbach. */
.bo-rr__items td:first-child { min-width: 10rem; }
/* W wąskim pudełku (telefon, wąska kolumna kasy) osiem kolumn nie mieści się
   nawet z przewijaniem — kolumny poza kadrem są niewidoczne. Wiersz staje się
   kartą: nazwa towaru u góry, pod nią pary „podpis — wartość”. */
.bo-rr__scroll { container-type: inline-size; container-name: bo-rritems; }
@container bo-rritems (max-width: 560px) {
	.bo-rr__items thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
	.bo-rr__items,
	.bo-rr__items tbody,
	.bo-rr__items tr,
	.bo-rr__items td { display: block; width: auto; }
	.bo-rr__items tr { padding: var(--bo-space-2) 0; border-bottom: 1px solid var(--bo-tint-warn-line); }
	.bo-rr__items td { display: flex; justify-content: space-between; gap: var(--bo-space-3); padding: 2px 0; border: 0; min-width: 0; text-align: right; }
	.bo-rr__items td::before { content: attr(data-label); flex: 0 0 auto; color: var(--bo-text-soft); text-align: left; }
	.bo-rr__items td:first-child { min-width: 0; padding-bottom: 4px; font-size: 0.8125rem; font-weight: 600; color: var(--bo-ink); text-align: left; }
	.bo-rr__items td:first-child::before { content: none; }
}
.bo-rr__fills { margin: 0; padding-left: 1.2em; font-size: 0.8125rem; line-height: 1.5; color: var(--bo-text); }

/* Numer faktury VAT RR — jedyne pole, o które kasa pyta w tym bloku. */
.bo-rr__field {
	margin: var(--bo-space-3) 0 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.bo-rr__label {
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--bo-text);
}

.bo-rr__input {
	max-width: 22rem;
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* Podpowiedź pod polem czyta się jak podpis, nie jak druga etykieta. */
.bo-rr__field .bo-rr__hint {
	margin: 0;
	font-size: 0.75rem;
	line-height: 1.5;
}

.bo-rr__note {
	margin: var(--bo-space-3) 0 0;
	font-size: 0.75rem;
	line-height: 1.5;
	color: var(--bo-muted);
}

@media (max-width: 640px) {
	.bo-rr__row dt { flex: 1 1 100%; }
}

/*
 * Natywne pola wyboru w kasie mają 13 px — poniżej minimum, które da się
 * pewnie trafić (WCAG 2.5.8 mówi o 24 px). Dotyczy to m.in. zgody na
 * fakturę, czyli decyzji, której nie da się później cofnąć bez kontaktu
 * ze sprzedawcą.
 */
.bo-checkout input[type="checkbox"]:not([class*="bo-"]),
.woocommerce-checkout .woocommerce-form__input-checkbox {
	width: 24px;
	height: 24px;
	margin: 0 8px 0 0;
	vertical-align: middle;
	accent-color: var(--bo-green-contrast);
}

/* --- płatność ------------------------------------------------------------- */

.bo-copay { display: flex; flex-direction: column; gap: var(--bo-space-4); }

.bo-copay__split {
	display: flex;
	align-items: flex-start;
	gap: var(--bo-space-2);
	padding: var(--bo-space-3) 14px;
	border-radius: var(--bo-radius);
	background: var(--bo-green-50);
	font-size: var(--bo-text-sm);
	color: var(--bo-text-soft);
}

.bo-copay__split .bo-icon { flex: 0 0 auto; margin-top: 2px; color: var(--bo-green-contrast); }
.bo-copay__split strong { color: var(--bo-green-contrast); }

.bo-copay__breakdown { display: flex; flex-direction: column; gap: 6px; }

.bo-copay__breakdown li {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--bo-space-3);
	font-size: var(--bo-text-sm);
	color: var(--bo-text-soft);
}

.bo-copay__breakdown li span:last-child { font-weight: 700; color: var(--bo-ink); }

.bo-copay__pending {
	padding: var(--bo-space-4);
	border: 1px dashed var(--bo-stroke);
	border-radius: var(--bo-radius);
	background: var(--bo-surface);
	font-size: var(--bo-text-sm);
	color: var(--bo-muted);
}

/* --- pola formularza WooCommerce ------------------------------------------ */

.bo-copanel .form-row { display: flex; flex-direction: column; gap: 7px; margin: 0 0 var(--bo-space-4); }

.bo-copanel label { font-size: var(--bo-text-sm); font-weight: 500; color: var(--bo-text-soft); }

.bo-copanel input[type="text"],
.bo-copanel input[type="email"],
.bo-copanel input[type="tel"],
.bo-copanel textarea,
.bo-copanel select {
	width: 100%;
	padding: var(--bo-space-3) 14px;
	border: 1px solid var(--bo-stroke);
	border-radius: 10px;
	/* Kolor tła osobno: skrót `background` kasuje strzałkę listy
	   rozwijanej, którą rysuje reguła `select` w base.css. */
	background-color: var(--bo-white);
	color: var(--bo-ink);
}

.bo-copanel select { padding-right: 38px; }

.bo-copanel input:focus,
.bo-copanel textarea:focus,
.bo-copanel select:focus {
	outline: none;
	border-color: var(--bo-green-contrast);
	box-shadow: var(--bo-focus);
}

.bo-copanel .required { color: var(--bo-sale); text-decoration: none; }

/* --- pusty koszyk ---------------------------------------------------------- */

/* --- pusty koszyk ----------------------------------------------------------
 *
 * Karta stała w lewym górnym rogu, a reszta strony była pustką — ekran
 * wyglądał na niedokończony dokładnie w chwili, w której kupujący i tak nie
 * wie, co dalej. Treść idzie więc na środek, dostaje oddech i skróty do
 * miejsc, z których zakupy faktycznie się zaczynają.
 * -------------------------------------------------------------------------- */

.bo-emptycart {
	max-width: 620px;
	margin: clamp(24px, 6vw, 72px) auto clamp(48px, 8vw, 96px);
	padding: clamp(32px, 5vw, 56px) clamp(24px, 4vw, 48px);
	border: 1px solid var(--bo-stroke);
	border-radius: 24px;
	background: var(--bo-white);
	/* Delikatna poświata zamiast twardego cienia — karta ma być spokojna,
	   nie ma nad czym budować napięcia. */
	box-shadow: 0 1px 2px rgb(0 0 0 / 0.03), 0 12px 32px rgb(31 36 33 / 0.05);
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 14px;
}

.bo-emptycart__icon {
	display: grid;
	place-items: center;
	width: 88px;
	height: 88px;
	margin-bottom: 4px;
	border-radius: var(--bo-radius-pill);
	background: var(--bo-green-50);
	color: var(--bo-green-contrast);
}

.bo-emptycart__icon .bo-icon { width: 34px; height: 34px; }

/* --- skróty do miejsc, gdzie zaczynają się zakupy --- */

.bo-emptycart__shortcuts {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
	width: 100%;
	margin: 20px 0 0;
	padding: 20px 0 0;
	border-top: 1px solid var(--bo-stroke);
	list-style: none;
	align-items: stretch;
}

.bo-emptycart__shortcuts li { display: flex; }
.bo-emptycart__shortcut { width: 100%; }

/* Trzy kafle obok siebie nie mieszczą się na telefonie — idą w kolumnę,
   każdy jako pełnowymiarowy cel dotknięcia. */
@media (max-width: 560px) {
	.bo-emptycart__shortcuts { grid-template-columns: 1fr; }
}

.bo-emptycart__shortcut {
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 56px;
	padding: 10px 12px;
	border: 1px solid var(--bo-stroke);
	border-radius: 14px;
	color: var(--bo-ink);
	text-align: left;
	transition: border-color var(--bo-transition), background-color var(--bo-transition);
}

.bo-emptycart__shortcut:hover {
	border-color: var(--bo-green-contrast);
	background: var(--bo-green-50);
}

.bo-emptycart__shortcut-icon {
	display: grid;
	place-items: center;
	flex: 0 0 auto;
	width: 34px;
	height: 34px;
	border-radius: 10px;
	background: var(--bo-green-50);
	color: var(--bo-green-contrast);
}

.bo-emptycart__shortcut:hover .bo-emptycart__shortcut-icon { background: var(--bo-white); }

.bo-emptycart__shortcut-text { display: flex; flex-direction: column; min-width: 0; }
.bo-emptycart__shortcut-label { font-weight: 700; font-size: var(--bo-text-sm); }
.bo-emptycart__shortcut-desc { font-size: 0.75rem; color: var(--bo-muted); }

.bo-emptycart__title { font-family: var(--bo-font-heading); font-size: clamp(24px, 3vw, 30px); font-weight: 700; color: var(--bo-ink); }
.bo-emptycart__lead { max-width: 44ch; color: var(--bo-text-soft); }
.bo-emptycart__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 10px; }

/* --- checkout: typ kupującego --------------------------------------------- */

.bo-cofield__label { display: block; margin-bottom: 7px; font-size: 14px; font-weight: 500; color: var(--bo-text-soft); }
.bo-buyertype { display: inline-flex; gap: 8px; flex-wrap: wrap; }

.bo-buyertype__option {
	display: inline-flex;
	align-items: center;
	padding: 9px 18px;
	border: 1px solid var(--bo-stroke);
	border-radius: var(--bo-radius-pill);
	background: var(--bo-white);
	font-weight: 700;
	font-size: 14px;
	color: var(--bo-text-soft);
	cursor: pointer;
	transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease;
}

.bo-buyertype__option input { position: absolute; opacity: 0; pointer-events: none; }
.bo-buyertype__option:hover { border-color: var(--bo-green-contrast); }

.bo-buyertype__option.is-on {
	background: var(--bo-green-contrast);
	border-color: var(--bo-green-contrast);
	color: var(--bo-white);
}

/* Napis jest zwykłym tekstem w <label>, więc łapie go ogólna reguła etykiet
   formularza kasy — mocniejsza od `.bo-buyertype__option.is-on`. Bez podbicia
   specyficzności zaznaczona opcja miała szary napis na zielonym tle. */
.bo-cofields .bo-buyertype__option.is-on,
.bo-cofields .bo-buyertype__option.is-on * { color: var(--bo-white); }

/* --- checkout: zapisane adresy -------------------------------------------- */

.bo-addrpick {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 12px;
	margin-bottom: 14px;
}

.bo-addrpick__card {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 14px 16px;
	border: 1.5px solid var(--bo-stroke);
	border-radius: 14px;
	background: var(--bo-white);
	text-align: left;
	cursor: pointer;
	transition: border-color 150ms ease, background-color 150ms ease;
}

.bo-addrpick__card:hover { border-color: var(--bo-green-contrast); }
.bo-addrpick__card.is-on { border-color: var(--bo-green-contrast); background: var(--bo-green-50); }
.bo-addrpick__head { display: flex; align-items: center; gap: 8px; }
.bo-addrpick__label { font-weight: 700; color: var(--bo-ink); }

.bo-addrpick__badge {
	padding: 2px 8px;
	border-radius: var(--bo-radius-pill);
	background: var(--bo-green-contrast);
	color: var(--bo-white);
	font-size: 12px;
	font-weight: 700;
}

.bo-addrpick__line { font-size: 14px; color: var(--bo-text-soft); }
.bo-addrpick__meta { font-size: 13px; color: var(--bo-muted); }

.bo-addrpick__title {
	margin: 18px 0 8px;
	font-size: 14px;
	font-weight: 600;
	color: var(--bo-text-soft);
}

.bo-addrpick__add {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 76px;
	padding: 14px 16px;
	border: 1.5px dashed var(--bo-green-contrast);
	border-radius: 14px;
	background: transparent;
	color: var(--bo-green-contrast);
	font-weight: 600;
	cursor: pointer;
}

.bo-addrpick__add:hover { background: var(--bo-green-50); }

/*
 * Checkbox „Wysłać na inny adres?" zastępuje kafel „Dodaj nowy adres" — patrz
 * template-parts/checkout/addresses.php. Sam formularz pod nim zostaje: to
 * WooCommerce pokazuje go i chowa, zależnie od stanu tego pola.
 */
.woocommerce-shipping-fields > h3#ship-to-different-address { display: none; }

/* --- checkout: płatność --------------------------------------------------- */

/* WooCommerce maluje `#payment` na szaro — u nas kartą jest sama metoda. */
#payment.bo-copay__methods { padding: 0; background: transparent; border-radius: 0; }

/*
 * Selektor z `#payment`, jak niżej przy `payment_box`: reguła WooCommerce
 * (`.woocommerce-checkout #payment ul.payment_methods`) niesie identyfikator
 * i wygrywała z każdą opartą wyłącznie na klasach. Zostawała po niej kreska
 * pod ostatnią metodą, przyklejona do „Przelewu bankowego" i do dolnej
 * krawędzi panelu.
 */
#payment.bo-copay__methods ul.wc_payment_methods,
.bo-copay__methods ul.wc_payment_methods {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
	border: 0;
}

/* Notka nad metodami (np. brak przelewu tradycyjnego) — patrz nfmkt_transfer_unavailable_note(). */
.bo-copay__methods .bo-copanel__note--payment { margin: 0 0 12px; }

.bo-copay__methods li.wc_payment_method {
	padding: 0;
	border: 1.5px solid var(--bo-stroke);
	border-radius: 14px;
	background: var(--bo-white);
}

.bo-copay__methods li.wc_payment_method:has(input:checked) {
	border-color: var(--bo-green-contrast);
	background: var(--bo-green-50);
}

.bo-copay__methods li.wc_payment_method > label {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	padding: 16px 18px;
	font-weight: 700;
	color: var(--bo-ink);
	cursor: pointer;
}

/* Metoda z opisem: opis (payment_box) domyka kartę, etykieta oddaje mu dół. */
.bo-copay__methods li.wc_payment_method:has(div.payment_box) > label { padding-bottom: 4px; }

.bo-copay__methods li.wc_payment_method > input[type="radio"] {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

/* Kropka wyboru rysowana przy etykiecie — natywny radio bywa nadpisany. */
.bo-copay__methods li.wc_payment_method > label::before {
	content: "";
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	border: 2px solid var(--bo-stroke);
	border-radius: 50%;
}

.bo-copay__methods li.wc_payment_method:has(input:checked) > label::before {
	border-color: var(--bo-green-contrast);
	box-shadow: inset 0 0 0 3px var(--bo-white), inset 0 0 0 9px var(--bo-green-contrast);
}

/*
 * Selektor z `#payment`, bo reguła WooCommerce (`#payment div.payment_box`)
 * niesie identyfikator i wygrywa z każdą regułą opartą wyłącznie na klasach —
 * bez tego opis metody zostawał na szarym tle w fioletowym odcieniu.
 */
#payment.bo-copay__methods div.payment_box {
	margin: 0;
	padding: 0 18px 16px 46px;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: var(--bo-text-soft);
	font-size: 14px;
	line-height: 1.5;
}

#payment.bo-copay__methods div.payment_box::before { display: none; }
#payment.bo-copay__methods div.payment_box p:last-child { margin-bottom: 0; }

/* --- po złożeniu zamówienia ------------------------------------------------ */

.bo-thanks {
	max-width: 720px;
	margin: 8px auto 72px;
	padding: 40px 36px;
	border: 1px solid var(--bo-stroke);
	border-radius: 20px;
	background: var(--bo-white);
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.bo-thanks__icon {
	display: grid;
	place-items: center;
	width: 64px;
	height: 64px;
	border-radius: var(--bo-radius-pill);
	background: var(--bo-green-50);
	color: var(--bo-green-contrast);
}

.bo-thanks__icon.is-error { background: var(--bo-tint-danger); color: var(--bo-sale); }
.bo-thanks__title { font-family: var(--bo-font-heading); font-size: 30px; font-weight: 700; line-height: 1.2; color: var(--bo-ink); }
.bo-thanks__lead { color: var(--bo-text-soft); }
.bo-thanks__subtitle { font-family: var(--bo-font-heading); font-size: 19px; font-weight: 700; color: var(--bo-ink); margin-bottom: 10px; }

.bo-thanks__facts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 14px;
	padding: 18px;
	border-radius: 14px;
	background: var(--bo-surface);
}

.bo-thanks__facts dt { font-size: 13px; color: var(--bo-muted); margin-bottom: 2px; }
.bo-thanks__facts dd { margin: 0; font-weight: 700; color: var(--bo-ink); } /* bez domyślnego wcięcia przeglądarki — wartość pod etykietą */
.bo-thanks__facts dl,
.bo-thanks__facts div { margin: 0; }
.bo-thanks__groups { display: flex; flex-direction: column; gap: 12px; }

.bo-thanks__addr {
	padding: 16px 18px;
	border-radius: 14px;
	background: var(--bo-surface);
	color: var(--bo-text-soft);
}

.bo-thanks__addrlabel { font-size: 13px; color: var(--bo-muted); margin-bottom: 4px; }

.bo-thanks__group {
	padding: 14px 16px;
	border: 1px solid var(--bo-stroke);
	border-radius: 14px;
}

.bo-thanks__vendor { display: flex; align-items: center; gap: 8px; font-weight: 700; color: var(--bo-green-contrast); }
.bo-thanks__sum { margin-left: auto; color: var(--bo-ink); }
.bo-thanks__items { margin-top: 8px; display: flex; flex-direction: column; gap: 4px; }
.bo-thanks__items li { display: flex; justify-content: space-between; gap: 12px; font-size: 14px; color: var(--bo-text-soft); }
.bo-thanks__qty { color: var(--bo-muted); white-space: nowrap; }
.bo-thanks__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 6px; }

/* Kwota sprzedawcy nie ucieka za kartę, gdy nazwa sklepu łamie się na
   kilka wierszy — nazwa ustępuje, kwota zostaje w całości. */
.bo-thanks__vendor { flex-wrap: wrap; }
.bo-thanks__vendor-name { flex: 1 1 140px; min-width: 0; overflow-wrap: anywhere; }
.bo-thanks__sum { flex: 0 0 auto; white-space: nowrap; }

/*
 * Telefon: 36 px wcięcia karty na każdym boku zabierało co piąty piksel
 * szerokości, a przyciski kończyły się w różnych miejscach. Węższe wcięcie,
 * przyciski na całą szerokość — jak główne działania na innych ekranach.
 */
@media (max-width: 599px) {
	.bo-thanks { padding: var(--bo-space-6) var(--bo-space-5); margin-bottom: var(--bo-space-10); }
	.bo-thanks__title { font-size: var(--bo-text-xl); }
	.bo-thanks__actions { flex-direction: column; }
	.bo-thanks__actions .bo-btn { width: 100%; }
}

/*
 * Potwierdzenie zamówienia otwarte bez sesji (link z wiadomości, inna
 * przeglądarka): WooCommerce prosi o adres e-mail zamówienia. Formularz
 * miał wygląd domyślny — szary przycisk, pole z ciemną ramką, czerwona
 * gwiazdka — i jako jedyny ekran sklepu nie wyglądał jak platforma.
 */
.woocommerce-thankyou-order-received:has(+ .woocommerce-verify-email) {
	max-width: 560px;
	margin-bottom: var(--bo-space-3);
	font-family: var(--bo-font-heading);
	font-size: var(--bo-text-xl);
	font-weight: 700;
	line-height: var(--bo-leading-heading);
	color: var(--bo-ink);
}

.woocommerce-verify-email {
	display: flex;
	flex-direction: column;
	gap: var(--bo-space-4);
	max-width: 560px;
	padding: var(--bo-space-6);
	border: 1px solid var(--bo-stroke);
	border-radius: var(--bo-radius-lg);
	background: var(--bo-white);
	color: var(--bo-text-soft);
}

.woocommerce-verify-email a { color: var(--bo-green-contrast); font-weight: 600; text-decoration: underline; }
/* Selektory z `.woocommerce` i nazwą elementu — arkusz WooCommerce styluje
   pola i przyciski formularzy z wyższą szczegółowością. */
.woocommerce .woocommerce-verify-email .form-row { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; }
.woocommerce-verify-email label { font-size: var(--bo-text-sm); font-weight: 600; color: var(--bo-text-soft); }
.woocommerce .woocommerce-verify-email .form-row .required { color: var(--bo-green-contrast); text-decoration: none; }

.woocommerce .woocommerce-verify-email .form-row input.input-text {
	inline-size: 100%;
	padding: 11px 14px;
	border: 1px solid var(--bo-field);
	border-radius: 10px;
	background: var(--bo-white);
	font-size: var(--bo-text-base);
	color: var(--bo-ink);
}

.woocommerce .woocommerce-verify-email .form-row input.input-text:focus { outline: none; border-color: var(--bo-green-contrast); box-shadow: var(--bo-focus); }

.woocommerce .woocommerce-verify-email button.button {
	align-self: flex-start;
	padding: var(--bo-space-3) var(--bo-space-6);
	border: 0;
	border-radius: var(--bo-radius-sm);
	background: var(--bo-green-contrast);
	color: var(--bo-white);
	font-weight: 700;
	cursor: pointer;
}

.woocommerce .woocommerce-verify-email button.button:hover { background: var(--bo-green-dark); }

@media (max-width: 599px) {
	.woocommerce-verify-email { padding: var(--bo-space-5) var(--bo-space-4); }
	.woocommerce .woocommerce-verify-email button.button { align-self: stretch; }
}

/* --- resztki domyślnego WooCommerce ---------------------------------------
   Kupon i komunikaty rysowały się z niebieską ramką i pseudo-ikoną, która
   nachodziła na tekst — ten sam błąd, co na ekranie logowania.
   -------------------------------------------------------------------------- */

.woocommerce-checkout .woocommerce-info,
.woocommerce-cart .woocommerce-info,
.woocommerce-checkout .woocommerce-message,
.woocommerce-cart .woocommerce-message {
	padding: 14px 18px;
	border-radius: 14px;
	border: 1px solid var(--bo-green-100);
	background: var(--bo-green-50);
	color: var(--bo-green-contrast);
	list-style: none;
}

.woocommerce-checkout .woocommerce-info::before,
.woocommerce-cart .woocommerce-info::before,
.woocommerce-checkout .woocommerce-message::before,
.woocommerce-cart .woocommerce-message::before { content: none; }

.woocommerce-checkout .woocommerce-error,
.woocommerce-cart .woocommerce-error {
	padding: 14px 18px;
	border-radius: 14px;
	border: 1px solid rgb(217 40 47 / 0.35);
	background: var(--bo-tint-danger);
	/* Tekst w kolorze „tekst na tincie": czerwień plakietki dawała na różowym
	   tle 4,17:1 przy wymaganych 4,5:1 (1.4.3 WCAG). */
	color: var(--bo-tint-danger-ink, #9a2b2e);
	list-style: none;
}

.woocommerce-checkout .woocommerce-error::before,
.woocommerce-cart .woocommerce-error::before { content: none; }
.woocommerce-checkout .woocommerce-error li,
.woocommerce-cart .woocommerce-error li { list-style: none; }

/* Komunikat walidacji kasy jest odnośnikiem do pola — cel 24 px
   (WCAG 2.5.8), bo kilka takich stoi wiersz pod wierszem. */
.woocommerce-checkout .woocommerce-error li > a { display: inline-flex; align-items: center; min-height: 24px; color: inherit; }

@media (prefers-reduced-motion: reduce) {
	.bo-buyertype__option, .bo-addrpick__card { transition: none; }
}

/* Karta niesie własny nagłówek („Dziękujemy — zamówienie przyjęte"), więc
   tytuł strony tylko go powtarzał. Zostaje dla czytników ekranu. */
body.woocommerce-order-received .bo-entry > h1 {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

/* --- pola checkoutu ---------------------------------------------------------
   WooCommerce układa pola na floatach (`form-row-first` / `form-row-last`),
   które przy różnej wysokości etykiet rozjeżdżają kolumny. Zamieniamy je na
   siatkę i ubieramy kontrolki w stylistykę motywu.
   -------------------------------------------------------------------------- */

.bo-cofields__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 4px 18px;
	align-items: start;
}

.bo-cofields__grid > .form-row { float: none !important; width: auto !important; margin: 0 0 14px; padding: 0; }
.bo-cofields__grid > .form-row-wide,
.bo-cofields__grid > .bo-cofield--type { grid-column: 1 / -1; }
.bo-cofields__grid > .form-row[hidden] { display: none; }

@media (max-width: 720px) {
	.bo-cofields__grid { grid-template-columns: 1fr; }
}

.woocommerce-checkout .form-row label {
	display: block;
	margin-bottom: 7px;
	font-size: 14px;
	/* WooCommerce daje etykietom interlinię 2 — dwuwierszowa etykieta
	   („Uwagi do zamówienia (opcjonalne)") rozjeżdżała się na pół karty. */
	line-height: 1.4;
	font-weight: 500;
	color: var(--bo-text-soft);
}

/* Wymagalność kropką, tak jak w panelu — gwiazdka wyglądała jak błąd. */
.woocommerce-checkout .form-row .required,
.woocommerce-checkout .form-row abbr.required {
	border: 0;
	text-decoration: none;
	color: var(--bo-sale);
	font-weight: 700;
}

.woocommerce-checkout .form-row abbr.required { font-size: 0; }
.woocommerce-checkout .form-row abbr.required::after { content: '•'; font-size: 16px; margin-left: 4px; }

.woocommerce-checkout .form-row .input-text,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea,
.woocommerce-checkout .select2-container .select2-selection--single {
	width: 100%;
	min-height: 48px;
	padding: 12px 14px;
	border: 1px solid var(--bo-stroke);
	border-radius: 10px;
	/* Kolor tła osobno — patrz uwaga przy `.bo-copanel select`. */
	background-color: var(--bo-white);
	font: inherit;
	color: var(--bo-ink);
}

.woocommerce-checkout .form-row select { padding-right: 38px; }

.woocommerce-checkout .form-row .input-text:focus,
.woocommerce-checkout .form-row select:focus,
.woocommerce-checkout .form-row textarea:focus {
	outline: none;
	border-color: var(--bo-green-contrast);
	box-shadow: var(--bo-focus, 0 0 0 3px rgb(0 119 55 / 0.18));
}

.woocommerce-checkout .form-row.woocommerce-invalid .input-text { border-color: var(--bo-sale); }
.woocommerce-checkout .form-row .description { font-size: 13px; color: var(--bo-muted); margin-top: 6px; }

/* Przycisk w komunikacie („Zobacz koszyk") szedł w domyślnej szarości. */
.woocommerce-checkout .woocommerce-message .button,
.woocommerce-cart .woocommerce-message .button,
.woocommerce-checkout .woocommerce-info .button,
.woocommerce-cart .woocommerce-info .button {
	padding: 9px 16px;
	border-radius: var(--bo-radius-pill);
	background: var(--bo-green-contrast);
	color: var(--bo-white);
	font-weight: 700;
	font-size: 14px;
}

.woocommerce-checkout .woocommerce-message,
.woocommerce-cart .woocommerce-message { display: flex; align-items: center; justify-content: space-between; gap: 16px; }

/* --- kasa: potwierdzenie dostawy (Figma 154:1068) --------------------------- */

.bo-codelivery__picked {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 13px 16px;
	border: 2px solid var(--bo-green-contrast, #007737);
	border-radius: 10px;
	background: var(--bo-green-50, #e8f5ee);
}

.bo-codelivery__picked > .bo-icon { flex: 0 0 auto; color: var(--bo-green-contrast); }
.bo-codelivery__body { display: flex; flex-direction: column; flex: 1 1 auto; min-width: 0; }
.bo-codelivery__name { font-weight: 700; color: var(--bo-ink); }
.bo-codelivery__meta { font-size: var(--bo-text-sm); color: var(--bo-muted); }

.bo-codelivery__change {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	/* Cel dotyku 24 px (WCAG 2.5.8) — sam wiersz tekstu dawał 21 px. */
	min-height: 24px;
	font-size: var(--bo-text-sm);
	font-weight: 600;
	color: var(--bo-green-contrast);
}

.bo-codelivery__change:hover { text-decoration: underline; }

/*
 * Telefon: „Zmień w koszyku" pod nazwą dostawy. Obok niej zabierał
 * połowę karty i nazwa łamała się na trzy wiersze po dwa słowa.
 */
@media (max-width: 599px) {
	.bo-codelivery__picked { flex-wrap: wrap; align-items: flex-start; row-gap: var(--bo-space-1); }
	.bo-codelivery__picked > .bo-icon { margin-top: 3px; }
	.bo-codelivery__body { flex-basis: calc(100% - 30px); }
	.bo-codelivery__change { margin-left: 30px; min-height: 44px; }
}

.bo-summary__legal {
	font-size: var(--bo-text-sm);
	line-height: var(--bo-leading-body);
	text-align: center;
	color: var(--bo-muted);
}

.bo-summary__cta { justify-content: center; }

/* --- sprzedawcy w zamówieniu ---------------------------------------------- */

.bo-coseller {
	padding: var(--bo-space-3) 14px;
	border: 1px solid var(--bo-stroke);
	border-radius: 10px;
}

.bo-coseller + .bo-coseller { margin-top: var(--bo-space-2); }

.bo-coseller__heading { margin: var(--bo-space-6) 0 var(--bo-space-2); font-size: var(--bo-text-base); }

.bo-coseller__name {
	margin: 0 0 var(--bo-space-2);
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--bo-ink);
}

.bo-coseller__list { display: flex; flex-direction: column; gap: var(--bo-space-1); margin: 0; }
.bo-coseller__row { display: flex; flex-wrap: wrap; gap: 2px var(--bo-space-3); }
.bo-coseller__row dt { flex: 0 0 190px; font-size: 0.8125rem; font-weight: 600; color: var(--bo-ink); }
.bo-coseller__row dd { flex: 1 1 200px; margin: 0; font-size: 0.8125rem; color: var(--bo-text); }

/* Telefon i e-mail sprzedawcy stoją w sąsiednich wierszach — każdy dostaje
   24 px wysokości celu dotyku (WCAG 2.5.8), żeby palec nie trafiał w sąsiada. */
.bo-coseller__row dd > a { display: inline-flex; align-items: center; min-height: 24px; }

@media (max-width: 640px) {
	.bo-coseller__row dt { flex: 1 1 100%; }
}

/* Zasada zbiegu obniżek w koszyku (WF-55). */
.bo-summary__clash {
	margin: 0 0 var(--bo-space-3);
	padding: var(--bo-space-2) 10px;
	border-radius: var(--bo-radius-sm);
	background: var(--bo-surface);
	font-size: 0.75rem;
	line-height: 1.5;
	color: var(--bo-muted);
}

/* Warunki dostawy opisane przez sprzedawcę (WF-72). */
.bo-codelivery__terms {
	margin: var(--bo-space-2) 0 0;
	font-size: 0.8125rem;
	line-height: 1.5;
	color: var(--bo-muted);
}

/* Termin doręczenia przy grupie sprzedawcy i dopisek „+ transport" przy wycenie. */
.bo-cartgroup__head { justify-content: space-between; flex-wrap: wrap; }
.bo-cartgroup__eta { margin: 0; font-size: var(--bo-text-sm); color: var(--bo-muted); }
.bo-summary__plus { display: block; font-size: var(--bo-text-sm); font-weight: 600; color: var(--bo-green-contrast); }

/* --- kasa zatrzymana: powód, nie ogólnik ---------------------------------- */

.bo-cartstop {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: var(--bo-space-4);
	margin-block: var(--bo-space-6);
	padding: var(--bo-space-6);
	border: 1px solid var(--bo-border);
	border-radius: 18px;
	background: var(--bo-white);
}

.bo-cartstop__lead { color: var(--bo-text); }

.bo-cartstop__list {
	display: flex;
	flex-direction: column;
	gap: var(--bo-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
	color: var(--bo-ink);
	font-size: 1.0625rem;
	line-height: 1.5;
}

.bo-cartstop__back { margin: 0; }

/* ==========================================================================
   Najwęższy telefon (320 px, WCAG 1.4.10)
   ========================================================================== */

/*
 * Wiersz koszyka na telefonie i wąskim tablecie: dwa piętra zamiast
 * jednego rzędu.
 *
 * W jednym rzędzie miniatura, stepper (136 px), suma (110 px) i przycisk
 * usunięcia zabierały przy 390 px prawie całą szerokość, więc kolumna opisu
 * (`flex: 1 0 0`) zjeżdżała do kilkudziesięciu pikseli: nazwa oferty
 * i cena jednostkowa łamały się słowo po słowie, a stepper — kurczony przez
 * flex i przycinany przez własne `overflow: hidden` — wchodził na opis
 * i pokazywał sam „−". Wcześniejsza łatka dotyczyła tylko 320 px.
 *
 * Górne piętro: miniatura, opis na całą resztę szerokości i usunięcie
 * w rogu (jak w innych sklepach — z dala od steppera, więc trudniej
 * o pomyłkę). Dolne: ilość i suma pozycji. Siatka zamiast zawijania flexa,
 * bo układ pięter ma być stały, a nie zależny od długości nazwy.
 */
/*
 * Próg liczony od szerokości LISTY POZYCJI (zapytanie o kontener), nie
 * okna: przy 1024–1279 px obok stoi podsumowanie 400 px i lista ma
 * ~560 px — jednorzędowy wiersz ściskał tam opis do słowa w linii, choć
 * okno było „desktopowe".
 */
.bo-cartgroup__items { container-type: inline-size; container-name: bo-cartitems; }

@media (max-width: 720px) {
	.bo-cartgroup { padding-inline: var(--bo-space-4); }
}

@container bo-cartitems (max-width: 640px) {
	.bo-cartitem {
		display: grid;
		grid-template-columns: 72px auto minmax(0, 1fr) auto;
		grid-template-areas:
			"media body body  remove"
			"qty   qty  total total";
		align-items: center;
		gap: var(--bo-space-3);
	}

	.bo-cartitem__media { grid-area: media; width: 72px; height: 72px; align-self: start; }
	.bo-cartitem__body { grid-area: body; align-self: start; }
	.bo-cartitem .bo-qty { grid-area: qty; justify-self: start; }
	.bo-cartitem__total { grid-area: total; width: auto; }
	.bo-cartitem__remove { grid-area: remove; align-self: start; width: 44px; height: 44px; margin: -10px -10px 0 0; }
}

/* Najwęższy telefon: usunięcie schodzi do dolnego piętra, żeby nazwa
   oferty miała całą szerokość obok miniatury. */
@container bo-cartitems (max-width: 300px) {
	.bo-cartitem {
		grid-template-columns: 56px auto minmax(0, 1fr) auto;
		grid-template-areas:
			"media body body  body"
			"qty   qty  total remove";
		column-gap: var(--bo-space-2);
	}

	.bo-cartitem__media { width: 56px; height: 56px; }
	.bo-cartitem__remove { align-self: center; width: 40px; margin: 0; }

	/* Węższy stepper, żeby ilość, suma i usunięcie zmieściły się w jednym
	   piętrze; przyciski nadal 32×40 px. */
	.bo-cartitem .bo-qty__step { width: 32px; }
	.bo-cartitem .bo-qty__input { width: 44px; }
}