/* ---------------------------------------------------------------
   Header
   --------------------------------------------------------------- */
.site-header {
	position: sticky;
	top: 0;
	z-index: 100;
}

.site-header__inner {
	gap: 32px;
	align-items: center;
}

.site-header__nav {
	flex-grow: 1;
}

.site-header__nav .wp-block-navigation-item a {
	text-decoration: none;
}

.site-header__nav .wp-block-navigation-item a:hover,
.site-header__nav .wp-block-navigation-item a:focus {
	color: var(--wp--preset--color--primary-dark);
}

.site-header__cart .wc-block-mini-cart__button {
	color: var(--wp--preset--color--contrast);
}

/* ---------------------------------------------------------------
   Promo banner (hero)
   The rail lays out banner siblings, so a second .promo can be added — or the
   rail turned into a slider — without touching the rest of the page.
   --------------------------------------------------------------- */
.promo-rail {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

.promo {
	position: relative;
	border-radius: 8px;
	overflow: hidden;
	background: var(--wp--preset--color--neutral-100);
}

.promo__media {
	margin: 0;
}

/* Fixed panoramic crop: any replacement photo lands at the same height, so the
   sections below never shift. Supply the banner at 3.2:1 — cover trims whatever
   does not match that ratio off the left and right edges. */
.promo__media img {
	display: block;
	width: 100%;
	aspect-ratio: 3.2 / 1;
	object-fit: cover;
}

/* A solid panel rather than a text-over-photo scrim: legibility then does not
   depend on how light or busy the eventual photograph is. */
.promo__panel {
	position: absolute;
	top: 50%;
	left: 40px;
	transform: translateY(-50%);
	width: min(42%, 440px);
	padding: 26px 30px;
	background: var(--wp--preset--color--base);
	border-radius: 6px;
}

.promo__eyebrow {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 12px;
	color: var(--wp--preset--color--neutral-500);
	text-transform: uppercase;
	letter-spacing: 0.08em;
	font-weight: 600;
}

.promo__eyebrow::before {
	content: "";
	display: block;
	width: 24px;
	height: 3px;
	background: var(--wp--preset--color--primary);
	flex: none;
}

.promo__heading {
	margin: 0 0 10px;
	font-size: clamp(1.5rem, 2.2vw, 2.125rem);
	line-height: 1.15;
}

.promo__lead {
	margin: 0 0 20px;
}

.promo__actions {
	margin: 0;
}

/* ---------------------------------------------------------------
   Info ticker — CSS-only seamless marquee
   --------------------------------------------------------------- */
.ticker {
	border-top: 1px solid var(--wp--preset--color--neutral-200);
	border-bottom: 1px solid var(--wp--preset--color--neutral-200);
}

/* Clips the oversized track: without this the repeated lists would widen the
   document and cause horizontal page scroll. */
.ticker__viewport {
	overflow: hidden;
}

.ticker__track {
	display: flex;
	width: max-content;
	will-change: transform;
	animation: primago-ticker 20s linear infinite;
}

/* Shift by exactly one copy. --ticker-copies is set inline by the shortcode, so
   the distance always matches however many copies PHP rendered: the end frame is
   pixel-identical to the start, which is what removes the jump. */
@keyframes primago-ticker {
	from { transform: translateX(0); }
	to   { transform: translateX(calc(-100% / var(--ticker-copies, 8))); }
}

/* animation-play-state keeps the current position, so it resumes where it
   stopped rather than restarting. */
.ticker:hover .ticker__track,
.ticker:focus-within .ticker__track {
	animation-play-state: paused;
}

/* padding-right carries the seam spacing. Because it is part of each copy's own
   width, the gap between the last item of one copy and the first of the next is
   identical to the gap between items inside a copy. */
.ticker__list {
	display: flex;
	align-items: center;
	flex: none;
	gap: 48px;
	margin: 0;
	padding: 10px 48px 10px 0;
	list-style: none;
}

.ticker__item {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	white-space: nowrap;
	line-height: 1.4;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--neutral-500);
}

.ticker__item::before {
	content: "";
	display: block;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--wp--preset--color--primary);
	flex: none;
}

@media (prefers-reduced-motion: reduce) {
	.ticker__track {
		animation: none;
		width: 100%;
	}

	/* No motion at all: drop every duplicate and let the row scroll by hand. */
	.ticker__list[aria-hidden="true"] {
		display: none;
	}

	.ticker__viewport {
		overflow-x: auto;
	}

	.ticker__list {
		gap: 28px;
		padding-right: 0;
	}
}

/* ---------------------------------------------------------------
   Section headings (homepage, catalogue, product page)
   --------------------------------------------------------------- */
.section-heading {
	margin: 0 0 20px;
}

/* Short yellow rule above the title — the same accent device as the hero
   eyebrow, reused so the accent reads as a system rather than decoration. */
.section-heading::before {
	content: "";
	display: block;
	width: 26px;
	height: 3px;
	margin-bottom: 10px;
	background: var(--wp--preset--color--primary);
}

.section-head {
	align-items: flex-end;
	margin-bottom: 20px;
}

.section-head .section-heading {
	margin-bottom: 0;
}

.section-head__link {
	margin: 0;
	padding-bottom: 3px;
}

.section-head__link a {
	text-decoration: none;
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
}

.section-head__link a::after {
	content: " →";
}

.section-head__link a:hover {
	color: var(--wp--preset--color--primary-dark);
}

/* ---------------------------------------------------------------
   Category tiles — compact, image-led, rendered from product_cat
   --------------------------------------------------------------- */
/* auto-fill with a capped track width: tiles stay ~150px whether there are two
   categories or twenty, so a short list never stretches across the page and a
   longer one wraps into a second row instead of shrinking. justify-content:start
   keeps three tiles grouped at the left rather than spread across 1200px. */
.cat-tiles {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(128px, 150px));
	justify-content: start;
	gap: 12px;
}

.cat-tile {
	display: flex;
	flex-direction: column;
	text-decoration: none;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 6px;
	overflow: hidden;
	background: var(--wp--preset--color--base);
	transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.cat-tile:hover {
	border-color: #d2d4d8;
	box-shadow: 0 2px 10px rgba(28, 29, 32, 0.07);
}

.cat-tile:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 2px;
}

/* 4:3 rather than square — the tile is a selector, not a showcase, and the
   shorter crop takes roughly a quarter off the section height. */
.cat-tile__media {
	display: block;
	aspect-ratio: 4 / 3;
	background: var(--wp--preset--color--neutral-100);
	overflow: hidden;
}

.cat-tile__media img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	display: block;
	transition: transform 0.25s ease;
}

.cat-tile:hover .cat-tile__media img {
	transform: scale(1.03);
}

.cat-tile__name {
	position: relative;
	padding: 8px 11px 9px;
	font-size: 0.8125rem;
	font-weight: 600;
	line-height: 1.3;
	color: var(--wp--preset--color--contrast);
	border-top: 1px solid var(--wp--preset--color--neutral-200);
}

/* Yellow underline grows from the left on hover — the accent, kept to 2px. */
.cat-tile__name::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	height: 2px;
	width: 0;
	background: var(--wp--preset--color--primary);
	transition: width 0.22s ease;
}

.cat-tile:hover .cat-tile__name::after {
	width: 100%;
}

@media (prefers-reduced-motion: reduce) {
	.cat-tile__media img,
	.cat-tile__name::after {
		transition: none;
	}

	.cat-tile:hover .cat-tile__media img {
		transform: none;
	}
}

/* ---------------------------------------------------------------
   WooCommerce product grid
   --------------------------------------------------------------- */
/* Explicit grid. WooCommerce ships .wc-block-product-template__responsive.columns-4
   (auto-fill) at the same specificity as a single-class override, so these rules
   carry an extra class to win deterministically rather than on load order. */
