/* ------------------------------------------------------------------ */
/* Category page v2 – header, sidebar filters, sorting (mockup stage 2) */
/* Loaded only when dbp_archive_v2_enabled(); everything is scoped to  */
/* .dbp-archive--v2 so the current page is untouched while it is off.  */
/* ------------------------------------------------------------------ */

.dbp-archive--v2 {
	--a2-accent: var(--dbp-color-accent, #00665e);
	--a2-accent-strong: var(--dbp-color-accent-strong, #00514b);
	--a2-accent-900: #003b37;
	--a2-accent-soft: var(--dbp-color-accent-soft, #e6f3f2);
	--a2-heading: var(--dbp-color-heading, #1f2937);
	--a2-text: var(--dbp-color-text, #334155);
	--a2-muted: #556477;
	--a2-border: var(--dbp-color-border, #e2e8f0);
	--a2-border-strong: var(--dbp-color-border-strong, #cbd5e1);
	--a2-gold: #b7791f;
	--a2-sticky-top: var(--dbp-archive-sticky-top, 72px);

	position: relative;
	max-width: var(--dbp-container);
	margin-inline: auto;
}

/* ---------- Header ---------- */
.dbp-archive--v2 .dbp-archive__head {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 400px);
	gap: 28px;
	align-items: center;
	padding: 14px 0 18px;
	border-bottom: 1px solid var(--a2-border);
}

.dbp-archive--v2 .dbp-archive__head--no-media {
	grid-template-columns: minmax(0, 1fr);
}

.dbp-archive--v2 .dbp-archive__head-copy {
	min-width: 0;
}

.dbp-archive--v2 .dbp-archive__breadcrumbs {
	margin: 0 0 6px;
	font-size: 12px;
}

.dbp-archive--v2 .dbp-archive__breadcrumbs,
.dbp-archive--v2 .dbp-archive__breadcrumbs * {
	font-size: 12px;
	text-transform: none;
	letter-spacing: 0;
}

.dbp-archive--v2 .dbp-archive__title {
	margin: 0 0 6px;
	font-size: clamp(24px, 2.4vw, 30px);
	line-height: 1.2;
	color: var(--a2-heading);
	text-transform: none;
	letter-spacing: -0.01em;
}

.dbp-archive--v2 .dbp-archive__title-meta {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 6px;
	margin-left: 10px;
	font-size: 14px;
	font-weight: 500;
	color: var(--a2-muted);
	letter-spacing: 0;
	vertical-align: middle;
}

.dbp-archive--v2 .dbp-archive__title-rating {
	display: inline-flex;
	align-items: baseline;
	gap: 6px;
}

.dbp-archive--v2 .dbp-archive__title-rating i {
	font-style: normal;
	color: var(--a2-gold);
}

.dbp-archive--v2 .dbp-archive__hero-desc {
	max-width: 62ch;
}

.dbp-archive--v2 .dbp-archive__hero-desc-content {
	font-size: 14px;
	line-height: 1.6;
	color: var(--a2-text);
}

.dbp-archive--v2 .dbp-archive__hero-desc-content p {
	margin: 0;
}

.dbp-archive--v2 .dbp-archive__hero-desc:not(.is-expanded) .dbp-archive__hero-desc-content {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.dbp-archive--v2 .dbp-archive__hero-toggle {
	text-transform: none;
	letter-spacing: 0;
	margin-top: 4px;
	padding: 0;
	border: 0;
	background: none;
	font-size: 13px;
	font-weight: 600;
	color: var(--a2-accent);
	cursor: pointer;
}

.dbp-archive--v2 .dbp-archive__head-media {
	margin: 0;
	height: 128px;
	border-radius: 12px;
	overflow: hidden;
	background: var(--a2-accent-soft);
}

.dbp-archive--v2 .dbp-archive__head-media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ---------- Toolbar: sorting above the grid, next to the active filters (desktop); sticky bar (phone) ---------- */
.dbp-archive--v2 .dbp-archive__toolbar--v2 {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	margin: 0 0 14px;
	padding: 0;
	border: 0;
	background: none;
	box-shadow: none;
}

@media (min-width: 961px) {
	/* Row 1 of the product column: active filter chips left, sorting right; everything else full width below. */
	.dbp-archive--v2 .dbp-archive__content {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		column-gap: 16px;
		align-content: start;
	}

	.dbp-archive--v2 .dbp-archive__content > * {
		grid-column: 1 / -1;
		min-width: 0;
	}

	.dbp-archive--v2 .dbp-archive__content > .dbp-archive__toolbar--v2 {
		grid-column: 2;
		grid-row: 1;
		align-self: start;
	}

	.dbp-archive--v2 .dbp-archive__content > .dbp-archive__applied-wrap {
		grid-column: 1;
		grid-row: 1;
		align-self: center;
		margin: 0 0 14px;
	}

}

/* Phone quick picks (toggle the matching checkbox in the filter panel). */
.dbp-archive--v2 .dbp-archive__quick {
	display: flex;
	gap: 6px;
	margin: 0 -16px;
	padding: 0 16px 8px;
	overflow-x: auto;
	scrollbar-width: none;
	-webkit-mask-image: linear-gradient(90deg, #000 92%, transparent);
	mask-image: linear-gradient(90deg, #000 92%, transparent);
}

.dbp-archive--v2 .dbp-archive__quick::-webkit-scrollbar {
	display: none;
}

.dbp-archive--v2 .dbp-archive__quick-chip {
	display: inline-flex;
	flex: none;
	align-items: center;
	gap: 6px;
	height: 36px;
	min-height: 36px; /* global touch rule gives buttons 48px */
	margin: 0;
	padding: 0 12px;
	border: 1px solid var(--a2-border-strong);
	border-radius: 999px;
	background: #fff;
	color: var(--a2-heading);
	font-size: 12.5px;
	font-weight: 500;
	line-height: 1;
	text-transform: none;
	letter-spacing: 0;
	white-space: nowrap;
	box-shadow: none;
	cursor: pointer;
}

.dbp-archive--v2 .dbp-archive__quick-chip em {
	font-style: normal;
	font-size: 11.5px;
	color: var(--a2-muted);
}

.dbp-archive--v2 .dbp-archive__quick-chip.is-on {
	border-color: var(--a2-accent);
	background: var(--a2-accent);
	color: #fff;
}

.dbp-archive--v2 .dbp-archive__quick-chip.is-on em {
	color: rgba(255, 255, 255, 0.8);
}

.dbp-archive--v2 .dbp-archive__quick-chip:disabled {
	opacity: 0.45;
	cursor: default;
}

@media (min-width: 961px) {
	.dbp-archive--v2 .dbp-archive__quick {
		display: none;
	}
}

.dbp-archive--v2 .dbp-archive__toolbar--v2 .dbp-archive__mobile-filters {
	display: none;
}

.dbp-archive--v2 .dbp-archive__sort-trigger {
	min-height: 36px;
	padding: 0 12px;
	border: 1px solid var(--a2-border-strong);
	border-radius: 10px;
	background: #fff;
	font-size: 13px;
	font-weight: 500;
	color: var(--a2-heading);
}

/* ---------- Layout: sidebar + products ---------- */
.dbp-archive--v2 .dbp-archive__layout,
.dbp-archive--v2.has-filters-open .dbp-archive__layout {
	grid-template-columns: minmax(0, 1fr);
	gap: 24px;
	margin-top: 16px;
}

@media (min-width: 961px) {
	.dbp-archive--v2 .dbp-archive__layout.has-sidebar,
	.dbp-archive--v2.has-filters-open .dbp-archive__layout.has-sidebar {
		grid-template-columns: 250px minmax(0, 1fr);
	}

	/* The sidebar is always visible on desktop – the JS drawer only matters on phones. */
	.dbp-archive--v2 .dbp-archive__filters--v2,
	.dbp-archive--v2 .dbp-archive__filters--v2[hidden] {
		display: block;
		position: sticky;
		top: calc(var(--a2-sticky-top) + 12px);
		max-height: calc(100vh - var(--a2-sticky-top) - 24px);
		overflow-y: auto;
		overscroll-behavior: contain;
		scrollbar-width: none;
		padding: 0 0 28px;
		border: 0;
		border-radius: 0;
		box-shadow: none;
		background: transparent;
		transform: none;
		-webkit-mask-image: linear-gradient(180deg, #000 calc(100% - 36px), transparent);
		mask-image: linear-gradient(180deg, #000 calc(100% - 36px), transparent);
	}

	.dbp-archive--v2 .dbp-archive__filters--v2::-webkit-scrollbar {
		display: none;
	}

	.dbp-archive--v2 .dbp-archive__filters-close,
	.dbp-archive--v2 .dbp-archive__filters-foot {
		display: none;
	}

	.dbp-archive--v2 .dbp-archive__overlay {
		display: none !important;
	}
}

@media (min-width: 961px) and (max-width: 1199px) {
	.dbp-archive--v2 .dbp-archive__layout.has-sidebar,
	.dbp-archive--v2.has-filters-open .dbp-archive__layout.has-sidebar {
		grid-template-columns: 240px minmax(0, 1fr);
		gap: 20px;
	}

	.dbp-archive--v2 .dbp-archive__head {
		grid-template-columns: minmax(0, 1fr) minmax(0, 300px);
		gap: 24px;
	}

}

/* ---------- Filters panel ---------- */
.dbp-archive--v2 .dbp-archive__filters-head {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 4px;
	padding: 0 4px 10px;
	border-bottom: 1px solid var(--a2-border);
}

.dbp-archive--v2 .dbp-archive__filters-head h2 {
	margin: 0;
	font-size: 15px;
	color: var(--a2-heading);
}

.dbp-archive--v2 .dbp-archive__filters-clear {
	display: inline-flex;
	align-items: center;
	min-height: 24px;
	margin-left: auto;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--a2-accent);
}

.dbp-archive--v2 .dbp-archive__filters-close {
	display: none;
	place-items: center;
	flex: none;
	width: 36px;
	height: 36px;
	min-width: 36px;
	min-height: 36px; /* global touch rule gives buttons 48px – the circle became an oval */
	padding: 0;
	line-height: 1;
	margin-left: auto;
	border: 0;
	border-radius: 50%;
	background: var(--a2-accent-soft);
	color: var(--a2-accent-900);
	font-size: 15px;
	cursor: pointer;
}

.dbp-archive--v2 .dbp-archive__filters-clear[hidden] {
	display: none;
}

.dbp-archive--v2 .dbp-archive__filters-clear:not([hidden]) + .dbp-archive__filters-close {
	margin-left: 12px;
}

@media (max-width: 960px) {
	.dbp-archive--v2 .dbp-archive__filters-clear {
		min-height: 36px;
		padding: 0 4px;
		font-size: 13px;
	}
}

.dbp-archive--v2 .dbp-archive__filters-form {
	gap: 0;
}

/* "Tylko dostępne" switch */
.dbp-archive--v2 .dbp-archive__switch {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 4px;
	border-bottom: 1px solid var(--a2-border);
	font-size: 13.5px;
	font-weight: 500;
	color: var(--a2-heading);
	cursor: pointer;
}

.dbp-archive--v2 .dbp-archive__switch input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
}

.dbp-archive--v2 .dbp-archive__switch-track {
	position: relative;
	flex: none;
	width: 34px;
	height: 20px;
	border-radius: 999px;
	background: var(--a2-border-strong);
	transition: background-color 0.15s ease;
}

.dbp-archive--v2 .dbp-archive__switch-track::after {
	content: '';
	position: absolute;
	top: 2px;
	left: 2px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
	transition: transform 0.15s ease;
}

.dbp-archive--v2 .dbp-archive__switch input:checked + .dbp-archive__switch-track {
	background: var(--a2-accent);
}

.dbp-archive--v2 .dbp-archive__switch input:checked + .dbp-archive__switch-track::after {
	transform: translateX(14px);
}

.dbp-archive--v2 .dbp-archive__switch input:focus-visible + .dbp-archive__switch-track {
	outline: 3px solid var(--a2-accent);
	outline-offset: 2px;
}

/* Groups */
.dbp-archive--v2 .dbp-archive__filter-group {
	gap: 0;
	padding: 6px 0 10px;
	border-bottom: 1px solid #eef2f4;
}

.dbp-archive--v2 .dbp-archive__filter-toggle {
	display: flex;
	align-items: center;
	gap: 8px;
	min-height: 40px;
	padding: 6px 4px;
	border: 0;
	background: none;
	box-shadow: none;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--a2-heading);
	cursor: pointer;
}

.dbp-archive--v2 .dbp-archive__filter-toggle > span:first-child {
	text-align: left;
	font-size: 13.5px;
	font-weight: 600;
	text-transform: none;
	letter-spacing: 0;
}

.dbp-archive--v2 .dbp-archive__filter-toggle-icon {
	margin-left: auto;
}

.dbp-archive--v2 .dbp-archive__filter-selected {
	display: inline-grid;
	place-items: center;
	min-width: 18px;
	height: 18px;
	padding: 0 5px;
	border-radius: 9px;
	background: var(--a2-accent);
	color: #fff;
	font-size: 11px;
}

.dbp-archive--v2 .dbp-archive__filter-panel {
	padding: 2px 0 0;
}

.dbp-archive--v2 .dbp-archive__filter-options {
	display: grid;
	gap: 0;
	max-height: none;
	overflow: visible;
	padding: 0;
}

.dbp-archive--v2 .dbp-archive__filter-option {
	display: grid;
	grid-template-columns: 18px minmax(0, 1fr) auto;
	align-items: center;
	gap: 10px;
	min-height: 34px;
	padding: 6px 4px;
	border: 0;
	border-radius: 8px;
	background: none;
	transform: none;
	cursor: pointer;
}

.dbp-archive--v2 .dbp-archive__filter-option:hover {
	background: var(--a2-accent-soft);
	transform: none;
}

.dbp-archive--v2 .dbp-archive__filter-option.is-collapsed {
	display: none;
}

.dbp-archive--v2 .dbp-archive__filter-option input {
	position: absolute;
	opacity: 0;
	width: 1px;
	height: 1px;
	margin: 0;
}

.dbp-archive--v2 .dbp-archive__check {
	width: 18px;
	height: 18px;
	border: 1.5px solid var(--a2-border-strong);
	border-radius: 5px;
	background: #fff;
	transition: background-color 0.12s ease, border-color 0.12s ease;
}

.dbp-archive--v2 .dbp-archive__filter-option input:checked + .dbp-archive__check {
	border-color: var(--a2-accent);
	background: var(--a2-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px no-repeat;
}

.dbp-archive--v2 .dbp-archive__filter-option input:focus-visible + .dbp-archive__check {
	outline: 3px solid var(--a2-accent);
	outline-offset: 2px;
}

.dbp-archive--v2 .dbp-archive__filter-option .dbp-archive__filter-name {
	font-size: 13.5px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--a2-text);
}

.dbp-archive--v2 .dbp-archive__filter-option:has(input:checked) .dbp-archive__filter-name {
	font-weight: 600;
	color: var(--a2-heading);
}

.dbp-archive--v2 .dbp-archive__filter-option small {
	font-size: 12px;
	font-weight: 400;
	color: var(--a2-muted);
	font-variant-numeric: tabular-nums;
}

.dbp-archive--v2 .dbp-archive__filter-option.is-disabled {
	opacity: 0.45;
	background: none;
	cursor: default;
}

.dbp-archive--v2 .dbp-archive__filter-more {
	display: inline-flex;
	align-items: center;
	min-height: 28px;
	margin: 2px 0 0 4px;
	padding: 0;
	border: 0;
	background: none;
	font-size: 12.5px;
	font-weight: 600;
	color: var(--a2-accent);
	cursor: pointer;
}

.dbp-archive--v2 .dbp-archive__filter-search-wrap,
.dbp-archive--v2 .dbp-archive__filter-empty {
	display: none !important;
}

.dbp-archive--v2 .dbp-archive__price-fields {
	padding: 4px;
}

/* Active filters above the grid */
.dbp-archive--v2 .dbp-archive__applied-wrap {
	margin: 0 0 12px;
}

.dbp-archive--v2 .dbp-archive__applied {
	gap: 6px;
	margin: 0;
	padding: 0;
}

.dbp-archive--v2 .dbp-archive__applied .dbp-archive__chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 34px;
	height: 34px;
	padding: 0 12px;
	border: 1px solid var(--a2-accent);
	border-radius: 999px;
	background: var(--a2-accent-soft);
	color: var(--a2-accent-900);
	font-size: 13px;
	font-weight: 500;
	line-height: 1;
	text-transform: none;
	letter-spacing: 0;
}

.dbp-archive--v2 .dbp-archive__applied .dbp-archive__chip--clear {
	border-color: transparent;
	background: none;
	color: var(--a2-accent);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ---------- Phones / tablets ---------- */
@media (max-width: 960px) {
	.dbp-archive--v2 .dbp-archive__head {
		grid-template-columns: minmax(0, 1fr);
		padding: 10px 0 12px;
		border-bottom: 0;
	}

	.dbp-archive--v2 .dbp-archive__head-copy {
		padding-right: 0;
	}

	.dbp-archive--v2 .dbp-archive__head-media {
		display: none;
	}

	.dbp-archive--v2 .dbp-archive__title {
		font-size: 24px;
	}

	.dbp-archive--v2 .dbp-archive__title-meta {
		display: flex;
		margin: 4px 0 0;
		font-size: 13px;
	}

	.dbp-archive--v2 .dbp-archive__hero-desc-content {
		font-size: 13px;
	}

	.dbp-archive--v2 .dbp-archive__toolbar--v2 {
		position: sticky;
		top: var(--a2-sticky-top);
		right: auto;
		z-index: 25;
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		align-items: center;
		gap: 8px;
		margin: 0 -16px 12px; /* the bar's bottom line must not touch the first row of cards */
		padding: 8px 16px;
		background: rgba(255, 255, 255, 0.97);
		border-bottom: 1px solid var(--a2-border);
	}

	.dbp-archive--v2 .dbp-archive__toolbar--v2 .dbp-archive__mobile-filters {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		gap: 6px;
		width: 100%;
		min-height: 40px;
		margin: 0;
		padding: 0 12px;
		border: 1px solid var(--a2-border-strong);
		border-radius: 10px;
		background: #fff;
		color: var(--a2-heading);
		font-size: 13px;
		font-weight: 600;
		box-shadow: none;
	}

	.dbp-archive--v2 .dbp-archive__toolbar--v2 .dbp-archive__mobile-filters svg {
		color: var(--a2-accent);
	}

	.dbp-archive--v2 .dbp-archive__filters-count {
		display: inline-grid;
		place-items: center;
		min-width: 18px;
		height: 18px;
		padding: 0 5px;
		border-radius: 9px;
		background: var(--a2-accent);
		color: #fff;
		font-size: 11px;
	}

	.dbp-archive--v2 .dbp-archive__sorting,
	.dbp-archive--v2 .dbp-archive__sort,
	.dbp-archive--v2 .dbp-archive__sort-dropdown {
		width: 100%;
		min-width: 0;
	}

	/* .dbp-archive__sort is a column with a 12px gap before the (empty) native form – it made the sort
	   button sit 6px higher than "Filtry". */
	.dbp-archive--v2 .dbp-archive__sort {
		gap: 0;
	}

	.dbp-archive--v2 .dbp-archive__sort-caret {
		display: none;
	}

	.dbp-archive--v2 .dbp-archive__sort-trigger {
		justify-content: center;
		width: 100%;
		min-height: 40px;
		gap: 6px;
		font-weight: 600;
	}

	.dbp-archive--v2 .dbp-archive__sort-trigger::before {
		content: '';
		flex: none;
		width: 17px;
		height: 17px;
		background: var(--a2-accent);
		-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 4v16M3 16l4 4 4-4M17 20V4M13 8l4-4 4 4'/%3E%3C/svg%3E") center / contain no-repeat;
		mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 4v16M3 16l4 4 4-4M17 20V4M13 8l4-4 4 4'/%3E%3C/svg%3E") center / contain no-repeat;
	}

	.dbp-archive--v2 .dbp-archive__sort-current {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.dbp-archive--v2 .dbp-archive__sort-menu {
		right: 0;
		left: auto;
		min-width: 220px;
	}

	.dbp-archive--v2 .dbp-archive__layout,
	.dbp-archive--v2.has-filters-open .dbp-archive__layout {
		width: 100%;
		margin-top: 12px;
	}

	/* Bigger touch targets for the small text links in the header. */
	.dbp-archive--v2 .dbp-archive__breadcrumbs a {
		display: inline-block;
		padding: 8px 0;
		margin: -8px 0;
	}

	.dbp-archive--v2 .dbp-archive__hero-toggle {
		padding: 8px 0;
		margin: -4px 0 -8px;
	}

	/* Active filters: one swipeable row (as in the mockup) instead of 2–3 wrapped lines above the grid. */
	.dbp-archive--v2 .dbp-archive__applied {
		flex-wrap: nowrap;
		margin: 0 -16px;
		padding: 0 16px;
		overflow-x: auto;
		scrollbar-width: none;
	}

	.dbp-archive--v2 .dbp-archive__applied::-webkit-scrollbar {
		display: none;
	}

	.dbp-archive--v2 .dbp-archive__applied .dbp-archive__chip {
		flex: none;
		white-space: nowrap;
	}

	/* "Wyczyść wszystko" first: at the end of a swipeable row it was often off screen. */
	.dbp-archive--v2 .dbp-archive__applied .dbp-archive__chip--clear {
		order: -1;
		padding: 0 4px;
	}

	/* The drawer is modal: the phone bottom bar (z-index 1300) would cover its "Pokaż N" button. */
	body.dbp-archive-filters-open .dbp-mobile-bottom-nav {
		display: none;
	}

	/* Drawer (existing bottom sheet): sticky header, close button and "Pokaż N produktów" button. */
	.dbp-archive--v2 .dbp-archive__filters-close {
		display: grid;
	}

	.dbp-archive--v2 .dbp-archive__filters--v2 {
		padding: 0 16px;
	}

	.dbp-archive--v2 .dbp-archive__filters--v2 .dbp-archive__filters-head {
		position: sticky;
		top: 0;
		z-index: 2;
		margin: 0 -16px;
		padding: 14px 16px 10px;
		background: #fff;
	}

	.dbp-archive--v2 .dbp-archive__filters-foot {
		position: sticky;
		bottom: 0;
		z-index: 2;
		margin: 8px -16px 0;
		padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
		background: #fff;
		border-top: 1px solid var(--a2-border);
	}

	.dbp-archive--v2 .dbp-archive__filters-apply {
		width: 100%;
		min-height: 44px;
		border: 0;
		border-radius: 10px;
		background: var(--a2-accent);
		color: #fff;
		font-size: 14px;
		font-weight: 600;
		cursor: pointer;
	}

	.dbp-archive--v2 .dbp-archive__filter-option {
		min-height: 40px;
	}
}

/* The old CSS drops to 2 columns up to 1120px; with the 240px sidebar 3 columns still give ~210px+ cards. */
@media (min-width: 601px) and (max-width: 1120px) {
	.dbp-archive--v2 .dbp-archive__products .products,
	.woocommerce .dbp-archive--v2 .dbp-archive__products ul.products {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* Small category without the sidebar: 4 columns on wide screens instead of three 380px cards. */
@media (min-width: 1121px) {
	.dbp-archive--v2 .dbp-archive__layout:not(.has-sidebar) .dbp-archive__products .products,
	.woocommerce .dbp-archive--v2 .dbp-archive__layout:not(.has-sidebar) .dbp-archive__products ul.products {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

/* ---------- Stage 3: in-feed banners, cosmetologist row, end card ---------- */
.dbp-archive--v2 .dbp-archive__products ul.products,
.woocommerce .dbp-archive--v2 .dbp-archive__products ul.products {
	grid-auto-flow: row dense; /* a 2-cell banner must not leave a hole before it */
}

.dbp-archive--v2 .dbp-v2-bn {
	--bn-bg: #f3f5f6;
	--bn-text: var(--a2-heading);
	--bn-sub: var(--a2-text);
	--bn-eyebrow: var(--a2-accent);
	--bn-line: var(--a2-border);
	--bn-btn-bg: var(--a2-accent);
	--bn-btn-text: #fff;
	position: relative;
	display: flex;
	flex-direction: column;
	min-width: 0;
	margin: 0;
	padding: 0;
	list-style: none;
	border-radius: var(--dbp-v2-card-radius, 14px);
	overflow: hidden;
	background: var(--bn-bg);
	color: var(--bn-text);
	box-shadow: inset 0 0 0 1px var(--bn-line);
	transition: box-shadow 0.2s ease;
}

.dbp-archive--v2 .dbp-v2-bn:hover {
	box-shadow: inset 0 0 0 1px var(--bn-line), 0 12px 28px rgba(2, 6, 23, 0.1);
}

.dbp-archive--v2 .dbp-v2-bn--dark {
	--bn-text: #fff;
	--bn-sub: rgba(255, 255, 255, 0.86);
	--bn-eyebrow: #9fe0d6;
	--bn-line: transparent;
	--bn-btn-bg: #fff;
	--bn-btn-text: var(--a2-accent-900);
}

.dbp-archive--v2 .dbp-v2-bn--row {
	--bn-bg: var(--a2-accent-900);
}

.dbp-archive--v2 .dbp-v2-bn__media {
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	background: #e9eded;
}

.dbp-archive--v2 .dbp-v2-bn__media picture {
	display: contents;
}

.dbp-archive--v2 .dbp-v2-bn__media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	object-fit: cover;
	border-radius: 0;
	transition: transform 0.5s ease;
}

.dbp-archive--v2 .dbp-v2-bn:hover .dbp-v2-bn__media img {
	transform: scale(1.03);
}

.dbp-archive--v2 .dbp-v2-bn--pack .dbp-v2-bn__media {
	background: transparent;
}

.dbp-archive--v2 .dbp-v2-bn--pack .dbp-v2-bn__media img {
	object-fit: contain;
	padding: 6%;
	mix-blend-mode: multiply;
}

.dbp-archive--v2 .dbp-v2-bn__badge {
	position: absolute;
	top: 10px;
	left: 10px;
	z-index: 1;
	padding: 4px 9px;
	border-radius: 999px;
	background: #b42318;
	color: #fff;
	font-size: 11.5px;
	font-weight: 600;
}

.dbp-archive--v2 .dbp-v2-bn__body {
	position: relative;
	z-index: 1;
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
	padding: 12px 16px 16px;
}

.dbp-archive--v2 .dbp-v2-bn__top {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 10px;
}

.dbp-archive--v2 .dbp-v2-bn__eyebrow {
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--bn-eyebrow);
}

.dbp-archive--v2 .dbp-v2-bn__date {
	display: inline-flex;
	align-items: center;
	height: 24px;
	padding: 0 10px;
	border-radius: 999px;
	background: #b42318;
	color: #fff;
	font-size: 11.5px;
	font-weight: 600;
}

.dbp-archive--v2 .dbp-v2-bn__title {
	display: -webkit-box;
	margin: 0;
	overflow: hidden;
	color: var(--bn-text);
	font-size: 18px;
	font-weight: 700;
	line-height: 1.3;
	text-transform: none;
	letter-spacing: 0;
	text-wrap: balance;
	overflow-wrap: anywhere;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
}

.dbp-archive--v2 .dbp-v2-bn__line {
	display: -webkit-box;
	margin: 0;
	overflow: hidden;
	color: var(--bn-sub);
	font-size: 13.5px;
	line-height: 1.5;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.dbp-archive--v2 .dbp-v2-bn__cta {
	margin-top: auto;
	padding-top: 8px;
}

.dbp-archive--v2 .dbp-v2-bn__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	min-height: 40px;
	padding: 0 16px;
	border-radius: 10px;
	background: var(--bn-btn-bg);
	color: var(--bn-btn-text);
	font-size: 13.5px;
	font-weight: 600;
	text-transform: none;
	letter-spacing: 0;
}

.dbp-archive--v2 .dbp-v2-bn__btn svg {
	flex: none;
	transition: transform 0.2s ease;
}

.dbp-archive--v2 .dbp-v2-bn:hover .dbp-v2-bn__btn svg {
	transform: translateX(3px);
}

.dbp-archive--v2 .dbp-v2-bn__hit {
	position: absolute;
	inset: 0;
	z-index: 2;
	border-radius: inherit;
}

.dbp-archive--v2 .dbp-v2-bn__hit:focus-visible {
	outline: 3px solid var(--a2-accent);
	outline-offset: -3px;
}

/* Wide banner (2 cells) and the end card when it spans several cells: text left, photo right. */
.dbp-archive--v2 .dbp-v2-bn--wide,
.dbp-archive--v2 .dbp-v2-bn--pack.is-wide {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
}

.dbp-archive--v2 .dbp-v2-bn--wide {
	grid-column: span 2;
}

/* 3 columns: 2 of 3 cells left a hole next to every wide banner – the end card can fill only one of them. */
@media (min-width: 601px) and (max-width: 1120px) {
	.dbp-archive--v2 .dbp-v2-bn--wide {
		grid-column: 1 / -1;
	}
}

.dbp-archive--v2 .dbp-v2-bn--wide .dbp-v2-bn__media,
.dbp-archive--v2 .dbp-v2-bn--pack.is-wide .dbp-v2-bn__media {
	order: 2;
	aspect-ratio: auto;
	min-height: 100%;
}

.dbp-archive--v2 .dbp-v2-bn--wide .dbp-v2-bn__body,
.dbp-archive--v2 .dbp-v2-bn--pack.is-wide .dbp-v2-bn__body {
	justify-content: center;
	gap: 12px;
	padding: 32px 12px 32px 32px;
}

.dbp-archive--v2 .dbp-v2-bn--wide .dbp-v2-bn__title,
.dbp-archive--v2 .dbp-v2-bn--pack.is-wide .dbp-v2-bn__title {
	max-width: 13em;
	font-size: 26px;
	line-height: 1.2;
	letter-spacing: -0.01em;
}

.dbp-archive--v2 .dbp-v2-bn--wide .dbp-v2-bn__line {
	max-width: 26em;
	font-size: 14.5px;
	-webkit-line-clamp: 3;
}

.dbp-archive--v2 .dbp-v2-bn--wide .dbp-v2-bn__btn,
.dbp-archive--v2 .dbp-v2-bn--row .dbp-v2-bn__btn,
.dbp-archive--v2 .dbp-v2-bn--pack.is-wide .dbp-v2-bn__btn {
	width: auto;
	padding: 0 22px;
}

/* End card over several cells: two equal halves, the set photo large and centred, text not squeezed. */
.dbp-archive--v2 .dbp-v2-bn--pack.is-wide {
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.dbp-archive--v2 .dbp-v2-bn--pack.is-wide .dbp-v2-bn__media img {
	padding: 4%;
}

.dbp-archive--v2 .dbp-v2-bn--pack.is-wide .dbp-v2-bn__title {
	max-width: none;
}

.dbp-archive--v2 .dbp-v2-bn--pack.is-wide .dbp-v2-bn__line {
	-webkit-line-clamp: 3;
}

/* Light wide banner: the photo fades into the banner colour instead of a hard edge. */
.dbp-archive--v2 .dbp-v2-bn--wide.dbp-v2-bn--light .dbp-v2-bn__media {
	margin-left: -18%;
	background: transparent;
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 32%);
	mask-image: linear-gradient(90deg, transparent 0, #000 32%);
}

.dbp-archive--v2 .dbp-v2-bn--wide.dbp-v2-bn--dark .dbp-v2-bn__media {
	margin: 14px 14px 14px 0;
	min-height: calc(100% - 28px);
	border-radius: 10px;
}

.dbp-archive--v2 .dbp-v2-bn--wide.is-no-media {
	grid-template-columns: minmax(0, 1fr);
}

/* Full-row banner: virtual cosmetologist. */
.dbp-archive--v2 .dbp-v2-bn--row {
	display: grid;
	grid-column: 1 / -1;
	grid-template-columns: minmax(0, 1fr) 36%;
}

.dbp-archive--v2 .dbp-v2-bn--row .dbp-v2-bn__media {
	order: 2;
	aspect-ratio: auto;
	min-height: 220px;
}

.dbp-archive--v2 .dbp-v2-bn--row .dbp-v2-bn__media img {
	object-position: 50% 22%;
}

.dbp-archive--v2 .dbp-v2-bn--row .dbp-v2-bn__body {
	justify-content: center;
	gap: 10px;
	padding: 26px 12px 26px 30px;
}

.dbp-archive--v2 .dbp-v2-bn--row .dbp-v2-bn__title {
	max-width: 18em;
	font-size: 24px;
	line-height: 1.2;
}

/* Text + button as one centred block in the wide variants (the button was pushed to the bottom). */
.dbp-archive--v2 .dbp-v2-bn--row .dbp-v2-bn__cta,
.dbp-archive--v2 .dbp-v2-bn--wide .dbp-v2-bn__cta,
.dbp-archive--v2 .dbp-v2-bn--pack.is-wide .dbp-v2-bn__cta {
	margin-top: 4px;
}

@media (min-width: 601px) and (max-width: 1199px) {
	.dbp-archive--v2 .dbp-v2-bn--wide .dbp-v2-bn__title,
	.dbp-archive--v2 .dbp-v2-bn--pack.is-wide .dbp-v2-bn__title {
		font-size: 22px;
	}

	.dbp-archive--v2 .dbp-v2-bn--wide .dbp-v2-bn__body,
	.dbp-archive--v2 .dbp-v2-bn--pack.is-wide .dbp-v2-bn__body {
		padding: 22px;
	}
}

/* Phones: a wide banner takes the whole row with a 42% photo; compact type. */
@media (max-width: 600px) {
	.dbp-archive--v2 .dbp-v2-bn--wide {
		grid-column: 1 / -1;
		grid-template-columns: minmax(0, 1fr) 42%;
		min-height: 160px;
	}

	.dbp-archive--v2 .dbp-v2-bn--wide .dbp-v2-bn__body,
	.dbp-archive--v2 .dbp-v2-bn--pack.is-wide .dbp-v2-bn__body {
		gap: 6px;
		padding: 14px 12px 14px 14px;
	}

	.dbp-archive--v2 .dbp-v2-bn--wide .dbp-v2-bn__title,
	.dbp-archive--v2 .dbp-v2-bn--pack.is-wide .dbp-v2-bn__title {
		font-size: 17px;
	}

	.dbp-archive--v2 .dbp-v2-bn--wide .dbp-v2-bn__line,
	.dbp-archive--v2 .dbp-v2-bn--pack .dbp-v2-bn__line,
	.dbp-archive--v2 .dbp-v2-bn--row .dbp-v2-bn__line {
		display: none;
	}

	.dbp-archive--v2 .dbp-v2-bn--wide.dbp-v2-bn--light .dbp-v2-bn__media {
		margin-left: -14%;
	}

	.dbp-archive--v2 .dbp-v2-bn--wide.dbp-v2-bn--dark .dbp-v2-bn__media {
		margin: 8px 8px 8px 0;
		min-height: calc(100% - 16px);
	}

	.dbp-archive--v2 .dbp-v2-bn__body {
		gap: 4px;
		padding: 10px 10px 12px;
	}

	.dbp-archive--v2 .dbp-v2-bn__eyebrow {
		font-size: 11px;
	}

	.dbp-archive--v2 .dbp-v2-bn__title {
		font-size: 15px;
		-webkit-line-clamp: 4;
	}

	.dbp-archive--v2 .dbp-v2-bn__btn {
		min-height: 36px;
		padding: 0 10px;
		font-size: 12.5px;
	}

	.dbp-archive--v2 .dbp-v2-bn--row {
		grid-template-columns: minmax(0, 1fr) 40%;
	}

	.dbp-archive--v2 .dbp-v2-bn--row .dbp-v2-bn__media {
		min-height: 170px;
	}

	.dbp-archive--v2 .dbp-v2-bn--row .dbp-v2-bn__body {
		gap: 6px;
		padding: 16px 10px 16px 16px;
	}

	.dbp-archive--v2 .dbp-v2-bn--row .dbp-v2-bn__title {
		font-size: 17px;
	}
}

/* ---------- Stage 4: content below the list (full width, after the sidebar ends) ---------- */
.dbp-archive--v2 .dbp-v2-below {
	--a2-band: #f4f7f6;
	margin-top: 32px;
}

.dbp-archive--v2 .dbp-v2-sec {
	padding: 34px 0 8px;
}

/* Full-bleed tinted band, content stays in the container; the shadow + clip trick adds no page width. */
.dbp-archive--v2 .dbp-v2-sec--band {
	padding: 30px 0;
	background: var(--a2-band);
	box-shadow: 0 0 0 100vmax var(--a2-band);
	clip-path: inset(0 -100vmax);
}

.dbp-archive--v2 .dbp-v2-sec > h2,
.dbp-archive--v2 .dbp-v2-sec__head h2,
.dbp-archive--v2 .dbp-v2-guide__wrap h2 {
	margin: 0;
	color: var(--a2-heading);
	font-size: 22px;
	line-height: 1.25;
	text-transform: none;
	letter-spacing: 0;
}

.dbp-archive--v2 .dbp-v2-sec__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 16px;
}

.dbp-archive--v2 .dbp-v2-sec__head p {
	margin: 4px 0 0;
	color: var(--a2-muted);
	font-size: 13.5px;
}

.dbp-archive--v2 .dbp-v2-sec__head > a {
	flex: none;
	color: var(--a2-accent);
	font-size: 13px;
	font-weight: 600;
	white-space: nowrap;
}

.dbp-archive--v2 .dbp-v2-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 36px;
	padding: 0 14px;
	border-radius: 10px;
	background: #fff;
	color: var(--a2-accent-900);
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
}

.dbp-archive--v2 .dbp-v2-btn:hover {
	background: var(--a2-accent);
	color: #fff;
}

/* Pairs bought together */
.dbp-archive--v2 .dbp-v2-pairs {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 14px;
}

.dbp-archive--v2 .dbp-v2-pair {
	display: flex;
	flex-direction: column;
	gap: 12px;
	padding: 16px;
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(2, 6, 23, 0.05);
}

.dbp-archive--v2 .dbp-v2-pair small {
	color: var(--a2-accent);
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.dbp-archive--v2 .dbp-v2-pair__duo {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 120px;
}

.dbp-archive--v2 .dbp-v2-pair__duo a {
	width: 112px;
	height: 112px;
	overflow: hidden;
	border-radius: 50%;
	background: #f3f5f6;
	box-shadow: 0 0 0 4px #fff;
}

.dbp-archive--v2 .dbp-v2-pair__duo a + a {
	margin-left: -18px;
}

.dbp-archive--v2 .dbp-v2-pair__duo img {
	width: 100%;
	height: 100%;
	padding: 6px;
	object-fit: contain;
	mix-blend-mode: multiply;
	border-radius: 0;
}

.dbp-archive--v2 .dbp-v2-pair__plus {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--a2-accent);
	box-shadow: 0 0 0 3px #fff;
	color: #fff;
	font-weight: 700;
	transform: translate(-50%, -50%);
}

.dbp-archive--v2 .dbp-v2-pair__names {
	min-height: 36px;
	color: var(--a2-heading);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.35;
	text-align: center;
}

.dbp-archive--v2 .dbp-v2-pair__names em {
	display: block;
	margin-top: 2px;
	color: var(--a2-muted);
	font-size: 11.5px;
	font-style: normal;
	font-weight: 500;
}

.dbp-archive--v2 .dbp-v2-pair__sum {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	margin-top: auto;
	color: var(--a2-muted);
	font-size: 12px;
}

.dbp-archive--v2 .dbp-v2-pair__sum b {
	color: var(--a2-heading);
	font-size: 18px;
}

.dbp-archive--v2 .dbp-v2-pair__add {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	min-height: 40px;
	margin: 0;
	padding: 0 12px;
	border: 0;
	border-radius: 10px;
	background: var(--a2-accent-soft);
	color: var(--a2-accent-900);
	font-size: 13px;
	font-weight: 600;
	text-transform: none;
	letter-spacing: 0;
	cursor: pointer;
}

.dbp-archive--v2 .dbp-v2-pair__add:hover,
.dbp-archive--v2 .dbp-v2-pair__add:focus-visible {
	background: var(--a2-accent);
	color: #fff;
}

.dbp-archive--v2 .dbp-v2-pair__add.is-loading {
	opacity: 0.6;
	cursor: progress;
}

/* "Jak wybrać …?" decision cards */
.dbp-archive--v2 .dbp-v2-decide-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: 14px;
}

.dbp-archive--v2 .dbp-v2-decide {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 16px;
	border-radius: 14px;
	background: #fff;
	box-shadow: inset 0 0 0 1px var(--a2-border);
}

.dbp-archive--v2 .dbp-v2-decide__ico {
	display: grid;
	place-items: center;
	width: 36px;
	height: 36px;
	border-radius: 10px;
	background: var(--a2-accent-soft);
	color: var(--a2-accent);
}

.dbp-archive--v2 .dbp-v2-decide h3 {
	margin: 0;
	color: var(--a2-heading);
	font-size: 15px;
	text-transform: none;
	letter-spacing: 0;
}

.dbp-archive--v2 .dbp-v2-decide p {
	margin: 0;
	color: var(--a2-muted);
	font-size: 13px;
	line-height: 1.5;
}

.dbp-archive--v2 .dbp-v2-decide__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: auto;
	padding-top: 4px;
}

/* Long option names ("Odwodnienie i przesuszenie") wrap inside the card instead of sticking out. */
.dbp-archive--v2 .dbp-v2-decide__chips .dbp-archive__quick-chip {
	max-width: 100%;
	height: auto;
	min-height: 36px;
	padding-top: 6px;
	padding-bottom: 6px;
	line-height: 1.25;
	text-align: left;
	white-space: normal;
	overflow-wrap: anywhere;
}

.dbp-archive--v2 .dbp-v2-decide__chips .dbp-archive__quick-chip em {
	flex: none;
}

.dbp-archive--v2 .dbp-v2-decide--ask {
	background: var(--a2-accent-soft);
	box-shadow: none;
}

/* Guide (existing SEO sections) + "W skrócie" */
.dbp-archive--v2 .dbp-v2-guide__wrap {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 300px;
	gap: 48px;
	align-items: start;
}

.dbp-archive--v2 .dbp-v2-guide h2 {
	margin-bottom: 12px;
}

.dbp-archive--v2 .dbp-v2-guide__body {
	position: relative;
	max-height: 17.4em;
	overflow: hidden;
	color: var(--a2-text);
	font-size: 14.5px;
	line-height: 1.7;
}

.dbp-archive--v2 .dbp-v2-guide__body::after {
	content: '';
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	height: 4.2em;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0), #fff);
	pointer-events: none;
}

.dbp-archive--v2 .dbp-v2-guide.is-open .dbp-v2-guide__body {
	max-height: none;
}

.dbp-archive--v2 .dbp-v2-guide.is-open .dbp-v2-guide__body::after {
	display: none;
}

.dbp-archive--v2 .dbp-v2-guide__body p,
.dbp-archive--v2 .dbp-v2-guide__body ul,
.dbp-archive--v2 .dbp-v2-guide__body ol {
	margin: 0 0 10px;
}

.dbp-archive--v2 .dbp-v2-guide__body h3 {
	margin: 18px 0 8px;
	color: var(--a2-heading);
	font-size: 17px;
	text-transform: none;
	letter-spacing: 0;
}

.dbp-archive--v2 .dbp-v2-guide__body a {
	color: var(--a2-accent);
	font-weight: 500;
	text-decoration: underline;
	text-decoration-color: rgba(0, 102, 94, 0.35);
	text-underline-offset: 2px;
}

.dbp-archive--v2 .dbp-v2-guide__toggle {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 36px;
	margin: 4px 0 0;
	padding: 0;
	border: 0;
	background: none;
	color: var(--a2-accent);
	font-size: 13.5px;
	font-weight: 600;
	text-transform: none;
	letter-spacing: 0;
	cursor: pointer;
}

.dbp-archive--v2 .dbp-v2-guide__toggle[hidden] {
	display: none;
}

.dbp-archive--v2 .dbp-v2-guide__toggle::after {
	content: '';
	width: 7px;
	height: 7px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(45deg) translateY(-2px);
}

.dbp-archive--v2 .dbp-v2-guide.is-open .dbp-v2-guide__toggle::after {
	transform: rotate(-135deg);
}

.dbp-archive--v2 .dbp-v2-facts {
	position: sticky;
	top: calc(var(--a2-sticky-top) + 16px);
	padding: 18px;
	border-radius: 14px;
	background: var(--a2-band);
}

.dbp-archive--v2 .dbp-v2-facts h3 {
	margin: 0 0 10px;
	color: var(--a2-muted);
	font-size: 13px;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.dbp-archive--v2 .dbp-v2-facts ul {
	display: grid;
	gap: 8px;
	margin: 0 0 14px;
	padding: 0;
	list-style: none;
}

.dbp-archive--v2 .dbp-v2-facts li {
	display: flex;
	justify-content: space-between;
	gap: 10px;
	padding-bottom: 8px;
	border-bottom: 1px solid var(--a2-border);
	color: var(--a2-text);
	font-size: 13.5px;
}

.dbp-archive--v2 .dbp-v2-facts li b {
	color: var(--a2-heading);
}

.dbp-archive--v2 .dbp-v2-facts__guide {
	display: grid;
	grid-template-columns: 56px 1fr;
	gap: 10px;
	align-items: center;
	padding: 10px;
	border-radius: 12px;
	background: #fff;
	box-shadow: inset 0 0 0 1px var(--a2-border);
	text-decoration: none;
}

.dbp-archive--v2 .dbp-v2-facts__guide img {
	width: 56px;
	height: 56px;
	border-radius: 8px;
	object-fit: cover;
}

.dbp-archive--v2 .dbp-v2-facts__guide small {
	display: block;
	color: var(--a2-accent);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.dbp-archive--v2 .dbp-v2-facts__guide b {
	display: block;
	color: var(--a2-heading);
	font-size: 13px;
	line-height: 1.3;
}

/* FAQ */
.dbp-archive--v2 .dbp-v2-faq h2 {
	margin-bottom: 14px;
}

.dbp-archive--v2 .dbp-v2-faq__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 14px;
	align-items: start;
}

.dbp-archive--v2 .dbp-v2-faq__grid details {
	margin-bottom: 8px;
	padding: 0 16px;
	border: 1px solid var(--a2-border);
	border-radius: 12px;
	background: #fff;
}

.dbp-archive--v2 .dbp-v2-faq__grid summary {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 14px 0;
	color: var(--a2-heading);
	font-size: 14px;
	font-weight: 600;
	list-style: none;
	cursor: pointer;
}

.dbp-archive--v2 .dbp-v2-faq__grid summary::-webkit-details-marker {
	display: none;
}

.dbp-archive--v2 .dbp-v2-faq__grid summary::after {
	content: '+';
	flex: none;
	color: var(--a2-accent);
	font-size: 18px;
	line-height: 1;
}

.dbp-archive--v2 .dbp-v2-faq__grid details[open] summary::after {
	content: '–';
}

.dbp-archive--v2 .dbp-v2-faq__grid details p {
	margin: 0 0 14px;
	color: var(--a2-text);
	font-size: 13.5px;
	line-height: 1.6;
}

/* Guides from the blog */
.dbp-archive--v2 .dbp-v2-posts {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
}

.dbp-archive--v2 .dbp-v2-post {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(2, 6, 23, 0.05);
	color: inherit;
	text-decoration: none;
	transition: box-shadow 0.2s ease;
}

.dbp-archive--v2 .dbp-v2-post:hover {
	box-shadow: 0 12px 28px rgba(2, 6, 23, 0.1);
}

.dbp-archive--v2 .dbp-v2-post__img {
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: #f3f5f6;
}

.dbp-archive--v2 .dbp-v2-post__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0;
	transition: transform 0.5s ease;
}

.dbp-archive--v2 .dbp-v2-post:hover .dbp-v2-post__img img {
	transform: scale(1.04);
}

.dbp-archive--v2 .dbp-v2-post__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 8px;
	padding: 14px 16px 16px;
}

.dbp-archive--v2 .dbp-v2-post__label {
	align-self: flex-start;
	padding: 3px 9px;
	border-radius: 999px;
	background: var(--a2-accent-soft);
	color: var(--a2-accent);
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.dbp-archive--v2 .dbp-v2-post.is-pillar .dbp-v2-post__label {
	background: var(--a2-accent);
	color: #fff;
}

.dbp-archive--v2 .dbp-v2-post b {
	display: -webkit-box;
	overflow: hidden;
	color: var(--a2-heading);
	font-size: 15px;
	line-height: 1.4;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
}

.dbp-archive--v2 .dbp-v2-post:hover b {
	color: var(--a2-accent);
}

.dbp-archive--v2 .dbp-v2-post__meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	margin-top: auto;
	padding-top: 10px;
	border-top: 1px solid var(--a2-border);
	color: var(--a2-muted);
	font-size: 12px;
}

.dbp-archive--v2 .dbp-v2-post__meta span {
	color: var(--a2-accent);
	font-weight: 600;
	white-space: nowrap;
}

/* End strip: related categories + TrustMate */
.dbp-archive--v2 .dbp-v2-endstrip {
	display: flex;
	align-items: center;
	gap: 24px;
	margin: 26px 0 30px;
	padding: 14px 18px;
	border-radius: 14px;
	box-shadow: inset 0 0 0 1px var(--a2-border);
}

.dbp-archive--v2 .dbp-v2-endstrip__related {
	display: flex;
	flex: 1;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
}

.dbp-archive--v2 .dbp-v2-endstrip__related b {
	flex: none;
	margin-right: 6px;
	color: var(--a2-heading);
	font-size: 13px;
	white-space: nowrap;
}

.dbp-archive--v2 .dbp-v2-endstrip__related .dbp-archive__quick-chip {
	text-decoration: none;
}

.dbp-archive--v2 .dbp-v2-endstrip__trust {
	display: flex;
	align-items: center;
	gap: 10px;
	padding-left: 20px;
	border-left: 1px solid var(--a2-border);
	color: var(--a2-muted);
	font-size: 12.5px;
	white-space: nowrap;
}

.dbp-archive--v2 .dbp-v2-endstrip__trust b {
	color: var(--a2-heading);
	font-size: 20px;
}

.dbp-archive--v2 .dbp-v2-endstrip__stars {
	color: var(--a2-gold);
	letter-spacing: 1px;
}

.dbp-archive--v2 .dbp-v2-endstrip__trust a {
	color: var(--a2-accent);
	font-weight: 600;
}

/* Tablets */
@media (max-width: 1199px) {
	.dbp-archive--v2 .dbp-v2-pairs,
	.dbp-archive--v2 .dbp-v2-posts {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.dbp-archive--v2 .dbp-v2-guide__wrap {
		grid-template-columns: minmax(0, 1fr) 260px;
		gap: 32px;
	}
}

/* Phones: swipeable rows instead of grids, one column for the guide and FAQ */
@media (max-width: 760px) {
	.dbp-archive--v2 .dbp-v2-below {
		margin-top: 20px;
	}

	.dbp-archive--v2 .dbp-v2-sec {
		padding: 26px 0 4px;
	}

	.dbp-archive--v2 .dbp-v2-sec--band {
		padding: 24px 0;
	}

	.dbp-archive--v2 .dbp-v2-sec > h2,
	.dbp-archive--v2 .dbp-v2-sec__head h2,
	.dbp-archive--v2 .dbp-v2-guide__wrap h2 {
		font-size: 18px;
	}

	.dbp-archive--v2 .dbp-v2-sec__head {
		margin-bottom: 12px;
	}

	.dbp-archive--v2 .dbp-v2-sec__head p {
		font-size: 12.5px;
	}

	.dbp-archive--v2 .dbp-v2-sec__head > a {
		display: none;
	}

	.dbp-archive--v2 .dbp-v2-pairs,
	.dbp-archive--v2 .dbp-v2-decide-grid,
	.dbp-archive--v2 .dbp-v2-posts {
		display: grid;
		grid-auto-columns: 78%;
		grid-auto-flow: column;
		grid-template-columns: none;
		gap: 10px;
		margin: 0 -16px;
		padding: 0 16px 4px;
		overflow-x: auto;
		scroll-padding: 0 16px;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
	}

	.dbp-archive--v2 .dbp-v2-pairs::-webkit-scrollbar,
	.dbp-archive--v2 .dbp-v2-decide-grid::-webkit-scrollbar,
	.dbp-archive--v2 .dbp-v2-posts::-webkit-scrollbar {
		display: none;
	}

	.dbp-archive--v2 .dbp-v2-pair,
	.dbp-archive--v2 .dbp-v2-decide,
	.dbp-archive--v2 .dbp-v2-post {
		scroll-snap-align: start;
	}

	/* Cards keep their own height (no empty gap above the buttons of a short card). */
	.dbp-archive--v2 .dbp-v2-decide-grid {
		grid-auto-columns: 80%;
		align-items: start;
	}

	.dbp-archive--v2 .dbp-v2-decide__chips {
		margin-top: 4px;
	}

	.dbp-archive--v2 .dbp-v2-guide__wrap {
		grid-template-columns: minmax(0, 1fr);
		gap: 18px;
	}

	.dbp-archive--v2 .dbp-v2-guide__body {
		max-height: 12em;
		font-size: 13.5px;
		line-height: 1.6;
	}

	.dbp-archive--v2 .dbp-v2-facts {
		position: static;
	}

	.dbp-archive--v2 .dbp-v2-faq__grid {
		grid-template-columns: minmax(0, 1fr);
	}

	.dbp-archive--v2 .dbp-v2-faq__grid summary {
		font-size: 13.5px;
	}

	.dbp-archive--v2 .dbp-v2-post b {
		font-size: 14px;
	}

	.dbp-archive--v2 .dbp-v2-endstrip {
		flex-direction: column;
		align-items: stretch;
		gap: 14px;
		margin: 20px 0 24px;
	}

	/* Chips wrap inside the box – a swipe row was cut off hard at the border. */
	.dbp-archive--v2 .dbp-v2-endstrip__related b {
		flex-basis: 100%;
		margin: 0 0 2px;
	}

	.dbp-archive--v2 .dbp-v2-endstrip__related .dbp-archive__quick-chip {
		flex: none;
	}

	.dbp-archive--v2 .dbp-v2-endstrip__trust {
		flex-wrap: wrap;
		padding: 12px 0 0;
		border-top: 1px solid var(--a2-border);
		border-left: 0;
		white-space: normal;
	}
}

/* ---------- Stage 5: campaign pages and Promocje ---------- */
.dbp-archive--v2 .dbp-v2-cp {
	margin: 12px 0 8px;
	padding: 22px 28px 28px;
	border-radius: 18px;
	background: var(--a2-accent-900);
	color: #fff;
}

.dbp-archive--v2 .dbp-v2-cp__crumbs,
.dbp-archive--v2 .dbp-v2-cp__crumbs a,
.dbp-archive--v2 .dbp-v2-cp__crumbs span {
	color: rgba(255, 255, 255, 0.75);
}

.dbp-archive--v2 .dbp-v2-cp__row {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
	gap: 32px;
	align-items: start;
	margin-top: 10px;
}

.dbp-archive--v2 .dbp-v2-cp__status {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 28px;
	padding: 0 12px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.12);
	color: #fff;
	font-size: 12.5px;
	font-weight: 600;
}

.dbp-archive--v2 .dbp-v2-cp__status i {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #9fe0d6;
}

.dbp-archive--v2 .dbp-v2-cp__status--live i {
	background: #4ade80;
	box-shadow: 0 0 0 4px rgba(74, 222, 128, 0.25);
}

.dbp-archive--v2 .dbp-v2-cp__status--last {
	background: #b42318;
}

.dbp-archive--v2 .dbp-v2-cp__status--last i {
	background: #fff;
}

.dbp-archive--v2 .dbp-v2-cp__status--after i {
	background: rgba(255, 255, 255, 0.5);
}

.dbp-archive--v2 .dbp-v2-cp h1 {
	margin: 14px 0 10px;
	color: #fff;
	font-size: clamp(26px, 3vw, 36px);
	line-height: 1.15;
	letter-spacing: -0.01em;
	text-transform: none;
	text-wrap: balance;
}

.dbp-archive--v2 .dbp-v2-cp__lead {
	max-width: 40em;
	margin: 0 0 16px;
	color: rgba(255, 255, 255, 0.9);
	font-size: 15px;
	line-height: 1.6;
}

.dbp-archive--v2 .dbp-v2-cp__facts {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 14px;
	padding: 0;
	list-style: none;
}

.dbp-archive--v2 .dbp-v2-cp__facts li {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 32px;
	padding: 0 12px;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.1);
	box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
	font-size: 13px;
	font-weight: 600;
}

.dbp-archive--v2 .dbp-v2-cp__facts li::before {
	content: '✓';
	color: #9fe0d6;
}

.dbp-archive--v2 .dbp-v2-cp__note {
	margin: 0;
	color: rgba(255, 255, 255, 0.75);
	font-size: 13px;
	line-height: 1.55;
}

.dbp-archive--v2 .dbp-v2-cp__card {
	padding: 20px 22px;
	border-radius: 14px;
	background: #fff;
	color: var(--a2-text);
}

.dbp-archive--v2 .dbp-v2-cp__card h2 {
	margin: 0 0 10px;
	color: var(--a2-heading);
	font-size: 19px;
	line-height: 1.25;
	text-transform: none;
}

.dbp-archive--v2 .dbp-v2-cp__card > p {
	margin: 0 0 14px;
	font-size: 14px;
	line-height: 1.55;
}

.dbp-archive--v2 .dbp-v2-cp__how summary {
	display: none;
	list-style: none;
	cursor: pointer;
}

.dbp-archive--v2 .dbp-v2-cp__steps {
	display: grid;
	gap: 10px;
	margin: 0 0 14px;
	padding: 0;
	list-style: none;
	counter-reset: cp-step;
}

.dbp-archive--v2 .dbp-v2-cp__steps li {
	position: relative;
	display: grid;
	gap: 2px;
	padding-left: 38px;
	font-size: 13.5px;
	line-height: 1.5;
	counter-increment: cp-step;
}

.dbp-archive--v2 .dbp-v2-cp__steps li::before {
	content: counter(cp-step);
	position: absolute;
	top: 0;
	left: 0;
	display: grid;
	place-items: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: var(--a2-accent-soft);
	color: var(--a2-accent);
	font-size: 13px;
	font-weight: 700;
}

.dbp-archive--v2 .dbp-v2-cp__steps b {
	color: var(--a2-heading);
}

.dbp-archive--v2 .dbp-v2-cp__example,
.dbp-archive--v2 .dbp-v2-cp__bundle {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px;
	border-radius: 12px;
	background: #f4f7f6;
	font-size: 13px;
	line-height: 1.5;
}

.dbp-archive--v2 .dbp-v2-cp__example small,
.dbp-archive--v2 .dbp-v2-cp__bundle small {
	display: block;
	color: var(--a2-muted);
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.dbp-archive--v2 .dbp-v2-cp__example strong {
	color: var(--a2-heading);
	font-size: 15px;
}

.dbp-archive--v2 .dbp-v2-cp__was {
	color: var(--a2-muted);
}

.dbp-archive--v2 .dbp-v2-cp__thumbs {
	display: flex;
	flex: none;
}

.dbp-archive--v2 .dbp-v2-cp__thumbs img {
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 0 0 3px #f4f7f6;
	object-fit: contain;
}

.dbp-archive--v2 .dbp-v2-cp__thumbs img + img {
	margin-left: -12px;
}

.dbp-archive--v2 .dbp-v2-cp__bundle > span:nth-child(2) {
	flex: 1;
}

.dbp-archive--v2 .dbp-v2-cp__price-big {
	color: var(--a2-heading);
	font-size: 24px;
	font-weight: 700;
	line-height: 1.1;
}

.dbp-archive--v2 .dbp-v2-cp__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 44px;
	margin: 4px 0 0;
	padding: 0 18px;
	border: 0;
	border-radius: 10px;
	background: var(--a2-accent);
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	text-transform: none;
	letter-spacing: 0;
	cursor: pointer;
}

.dbp-archive--v2 .dbp-v2-cp__btn:hover {
	background: var(--a2-accent-strong);
	color: #fff;
}

.dbp-archive--v2 .dbp-v2-cp__bundle .dbp-v2-cp__btn {
	flex: none;
	margin: 0;
}

.dbp-archive--v2 .dbp-v2-cp__fine {
	margin: 8px 0 0;
	color: var(--a2-muted);
	font-size: 12.5px;
}

/* After a campaign the header's "Co teraz?" card says it all – no generic empty-category box below. */
.dbp-archive--v2 .dbp-v2-cp--phase-after ~ .dbp-archive__layout .dbp-archive__empty {
	display: none;
}

/* Closing cards of a campaign grid */
.dbp-archive--v2 .dbp-v2-cp-sum {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 8px;
	padding: 24px;
	border-radius: var(--dbp-v2-card-radius, 14px);
	background: #f4f7f6;
	box-shadow: inset 0 0 0 1px var(--a2-border);
	list-style: none;
}

.dbp-archive--v2 .dbp-v2-cp-sum small {
	color: var(--a2-accent);
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.dbp-archive--v2 .dbp-v2-cp-sum del {
	color: var(--a2-muted);
	font-size: 14px;
}

.dbp-archive--v2 .dbp-v2-cp-sum p {
	margin: 0;
	color: var(--a2-text);
	font-size: 13.5px;
	line-height: 1.5;
}

.dbp-archive--v2 .dbp-v2-cp-sum .dbp-v2-pair__add {
	width: auto;
	align-self: flex-start;
	margin-top: 6px;
	padding: 0 18px;
	background: var(--a2-accent);
	color: #fff;
}

/* Promocje: mechanism chips above the grid (desktop too) */
.dbp-archive--v2 .dbp-v2-promo-chips {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px;
	margin: 0 0 14px;
}

.dbp-archive--v2 .dbp-v2-promo-chips > span {
	margin-right: 4px;
	color: var(--a2-muted);
	font-size: 12.5px;
	font-weight: 600;
}

/* Desktop grid row: the chips take row 1 next to the sorting, like the active filters. */
@media (min-width: 961px) {
	.dbp-archive--v2 .dbp-archive__content > .dbp-v2-promo-chips {
		grid-column: 1;
		grid-row: 1;
		align-self: center;
	}
}

/* Product rows under the list ("Inne promocje", best sellers) */
.dbp-archive--v2 ul.products.dbp-v2-card-row,
.woocommerce .dbp-archive--v2 ul.products.dbp-v2-card-row {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 16px;
	margin: 0;
	padding: 0;
}

@media (max-width: 1120px) {
	.dbp-archive--v2 .dbp-v2-cp__row {
		grid-template-columns: minmax(0, 1fr);
		gap: 18px;
	}

	.dbp-archive--v2 ul.products.dbp-v2-card-row,
	.woocommerce .dbp-archive--v2 ul.products.dbp-v2-card-row {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 760px) {
	/* Panel idzie na całą szerokość – bez górnego marginesu, który zostawiał biały pasek pod nagłówkiem. */
	.dbp-archive--v2 .dbp-v2-cp {
		margin: 0 -16px 4px;
		padding: 16px 16px 18px;
		border-radius: 0;
	}

	.dbp-archive--v2 .dbp-v2-cp h1 {
		margin: 10px 0 8px;
		font-size: 24px;
	}

	.dbp-archive--v2 .dbp-v2-cp__lead {
		font-size: 14px;
	}

	.dbp-archive--v2 .dbp-v2-cp__facts li {
		font-size: 12.5px;
	}

	.dbp-archive--v2 .dbp-v2-cp__card {
		padding: 16px;
	}

	/* Steps folded on phones, so the products start on the first screen; the example stays. */
	.dbp-archive--v2 .dbp-v2-cp__how summary {
		display: flex;
		align-items: center;
		justify-content: space-between;
		min-height: 40px;
		margin-bottom: 8px;
		color: var(--a2-accent);
		font-size: 14px;
		font-weight: 600;
	}

	.dbp-archive--v2 .dbp-v2-cp__how summary::-webkit-details-marker {
		display: none;
	}

	.dbp-archive--v2 .dbp-v2-cp__how summary::after {
		content: '+';
		font-size: 18px;
	}

	.dbp-archive--v2 .dbp-v2-cp__how[open] summary::after {
		content: '–';
	}

	.dbp-archive--v2 .dbp-v2-cp__bundle {
		flex-wrap: wrap;
	}

	/* Sorting alone (Promocje without the filter panel): full width. */
	.dbp-archive--v2 .dbp-archive__toolbar--v2:not(:has(.dbp-archive__mobile-filters)) {
		grid-template-columns: minmax(0, 1fr);
	}

	.dbp-archive--v2 .dbp-v2-promo-chips {
		flex-wrap: nowrap;
		margin: 0 -16px 10px;
		padding: 0 16px;
		overflow-x: auto;
		scrollbar-width: none;
	}

	.dbp-archive--v2 .dbp-v2-promo-chips::-webkit-scrollbar {
		display: none;
	}

	.dbp-archive--v2 .dbp-v2-promo-chips .dbp-archive__quick-chip,
	.dbp-archive--v2 .dbp-v2-promo-chips > span {
		flex: none;
	}

	/* Same 2-column grid as the product list (a swipe row had a wider right edge than the list). */
	.dbp-archive--v2 ul.products.dbp-v2-card-row,
	.woocommerce .dbp-archive--v2 ul.products.dbp-v2-card-row {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 16px;
		width: 100%;
		margin: 0;
	}
}

/* ---------- Loading state of a filter / sort change ---------- */
/* Lighter dimming than the old page (no grey filter) and no label at the top of the list – it was out of
   view once scrolled; the status pill below stays on screen. */
.dbp-archive--v2.is-loading .dbp-archive__listing {
	opacity: 0.45;
	filter: none;
	transition: opacity 0.15s ease;
}

.dbp-archive--v2.is-loading .dbp-archive__listing::before,
.dbp-archive--v2.is-loading .dbp-archive__listing::after {
	content: none;
	display: none;
}

.dbp-archive--v2 .dbp-archive__loading {
	position: fixed;
	left: 50%;
	bottom: calc(24px + env(safe-area-inset-bottom, 0px));
	z-index: 1350;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 10px 18px 10px 14px;
	border-radius: 999px;
	background: var(--a2-accent-900);
	box-shadow: 0 10px 28px rgba(0, 59, 55, 0.28);
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	line-height: 1.2;
	white-space: nowrap;
	pointer-events: none;
	opacity: 0;
	transform: translate(-50%, 12px);
	transition: opacity 0.18s ease, transform 0.18s ease;
}

/* Shown only after a short delay, so a fast answer does not flash it. */
.dbp-archive--v2 .dbp-archive__loading.is-visible {
	opacity: 1;
	transform: translate(-50%, 0);
	transition-delay: 0.25s;
}

.dbp-archive--v2 .dbp-archive__loading-spinner {
	flex: none;
	width: 16px;
	height: 16px;
	border: 2px solid rgba(255, 255, 255, 0.3);
	border-top-color: #fff;
	border-radius: 50%;
	animation: dbp-archive-spin 0.72s linear infinite;
}

/* Phones: above the bottom navigation bar. */
@media (max-width: 960px) {
	.dbp-archive--v2 .dbp-archive__loading {
		bottom: calc(84px + env(safe-area-inset-bottom, 0px));
	}

	body.dbp-archive-filters-open .dbp-archive--v2 .dbp-archive__loading {
		bottom: calc(88px + env(safe-area-inset-bottom, 0px)); /* above the drawer's "Pokaż N" button */
	}

	/* Thin progress line under the sticky Filtry / Sortuj bar. */
	.dbp-archive--v2.is-loading .dbp-archive__toolbar--v2::after {
		content: '';
		position: absolute;
		left: 0;
		right: 0;
		bottom: -1px;
		height: 2px;
		background: linear-gradient(90deg, transparent, var(--a2-accent), transparent) 0 0 / 40% 100% no-repeat;
		animation: dbp-archive-progress 1s ease-in-out infinite;
	}
}

@keyframes dbp-archive-progress {
	from { background-position: -40% 0; }
	to { background-position: 140% 0; }
}

/* Header "Czytaj więcej": same look as the guide's toggle – a 32px target and a drawn chevron that
   turns when open (the text "⌄" sat off the baseline). */
.dbp-archive--v2 .dbp-archive__hero-toggle {
	align-items: center;
	gap: 8px;
	min-height: 32px;
}

.dbp-archive--v2 .dbp-archive__hero-toggle > span[aria-hidden='true'] {
	display: none;
}

.dbp-archive--v2 .dbp-archive__hero-toggle::after {
	content: '';
	width: 7px;
	height: 7px;
	border-right: 1.5px solid currentColor;
	border-bottom: 1.5px solid currentColor;
	transform: rotate(45deg) translateY(-2px);
	transition: transform 0.2s ease;
}

.dbp-archive--v2 .dbp-archive__hero-toggle[aria-expanded='true']::after {
	transform: rotate(-135deg);
}

/* The theme's global button:hover lifts every button, adds a shadow and swaps the background –
   wrong for text links and chips here; each v2 control gets its own quiet hover instead. */
.dbp-archive--v2 button:hover {
	transform: none;
	box-shadow: none;
}

.dbp-archive--v2 .dbp-v2-guide__toggle:hover,
.dbp-archive--v2 .dbp-archive__hero-toggle:hover,
.dbp-archive--v2 .dbp-archive__filter-more:hover,
.dbp-archive--v2 .dbp-archive__filter-toggle:hover {
	border-color: transparent;
	background: none;
	color: var(--a2-accent-strong);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.dbp-archive--v2 .dbp-archive__filter-toggle:hover {
	color: var(--a2-heading);
	text-decoration: none;
}

.dbp-archive--v2 .dbp-archive__quick-chip:hover {
	border-color: var(--a2-accent);
	background: #fff;
	color: var(--a2-heading);
}

.dbp-archive--v2 .dbp-archive__quick-chip.is-on:hover {
	background: var(--a2-accent-strong);
	color: #fff;
}

.dbp-archive--v2 .dbp-archive__mobile-filters:hover,
.dbp-archive--v2 .dbp-archive__sort-trigger:hover {
	border-color: var(--a2-accent);
	background: #fff;
	color: var(--a2-heading);
}

.dbp-archive--v2 .dbp-archive__filters-close:hover {
	background: var(--a2-accent);
	color: #fff;
}

/* Keyboard focus on the v2 controls (the theme resets outlines on buttons). */
.dbp-archive--v2 .dbp-archive__quick-chip:focus-visible,
.dbp-archive--v2 .dbp-archive__mobile-filters:focus-visible,
.dbp-archive--v2 .dbp-archive__sort-trigger:focus-visible,
.dbp-archive--v2 .dbp-archive__filter-toggle:focus-visible,
.dbp-archive--v2 .dbp-archive__filter-more:focus-visible,
.dbp-archive--v2 .dbp-archive__filters-close:focus-visible,
.dbp-archive--v2 .dbp-archive__filters-apply:focus-visible,
.dbp-archive--v2 .dbp-archive__filters-clear:focus-visible,
.dbp-archive--v2 .dbp-archive__chip:focus-visible {
	outline: 2px solid var(--a2-accent);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.dbp-archive--v2 .dbp-archive__loading-spinner,
	.dbp-archive--v2.is-loading .dbp-archive__toolbar--v2::after {
		animation-duration: 2.4s;
	}

	.dbp-archive--v2 * {
		transition: none !important;
	}
}