.product-grid.wp-block-woocommerce-product-collection .wc-block-product-template {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.product-grid .wc-block-product {
	width: auto;
	max-width: none;
	flex-basis: auto;
	margin: 0;
	display: flex;
	flex-direction: column;
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 5px;
	padding: 8px 8px 10px;
	transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.product-grid .wc-block-product:hover {
	border-color: #d2d4d8;
	box-shadow: 0 2px 10px rgba(28, 29, 32, 0.07);
	transform: translateY(-2px);
}

/* Uniform, shallower image box so mixed-aspect product photos still line up.
   The image stays the dominant element — only the chrome around it shrinks. */
.product-grid .wc-block-components-product-image {
	position: relative;
	margin: 0 0 8px;
	border-radius: 3px;
	overflow: hidden;
	background: var(--wp--preset--color--neutral-100);
}

.product-grid .wc-block-components-product-image img {
	display: block;
	aspect-ratio: 4 / 3;
	object-fit: contain;
	width: 100%;
	margin: 0;
}

/* ---- Hover crossfade to the second gallery image ----
   The alternate image is only painted on real hover-capable pointers, so touch
   devices keep the featured image and never see a stuck hover state. It is
   absolutely positioned over the primary image, so nothing reflows. */
.primago-card-img-alt {
	display: none;
}

/* Unscoped from .product-grid so the crossfade also works on the shop and
   category archives, where the same block renders. */
@media (hover: hover) and (pointer: fine) {
	.has-hover-image a {
		display: block;
		position: relative;
	}

	.has-hover-image .primago-card-img-alt {
		display: block;
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		aspect-ratio: auto;
		object-fit: contain;
		background: var(--wp--preset--color--neutral-100);
		opacity: 0;
		transition: opacity 0.3s ease;
		pointer-events: none;
		z-index: 0;
	}

	/* The sale badge shares the product link, so it has to outrank the overlay. */
	.wc-block-components-product-sale-badge {
		z-index: 2;
	}

	.wc-block-product:hover .has-hover-image .primago-card-img-alt {
		opacity: 1;
	}
}

@media (prefers-reduced-motion: reduce) {
	.product-grid .wc-block-product {
		transition: none;
	}

	.product-grid .wc-block-product:hover {
		transform: none;
	}

	.has-hover-image .primago-card-img-alt {
		transition: none;
	}
}

.product-grid .wc-block-components-product-title {
	margin: 0 0 4px !important;
	font-size: 0.84375rem !important;
	line-height: 1.35 !important;
	font-weight: 500;
}

.product-grid .wc-block-components-product-price {
	font-size: 0.9375rem;
	font-weight: 700;
	margin: 0 0 8px;
}

/* Push the button to the card foot so mixed-length titles stay aligned. */
.product-grid .wp-block-woocommerce-product-button {
	margin-top: auto;
}

.product-grid .wc-block-components-product-button .wp-block-button__link {
	width: 100%;
	min-height: 38px;
	text-align: center;
	padding: 8px 12px;
	font-size: 0.8125rem;
}

/* 2 columns on phones, 3 on tablets, 4 from small laptops up. */
@media (min-width: 600px) {
	.product-grid.wp-block-woocommerce-product-collection .wc-block-product-template {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 18px 14px;
	}
}

@media (min-width: 1000px) {
	.product-grid.wp-block-woocommerce-product-collection .wc-block-product-template {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 22px 16px;
	}
}

/* Small and rectangular: the badge is a marker, not a headline. */
.wc-block-components-product-sale-badge {
	background: var(--wp--preset--color--primary) !important;
	color: var(--wp--preset--color--contrast) !important;
	border: none !important;
	border-radius: 3px !important;
	font-weight: 700 !important;
	font-size: 0.625rem !important;
	line-height: 1.2 !important;
	letter-spacing: 0.03em;
	padding: 3px 7px !important;
	min-width: 0 !important;
	min-height: 0 !important;
}

/* ---------------------------------------------------------------
   Single product page
   --------------------------------------------------------------- */
.product-page {
	padding-top: 18px;
	padding-bottom: 52px;
}

.product-breadcrumbs {
	margin-bottom: 24px;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--neutral-500);
}

.product-breadcrumbs a {
	color: var(--wp--preset--color--neutral-500);
	text-decoration: none;
}

.product-breadcrumbs a:hover {
	color: var(--wp--preset--color--contrast);
}

.product-hero {
	gap: 36px;
	margin-bottom: 44px;
}

/* --- Gallery --------------------------------------------------- */
.product-hero__media .woocommerce-product-gallery {
	width: 100% !important;
	margin: 0;
	float: none;
}

.product-hero__media .woocommerce-product-gallery__wrapper {
	margin: 0;
}

.product-hero__media .woocommerce-product-gallery__image > a {
	display: block;
}

/* Fixed 1:1 display box.
   Previously this was `width: 100%` with height left auto and only a
   `max-height: 420px` cap. Height therefore came from each file's own intrinsic
   ratio, and the gallery images range from 0.574 to 1.556 — so the frame
   measured ~302px tall on the widest shot and 420px on the tall ones, changing
   height on every slide and making products look different sizes. object-fit
   also had nothing to do in that setup, because the box already matched the
   image's ratio.
   A fixed aspect-ratio makes the box identical on every slide and lets contain
   letterbox inside it. 1:1 is used because these images are portrait-leaning
   (median 0.915) and it leaves the least unused area of the ratios tested
   (21.2% vs 28.2% at 5:4 and 30.3% at 4:3). Nothing is cropped. */
.product-hero__media .woocommerce-product-gallery__image img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: contain;
	object-position: center;
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 6px;
}

/* Thumbnails below the main image. */
.product-hero__media .flex-control-thumbs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 10px 0 0;
	padding: 0;
	list-style: none;
}

.product-hero__media .flex-control-thumbs li {
	width: 68px;
	margin: 0;
	list-style: none;
}

/* Thumbnails share the same fixed-box + contain treatment as the main image, so
   the strip stays even.
   Note: WooCommerce generates gallery_thumbnail at 100x100 with crop enabled, so
   the thumbnail FILES are already square crops — contain has nothing left to fit
   on them. Showing uncropped thumbnails would mean changing that WooCommerce
   image size and regenerating, which is outside this change. */
.product-hero__media .flex-control-thumbs img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: contain;
	object-position: center;
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 4px;
	cursor: pointer;
	opacity: 1;
	transition: border-color 0.15s ease;
}

.product-hero__media .flex-control-thumbs img:hover,
.product-hero__media .flex-control-thumbs img.flex-active {
	border-color: var(--wp--preset--color--primary);
}

/* Keep WooCommerce's zoom/lightbox trigger usable but unobtrusive. */
.product-hero__media .woocommerce-product-gallery__trigger {
	top: 12px;
	right: 12px;
}

/* --- Info column ----------------------------------------------- */
.product-title {
	margin: 0 0 10px;
	font-size: clamp(1.5rem, 2.4vw, 2rem);
	line-height: 1.2;
}

.product-rating {
	margin: 0 0 12px;
}

.product-price {
	margin: 0 0 8px;
	font-size: 1.75rem;
	font-weight: 700;
	line-height: 1.2;
}

.product-price del {
	font-size: 1.125rem;
	font-weight: 500;
	color: var(--wp--preset--color--neutral-500);
	margin-right: 8px;
}

.product-price ins {
	text-decoration: none;
}

.product-stock {
	margin: 0 0 20px;
	font-size: var(--wp--preset--font-size--small);
}

/* --- Short summary (per-product, from the short description) ---- */
.product-summary {
	margin: 0 0 22px;
	padding-bottom: 20px;
	border-bottom: 1px solid var(--wp--preset--color--neutral-200);
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.6;
	color: var(--wp--preset--color--contrast);
}

.product-summary > *:first-child {
	margin-top: 0;
}

.product-summary > *:last-child {
	margin-bottom: 0;
}

.product-summary p {
	margin: 0 0 12px;
	color: var(--wp--preset--color--neutral-500);
}

.product-summary ul,
.product-summary ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

.product-summary ol {
	counter-reset: primago-summary;
}

.product-summary li {
	position: relative;
	margin: 0 0 6px;
	padding-left: 18px;
	line-height: 1.45;
}

/* Small yellow marker instead of a default bullet. */
.product-summary li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.52em;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--wp--preset--color--primary);
}

.product-summary strong {
	font-weight: 600;
}

/* --- Add to cart ----------------------------------------------- */
.product-atc {
	margin: 0 0 18px;
	padding-top: 18px;
	border-top: 1px solid var(--wp--preset--color--neutral-200);
}

.product-atc form.cart {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	margin: 0;
}

.product-atc .quantity {
	display: flex;
	align-items: center;
}

.product-atc .quantity input[type="number"],
.product-atc .quantity .qty {
	width: 76px;
	height: 46px;
	padding: 8px 10px;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--medium);
	text-align: center;
	color: var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 4px;
}

.product-atc .quantity input:focus {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 1px;
}

.product-atc button.single_add_to_cart_button {
	flex: 1 1 220px;
	min-height: 46px;
	padding: 12px 28px;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--primary);
	border: none;
	border-radius: 4px;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.product-atc button.single_add_to_cart_button:hover {
	background: var(--wp--preset--color--primary-dark);
}

/* --- Store benefits (secondary) --------------------------------- */
/* Deliberately quiet: no panel, small type, wrapping inline row so it never
   competes with the summary or the buy button. */
.product-trust {
	margin: 0 0 18px;
}

.product-trust__list {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 18px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.product-trust__list li {
	display: flex;
	align-items: baseline;
	gap: 7px;
	margin: 0;
	font-size: 0.75rem;
	line-height: 1.35;
	color: var(--wp--preset--color--neutral-500);
}

.product-trust__list li::before {
	content: "";
	flex: none;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--wp--preset--color--primary);
	transform: translateY(-1px);
}

.product-meta {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--neutral-500);
}

.product-meta a {
	color: var(--wp--preset--color--neutral-500);
}

/* --- Lower sections -------------------------------------------- */
.product-section {
	padding-top: 30px;
	border-top: 1px solid var(--wp--preset--color--neutral-200);
}

.product-section + .product-section {
	margin-top: 36px;
}

/* Hold the description to a comfortable measure rather than the full grid. */
.product-section--description > * {
	max-width: 1060px;
}

.product-desc__heading {
	margin: 0 0 20px;
	font-size: var(--wp--preset--font-size--large);
}

/* Authored description content: room for later Allegro-style markup, but
   tightened so a long description does not sprawl. */
.product-section--description .wp-block-woocommerce-product-description {
	font-size: 0.9375rem;
	line-height: 1.6;
}

.product-section--description .wp-block-woocommerce-product-description > * + * {
	margin-top: 0.85em;
}

.product-section--description p {
	margin: 0 0 0.85em;
}

.product-section--description h2,
.product-section--description h3,
.product-section--description h4 {
	margin: 1.4em 0 0.45em;
	line-height: 1.25;
}

.product-section--description h2 {
	font-size: 1.25rem;
}

.product-section--description h3 {
	font-size: 1.0625rem;
}

.product-section--description h4 {
	font-size: 1rem;
}

.product-section--description ul,
.product-section--description ol {
	padding-left: 20px;
	margin: 0 0 0.85em;
}

.product-section--description li {
	margin-bottom: 4px;
}

.product-section--description img {
	max-width: 100%;
	height: auto;
	border-radius: 5px;
}

.product-section--description table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--wp--preset--font-size--small);
}

.product-section--description th,
.product-section--description td {
	padding: 8px 11px;
	border: 1px solid var(--wp--preset--color--neutral-200);
	text-align: left;
}

.product-section--description th {
	background: var(--wp--preset--color--neutral-100);
	font-weight: 600;
}

/* --- Collapsible description ------------------------------------
   No max-height by default: without JavaScript the description stays fully
   visible. The script adds .is-collapsible/.is-collapsed and drives the
   inline max-height, so nothing is ever hidden from the DOM. */
.product-desc {
	position: relative;
}

.product-desc__content {
	transition: max-height 0.3s ease;
}

.product-desc.is-collapsible .product-desc__content {
	overflow: hidden;
}

/* Fade only while collapsed, to signal there is more below. */
.product-desc.is-collapsible.is-collapsed::before {
	content: "";
	position: absolute;
	left: 0;
	right: 0;
	bottom: 46px;
	height: 90px;
	background: linear-gradient(
		to bottom,
		rgba(255, 255, 255, 0),
		var(--wp--preset--color--base)
	);
	pointer-events: none;
}

.product-desc__toggle {
	display: block;
	margin: 16px auto 0;
	padding: 9px 22px;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 4px;
	cursor: pointer;
	transition: border-color 0.15s ease, background-color 0.15s ease;
}

.product-desc__toggle:hover {
	border-color: var(--wp--preset--color--neutral-500);
	background: var(--wp--preset--color--neutral-100);
}

.product-desc__toggle:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.product-desc__content {
		transition: none;
	}
}

/* --- Reviews --------------------------------------------------- */
.product-section--reviews .woocommerce-Reviews-title,
.product-section--reviews .wp-block-woocommerce-product-reviews-title {
	font-size: var(--wp--preset--font-size--x-large);
	margin-bottom: 24px;
}

.product-section--reviews .verified,
.product-section--reviews .woocommerce-review__verified {
	display: inline-block;
	margin-left: 6px;
	padding: 2px 7px;
	font-size: 0.6875rem;
	font-style: normal;
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--primary);
	border-radius: 3px;
}

.product-section--reviews .comment-form input[type="text"],
.product-section--reviews .comment-form input[type="email"],
.product-section--reviews .comment-form textarea {
	font-family: inherit;
	padding: 10px 12px;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 4px;
	background: var(--wp--preset--color--base);
}

.product-section--reviews .comment-form .submit {
	padding: 11px 24px;
	font-family: inherit;
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--primary);
	border: none;
	border-radius: 4px;
	cursor: pointer;
}

.product-section--reviews .woocommerce-verification-required {
	margin: 0;
	padding: 14px 16px;
	background: var(--wp--preset--color--neutral-100);
	border-radius: 5px;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--neutral-500);
}

/* --- Related products ------------------------------------------ */
.product-section--related > h2,
.product-section--related .wp-block-heading {
	font-size: var(--wp--preset--font-size--x-large);
	margin-bottom: 24px;
}

/* ===============================================================
   Catalogue (shop + every product taxonomy archive)
   =============================================================== */
.catalog {
	padding-top: 18px;
	padding-bottom: 52px;
}

.catalog-head {
	margin: 0 0 18px;
	padding-bottom: 15px;
	border-bottom: 1px solid var(--wp--preset--color--neutral-200);
}

.catalog-head__title {
	margin: 0 0 8px;
	font-size: clamp(1.625rem, 2.6vw, 2.125rem);
	line-height: 1.2;
}

.catalog-head__desc {
	margin: 0;
	max-width: 60ch;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--neutral-500);
}

.catalog-head__count {
	margin: 10px 0 0;
	font-size: 0.75rem;
	color: var(--wp--preset--color--neutral-500);
}

/* Toolbar: subtle count, properly styled sorting. */
.catalog-toolbar {
	align-items: center;
	gap: 10px 18px;
	margin: 0 0 18px;
}

.catalog-toolbar .woocommerce-result-count,
.catalog-toolbar__count {
	margin: 0;
	font-size: 0.75rem;
	color: var(--wp--preset--color--neutral-500);
}

.catalog-toolbar .woocommerce-ordering,
.catalog-toolbar__sorting {
	margin: 0;
}

.catalog-toolbar select,
.woocommerce-ordering select.orderby {
	font-family: inherit;
	font-size: var(--wp--preset--font-size--small);
	min-height: 40px;
	padding: 9px 34px 9px 12px;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 4px;
	background-color: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	cursor: pointer;
	/* Inline chevron keeps the control consistent across browsers. */
	appearance: none;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%236b6f76' stroke-width='1.6' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	background-size: 11px;
}

.catalog-toolbar select:hover,
.woocommerce-ordering select.orderby:hover {
	border-color: var(--wp--preset--color--neutral-500);
}

.catalog-empty {
	margin: 0;
	padding: 28px 0;
	color: var(--wp--preset--color--neutral-500);
}

/* Pagination */
.catalog-pagination {
	margin-top: 40px;
	gap: 6px;
}

.catalog-pagination .wp-block-query-pagination-numbers,
.catalog-pagination .page-numbers {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	align-items: center;
}

.catalog-pagination a,
.catalog-pagination span.page-numbers,
.catalog-pagination .wp-block-query-pagination-previous,
.catalog-pagination .wp-block-query-pagination-next {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 38px;
	height: 38px;
	padding: 0 12px;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	text-decoration: none;
	color: var(--wp--preset--color--contrast);
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 4px;
	transition: border-color 0.15s ease, background-color 0.15s ease;
}

.catalog-pagination a:hover {
	border-color: var(--wp--preset--color--neutral-500);
	background: var(--wp--preset--color--neutral-100);
}

.catalog-pagination .page-numbers.current {
	border-color: var(--wp--preset--color--primary);
	background: var(--wp--preset--color--primary);
	font-weight: 700;
}

/* ===============================================================
   Information & legal pages (shared)
   =============================================================== */
.legal-page {
	padding-top: 18px;
	padding-bottom: 52px;
}

.legal-page__title {
	margin: 0 0 10px;
	font-size: clamp(1.625rem, 2.6vw, 2.125rem);
	line-height: 1.2;
}

/* One style for every information page rather than per-page rules. */
.legal-content {
	font-size: 0.9375rem;
	line-height: 1.65;
	color: var(--wp--preset--color--contrast);
}

.legal-content > * + * {
	margin-top: 0.9em;
}

.legal-content h2 {
	margin: 1.8em 0 0.5em;
	padding-top: 0.8em;
	border-top: 1px solid var(--wp--preset--color--neutral-200);
	font-size: 1.25rem;
	line-height: 1.25;
}

.legal-content > h2:first-child {
	margin-top: 0;
	padding-top: 0;
	border-top: none;
}

.legal-content h3 {
	margin: 1.4em 0 0.4em;
	font-size: 1.0625rem;
	line-height: 1.3;
}

.legal-content h4 {
	margin: 1.2em 0 0.4em;
	font-size: 1rem;
}

.legal-content p {
	margin: 0 0 0.9em;
}

.legal-content ul,
.legal-content ol {
	margin: 0 0 0.9em;
	padding-left: 22px;
}

.legal-content li {
	margin-bottom: 5px;
}

.legal-content a {
	color: var(--wp--preset--color--contrast);
	text-decoration: underline;
	text-underline-offset: 2px;
}

.legal-content a:hover {
	color: var(--wp--preset--color--primary-dark);
}

.legal-content table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--wp--preset--font-size--small);
	margin: 0 0 0.9em;
}

.legal-content th,
.legal-content td {
	padding: 9px 12px;
	border: 1px solid var(--wp--preset--color--neutral-200);
	text-align: left;
	vertical-align: top;
}

.legal-content th {
	background: var(--wp--preset--color--neutral-100);
	font-weight: 600;
}

/* Wide tables scroll inside their own box rather than the page. */
.legal-content .wp-block-table {
	overflow-x: auto;
}

.legal-content .wp-block-file {
	padding: 14px 16px;
	background: var(--wp--preset--color--neutral-100);
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 5px;
}

.legal-content .wp-block-file a:first-child {
	font-weight: 600;
}

.legal-content .wp-block-file__button {
	margin-left: 12px;
	padding: 7px 15px;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--primary);
	border-radius: 4px;
	text-decoration: none;
}

/* ---------------------------------------------------------------
   Content pages (Kontakt / O nas / B2B)
   --------------------------------------------------------------- */
.content-page__title {
	margin: 0 0 18px;
	font-size: clamp(1.625rem, 2.4vw, 2rem);
	line-height: 1.2;
}

/* Lead paragraph: informative, not a headline. */
.page-lead {
	margin: 0 0 8px;
	max-width: 62ch;
	font-size: 1.0625rem;
	line-height: 1.55;
	color: var(--wp--preset--color--neutral-500);
}

/* Sections carry the rhythm, so headings can stay modest. */
.info-section {
	margin-top: 32px;
	padding-top: 24px;
	border-top: 1px solid var(--wp--preset--color--neutral-200);
}

.info-section--last {
	margin-bottom: 8px;
}

.content-page .info-section h2,
.content-page .entry-content > h2,
.b2b-intro .info-section h2 {
	margin: 0 0 12px;
	font-size: 1.25rem;
	line-height: 1.25;
}

.content-page .info-section h3,
.b2b-intro .info-section h3 {
	margin: 0 0 8px;
	font-size: 1.0625rem;
	line-height: 1.3;
}

.content-page p,
.b2b-intro p {
	font-size: 0.9375rem;
	line-height: 1.6;
}

.info-list {
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
}

.info-list li {
	position: relative;
	margin-bottom: 8px;
	padding-left: 16px;
	font-size: 0.9375rem;
	line-height: 1.5;
}

.info-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.6em;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--wp--preset--color--primary);
}

.info-list a {
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.info-list a:hover {
	color: var(--wp--preset--color--primary-dark);
}

/* The dashed .media-slot photography placeholders were removed together with
   the panels they styled — an empty reserved box is not something a visitor
   should ever see. Add a normal Image block when real photos exist. */

/* Compact audience tiles */
.tile-row {
	gap: 12px;
	margin-top: 4px;
}

.tile {
	margin: 0;
	height: 100%;
	padding: 10px 12px;
	font-size: 0.8125rem !important;
	font-weight: 600;
	line-height: 1.3;
	color: var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--neutral-100);
	border-radius: 4px;
	border-left: 3px solid var(--wp--preset--color--primary);
}

/* Offer cards */
.card-row {
	gap: 12px;
	margin-bottom: 12px;
}

.card-row:last-child {
	margin-bottom: 0;
}

.info-card {
	height: 100%;
	padding: 14px 16px;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 5px;
	background: var(--wp--preset--color--base);
}

.info-card p {
	font-size: 0.875rem !important;
	line-height: 1.5;
}

.info-card h3 {
	margin: 0 0 8px !important;
}

.info-card p {
	margin: 0;
	color: var(--wp--preset--color--neutral-500);
}

/* Closing CTA */
.cta-panel {
	margin-top: 32px;
	padding: 22px 24px;
	background: var(--wp--preset--color--neutral-100);
	border-radius: 6px;
}

.cta-panel h2 {
	margin: 0 0 10px !important;
	padding-top: 0 !important;
	border-top: none !important;
	font-size: 1.25rem !important;
}

.cta-panel p {
	margin: 0 0 10px;
	color: var(--wp--preset--color--neutral-500);
}

.cta-panel__contact {
	margin-bottom: 18px !important;
	font-weight: 600;
	color: var(--wp--preset--color--contrast) !important;
}

.cta-panel__contact a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.cta-panel__contact a:hover {
	color: var(--wp--preset--color--primary-dark);
}

/* Live shipping / payment summary */
.info-blocks {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 20px;
	margin: 0 0 8px;
}

@media (min-width: 700px) {
	.info-blocks {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.info-block {
	padding: 18px 20px;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 6px;
	background: var(--wp--preset--color--base);
}

.info-block h2 {
	margin: 0 0 12px !important;
	padding-top: 0 !important;
	border-top: none !important;
	font-size: var(--wp--preset--font-size--medium);
}

.info-block__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.info-block__list li {
	position: relative;
	margin: 0 0 8px;
	padding-left: 16px;
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.45;
	color: var(--wp--preset--color--neutral-500);
}

.info-block__list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.55em;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--wp--preset--color--primary);
}

.info-block__list strong {
	color: var(--wp--preset--color--contrast);
	font-weight: 600;
}

.info-block__zone {
	display: block;
	font-size: 0.75rem;
	color: var(--wp--preset--color--neutral-500);
}

.info-block__note {
	margin: 12px 0 0;
	font-size: 0.75rem;
	color: var(--wp--preset--color--neutral-500);
}

/* Contact page */
.contact-cols {
	gap: 16px;
	margin-bottom: 0;
}

/* The two columns are cards, so the factual data reads as one block each
   instead of two loose stacks of text. Equal height without a fixed one. */
.contact-cols .wp-block-column {
	display: flex;
}

.contact-card {
	flex: 1;
	padding: 18px 20px 6px;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 6px;
	background: var(--wp--preset--color--base);
}

.content-page .contact-card h2 {
	margin: 0 0 14px !important;
	padding-top: 0 !important;
	border-top: none !important;
	font-size: 1rem !important;
	letter-spacing: 0.01em;
}

.contact-line {
	margin: 0 0 14px;
	line-height: 1.5;
}

.contact-line strong {
	display: block;
	margin-bottom: 2px;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--neutral-500);
	font-weight: 600;
}

.contact-line a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
	font-weight: 600;
}

.contact-line a:hover {
	color: var(--wp--preset--color--primary-dark);
}

/* "W jakiej sprawie piszesz?" — three routes to an existing page. Rows rather
   than sentences, so the destination is the thing you read first. */
.contact-topics {
	margin-top: 28px;
}

.content-page .contact-topics h2 {
	margin: 0 0 12px !important;
	font-size: 1.0625rem !important;
}

.topic-list {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--wp--preset--color--neutral-200);
}

.topic-list li {
	margin: 0;
	padding: 11px 2px;
	border-bottom: 1px solid var(--wp--preset--color--neutral-200);
}

.topic-list a {
	display: inline-block;
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.topic-list a:hover {
	color: var(--wp--preset--color--primary-dark);
}

.topic-list span {
	display: block;
	margin-top: 2px;
	font-size: 0.8125rem;
	line-height: 1.45;
	color: var(--wp--preset--color--neutral-500);
}

.contact-cta {
	margin-top: 24px;
}

/* One-line closing prompt, used where a full contact block would duplicate
   the Kontakt page. */
.page-outro {
	margin: 32px 0 0;
	padding-top: 20px;
	border-top: 1px solid var(--wp--preset--color--neutral-200);
	font-size: 0.9375rem;
	color: var(--wp--preset--color--neutral-500);
}

.page-outro a {
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
	border-bottom: 2px solid var(--wp--preset--color--primary);
	padding-bottom: 1px;
}

.page-outro a:hover {
	color: var(--wp--preset--color--primary-dark);
}

/* ===============================================================
   WooCommerce pages (cart / checkout / account)
   Classic shortcode markup, styled with the theme's own tokens so
   these pages share one system with the rest of the site.
   =============================================================== */

/* --- Shared controls ------------------------------------------- */
.woocommerce .button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button,
.woocommerce-page .button {
	font-family: inherit;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	line-height: 1.2;
	min-height: 44px;
	padding: 12px 22px;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 4px;
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	transition: border-color 0.15s ease, background-color 0.15s ease;
}

.woocommerce .button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce a.button:hover {
	background: var(--wp--preset--color--neutral-100);
	border-color: var(--wp--preset--color--neutral-500);
	color: var(--wp--preset--color--contrast);
}

/* Primary actions carry the brand yellow. */
.woocommerce .button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce a.button.alt,
.woocommerce .checkout-button,
.woocommerce #place_order {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--contrast);
}

.woocommerce .button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce .checkout-button:hover,
.woocommerce #place_order:hover {
	background: var(--wp--preset--color--primary-dark);
	border-color: var(--wp--preset--color--primary-dark);
	color: var(--wp--preset--color--contrast);
}

.woocommerce .button:focus-visible,
.woocommerce button:focus-visible,
.woocommerce input:focus-visible,
.woocommerce select:focus-visible,
.woocommerce textarea:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 1px;
}

/* Inputs */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-page form .form-row input.input-text,
.woocommerce .select2-container .select2-selection--single {
	font-family: inherit;
	font-size: var(--wp--preset--font-size--medium);
	line-height: 1.4;
	min-height: 46px;
	padding: 11px 13px;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 4px;
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	box-shadow: none;
}

.woocommerce form .form-row label {
	margin-bottom: 5px;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
}

.woocommerce form .form-row {
	margin-bottom: 16px;
	padding: 0;
}

.woocommerce .required {
	color: var(--wp--preset--color--error);
	text-decoration: none;
}

/* Notices — flat, aligned with the rest of the site. */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-notice {
	margin: 0 0 20px;
	padding: 14px 18px;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-left: 3px solid var(--wp--preset--color--neutral-500);
	border-radius: 4px;
	background: var(--wp--preset--color--neutral-100);
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--contrast);
	list-style: none;
}

.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
	display: none;
}

.woocommerce-message {
	border-left-color: var(--wp--preset--color--success);
	background: #f2f9f4;
}

.woocommerce-error {
	border-left-color: var(--wp--preset--color--error);
	background: #fbf1ef;
}

.woocommerce-info {
	border-left-color: var(--wp--preset--color--primary);
}

.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button {
	min-height: 36px;
	padding: 8px 16px;
}

/* --- Free shipping progress ------------------------------------ */
/* Integrated into the summary: no box, just a line of text and a hairline bar. */
.free-ship {
	margin: 0 0 14px;
	padding: 0;
	background: none;
	border: none;
}

.free-ship__text {
	margin: 0 0 7px;
	font-size: 0.8125rem;
	line-height: 1.35;
	color: var(--wp--preset--color--neutral-500);
}

.free-ship__text strong {
	color: var(--wp--preset--color--contrast);
}

.free-ship__bar {
	height: 3px;
	border-radius: 2px;
	background: var(--wp--preset--color--neutral-200);
	overflow: hidden;
}

.free-ship__fill {
	display: block;
	height: 100%;
	background: var(--wp--preset--color--primary);
	transition: width 0.3s ease;
}

.free-ship.is-qualified .free-ship__fill {
	background: var(--wp--preset--color--success);
}

@media (prefers-reduced-motion: reduce) {
	.free-ship__fill {
		transition: none;
	}
}

/* --- Cart ------------------------------------------------------- */
/* Cart and checkout run wider than the default page measure. */
.cart-page,
.checkout-page {
	--wp--style--global--content-size: 1280px;
}

.cart-page > .content-page__title,
.checkout-page > .content-page__title {
	max-width: 1280px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 22px;
	font-size: clamp(1.5rem, 2.2vw, 1.875rem);
}

.cart-page > .woocommerce,
.checkout-page > .woocommerce,
.cart-page > .entry-content,
.checkout-page > .entry-content {
	max-width: 1280px;
	margin-left: auto;
	margin-right: auto;
}

.woocommerce-cart .woocommerce {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 32px;
	align-items: start;
}

@media (min-width: 900px) {
	.woocommerce-cart .woocommerce {
		grid-template-columns: minmax(0, 1fr) 320px;
		gap: 36px;
	}

	/* Notices span both columns rather than squeezing the item list. */
	.woocommerce-cart .woocommerce > .woocommerce-notices-wrapper {
		grid-column: 1 / -1;
	}
}

.woocommerce-cart table.shop_table {
	width: 100%;
	margin: 0;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 6px;
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
}

.woocommerce-cart table.shop_table thead th {
	padding: 12px 14px;
	font-size: 0.75rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--neutral-500);
	background: var(--wp--preset--color--neutral-100);
	border-bottom: 1px solid var(--wp--preset--color--neutral-200);
}

.woocommerce-cart table.shop_table td {
	padding: 12px 14px;
	border-top: 1px solid var(--wp--preset--color--neutral-200);
	vertical-align: middle;
}

/* Price and subtotal support the product name rather than competing with it. */
.woocommerce-cart td.product-price,
.woocommerce-cart td.product-subtotal {
	font-size: var(--wp--preset--font-size--small);
	white-space: nowrap;
}

.woocommerce-cart td.product-price {
	color: var(--wp--preset--color--neutral-500);
}

.woocommerce-cart td.product-subtotal {
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
}

.woocommerce-cart td.product-name {
	font-size: var(--wp--preset--font-size--small);
	line-height: 1.4;
}

.woocommerce-cart table.shop_table tbody tr:first-child td {
	border-top: none;
}

.woocommerce-cart td.product-thumbnail {
	width: 84px;
}

.woocommerce-cart td.product-thumbnail img {
	width: 72px;
	height: 72px;
	object-fit: contain;
	background: var(--wp--preset--color--neutral-100);
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 4px;
}

/* Quantity and subtotal read as a pair on the right of the row. */
.woocommerce-cart td.product-quantity,
.woocommerce-cart td.product-subtotal {
	text-align: right;
	white-space: nowrap;
}

.woocommerce-cart td.product-quantity .quantity {
	display: inline-flex;
}

.woocommerce-cart td.product-name a {
	font-weight: 600;
	text-decoration: none;
	color: var(--wp--preset--color--contrast);
	line-height: 1.35;
}

.woocommerce-cart td.product-name a:hover {
	color: var(--wp--preset--color--primary-dark);
}

/* Quieter remove action than WooCommerce's red circle. */
.woocommerce-cart td.product-remove a.remove,
.woocommerce a.remove {
	width: 26px;
	height: 26px;
	font-size: 20px;
	line-height: 24px;
	color: var(--wp--preset--color--neutral-500) !important;
	background: transparent;
	border-radius: 4px;
}

.woocommerce-cart td.product-remove a.remove:hover,
.woocommerce a.remove:hover {
	color: var(--wp--preset--color--error) !important;
	background: var(--wp--preset--color--neutral-100) !important;
}

/* Cleaner quantity field than the WooCommerce default. */
.woocommerce-cart td.product-quantity .quantity input.qty,
.woocommerce .quantity input.qty {
	width: 72px;
	height: 42px;
	padding: 8px;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--medium);
	text-align: center;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 4px;
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
	-moz-appearance: textfield;
}

.woocommerce .quantity input.qty::-webkit-outer-spin-button,
.woocommerce .quantity input.qty::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* Actions row now only carries "Aktualizuj koszyk" — the coupon moved into the
   order summary, so WooCommerce's own coupon block is suppressed here. */
.woocommerce-cart td.actions {
	padding: 12px 14px;
	background: var(--wp--preset--color--neutral-100);
	border-top: 1px solid var(--wp--preset--color--neutral-200);
	text-align: right;
}

.woocommerce-cart td.actions .coupon {
	display: none;
}

.woocommerce-cart td.actions .button[name="update_cart"] {
	float: none;
	min-height: 38px;
	padding: 8px 16px;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
}

/* --- Coupon in the order summary -------------------------------- */
.cart-coupon {
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid var(--wp--preset--color--neutral-200);
}

.cart-coupon__summary {
	display: flex;
	align-items: center;
	gap: 7px;
	list-style: none;
	cursor: pointer;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--neutral-500);
}

.cart-coupon__summary::-webkit-details-marker {
	display: none;
}

.cart-coupon__summary::before {
	content: "";
	flex: none;
	width: 7px;
	height: 7px;
	border-right: 2px solid var(--wp--preset--color--neutral-500);
	border-bottom: 2px solid var(--wp--preset--color--neutral-500);
	transform: rotate(-45deg);
	transition: transform 0.15s ease;
}

.cart-coupon[open] .cart-coupon__summary::before {
	transform: rotate(45deg);
}

.cart-coupon__summary:hover {
	color: var(--wp--preset--color--contrast);
}

.cart-coupon__form {
	display: flex;
	gap: 8px;
	margin-top: 12px;
}

.cart-coupon__form input[type="text"] {
	flex: 1 1 auto;
	min-width: 0;
	min-height: 40px;
	padding: 9px 12px;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--small);
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 4px;
	background: var(--wp--preset--color--base);
}

.cart-coupon__form .button {
	flex: none;
	min-height: 40px;
	padding: 9px 16px;
	font-size: var(--wp--preset--font-size--small);
}

/* Order summary */
.woocommerce-cart .cart-collaterals {
	width: 100%;
}

.woocommerce-cart .cart-collaterals .cart_totals {
	width: 100%;
	float: none;
	padding: 20px;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 6px;
	background: var(--wp--preset--color--base);
}

@media (min-width: 900px) {
	.woocommerce-cart .cart-collaterals .cart_totals {
		position: sticky;
		top: 96px;
	}
}

.woocommerce-cart .cart_totals h2 {
	margin: 0 0 16px;
	font-size: var(--wp--preset--font-size--large);
}

.woocommerce-cart .cart_totals table.shop_table {
	border: none;
	border-radius: 0;
}

.woocommerce-cart .cart_totals table.shop_table th,
.woocommerce-cart .cart_totals table.shop_table td {
	padding: 9px 0;
	border: none;
	border-top: 1px solid var(--wp--preset--color--neutral-200);
	font-size: var(--wp--preset--font-size--small);
	background: none;
}

.woocommerce-cart .cart_totals table.shop_table tr:first-child th,
.woocommerce-cart .cart_totals table.shop_table tr:first-child td {
	border-top: none;
}

.woocommerce-cart .cart_totals th {
	font-weight: 500;
	color: var(--wp--preset--color--neutral-500);
	text-transform: none;
	letter-spacing: 0;
}

.woocommerce-cart .cart_totals .order-total th,
.woocommerce-cart .cart_totals .order-total td {
	padding-top: 13px;
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 700;
	color: var(--wp--preset--color--contrast);
}

.woocommerce-cart .wc-proceed-to-checkout {
	padding: 16px 0 0;
}

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	box-sizing: border-box;
	min-height: 47px;
	margin: 0;
	padding: 11px 20px;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 700;
	line-height: 1.2;
	text-align: center;
}

.woocommerce-cart .cart_totals .shipping-calculator-button {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--neutral-500);
}

/* --- Empty cart ------------------------------------------------- */
.woocommerce .cart-empty,
.woocommerce-page .cart-empty {
	margin: 0 0 10px;
	padding: 0;
	border: none;
	background: none;
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 700;
	color: var(--wp--preset--color--contrast);
}

.woocommerce .cart-empty::before {
	display: none;
}

.woocommerce .return-to-shop {
	margin: 18px 0 0;
}

.woocommerce .return-to-shop .button {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	padding: 13px 26px;
	font-size: var(--wp--preset--font-size--medium);
}

.woocommerce .return-to-shop .button:hover {
	background: var(--wp--preset--color--primary-dark);
	border-color: var(--wp--preset--color--primary-dark);
}

.primago-empty-cart__lead {
	margin: 0;
	max-width: 46ch;
	color: var(--wp--preset--color--neutral-500);
}

/* --- Checkout ----------------------------------------------------
   Two stacked sections rather than one two-column split:
     A  customer details, centred and narrower
     B  payment (wide, left) + order summary (right)
   The previous layout put everything after the details column into the narrow
   right-hand column, which is what produced the tall payment strip beside a
   large empty area. */
.woocommerce-checkout form.checkout {
	display: block;
}

/* Section A — customer details */
.checkout-customer {
	max-width: 1000px;
	margin: 0 auto 32px;
	padding-bottom: 28px;
	border-bottom: 1px solid var(--wp--preset--color--neutral-200);
}

.checkout-page > .content-page__title {
	margin-bottom: 18px;
	font-size: clamp(1.375rem, 2vw, 1.75rem);
}

/* Two-column form rows. WooCommerce already flags short fields as
   form-row-first / form-row-last; this turns that into a real grid. */
@media (min-width: 720px) {
	.woocommerce-checkout .woocommerce-billing-fields__field-wrapper,
	.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper,
	.woocommerce-checkout .woocommerce-additional-fields__field-wrapper {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0 18px;
	}

	.woocommerce-checkout .woocommerce-billing-fields__field-wrapper > .form-row,
	.woocommerce-checkout .woocommerce-shipping-fields__field-wrapper > .form-row,
	.woocommerce-checkout .woocommerce-additional-fields__field-wrapper > .form-row {
		width: auto;
		float: none;
		margin-left: 0;
		margin-right: 0;
	}

	/* Long fields span both columns. */
	.woocommerce-checkout .form-row-wide,
	.woocommerce-checkout #order_comments_field {
		grid-column: 1 / -1;
	}

	/* WooCommerce marks almost every billing field form-row-wide — including
	   postcode, city, phone and email — so the rule above was stacking the very
	   pairs that should sit side by side. ID selectors outrank that class, so
	   these opt back into a single column regardless of source order. */
	.woocommerce-checkout #billing_first_name_field,
	.woocommerce-checkout #billing_last_name_field,
	.woocommerce-checkout #billing_postcode_field,
	.woocommerce-checkout #billing_city_field,
	.woocommerce-checkout #billing_phone_field,
	.woocommerce-checkout #billing_email_field,
	.woocommerce-checkout #shipping_first_name_field,
	.woocommerce-checkout #shipping_last_name_field,
	.woocommerce-checkout #shipping_postcode_field,
	.woocommerce-checkout #shipping_city_field {
		grid-column: span 1;
	}

	/* State sits between city and phone in the Polish locale and is optional
	   here; keeping it full width stops it pairing with phone and breaking the
	   phone/email row. */
	.woocommerce-checkout #billing_state_field,
	.woocommerce-checkout #shipping_state_field {
		grid-column: 1 / -1;
	}
}

/* Section B — payment (left) + summary (right) */
.checkout-final {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 32px;
	align-items: start;
}

@media (min-width: 1000px) {
	.checkout-final {
		grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
		gap: 40px;
	}

	.checkout-final__summary {
		position: sticky;
		top: 96px;
	}
}

.checkout-final__title {
	margin: 0 0 11px;
	font-size: 1.0625rem;
	line-height: 1.3;
}

/* Coupon toggle: an option, not an alert.
   WooCommerce renders it as a blocks notice-banner (.is-info) with an icon and
   blue styling, which read as a system warning. Flattened to a quiet line —
   the link and its toggle behaviour are untouched. */
.woocommerce-checkout .woocommerce-form-coupon-toggle {
	max-width: 1000px;
	margin: 0 auto 18px;
}

.woocommerce-checkout .woocommerce-form-coupon-toggle .wc-block-components-notice-banner,
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
	margin: 0;
	padding: 9px 13px;
	min-height: 0;
	background: var(--wp--preset--color--neutral-100) !important;
	border: 1px solid var(--wp--preset--color--neutral-200) !important;
	border-radius: 4px;
	font-size: 0.8125rem;
	color: var(--wp--preset--color--neutral-500);
	box-shadow: none;
}

/* The banner's leading info icon is what made it read as an alert. */
.woocommerce-checkout .woocommerce-form-coupon-toggle .wc-block-components-notice-banner > svg {
	display: none;
}

.woocommerce-checkout .woocommerce-form-coupon-toggle .wc-block-components-notice-banner__content {
	padding: 0;
	font-size: 0.8125rem;
}

.woocommerce-checkout .woocommerce-form-coupon-toggle a {
	color: var(--wp--preset--color--contrast);
	font-weight: 600;
	text-decoration: none;
	border-bottom: 1px solid var(--wp--preset--color--neutral-500);
}

.woocommerce-checkout .woocommerce-form-coupon-toggle a:hover {
	color: var(--wp--preset--color--primary-dark);
	border-bottom-color: var(--wp--preset--color--primary);
}

.woocommerce-checkout form.checkout_coupon {
	max-width: 1000px;
	margin: 0 auto 24px;
	padding: 16px;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 5px;
	background: var(--wp--preset--color--base);
}

.woocommerce-checkout form.checkout_coupon .form-row {
	margin-bottom: 0;
}

/* Single column inside the details panel: the default two-col split makes
   Polish address labels wrap badly. */
.woocommerce-checkout #customer_details .col-1,
.woocommerce-checkout #customer_details .col-2 {
	width: 100%;
	float: none;
	margin: 0;
}

.woocommerce-checkout #customer_details .col2-set {
	width: 100%;
}

@media (min-width: 1240px) {
	.checkout-final {
		gap: 48px;
	}
}

.checkout-section-title,
.woocommerce-checkout h3,
.woocommerce-checkout #order_review_heading {
	margin: 0 0 11px;
	font-size: 1.0625rem;
	line-height: 1.3;
}

/* Denser form: labels tight to their inputs, rows closer together. */
.woocommerce-checkout form .form-row label {
	margin-bottom: 3px;
	font-size: 0.78125rem;
	font-weight: 600;
	line-height: 1.3;
}

.woocommerce-checkout form .form-row {
	margin-bottom: 11px;
}

.woocommerce-checkout form .form-row input.input-text,
.woocommerce-checkout form .form-row textarea,
.woocommerce-checkout form .form-row select,
.woocommerce-checkout .select2-container .select2-selection--single {
	font-size: 0.875rem;
	min-height: 41px;
	padding: 9px 11px;
}

.woocommerce-checkout form .form-row textarea {
	min-height: 74px;
}

/* select2 (country picker) has to match the plain inputs. */
.woocommerce-checkout .select2-container .select2-selection--single .select2-selection__rendered {
	line-height: 23px;
	padding-left: 0;
}

.woocommerce-checkout #customer_details > .col2-set > div + div {
	margin-top: 28px;
	padding-top: 28px;
	border-top: 1px solid var(--wp--preset--color--neutral-200);
}

.woocommerce-checkout #order_review {
	padding: 16px;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 6px;
	background: var(--wp--preset--color--base);
}

.woocommerce-checkout #order_review table.shop_table {
	width: 100%;
	margin: 0;
	border: none;
	border-collapse: collapse;
}

.woocommerce-checkout #order_review table.shop_table th,
.woocommerce-checkout #order_review table.shop_table td {
	padding: 7px 0;
	border: none;
	border-top: 1px solid var(--wp--preset--color--neutral-200);
	font-size: 0.8125rem;
	line-height: 1.4;
}

.woocommerce-checkout #order_review table.shop_table thead th {
	border-top: none;
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--neutral-500);
}

/* Total stays clearly the strongest line in the summary. */
.woocommerce-checkout #order_review .order-total th,
.woocommerce-checkout #order_review .order-total td {
	padding-top: 11px;
	font-size: 1rem;
	font-weight: 700;
	color: var(--wp--preset--color--contrast);
}

.woocommerce-checkout #order_review .product-name {
	font-weight: 500;
	color: var(--wp--preset--color--contrast);
}

.woocommerce-checkout #order_review .product-quantity {
	color: var(--wp--preset--color--neutral-500);
	font-weight: 400;
}

/* Section label rendered as a table row inside the order review. */
.woocommerce-checkout #order_review tr.checkout-section-row th {
	padding: 18px 0 6px;
	border-top: 1px solid var(--wp--preset--color--neutral-200);
	text-align: left;
}

.woocommerce-checkout #order_review tr.checkout-section-row .checkout-section-title {
	display: block;
	margin: 0;
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 700;
	color: var(--wp--preset--color--contrast);
	text-transform: none;
	letter-spacing: 0;
}

.woocommerce-checkout #order_review tr.free-ship-row td {
	padding: 4px 0 10px;
	border-top: none;
}

.woocommerce-checkout #order_review tr.free-ship-row .free-ship {
	margin: 0;
}

.checkout-section-title--payment {
	margin: 22px 0 12px;
	padding-top: 18px;
	border-top: 1px solid var(--wp--preset--color--neutral-200);
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 700;
}

/* Shipping + payment as deliberate, selectable options. */
.woocommerce-checkout #shipping_method,
.woocommerce-checkout ul.wc_payment_methods {
	margin: 0;
	padding: 0;
	list-style: none;
}

.woocommerce-checkout #shipping_method li,
.woocommerce-checkout ul.wc_payment_methods li {
	margin: 0 0 8px;
	padding: 0;
	list-style: none;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 5px;
	background: var(--wp--preset--color--base);
	transition: border-color 0.15s ease, background-color 0.15s ease;
}

.woocommerce-checkout #shipping_method li:hover,
.woocommerce-checkout ul.wc_payment_methods li:hover {
	border-color: var(--wp--preset--color--neutral-500);
}

.woocommerce-checkout #shipping_method li label,
.woocommerce-checkout ul.wc_payment_methods > li > label {
	display: flex;
	align-items: center;
	gap: 9px;
	margin: 0;
	padding: 9px 12px;
	font-size: 0.84375rem;
	font-weight: 500;
	line-height: 1.35;
	cursor: pointer;
}

/* Payment methods as one compact card: rows stack with hairlines rather than
   each becoming a separate floating box. */
.woocommerce-checkout ul.wc_payment_methods {
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 5px;
	overflow: hidden;
	background: var(--wp--preset--color--base);
}

.woocommerce-checkout ul.wc_payment_methods > li {
	margin: 0;
	border: none;
	border-radius: 0;
	border-top: 1px solid var(--wp--preset--color--neutral-200);
}

.woocommerce-checkout ul.wc_payment_methods > li:first-child {
	border-top: none;
}

/* Only the selected method opens; the rest stay one compact row each. */
.woocommerce-checkout ul.wc_payment_methods > li:has(input:checked) {
	background: var(--wp--preset--color--neutral-100);
	box-shadow: inset 3px 0 0 var(--wp--preset--color--primary);
}

.woocommerce-checkout #shipping_method li input[type="radio"],
.woocommerce-checkout ul.wc_payment_methods li input[type="radio"] {
	flex: none;
	width: 17px;
	height: 17px;
	margin: 0;
	accent-color: var(--wp--preset--color--primary);
}

/* Selected state: yellow edge, no fill, so it reads as chosen not highlighted. */
.woocommerce-checkout #shipping_method li:has(input:checked) {
	border-color: var(--wp--preset--color--primary);
	background: var(--wp--preset--color--neutral-100);
}

.woocommerce-checkout ul.wc_payment_methods li .payment_box {
	margin: 0;
	padding: 0 12px 10px;
	background: none;
	border-radius: 0;
	font-size: 0.8125rem;
	line-height: 1.45;
	color: var(--wp--preset--color--neutral-500);
}

.woocommerce-checkout ul.wc_payment_methods li .payment_box::before {
	display: none;
}

.woocommerce-checkout ul.wc_payment_methods > li > label img {
	max-height: 22px;
	width: auto;
	margin: 0 0 0 auto;
}

/* --- PayU bank selection ----------------------------------------
   Styling only, against the gateway's existing markup:
     .pbl-container > ul.payu-list-banks > li.payu-bank > label > input + div > img
   The radio inputs, names, values and classes are left untouched, so gateway
   behaviour and PayU's own scripts are unaffected. The default plugin styling
   stacks these vertically, which produced a very tall, narrow column. */
.woocommerce-checkout .pbl-container {
	width: 100%;
	max-width: 100%;
	margin-top: 10px;
	overflow: visible;
}

/* Now that payment sits in the wide left column there is room for a real grid:
   ~5-7 tiles per row at desktop widths, no horizontal scrolling. */
.woocommerce-checkout ul.payu-list-banks {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
	gap: 8px;
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
	/* Generous, but capped so a long bank list cannot dominate the page. */
	max-height: 400px;
	overflow-y: auto;
	overflow-x: hidden;
}

.woocommerce-checkout ul.payu-list-banks > li.payu-bank {
	float: none;
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	list-style: none;
	border: none;
	background: none;
}

.woocommerce-checkout ul.payu-list-banks > li.payu-bank label {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	min-height: 46px;
	margin: 0;
	padding: 6px 5px;
	gap: 0;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 4px;
	background: var(--wp--preset--color--base);
	cursor: pointer;
	transition: border-color 0.15s ease, background-color 0.15s ease;
}

.woocommerce-checkout ul.payu-list-banks > li.payu-bank label:hover {
	border-color: var(--wp--preset--color--neutral-500);
}

/* Keep the radio operable and focusable, but out of the visual grid. */
.woocommerce-checkout ul.payu-list-banks > li.payu-bank input[type="radio"] {
	position: absolute;
	width: 1px;
	height: 1px;
	opacity: 0;
	pointer-events: none;
}

.woocommerce-checkout ul.payu-list-banks > li.payu-bank label > div {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
}

.woocommerce-checkout ul.payu-list-banks > li.payu-bank img {
	display: block;
	max-width: 100%;
	max-height: 30px;
	width: auto;
	height: auto;
	margin: 0;
	object-fit: contain;
}

/* Selected bank — :has() covers the plugin's own active class too. */
.woocommerce-checkout ul.payu-list-banks > li.payu-bank:has(input:checked) label,
.woocommerce-checkout ul.payu-list-banks > li.payu-bank label:focus-within {
	border-color: var(--wp--preset--color--primary);
	background: var(--wp--preset--color--neutral-100);
}

/* PayU's own copy and any required disclosures stay visible. */
.woocommerce-checkout .payment_box p {
	margin: 0 0 8px;
}

.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper {
	margin: 16px 0 0;
	font-size: var(--wp--preset--font-size--small);
}

.woocommerce-checkout #payment {
	background: none;
	border-radius: 0;
	padding: 0;
}

.woocommerce-checkout #payment div.form-row.place-order {
	margin: 16px 0 0;
	padding: 0;
}

/* Legal/privacy text sits above the button and must not crowd it. */
.woocommerce-checkout .woocommerce-privacy-policy-text,
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper {
	margin: 0 0 14px;
	padding-top: 12px;
	border-top: 1px solid var(--wp--preset--color--neutral-200);
	font-size: 0.75rem;
	line-height: 1.5;
	color: var(--wp--preset--color--neutral-500);
}

.woocommerce-checkout .woocommerce-privacy-policy-text p {
	margin: 0;
}

.woocommerce-checkout #place_order {
	display: block;
	width: 100%;
	min-height: 48px;
	margin: 0;
	padding: 13px 22px;
	font-size: 0.9375rem;
	font-weight: 700;
	float: none;
}

/* Trust row: clearly below the CTA, never beside it. */
.checkout-trust {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px 18px;
	margin: 16px 0 0;
	padding: 0;
	list-style: none;
	clear: both;
}

.checkout-trust li {
	display: flex;
	align-items: baseline;
	gap: 6px;
	margin: 0;
	font-size: 0.75rem;
	line-height: 1.35;
	color: var(--wp--preset--color--neutral-500);
}

.checkout-trust li::before {
	content: "";
	flex: none;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: var(--wp--preset--color--primary);
	transform: translateY(-1px);
}

/* --- My account -------------------------------------------------- */
.woocommerce-account .woocommerce {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 28px;
	align-items: start;
}

@media (min-width: 860px) {
	.woocommerce-account .woocommerce:has(.woocommerce-MyAccount-navigation) {
		grid-template-columns: 220px minmax(0, 1fr);
	}
}

.woocommerce-account .woocommerce-MyAccount-navigation {
	width: 100%;
	float: none;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
	margin: 0;
	padding: 0;
	list-style: none;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 6px;
	overflow: hidden;
}

.woocommerce-account .woocommerce-MyAccount-navigation li {
	margin: 0;
	border-top: 1px solid var(--wp--preset--color--neutral-200);
}

.woocommerce-account .woocommerce-MyAccount-navigation li:first-child {
	border-top: none;
}

.woocommerce-account .woocommerce-MyAccount-navigation li a {
	display: block;
	padding: 11px 15px;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 500;
	text-decoration: none;
	color: var(--wp--preset--color--contrast);
	transition: background-color 0.15s ease;
}

.woocommerce-account .woocommerce-MyAccount-navigation li a:hover {
	background: var(--wp--preset--color--neutral-100);
}

.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
	background: var(--wp--preset--color--neutral-100);
	box-shadow: inset 3px 0 0 var(--wp--preset--color--primary);
}

.woocommerce-account .woocommerce-MyAccount-content {
	width: 100%;
	float: none;
}

.woocommerce-account .woocommerce-MyAccount-content table.shop_table {
	width: 100%;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 6px;
	border-collapse: separate;
	border-spacing: 0;
	overflow: hidden;
	font-size: var(--wp--preset--font-size--small);
}

.woocommerce-account .woocommerce-MyAccount-content table.shop_table th {
	padding: 11px 13px;
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--wp--preset--color--neutral-500);
	background: var(--wp--preset--color--neutral-100);
}

.woocommerce-account .woocommerce-MyAccount-content table.shop_table td {
	padding: 13px;
	border-top: 1px solid var(--wp--preset--color--neutral-200);
}

.woocommerce-account .u-columns.col2-set {
	display: flex;
	flex-wrap: wrap;
	gap: 28px;
	width: 100%;
}

.woocommerce-account .u-columns.col2-set > div {
	flex: 1 1 280px;
	min-width: 0;
}

/* Login / register */
.woocommerce-account .woocommerce-form-login,
...
/* Login / register */
.woocommerce-account .woocommerce-form-login,
.woocommerce-account .woocommerce-form-register,
.woocommerce-account .u-column1,
.woocommerce-account .u-column2 {
	padding: 22px;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 6px;
	background: var(--wp--preset--color--base);
}

.woocommerce-account .woocommerce-form-login,
.woocommerce-account .woocommerce-form-register {
	border: none;
	padding: 0;
}

.woocommerce-account .woocommerce-form-login .woocommerce-form-login__submit,
.woocommerce-account .woocommerce-form-register button[type="submit"] {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	width: 100%;
	margin: 0 0 10px;
}

.woocommerce-account .woocommerce-form-login__rememberme {
	font-size: var(--wp--preset--font-size--small);
}

.woocommerce-account .woocommerce-address-fields__field-wrapper {
	margin-bottom: 16px;
}

/* --- Mobile ------------------------------------------------------ */
@media (max-width: 781px) {
	/* Stacked cart rows: the default table is unreadable at phone widths. */
	.woocommerce-cart table.shop_table thead {
		display: none;
	}

	.woocommerce-cart table.shop_table,
	.woocommerce-cart table.shop_table tbody,
	.woocommerce-cart table.shop_table tr,
	.woocommerce-cart table.shop_table td {
		display: block;
		width: 100%;
	}

	.woocommerce-cart table.shop_table tr.woocommerce-cart-form__cart-item {
		position: relative;
		display: grid;
		grid-template-columns: 64px minmax(0, 1fr);
		gap: 4px 12px;
		padding: 14px;
		border-top: 1px solid var(--wp--preset--color--neutral-200);
	}

	.woocommerce-cart table.shop_table tbody tr:first-child {
		border-top: none;
	}

	.woocommerce-cart table.shop_table tr.woocommerce-cart-form__cart-item td {
		padding: 0;
		border: none;
	}

	.woocommerce-cart td.product-remove {
		position: absolute;
		top: 10px;
		right: 10px;
		width: auto;
	}

	.woocommerce-cart td.product-thumbnail {
		grid-row: span 4;
	}

	.woocommerce-cart td.product-name {
		padding-right: 30px !important;
	}

	.woocommerce-cart td.product-price,
	.woocommerce-cart td.product-subtotal {
		font-size: var(--wp--preset--font-size--small);
	}

	.woocommerce-cart td.product-price::before {
		content: "Cena: ";
		color: var(--wp--preset--color--neutral-500);
	}

	.woocommerce-cart td.product-subtotal::before {
		content: "Razem: ";
		color: var(--wp--preset--color--neutral-500);
	}

	.woocommerce-cart td.product-quantity {
		margin-top: 6px;
	}

	.woocommerce-cart td.actions .button[name="update_cart"] {
		float: none;
		width: 100%;
	}

	.woocommerce-checkout #order_review,
	.woocommerce-cart .cart-collaterals .cart_totals {
		padding: 16px;
	}

	.woocommerce-checkout #place_order {
		min-height: 48px;
	}

	/* 2-3 tiles per row at phone widths, still no horizontal overflow. */
	.woocommerce-checkout ul.payu-list-banks {
		grid-template-columns: repeat(auto-fill, minmax(88px, 1fr));
		gap: 6px;
		max-height: 300px;
	}

	/* No sticky sidebar on mobile — one clean vertical flow. */
	.checkout-final__summary {
		position: static;
	}

	.checkout-customer {
		margin-bottom: 28px;
		padding-bottom: 24px;
	}

	.woocommerce-checkout ul.payu-list-banks > li.payu-bank label {
		min-height: 46px;
		padding: 6px 4px;
	}

	.woocommerce-checkout ul.payu-list-banks > li.payu-bank img {
		max-height: 24px;
	}

	.content-page__title,
	.cart-page > .content-page__title,
	.checkout-page > .content-page__title {
		font-size: 1.5rem;
	}

	.info-section {
		margin-top: 32px;
		padding-top: 24px;
	}

	.tile-row,
	.card-row {
		gap: 10px;
	}

	.cta-panel {
		margin-top: 32px;
		padding: 20px;
	}

	.media-slot--wide {
		aspect-ratio: 16 / 9;
	}
}

/* ---------------------------------------------------------------
   Footer
   --------------------------------------------------------------- */
.site-footer {
	border-top: 1px solid var(--wp--preset--color--neutral-200);
}

.site-footer__columns {
	gap: 20px 28px;
	margin-bottom: 20px;
}

/* Column headings still need to outrank the links beneath them, just smaller. */
.site-footer h6 {
	margin: 0 0 9px;
	font-size: 0.9375rem;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: -0.005em;
	color: var(--wp--preset--color--contrast);
}

.site-footer p,
.site-footer li {
	font-size: 0.8125rem;
	line-height: 1.45;
}

.site-footer .wp-block-site-logo {
	margin-bottom: 0;
}

.footer-links {
	list-style: none;
	margin: 0;
	padding: 0;
}

.footer-links li {
	margin-bottom: 5px;
}

.footer-links a {
	color: var(--wp--preset--color--neutral-500);
	text-decoration: none;
}

.footer-links a:hover {
	color: var(--wp--preset--color--contrast);
}

.site-footer__rule {
	margin: 16px 0;
	border: none;
	height: 1px;
}

.site-footer__bottom {
	flex-wrap: wrap;
	gap: 5px 20px;
}

.site-footer__bottom p {
	font-size: 0.75rem;
}

/* Deliberately the quietest thing in the footer. */
.site-footer__ai-guide {
	margin: 10px 0 0;
	font-size: 0.6875rem;
	line-height: 1.4;
}

.site-footer__ai-guide a {
	color: var(--wp--preset--color--neutral-500);
	text-decoration: none;
	border-bottom: 1px solid var(--wp--preset--color--neutral-200);
}

.site-footer__ai-guide a:hover {
	color: var(--wp--preset--color--contrast);
	border-bottom-color: var(--wp--preset--color--neutral-500);
}

/* ---------------------------------------------------------------
   B2B application form (page template; feature work paused)
   Presentation only — no field, requirement or validation changed.
   --------------------------------------------------------------- */
.b2b-form-section {
	padding-top: 32px !important;
	padding-bottom: 40px !important;
}

.b2b-form-section > h2 {
	margin-bottom: 6px;
	font-size: 1.25rem;
}

.b2b-form-section > p {
	font-size: 0.9375rem;
	margin-bottom: 0;
}

/* Two-column rows for short fields; the form itself stays centred and capped. */
.primago-form {
	max-width: 900px;
	margin: 22px auto 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px 16px;
	padding: 22px 24px;
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 6px;
}

/* Long-form fields and controls span the full width. */
.primago-form > .primago-form__row--full,
.primago-form > .primago-form__row--checkbox,
.primago-form > .primago-form__submit,
.primago-form > .primago-form__hp {
	grid-column: 1 / -1;
}

/* The plugin's own paired wrapper: flatten it so its children join the grid. */
.primago-form__grid {
	display: contents;
}

.primago-form__row {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}

/* Textareas are always full width regardless of source order. */
.primago-form__row:has(textarea) {
	grid-column: 1 / -1;
}

.primago-form__row label {
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
}

.primago-form__row input[type="text"],
.primago-form__row input[type="email"],
.primago-form__row input[type="tel"],
.primago-form__row select,
.primago-form__row textarea {
	font-family: inherit;
	font-size: 0.9375rem;
	min-height: 42px;
	padding: 10px 12px;
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 4px;
	background: var(--wp--preset--color--base);
	color: var(--wp--preset--color--contrast);
}

.primago-form__row textarea {
	min-height: 90px;
	resize: vertical;
}

.primago-form__row input:focus,
.primago-form__row select:focus,
.primago-form__row textarea:focus {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: 1px;
}

.primago-form__row--checkbox {
	flex-direction: row;
	align-items: flex-start;
	margin-top: 2px;
	font-size: 0.875rem;
}

.primago-form__row--checkbox label {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	font-weight: 400;
}

.primago-form__row--checkbox input[type="checkbox"] {
	margin-top: 4px;
}

.primago-form__hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.primago-form__submit {
	border: none;
	cursor: pointer;
	justify-self: start;
	min-height: 44px;
	padding: 12px 26px;
	font-size: 0.9375rem;
}

.primago-form-notice {
	padding: 16px 20px;
	border-radius: 4px;
	margin-bottom: 24px;
	border-left: 3px solid;
}

.primago-form-notice p {
	margin: 0;
}

.primago-form-notice p + p {
	margin-top: 4px;
}

.primago-form-notice--success {
	background: #f2f9f4;
	border-color: var(--wp--preset--color--success);
}

.primago-form-notice--error {
	background: #fbf1ef;
	border-color: var(--wp--preset--color--error);
}

/* ---------------------------------------------------------------
   Tablet
   --------------------------------------------------------------- */
@media (max-width: 1024px) {
	.promo__panel {
		left: 24px;
		width: min(50%, 380px);
		padding: 20px 22px;
	}
}

/* ---------------------------------------------------------------
   Mobile
   --------------------------------------------------------------- */
@media (max-width: 781px) {
	.promo-rail,
	.categories-section,
	.products-section {
		padding-top: 24px !important;
		padding-bottom: 32px !important;
	}

	/* The panel stops overlaying and stacks under a squarer crop: a 3.2:1 strip
	   plus overlaid text is unreadable at phone widths, and overlaying would
	   force the hero far taller than it needs to be. */
	.promo {
		background: var(--wp--preset--color--base);
		border: 1px solid var(--wp--preset--color--neutral-200);
	}

	/* Mobile is an intentional centred crop. object-fit is restated so this stays
	   cover even if the desktop rule above is ever changed. */
	.promo__media img {
		aspect-ratio: 16 / 9;
		object-fit: cover;
	}

	.promo__panel {
		position: static;
		transform: none;
		width: auto;
		padding: 18px 18px 20px;
		border-radius: 0;
	}

	.promo__heading {
		font-size: 1.5rem;
	}

	.promo__actions .wp-block-button,
	.promo__actions .wp-block-button__link {
		width: 100%;
		text-align: center;
	}

	.section-head {
		gap: 4px 16px;
	}

	.cat-tiles {
		grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
		gap: 10px;
	}

	.cat-tile__name {
		padding: 8px 10px 9px;
	}

	/* Product page: gallery first, then info — matches the block order. */
	.product-page {
		padding-bottom: 48px;
	}

	.product-hero {
		gap: 24px;
		margin-bottom: 40px;
	}

	/* No height cap here: the 1:1 aspect-ratio box already scales with the
	   column width, and a max-height would reintroduce per-slide height
	   differences on mobile. */

	.product-hero__media .flex-control-thumbs li {
		width: 56px;
	}

	.product-price {
		font-size: 1.5rem;
	}

	.product-atc form.cart {
		gap: 10px;
	}

	.product-atc button.single_add_to_cart_button {
		flex: 1 1 100%;
	}

	.product-section {
		padding-top: 32px;
	}

	.product-section + .product-section {
		margin-top: 32px;
	}

	.primago-form__grid {
		grid-template-columns: 1fr;
	}

	.primago-form__submit {
		align-self: stretch;
		text-align: center;
	}
}

/* ---------------------------------------------------------------
   Formularz kontaktowy (Contact Form 7)
   Te same tokeny co reszta witryny, żeby nie było widać, że to wtyczka.
   --------------------------------------------------------------- */
.contact-form-section {
	margin-top: 28px;
}

.content-page .contact-form-section h2 {
	margin: 0 0 14px !important;
	font-size: 1.0625rem !important;
}

.contact-form-section .wpcf7-form p {
	margin: 0 0 14px;
}

/* Imię i e-mail obok siebie na desktopie. */
.contact-form-section .cf-row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 16px;
}

.contact-form-section .cf-field label {
	display: block;
	margin-bottom: 5px;
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	color: var(--wp--preset--color--neutral-500);
}

.cf-req {
	color: var(--wp--preset--color--primary-dark);
}

.contact-form-section input[type="text"],
.contact-form-section input[type="email"],
.contact-form-section textarea {
	width: 100%;
	padding: 9px 12px;
	font-family: inherit;
	font-size: 0.9375rem;
	line-height: 1.45;
	color: var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--neutral-200);
	border-radius: 5px;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.contact-form-section input[type="text"],
.contact-form-section input[type="email"] {
	height: 42px;
}

.contact-form-section input:focus,
.contact-form-section textarea:focus {
	outline: none;
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 0 0 3px rgba(245, 163, 0, 0.16);
}

.contact-form-section textarea {
	resize: vertical;
	min-height: 120px;
}

/* Zgoda RODO — mniejsza, wyraźnie podrzędna wobec pól. */
.contact-form-section .cf-consent {
	display: flex;
	gap: 9px;
	align-items: flex-start;
	font-size: 0.8125rem;
	line-height: 1.5;
	color: var(--wp--preset--color--neutral-500);
}

.contact-form-section .cf-consent .wpcf7-list-item {
	margin: 0;
}

.contact-form-section .cf-consent input[type="checkbox"] {
	margin-top: 2px;
	accent-color: var(--wp--preset--color--primary);
}

.contact-form-section .cf-consent a {
	color: var(--wp--preset--color--contrast);
	font-weight: 600;
}

.contact-form-section .cf-submit {
	margin-top: 18px;
}

.contact-form-section input[type="submit"] {
	min-height: 44px;
	padding: 0 26px;
	font-family: inherit;
	font-size: 0.9375rem;
	font-weight: 600;
	color: var(--wp--preset--color--contrast);
	background: var(--wp--preset--color--primary);
	border: none;
	border-radius: 5px;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.contact-form-section input[type="submit"]:hover {
	background: var(--wp--preset--color--primary-dark);
}

/* Komunikaty wtyczki — spłaszczone do stylu witryny zamiast domyślnych ramek. */
.contact-form-section .wpcf7-response-output {
	margin: 16px 0 0 !important;
	padding: 11px 14px !important;
	font-size: 0.875rem;
	border: 1px solid var(--wp--preset--color--neutral-200) !important;
	border-left: 3px solid var(--wp--preset--color--neutral-500) !important;
	border-radius: 4px;
	background: var(--wp--preset--color--neutral-100);
}

.contact-form-section .wpcf7-form.sent .wpcf7-response-output {
	border-left-color: var(--wp--preset--color--success) !important;
}

.contact-form-section .wpcf7-form.invalid .wpcf7-response-output,
.contact-form-section .wpcf7-form.failed .wpcf7-response-output {
	border-left-color: var(--wp--preset--color--error) !important;
}

.contact-form-section .wpcf7-not-valid-tip {
	margin-top: 4px;
	font-size: 0.8125rem;
	color: var(--wp--preset--color--error);
}

.contact-form-section .wpcf7-not-valid {
	border-color: var(--wp--preset--color--error);
}

@media (max-width: 781px) {
	.contact-form-section .cf-row {
		grid-template-columns: minmax(0, 1fr);
	}
}

.woocommerce-checkout table.shop_table .select-paczkomat-button {
	display: block !important;
	width: 100% !important;
	margin-top: 10px !important;
	padding: 14px 20px !important;
	font-size: 1rem !important;
	font-weight: 700 !important;
	text-align: center !important;
	background: #ffcb03 !important;
	color: #1a1a1a !important;
	border: none !important;
	border-radius: 6px !important;
	cursor: pointer !important;
}

.woocommerce-checkout table.shop_table .select-paczkomat-button:hover {
	background: #e6b700 !important;
}

#widget-modal #widget-modal__map {
	position: fixed !important;
	top: 50% !important;
	left: 50% !important;
	transform: translate(-50%, -50%) !important;
	margin: 0 !important;
	max-width: 900px !important;
	max-height: 90vh !important;
	width: 95vw !important;
	height: 90vh !important;
}