/* Product-filter presentation. Business logic remains in Broekenpaleis Filters. */

.bpal-catalog-layout {
	--bpal-filter-sticky-top: 16px;
}

.bpal-catalog-layout.is-enhanced,
.bpal-catalog-layout.bpal-catalog-layout--server-ready {
	display: grid;
	grid-template-columns: minmax(230px, 270px) minmax(0, 1fr);
	gap: 32px;
	align-items: start;
}

.bpal-filter-panel {
	display: none;
}

.bpal-catalog-layout.is-enhanced .bpal-filter-panel,
.bpal-catalog-layout.bpal-catalog-layout--server-ready .bpal-filter-panel {
	display: block;
	/* No max-height and no overflow: the panel never has a scrollbar of its own on desktop (it sticks, see
	   catalog-scroll.css); on mobile it is the drawer below. */
	padding: 22px 20px 24px;
	background: var(--bpal-white);
	border: 1px solid rgba(14, 39, 66, 0.12);
	border-radius: 2px;
	box-shadow: 0 10px 30px rgba(14, 39, 66, 0.045);
}

.bpal-filter-panel__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding-bottom: 14px;
	border-bottom: 1px solid var(--bpal-line);
}

.bpal-filter-panel__header h2 {
	margin: 0;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.2;
}

.bpal-filter-panel__close,
.bpal-filter-backdrop,
.bpal-filter-mobile-controls,
.bpal-filter-panel__apply {
	display: none;
}

.bpal-filter-feedback {
	min-height: 1.4em;
	margin: 10px 0 0;
	color: #59636e;
	font-size: 0.78rem;
}

.bpal-filter-groups {
	display: grid;
	gap: 0;
}

.bpal-filter-group {
	padding: 12px 0;
	border-bottom: 1px solid rgba(14, 39, 66, 0.11);
}

.bpal-filter-group:last-child {
	border-bottom: 0;
}

.bpal-filter-group > summary {
	position: relative;
	padding-right: 28px;
	color: var(--bpal-primary);
	font-family: var(--bpal-heading);
	font-size: 0.94rem;
	font-weight: 600;
	letter-spacing: 0.005em;
	cursor: pointer;
	list-style: none;
}

.bpal-filter-group > summary::-webkit-details-marker { display: none; }
.bpal-filter-group > summary::after {
	position: absolute;
	top: 50%;
	right: 2px;
	content: "+";
	transform: translateY(-50%);
}
.bpal-filter-group[open] > summary::after { content: "−"; }

.bpal-filter-group__body {
	display: grid;
	gap: 7px;
	padding-top: 8px;
}

.bpal-filter-section-title {
	margin: 4px 0 2px;
	color: #59636e;
	font-size: 0.74rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.bpal-filter-scope-list,
.bpal-filter-option-list,
.bpal-filter-size-list {
	padding: 0;
	margin: 0;
	list-style: none;
}

.bpal-filter-scope-list,
.bpal-filter-option-list {
	display: grid;
	gap: 7px;
}

.bpal-filter-scope-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 38px;
	padding: 7px 9px;
	border-left: 2px solid transparent;
	color: var(--bpal-text);
	font-size: 0.84rem;
	text-decoration: none;
	transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease;
}

.bpal-filter-scope-link:hover,
.bpal-filter-scope-link:focus-visible,
.bpal-filter-scope-link[aria-current="page"] {
	border-left-color: var(--bpal-primary);
	background: rgba(14, 39, 66, 0.035);
	color: var(--bpal-primary);
}

.bpal-filter-scope-link:focus-visible {
	outline: 2px solid var(--bpal-primary);
	outline-offset: 2px;
}

.bpal-filter-wl-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 14px;
	align-items: start;
}

.bpal-filter-size-column {
	min-width: 0;
}

.bpal-filter-size-column__title {
	margin: 0 0 8px;
	color: #59636e;
	font-size: 0.73rem;
	font-weight: 600;
	letter-spacing: 0.055em;
	text-transform: uppercase;
}

.bpal-filter-size-hint {
	min-height: 42px;
	margin: 0;
	padding: 10px 9px;
	background: rgba(14, 39, 66, 0.035);
	border: 1px dashed rgba(14, 39, 66, 0.18);
	color: #68727d;
	font-size: 0.73rem;
	line-height: 1.35;
}

.bpal-filter-size-list {
	display: grid;
	grid-template-columns: 20px minmax(0, max-content) max-content;
	column-gap: 8px;
	row-gap: 0;
	width: 100%;
}

/* The W/L columns retain their existing two-column layout; every option
   shares one label-width track with the other options in its own list. */
.bpal-filter-size-list--stacked {
	grid-template-columns: 20px minmax(0, max-content) max-content;
}

.bpal-filter-size-button {
	display: grid;
	grid-column: 1 / -1;
	grid-template-columns: subgrid;
	align-items: center;
	column-gap: inherit;
	width: 100%;
	min-width: 0;
	min-height: 28px;
	padding: 3px 10px;
	background: var(--bpal-white);
	border: 0;
	border-radius: 2px;
	color: var(--bpal-primary);
	font: inherit;
	font-size: 0.82rem;
	font-weight: 600;
	cursor: pointer;
	transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease;
}

.bpal-filter-size-button:hover {
	background: rgba(14, 39, 66, 0.035);
}

.bpal-filter-size-button.is-selected {
	background: var(--bpal-white);
	color: var(--bpal-primary);
}

.bpal-filter-size-button input {
	width: 16px;
	height: 16px;
	margin: 0;
	accent-color: var(--bpal-primary);
	cursor: pointer;
}

.bpal-filter-size-label,
.bpal-filter-size-count {
	white-space: nowrap;
}

.bpal-filter-size-count {
	color: #6b7580;
	font-size: 0.72rem;
	font-weight: 550;
	font-variant-numeric: tabular-nums;
}

.bpal-filter-size-button.is-selected .bpal-filter-size-count {
	color: #6b7580;
}

.bpal-filter-letter-list {
	display: block;
}

.bpal-filter-letter-size {
	display: grid;
	grid-template-columns: 20px minmax(0, max-content) max-content;
	column-gap: 8px;
	width: 100%;
}

.bpal-filter-letter-size > .bpal-filter-size-button {
	grid-column: 1 / -1;
}

.bpal-filter-collar-links {
	position: relative;
	display: grid;
	grid-column: 1 / -1;
	grid-template-columns: 18px minmax(0, max-content) max-content;
	column-gap: 7px;
	margin: 0 0 4px 19px;
	padding: 0 0 2px 13px;
}

.bpal-filter-collar-links::before {
	position: absolute;
	top: -2px;
	bottom: 13px;
	left: 4px;
	border-left: 1px solid rgba(14, 39, 66, 0.28);
	content: "";
}

.bpal-filter-collar-option {
	position: relative;
	display: grid;
	grid-column: 1 / -1;
	grid-template-columns: subgrid;
	align-items: center;
	min-height: 24px;
	color: #5f6974;
	font-size: 0.78rem;
	cursor: pointer;
}

.bpal-filter-collar-option::before {
	position: absolute;
	top: 50%;
	left: -9px;
	width: 9px;
	border-top: 1px solid rgba(14, 39, 66, 0.28);
	content: "";
}

.bpal-filter-collar-option input {
	width: 14px;
	height: 14px;
	margin: 0;
	accent-color: var(--bpal-primary);
}

.bpal-filter-collar-option__label {
	white-space: nowrap;
}

.bpal-filter-option {
	display: grid;
	grid-column: 1 / -1;
	grid-template-columns: subgrid;
	column-gap: inherit;
	align-items: center;
	min-height: 27px;
	padding: 0 4px;
	font-size: 0.84rem;
	cursor: pointer;
}

.bpal-filter-option-list {
	grid-template-columns: 17px minmax(0, max-content) max-content;
	column-gap: 8px;
	width: 100%;
}

.bpal-filter-option input {
	width: 17px;
	height: 17px;
	margin: 0;
	accent-color: var(--bpal-primary);
}

.bpal-filter-option__count {
	color: #66717c;
	font-size: 0.75rem;
	font-variant-numeric: tabular-nums;
}

/* Price: one track with two thumbs. Both range inputs share one grid cell; the first draws the track and
 * the selected range from --bpal-range-from / --bpal-range-to (0 to 1, set by product-filters.js). Only the
 * thumbs take the pointer, so both stay reachable. Without JavaScript the whole range shows as selected. */
.bpal-filter-price {
	--bpal-range-thumb: 18px;
	--bpal-range-track: 4px;
	--bpal-range-rail: rgba(14, 39, 66, 0.2);
	--bpal-range-from: 0;
	--bpal-range-to: 1;
	--bpal-range-start: calc(var(--bpal-range-from) * (100% - var(--bpal-range-thumb)) + var(--bpal-range-thumb) / 2);
	--bpal-range-end: calc(var(--bpal-range-to) * (100% - var(--bpal-range-thumb)) + var(--bpal-range-thumb) / 2);
	display: grid;
	gap: 10px;
}

.bpal-filter-price__values {
	grid-area: 1 / 1;
	display: flex;
	justify-content: space-between;
	gap: 12px;
	font-size: 0.8rem;
	font-variant-numeric: tabular-nums;
}

.bpal-filter-price input[type="range"] {
	grid-area: 2 / 1;
	position: relative;
	z-index: 1;
	width: 100%;
	height: var(--bpal-range-thumb);
	margin: 0;
	padding: 0;
	background: transparent;
	-webkit-appearance: none;
	appearance: none;
	pointer-events: none;
}

/* Overlapping thumbs: the one on top is the one that can move away (see syncPriceTrack()). */
.bpal-filter-price[data-bpal-range-top="min"] input[data-price-range="min"] { z-index: 2; }

.bpal-filter-price input[type="range"]::-webkit-slider-runnable-track {
	height: var(--bpal-range-track);
	border: 0;
	border-radius: 999px;
	background: transparent;
}

.bpal-filter-price input[type="range"]::-moz-range-track {
	height: var(--bpal-range-track);
	border: 0;
	border-radius: 999px;
	background: transparent;
}

.bpal-filter-price input[data-price-range="min"]::-webkit-slider-runnable-track {
	background: linear-gradient(to right, var(--bpal-range-rail) var(--bpal-range-start), var(--bpal-primary) var(--bpal-range-start), var(--bpal-primary) var(--bpal-range-end), var(--bpal-range-rail) var(--bpal-range-end));
}

.bpal-filter-price input[data-price-range="min"]::-moz-range-track {
	background: linear-gradient(to right, var(--bpal-range-rail) var(--bpal-range-start), var(--bpal-primary) var(--bpal-range-start), var(--bpal-primary) var(--bpal-range-end), var(--bpal-range-rail) var(--bpal-range-end));
}

.bpal-filter-price input[type="range"]::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	box-sizing: border-box;
	width: var(--bpal-range-thumb);
	height: var(--bpal-range-thumb);
	margin-top: calc((var(--bpal-range-track) - var(--bpal-range-thumb)) / 2);
	border: 2px solid #fff;
	border-radius: 50%;
	background: var(--bpal-primary);
	box-shadow: 0 0 0 1px rgba(14, 39, 66, 0.35), 0 1px 3px rgba(14, 39, 66, 0.3);
	cursor: grab;
	pointer-events: auto;
}

.bpal-filter-price input[type="range"]::-moz-range-thumb {
	box-sizing: border-box;
	width: var(--bpal-range-thumb);
	height: var(--bpal-range-thumb);
	border: 2px solid #fff;
	border-radius: 50%;
	background: var(--bpal-primary);
	box-shadow: 0 0 0 1px rgba(14, 39, 66, 0.35), 0 1px 3px rgba(14, 39, 66, 0.3);
	cursor: grab;
	pointer-events: auto;
}

.bpal-filter-price input[type="range"]:active::-webkit-slider-thumb { cursor: grabbing; }
.bpal-filter-price input[type="range"]:active::-moz-range-thumb { cursor: grabbing; }

.bpal-filter-price input[type="range"]:focus { outline: none; }

.bpal-filter-price input[type="range"]:focus-visible::-webkit-slider-thumb {
	box-shadow: 0 0 0 1px rgba(14, 39, 66, 0.35), 0 0 0 4px rgba(14, 39, 66, 0.35);
}

.bpal-filter-price input[type="range"]:focus-visible::-moz-range-thumb {
	box-shadow: 0 0 0 1px rgba(14, 39, 66, 0.35), 0 0 0 4px rgba(14, 39, 66, 0.35);
}

@media (forced-colors: active) {
	.bpal-filter-price input[type="range"]::-webkit-slider-runnable-track { border: 1px solid CanvasText; }
	.bpal-filter-price input[type="range"]::-moz-range-track { border: 1px solid CanvasText; }
	.bpal-filter-price input[type="range"]::-webkit-slider-thumb { background: CanvasText; border-color: Canvas; }
	.bpal-filter-price input[type="range"]::-moz-range-thumb { background: CanvasText; border-color: Canvas; }
}

.bpal-catalog-results { min-width: 0; }

.bpal-catalog-toolbar {
	display: none;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	min-height: 36px;
	margin-bottom: 4px;
	padding-bottom: 4px;
	border-bottom: 1px solid rgba(14, 39, 66, 0.1);
}


.bpal-catalog-layout.is-enhanced .bpal-catalog-toolbar,
.bpal-catalog-layout.bpal-catalog-layout--server-ready .bpal-catalog-toolbar { display: flex; }

.bpal-catalog-layout.is-enhanced > .bpal-catalog-results > .woocommerce-result-count,
.bpal-catalog-layout.is-enhanced > .bpal-catalog-results > .woocommerce-ordering,
.bpal-catalog-layout.is-enhanced > .bpal-catalog-results > .woocommerce-pagination,
.bpal-catalog-layout.is-enhanced > .bpal-catalog-results > .woocommerce-info,
.bpal-catalog-layout.bpal-catalog-layout--server-ready > .bpal-catalog-results > .woocommerce-result-count,
.bpal-catalog-layout.bpal-catalog-layout--server-ready > .bpal-catalog-results > .woocommerce-ordering,
.bpal-catalog-layout.bpal-catalog-layout--server-ready > .bpal-catalog-results > .woocommerce-pagination,
.bpal-catalog-layout.bpal-catalog-layout--server-ready > .bpal-catalog-results > .woocommerce-info {
	display: none;
}

.bpal-catalog-count {
	margin: 0;
	color: #59636e;
	font-size: 0.84rem;
	font-weight: 550;
}

.bpal-filter-sort {
	display: flex;
	gap: 8px;
	align-items: center;
	font-size: 0.8rem;
	font-weight: 600;
}

.bpal-filter-sort select {
	min-height: 40px;
	padding: 7px 32px 7px 10px;
	background: var(--bpal-white);
	border: 1px solid rgba(14, 39, 66, 0.25);
	border-radius: var(--bpal-radius);
	color: var(--bpal-text);
	font: inherit;
}

.bpal-filter-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 7px;
	min-height: 0;
	margin-bottom: 2px;
}

.bpal-filter-chips:empty { display: none; }

.bpal-filter-chip,
.bpal-filter-clear-all {
	display: inline-flex;
	align-items: center;
	min-height: 34px;
	padding: 6px 10px;
	border-radius: 2px;
	font: inherit;
	font-size: 0.76rem;
	cursor: pointer;
}

.bpal-filter-chip {
	gap: 7px;
	background: var(--bpal-white);
	border: 1px solid rgba(14, 39, 66, 0.24);
	color: var(--bpal-primary);
}

.bpal-filter-chip:hover,
.bpal-filter-chip:focus-visible {
	border-color: var(--bpal-primary);
}

.bpal-filter-chip__remove {
	font-size: 1rem;
	line-height: 1;
}

.bpal-filter-clear-all {
	background: transparent;
	border: 0;
	color: var(--bpal-primary);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.bpal-filter-error {
	padding: 10px 12px;
	margin: 0 0 14px;
	background: #fff;
	border: 1px solid #9f2d2d;
	color: #7c1f1f;
	font-size: 0.82rem;
}

.bpal-product-image-frame {
	display: block;
	overflow: hidden;
}

.bpal-product-image-frame img {
	display: block;
	width: 100%;
	transform: scale(1);
	transform-origin: center center;
}

@media (hover: hover) and (pointer: fine) {
	.bpal-catalog-results li.product .woocommerce-loop-product__link:hover .bpal-product-image-frame img {
		transform: scale(1.04);
		transition: transform 200ms ease;
	}

	.bpal-catalog-results li.product .bpal-product-image-frame img {
		transition: transform 200ms ease;
	}
}

@media (prefers-reduced-motion: reduce) {
	.bpal-catalog-results li.product .bpal-product-image-frame img,
	.bpal-catalog-results li.product .woocommerce-loop-product__link:hover .bpal-product-image-frame img {
		transform: none;
		transition: none;
	}
}

.bpal-filter-empty {
	grid-column: 1 / -1;
	padding: 54px 28px;
	background: var(--bpal-white);
	border: 1px solid rgba(14, 39, 66, 0.12);
	list-style: none;
	color: var(--bpal-primary);
	font-weight: 550;
	text-align: center;
}

.bpal-filter-pagination {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	justify-content: center;
	margin-top: 28px;
}

.bpal-filter-page {
	display: inline-grid;
	min-width: 40px;
	min-height: 40px;
	place-items: center;
	padding: 7px 10px;
	background: var(--bpal-white);
	border: 1px solid rgba(14, 39, 66, 0.25);
	border-radius: var(--bpal-radius);
	color: var(--bpal-primary);
	font: inherit;
	font-size: 0.82rem;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
}

.bpal-filter-page:hover,
.bpal-filter-page:focus-visible,
.bpal-filter-page[aria-current="page"] {
	background: var(--bpal-primary);
	border-color: var(--bpal-primary);
	color: var(--bpal-white);
}

@media (min-width: 1024px) and (max-width: 1180px) {
	.bpal-catalog-layout.is-enhanced,
	.bpal-catalog-layout.bpal-catalog-layout--server-ready { grid-template-columns: minmax(220px, 240px) minmax(0, 1fr); gap: 24px; }
	.bpal-catalog-results .products ul,
	.bpal-catalog-results ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1023px) {
	.bpal-catalog-layout.is-enhanced,
	.bpal-catalog-layout.bpal-catalog-layout--server-ready { display: block; }

	.bpal-catalog-layout.is-enhanced .bpal-filter-mobile-controls,
	.bpal-catalog-layout.bpal-catalog-layout--server-ready .bpal-filter-mobile-controls {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 10px;
		margin-bottom: 12px;
	}

	.bpal-filter-mobile-trigger,
	.bpal-filter-sort--mobile {
		min-height: 44px;
		background: var(--bpal-white);
		border: 1px solid rgba(14, 39, 66, 0.25);
		border-radius: var(--bpal-radius);
	}

	.bpal-filter-mobile-trigger {
		padding: 8px 12px;
		color: var(--bpal-primary);
		font: inherit;
		font-weight: 600;
		cursor: pointer;
	}

	.bpal-filter-mobile-trigger span:not([hidden])::before { content: " ("; }
	.bpal-filter-mobile-trigger span:not([hidden])::after { content: ")"; }

	.bpal-filter-sort--mobile {
		position: relative;
		display: block;
		padding: 0;
	}

	.bpal-filter-sort--mobile > span {
		position: absolute;
		left: 12px;
		top: 50%;
		z-index: 1;
		transform: translateY(-50%);
		pointer-events: none;
	}

	/* Two classes: the desktop polish `.bpal-filter-sort select` further down (and in frontend-post.css) has the same
	   specificity and comes later, and it reset this padding, so "Sorteren" was drawn over the chosen value. The
	   padding follows the label's font size so it still clears the label when the text is enlarged. */
	.bpal-filter-sort.bpal-filter-sort--mobile select {
		width: 100%;
		height: 100%;
		min-height: 42px;
		padding-left: calc(12px + 5em);
		border: 0;
		background: transparent;
	}

	.bpal-filter-sort--desktop { display: none; }

	.bpal-filter-backdrop {
		position: fixed;
		z-index: 998;
		inset: 0;
		width: 100%;
		height: 100%;
		padding: 0;
		background: rgba(14, 39, 66, 0.58);
		border: 0;
		cursor: default;
	}

	.bpal-catalog-layout.is-panel-open .bpal-filter-backdrop { display: block; }

	.bpal-catalog-layout.is-enhanced .bpal-filter-panel,
	.bpal-catalog-layout.bpal-catalog-layout--server-ready .bpal-filter-panel {
		position: fixed;
		z-index: 999;
		top: 0;
		right: 0;
		bottom: 0;
		left: auto;
		display: grid;
		grid-template-rows: auto auto minmax(0, 1fr) auto;
		width: min(92vw, 420px);
		max-height: none;
		padding: 18px;
		overflow: hidden;
		visibility: hidden;
		pointer-events: none;
		transform: translateX(105%);
		transition: transform 180ms ease, visibility 0s linear 180ms;
		box-shadow: -18px 0 42px rgba(14, 39, 66, 0.22);
	}

	.bpal-catalog-layout.is-panel-open .bpal-filter-panel {
		visibility: visible;
		pointer-events: auto;
		transform: translateX(0);
		transition-delay: 0s;
	}

	.bpal-filter-panel__close {
		display: inline-grid;
		width: 42px;
		height: 42px;
		place-items: center;
		padding: 0;
		background: transparent;
		border: 1px solid rgba(14, 39, 66, 0.2);
		border-radius: var(--bpal-radius);
		color: var(--bpal-primary);
		font: inherit;
		font-size: 1.5rem;
		cursor: pointer;
	}

	.bpal-filter-groups {
		overflow-y: auto;
		overscroll-behavior: contain;
		padding-right: 4px;
	}

	.bpal-filter-panel__apply {
		display: block;
		padding-top: 14px;
		background: var(--bpal-white);
		border-top: 1px solid var(--bpal-line);
	}

	.bpal-filter-apply { width: 100%; min-height: 46px; }

	body.bpal-filter-panel-open { overflow: hidden; }

	.bpal-catalog-toolbar { min-height: 0; margin-bottom: 10px; }
	.bpal-catalog-toolbar .bpal-catalog-count { width: 100%; }

	.bpal-filter-chips {
		flex-wrap: nowrap;
		overflow-x: auto;
		padding-bottom: 4px;
		scrollbar-width: thin;
	}

	.bpal-filter-chip,
	.bpal-filter-clear-all { flex: 0 0 auto; }
}

@media (prefers-reduced-motion: reduce) {
	.bpal-filter-panel,
	.bpal-catalog-results ul.products { transition: none; }
}

.woocommerce .bpal-catalog-layout.is-enhanced .bpal-catalog-results ul.products li.product,
.woocommerce-page .bpal-catalog-layout.is-enhanced .bpal-catalog-results ul.products li.product,
.woocommerce .bpal-catalog-layout.bpal-catalog-layout--server-ready .bpal-catalog-results ul.products li.product,
.woocommerce-page .bpal-catalog-layout.bpal-catalog-layout--server-ready .bpal-catalog-results ul.products li.product {
	float: none;
	clear: none;
	width: 100%;
	max-width: none;
	margin: 0;
}

@media (min-width: 1024px) {
	.bpal-catalog-layout.is-enhanced .bpal-catalog-results ul.products,
	.bpal-catalog-layout.bpal-catalog-layout--server-ready .bpal-catalog-results ul.products {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* Theme v0.1.60 filter and catalog layout refinement. */
body.bpal-has-product-filters .bpal-main--woocommerce {
  padding-top: 32px;
}

body.bpal-has-product-filters .woocommerce-products-header {
  margin-bottom: 14px;
}

body.bpal-has-product-filters .woocommerce-products-header__title.page-title {
  margin: 0;
  max-width: 14ch;
  font-size: clamp(1.65rem, 2.25vw, 1.9rem);
  line-height: 1.08;
  letter-spacing: -0.025em;
  scroll-margin-top: 124px;
}

/* v0.1.81: 1440px archive = 240px filter + 32px gap + 1168px results. */
@media (min-width: 1181px) {
  .bpal-catalog-layout.is-enhanced,
  .bpal-catalog-layout.bpal-catalog-layout--server-ready {
    grid-template-columns: 240px minmax(0, 1fr);
    gap: 32px;
  }
}

.bpal-catalog-layout.is-enhanced .bpal-filter-panel,
.bpal-catalog-layout.bpal-catalog-layout--server-ready .bpal-filter-panel {
  padding: 0 22px 0 0;
  background: transparent;
  border: 0;
  border-right: 1px solid rgba(14, 39, 66, 0.075);
  border-radius: 0;
  box-shadow: none;
}

.bpal-filter-panel__header {
  padding: 0 0 12px;
  border-bottom: 1px solid rgba(14, 39, 66, 0.075);
}

.bpal-filter-panel__header h2 {
  color: var(--bpal-primary);
  font-size: 0.98rem;
  font-weight: 600;
  letter-spacing: 0.005em;
}

.bpal-filter-feedback {
  min-height: 0;
  margin-top: 7px;
  color: #747c84;
  font-size: 0.69rem;
  line-height: 1.45;
}

.bpal-filter-feedback:empty { display: none; }

.bpal-filter-group {
  padding: 14px 0;
  border-bottom: 1px solid rgba(14, 39, 66, 0.065);
}

.bpal-filter-group > summary {
  min-height: 24px;
  padding-right: 25px;
  color: var(--bpal-primary);
  font-size: 0.84rem;
  font-weight: 600;
  letter-spacing: 0.008em;
  line-height: 1.35;
}

.bpal-filter-group > summary::after {
  right: 1px;
  color: #737b83;
  font-family: var(--bpal-body);
  font-size: 0.94rem;
  font-weight: 400;
  pointer-events: none;
}

.bpal-filter-group > summary:focus-visible {
  outline: 1px solid var(--bpal-primary);
  outline-offset: 3px;
}

.bpal-filter-group__body {
  gap: 9px;
  padding-top: 10px;
}

.bpal-filter-section-title {
  margin: 3px 0 1px;
  color: #737b83;
  font-size: 0.64rem;
  font-weight: 600;
  letter-spacing: 0.06em;
}

.bpal-filter-scope-list { gap: 3px; }
.bpal-filter-option-list { row-gap: 1px; }

.bpal-filter-scope-link {
  min-height: 31px;
  padding: 4px 4px 4px 7px;
  border-left: 1px solid transparent;
  border-radius: 0;
  color: var(--bpal-text);
  font-size: 0.79rem;
  font-weight: 500;
}

.bpal-filter-scope-link:hover,
.bpal-filter-scope-link:focus-visible {
  border-left-color: rgba(14, 39, 66, 0.22);
  background: transparent;
  color: var(--bpal-primary);
}

.bpal-filter-scope-link[aria-current="page"],
.bpal-filter-scope-link[aria-current="page"]:hover,
.bpal-filter-scope-link[aria-current="page"]:focus-visible {
  border-left-color: var(--bpal-primary);
  background: transparent;
  color: var(--bpal-primary);
  font-weight: 600;
}

/* Outlet is listed first and drawn in red, also on hover, on focus and as the current page (#b3261e on white is
 * 6.5:1). The word itself says what it is; the colour only draws the eye. */
.bpal-filter-scope-link.bpal-filter-scope-link--outlet,
.bpal-filter-scope-link.bpal-filter-scope-link--outlet:hover,
.bpal-filter-scope-link.bpal-filter-scope-link--outlet:focus-visible,
.bpal-filter-scope-link.bpal-filter-scope-link--outlet[aria-current="page"],
.bpal-filter-scope-link.bpal-filter-scope-link--outlet[aria-current="page"]:hover,
.bpal-filter-scope-link.bpal-filter-scope-link--outlet[aria-current="page"]:focus-visible {
  color: #b3261e;
  font-weight: 600;
}

.bpal-filter-scope-link.bpal-filter-scope-link--outlet:hover,
.bpal-filter-scope-link.bpal-filter-scope-link--outlet:focus-visible,
.bpal-filter-scope-link.bpal-filter-scope-link--outlet[aria-current="page"],
.bpal-filter-scope-link.bpal-filter-scope-link--outlet[aria-current="page"]:hover,
.bpal-filter-scope-link.bpal-filter-scope-link--outlet[aria-current="page"]:focus-visible {
  border-left-color: #b3261e;
}

/* On a brand page the categories are checkboxes and Outlet is red there too (the same colour and weight as above). */
.bpal-filter-option.bpal-filter-option--outlet,
.bpal-filter-option.bpal-filter-option--outlet:hover {
  color: #b3261e;
  font-weight: 600;
}

.bpal-filter-wl-grid { gap: 9px; }

.bpal-filter-size-column {
  min-width: 0;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

.bpal-filter-size-column__title {
  margin-bottom: 6px;
  color: #69737c;
  font-size: 0.64rem;
  font-weight: 600;
  letter-spacing: 0.055em;
}

.bpal-filter-size-hint {
  min-height: 34px;
  padding: 7px 6px;
  background: transparent;
  border: 1px dashed rgba(14, 39, 66, 0.11);
  border-radius: 0;
  color: #788089;
  font-size: 0.65rem;
}

.bpal-filter-size-list { row-gap: 1px; }

.bpal-filter-size-button {
  min-height: 30px;
  padding: 4px 7px 4px 3px;
  background: transparent;
  border: 0;
  border-radius: 0;
  color: var(--bpal-primary);
  font-size: 0.75rem;
  font-weight: 580;
  line-height: 1.2;
  box-shadow: none;
  transition: border-color 120ms ease, background-color 120ms ease, color 120ms ease, box-shadow 120ms ease;
}

.bpal-filter-size-button:hover {
  background: rgba(14, 39, 66, 0.02);
  color: var(--bpal-primary);
  box-shadow: none;
}

.bpal-filter-size-button.is-selected,
.bpal-filter-size-button.is-selected:hover,
.bpal-filter-size-button.is-selected:focus-visible {
  background: var(--bpal-white);
  color: var(--bpal-primary);
  font-weight: 600;
  box-shadow: none;
}

.bpal-filter-size-count,
.bpal-filter-size-button.is-selected .bpal-filter-size-count,
.bpal-filter-size-button.is-selected:hover .bpal-filter-size-count,
.bpal-filter-size-button.is-selected:focus-visible .bpal-filter-size-count {
  color: #515d69;
  font-size: 0.63rem;
  font-weight: 500;
}

.bpal-filter-size-button.is-selected .bpal-filter-size-count,
.bpal-filter-size-button.is-selected:hover .bpal-filter-size-count,
.bpal-filter-size-button.is-selected:focus-visible .bpal-filter-size-count {
  color: var(--bpal-primary);
}

.bpal-filter-option {
  column-gap: inherit;
  min-height: 29px;
  padding: 1px;
  border-radius: 0;
  color: var(--bpal-text);
  font-size: 0.79rem;
  line-height: 1.25;
}

.bpal-filter-option:hover {
  background: transparent;
  color: var(--bpal-primary);
}

.bpal-filter-option input {
  width: 16px;
  height: 16px;
  accent-color: var(--bpal-primary);
}

.bpal-filter-option input:focus-visible {
  outline: 1px solid var(--bpal-primary);
  outline-offset: 2px;
}

.bpal-filter-option__count {
  padding-left: 0;
  color: #858c93;
  font-size: 0.64rem;
  font-weight: 500;
}

.bpal-filter-price {
  gap: 9px;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

.bpal-filter-price__values {
  color: #66717b;
  font-size: 0.71rem;
  font-weight: 550;
}

.bpal-catalog-toolbar {
  min-height: 38px;
  margin-bottom: 5px;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(14, 39, 66, 0.06);
}

.bpal-catalog-count {
  color: #69737c;
  font-size: 0.77rem;
  font-weight: 550;
}

.bpal-filter-sort {
  gap: 7px;
  color: #59636d;
  font-size: 0.74rem;
  font-weight: 600;
}

.bpal-filter-sort select {
  min-height: 36px;
  padding: 5px 29px 5px 9px;
  background: var(--bpal-white);
  border: 1px solid rgba(14, 39, 66, 0.13);
  border-radius: 0;
  color: var(--bpal-primary);
  box-shadow: none;
}

.bpal-filter-sort select:hover { border-color: rgba(14, 39, 66, 0.28); }
.bpal-filter-sort select:focus-visible { outline: 1px solid var(--bpal-primary); outline-offset: 2px; }

.bpal-filter-chips {
  align-items: center;
  gap: 5px;
  margin-bottom: 5px;
}

.bpal-catalog-results ul.products {
  margin-top: 0 !important;
}

.bpal-filter-chips:not(:empty)::before {
  margin-right: 2px;
  color: #4a5560;
  content: "Actief";
  font-size: 0.67rem;
  font-weight: 550;
  letter-spacing: 0.02em;
}

.bpal-filter-chip,
.bpal-filter-clear-all {
  min-height: 28px;
  padding: 4px 7px;
  border-radius: 0;
  font-size: 0.69rem;
  line-height: 1.15;
}

.bpal-catalog-layout .bpal-filter-chip,
.bpal-catalog-layout .bpal-filter-chip:hover,
.bpal-catalog-layout .bpal-filter-chip:focus-visible {
  gap: 6px;
  background: var(--bpal-white);
  border: 1px solid rgba(14, 39, 66, 0.14);
  color: var(--bpal-primary);
  font-weight: 550;
  box-shadow: none;
}

.bpal-catalog-layout .bpal-filter-chip:hover,
.bpal-catalog-layout .bpal-filter-chip:focus-visible {
  background: rgba(14, 39, 66, 0.025);
  border-color: rgba(14, 39, 66, 0.34);
}

.bpal-catalog-layout .bpal-filter-chip:focus-visible {
  outline: 1px solid var(--bpal-primary);
  outline-offset: 2px;
}

.bpal-filter-chip__remove,
.bpal-filter-chip:hover .bpal-filter-chip__remove,
.bpal-filter-chip:focus-visible .bpal-filter-chip__remove {
  color: inherit;
  font-size: 0.86rem;
  font-weight: 500;
  line-height: 1;
  opacity: 0.72;
}

.bpal-filter-chip:hover .bpal-filter-chip__remove,
.bpal-filter-chip:focus-visible .bpal-filter-chip__remove { opacity: 1; }

.bpal-filter-clear-all {
  min-height: 28px;
  padding-inline: 5px;
  background: transparent;
  border: 0;
  color: #4a5560;
  font-weight: 550;
  text-decoration: none;
}

.bpal-filter-clear-all:hover,
.bpal-filter-clear-all:focus-visible {
  background: transparent;
  color: var(--bpal-primary);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.bpal-filter-empty {
  padding: 48px 24px;
  background: transparent;
  border: 1px solid rgba(14, 39, 66, 0.07);
  border-radius: 0;
  box-shadow: none;
  color: var(--bpal-primary);
  font-weight: 600;
}

.bpal-filter-page {
  border-color: rgba(14, 39, 66, 0.13);
  border-radius: 0;
  box-shadow: none;
}

@media (min-width: 1024px) and (max-width: 1180px) {
  .bpal-catalog-layout.is-enhanced,
  .bpal-catalog-layout.bpal-catalog-layout--server-ready {
    grid-template-columns: minmax(204px, 222px) minmax(0, 1fr);
    gap: 26px;
  }
}

@media (max-width: 1023px) {
  body.bpal-has-product-filters .bpal-main--woocommerce { padding-top: 24px; }

  body.bpal-has-product-filters .woocommerce-products-header {
    margin-bottom: 12px;
  }

  body.bpal-has-product-filters .woocommerce-products-header__title.page-title {
    max-width: none;
    font-size: clamp(1.55rem, 6vw, 1.7rem);
    scroll-margin-top: 96px;
  }

  .bpal-filter-mobile-trigger,
  .bpal-filter-sort--mobile {
    min-height: 42px;
    background: var(--bpal-white);
    border-color: rgba(14, 39, 66, 0.13);
    border-radius: 0;
    color: var(--bpal-primary);
    box-shadow: none;
  }

  .bpal-filter-mobile-trigger:hover,
  .bpal-filter-mobile-trigger:focus-visible {
    background: var(--bpal-white);
    border-color: rgba(14, 39, 66, 0.34);
    color: var(--bpal-primary);
  }

  .bpal-filter-backdrop { background: rgba(14, 39, 66, 0.54); backdrop-filter: none; }

  .bpal-catalog-layout.is-enhanced .bpal-filter-panel,
  .bpal-catalog-layout.bpal-catalog-layout--server-ready .bpal-filter-panel {
    width: min(92vw, 390px);
    padding: 18px 18px 20px;
    background: var(--bpal-white);
    border: 0;
    border-left: 1px solid rgba(14, 39, 66, 0.08);
    border-radius: 0;
    box-shadow: none;
  }

  .bpal-filter-panel__close {
    width: 34px;
    height: 34px;
    background: var(--bpal-white);
    border: 1px solid rgba(14, 39, 66, 0.13);
    border-radius: 0;
    color: var(--bpal-primary);
    font-size: 1.2rem;
  }

  .bpal-filter-panel__close:hover,
  .bpal-filter-panel__close:focus-visible {
    background: var(--bpal-white);
    border-color: rgba(14, 39, 66, 0.34);
    color: var(--bpal-primary);
  }

  .bpal-filter-panel__apply {
    padding-top: 13px;
    background: var(--bpal-white);
    border-top: 1px solid rgba(14, 39, 66, 0.07);
  }

  .bpal-filter-apply,
  .bpal-filter-apply:hover,
  .bpal-filter-apply:focus-visible {
    width: 100%;
    min-height: 44px;
    background: var(--bpal-white);
    border: 1px solid var(--bpal-primary);
    border-radius: 0;
    color: var(--bpal-primary);
    font-weight: 600;
    box-shadow: none;
  }

  .bpal-filter-chips { gap: 5px; padding-bottom: 3px; }
}


/* Filter controls use only a thin blue keyboard-focus line, never site-wide gold. */
.bpal-filter-panel :focus-visible,
.bpal-filter-mobile-controls :focus-visible,
.bpal-filter-chips :focus-visible,
.bpal-filter-pagination :focus-visible {
  outline: 1px solid var(--bpal-primary);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .bpal-filter-size-button,
  .bpal-catalog-layout .bpal-filter-chip,
  .bpal-filter-option { transition: none; }
}


/* Theme 0.1.76: colour-family swatches. No changes to the other filter rows. */
.bpal-filter-color-list {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 13px 8px;
	width: 100%;
}

.bpal-filter-color-option {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 5px;
	min-width: 0;
	padding: 4px 2px;
	border: 0;
	background: transparent;
	cursor: pointer;
}

.bpal-filter-color-option__input {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.bpal-filter-color-option__swatch {
	position: relative;
	display: block;
	width: 31px;
	height: 31px;
	border-radius: 50%;
	background: var(--bpal-swatch-color, #a3a7aa);
	border: 1px solid rgba(14, 39, 66, 0.32);
	box-shadow: 0 0 0 2px #fff;
	transition: box-shadow 120ms ease, transform 120ms ease;
}

.bpal-filter-color-option__swatch.is-mixed {
	background: conic-gradient(#285bb4 0 25%, #ba293b 25% 50%, #e9bb35 50% 75%, #386c48 75%);
}

.bpal-filter-color-option:hover .bpal-filter-color-option__swatch {
	box-shadow: 0 0 0 2px #fff, 0 0 0 3px rgba(14, 39, 66, 0.28);
}

.bpal-filter-color-option__input:checked + .bpal-filter-color-option__swatch,
.bpal-filter-color-option.is-selected .bpal-filter-color-option__swatch {
	box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--bpal-primary);
}

.bpal-filter-color-option__input:checked + .bpal-filter-color-option__swatch::after {
	position: absolute;
	inset: 0;
	content: '✓';
	display: grid;
	place-items: center;
	color: #fff;
	font-family: Arial, sans-serif;
	font-size: 19px;
	font-weight: 600;
	text-shadow: 0 1px 2px rgba(0,0,0,.7);
}

.bpal-filter-color-option__input:checked + .bpal-filter-color-option__swatch[style*="#ffffff"]::after,
.bpal-filter-color-option__input:checked + .bpal-filter-color-option__swatch[style*="#e9bb35"]::after,
.bpal-filter-color-option__input:checked + .bpal-filter-color-option__swatch[style*="#c9b697"]::after {
	color: var(--bpal-primary);
	text-shadow: none;
}

.bpal-filter-color-option__input:focus-visible + .bpal-filter-color-option__swatch {
	outline: 2px solid var(--bpal-primary);
	outline-offset: 5px;
}

.bpal-filter-color-option__input[data-partial="true"] + .bpal-filter-color-option__swatch::after {
	position: absolute;
	inset: 0;
	content: '−';
	display: grid;
	place-items: center;
	color: #fff;
	font: 700 20px/1 Arial, sans-serif;
	text-shadow: 0 1px 2px rgba(0,0,0,.7);
}

.bpal-filter-color-option__count {
	font-size: .73rem;
	line-height: 1.3;
	color: #66717c;
	font-variant-numeric: tabular-nums;
}

@media (max-width: 359px) {
	.bpal-filter-color-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* v0.1.79: both desktop filter and active refinements follow the viewport,
   not the (now normally scrolling) catalog header. */
.bpal-catalog-layout.is-enhanced .bpal-filter-chips:not(:empty),
.bpal-catalog-layout.bpal-catalog-layout--server-ready .bpal-filter-chips:not(:empty) {
	position: sticky;
	top: var(--bpal-filter-sticky-top);
	z-index: 40;
	max-height: min(40vh, 240px);
	padding: 10px 0;
	overflow-y: auto;
	overscroll-behavior: contain;
	background: var(--bpal-white);
	border-bottom: 1px solid rgba(14, 39, 66, 0.1);
}

.bpal-catalog-layout .bpal-catalog-toolbar {
	scroll-margin-top: calc(var(--bpal-filter-sticky-top) + 8px);
}

@media (max-width: 1023px) {
	.bpal-catalog-layout.is-enhanced .bpal-filter-chips:not(:empty),
	.bpal-catalog-layout.bpal-catalog-layout--server-ready .bpal-filter-chips:not(:empty) {
		max-height: none;
		padding: 7px 0;
		overflow-x: auto;
		overflow-y: hidden;
	}
}

/* Size groups (0.30.0): sizes per product group, e.g. "Broeken, ondergoed en zwemshorts". */
.bpal-filter-size-group {
	margin-top: 14px;
	padding-top: 12px;
	border-top: 1px solid var(--bpal-line, #e3e6ea);
}

.bpal-filter-size-group:first-child {
	margin-top: 0;
	padding-top: 0;
	border-top: 0;
}

.bpal-filter-size-group__title {
	margin: 0 0 8px;
	color: var(--bpal-primary, #0e2742);
	font-size: 0.8rem;
	font-weight: 700;
	line-height: 1.3;
}

/* Theme 0.30.9 — compact size tiles, theme colours, no catalog-layout changes.
   Uses the existing labelled checkboxes, same facet keys/counts and existing JS.
   Only the size controls change: other filters and the sticky toolbar remain untouched. */
.bpal-catalog-layout .bpal-filter-size-list,
.bpal-catalog-layout .bpal-filter-size-list--stacked,
.bpal-catalog-layout .bpal-filter-letter-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
  width: 100%;
}

/* The narrow former side-by-side W/L columns cannot fit four usable tiles.
   Stack the two size dimensions within the existing sidebar instead. */
.bpal-catalog-layout .bpal-filter-wl-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
}
.bpal-catalog-layout .bpal-filter-size-column { min-width: 0; }
.bpal-catalog-layout .bpal-filter-size-column__title { margin: 0 0 7px; }

.bpal-catalog-layout .bpal-filter-size-button {
  position: relative;
  display: flex;
  flex-direction: column;
  grid-column: auto;
  align-items: center;
  justify-content: center;
  gap: 2px;
  min-width: 0;
  min-height: 44px;
  width: 100%;
  padding: 5px 2px;
  border: 1px solid rgba(14, 39, 66, 0.19);
  border-radius: 3px;
  background: var(--bpal-white);
  color: var(--bpal-primary);
  text-align: center;
  line-height: 1.2;
  box-shadow: none;
}
.bpal-catalog-layout .bpal-filter-size-button:hover {
  background: rgba(14, 39, 66, 0.055);
  border-color: var(--bpal-primary);
  color: var(--bpal-primary);
}
.bpal-catalog-layout .bpal-filter-size-button.is-selected,
.bpal-catalog-layout .bpal-filter-size-button.is-selected:hover,
.bpal-catalog-layout .bpal-filter-size-button:has(> input:checked),
.bpal-catalog-layout .bpal-filter-size-button:has(> input:checked):hover {
  background: var(--bpal-primary);
  border-color: var(--bpal-primary);
  color: var(--bpal-white);
}
.bpal-catalog-layout .bpal-filter-size-button input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.bpal-catalog-layout .bpal-filter-size-button:focus-within {
  outline: 2px solid var(--bpal-primary);
  outline-offset: 2px;
}
.bpal-catalog-layout .bpal-filter-size-label {
  display: block;
  font-size: 0.76rem;
  font-weight: 650;
}
.bpal-catalog-layout .bpal-filter-size-button .bpal-filter-size-count {
  display: block;
  color: #66717c;
  font-size: 0.60rem;
  font-weight: 500;
  line-height: 1.1;
}
.bpal-catalog-layout .bpal-filter-size-button.is-selected .bpal-filter-size-count,
.bpal-catalog-layout .bpal-filter-size-button:has(> input:checked) .bpal-filter-size-count {
  color: rgba(255, 255, 255, 0.88);
}

/* Letter-size tiles are one grid cell each, except a selected letter size
   with expanded linked collar options: keep the collars in their own row. */
.bpal-catalog-layout .bpal-filter-letter-size {
  display: block;
  min-width: 0;
  width: 100%;
  grid-column: auto;
}
.bpal-catalog-layout .bpal-filter-letter-size > .bpal-filter-size-button { width: 100%; }
.bpal-catalog-layout .bpal-filter-letter-size.has-collar-links {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px;
}
.bpal-catalog-layout .bpal-filter-letter-size.has-collar-links > .bpal-filter-size-button {
  grid-column: 1 / 2;
}
.bpal-catalog-layout .bpal-filter-letter-size.has-collar-links .bpal-filter-collar-links {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 3px 10px;
  margin: 0 0 5px 6px;
  padding: 4px 0 3px 13px;
}
.bpal-catalog-layout .bpal-filter-letter-size.has-collar-links .bpal-filter-collar-option {
  display: grid;
  grid-column: auto;
  grid-template-columns: 16px minmax(0, 1fr) auto;
  column-gap: 5px;
  min-width: 0;
  font-size: 0.72rem;
}
.bpal-catalog-layout .bpal-filter-letter-size.has-collar-links .bpal-filter-collar-option::before { left: -8px; width: 7px; }
.bpal-catalog-layout .bpal-filter-letter-size.has-collar-links .bpal-filter-collar-option .bpal-filter-size-count {
  font-size: 0.61rem;
  color: #68727d;
}
@media (max-width: 359px) {
  .bpal-catalog-layout .bpal-filter-size-list,
  .bpal-catalog-layout .bpal-filter-size-list--stacked,
  .bpal-catalog-layout .bpal-filter-letter-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .bpal-catalog-layout .bpal-filter-letter-size.has-collar-links { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}


/* Theme 0.30.10 — compact single-line size buttons without counts. */
.bpal-catalog-layout .bpal-filter-size-list,
.bpal-catalog-layout .bpal-filter-size-list--stacked,
.bpal-catalog-layout .bpal-filter-letter-list {
  gap: 4px;
}
.bpal-catalog-layout .bpal-filter-wl-grid { gap: 10px; }
.bpal-catalog-layout .bpal-filter-size-column__title { margin-bottom: 5px; }
.bpal-catalog-layout .bpal-filter-size-button {
  flex-direction: row;
  min-height: 29px;
  height: 29px;
  padding: 2px 1px;
  gap: 0;
  font-size: 0.71rem;
  font-weight: 600;
  border-radius: 2px;
  transition: none;
  animation: none;
  transform: none;
}
.bpal-catalog-layout .bpal-filter-size-button .bpal-filter-size-label {
  font-size: 0.71rem;
  line-height: 1;
}
/* The counts are intentionally absent from PHP output as well; this rule
   safeguards first paints from older HTML fragments during a rolling update. */
.bpal-catalog-layout .bpal-filter-size-count { display: none !important; }
.bpal-catalog-layout .bpal-filter-size-button:hover,
.bpal-catalog-layout .bpal-filter-size-button:focus-visible {
  border-color: rgba(14, 39, 66, 0.19);
  background: var(--bpal-white);
  color: var(--bpal-primary);
  box-shadow: none;
}
.bpal-catalog-layout .bpal-filter-size-button.is-selected,
.bpal-catalog-layout .bpal-filter-size-button.is-selected:hover,
.bpal-catalog-layout .bpal-filter-size-button:has(> input:checked),
.bpal-catalog-layout .bpal-filter-size-button:has(> input:checked):hover {
  border-color: var(--bpal-primary);
  background: var(--bpal-primary);
  color: var(--bpal-white);
  box-shadow: none;
}
.bpal-catalog-layout .bpal-filter-letter-size.has-collar-links { gap: 4px; }
.bpal-catalog-layout .bpal-filter-letter-size.has-collar-links .bpal-filter-collar-links { margin-bottom: 2px; }
/* Eliminate hover zoom, transforms and visual transitions from the catalog.
   Preserve structural transforms for mobile drawer and caret alignment. */
.bpal-catalog-layout .bpal-filter-panel label,
.bpal-catalog-layout .bpal-filter-panel input,
.bpal-catalog-layout .bpal-filter-panel summary,
.bpal-catalog-layout .bpal-filter-chips *,
.bpal-catalog-layout .bpal-catalog-results ul.products li.product,
.bpal-catalog-layout .bpal-catalog-results ul.products li.product *,
.bpal-catalog-layout .bpal-filter-page,
.bpal-catalog-layout .bpal-filter-sort select {
  transition: none !important;
  animation: none !important;
}
.bpal-catalog-layout .bpal-catalog-results ul.products li.product .bpal-product-image-frame img,
.bpal-catalog-layout .bpal-catalog-results ul.products li.product .woocommerce-loop-product__link:hover .bpal-product-image-frame img {
  transform: none !important;
}
.bpal-catalog-layout .bpal-product-card,
.bpal-catalog-layout .bpal-product-card:hover {
  transform: none !important;
}
@media (max-width: 1023px) {
  .bpal-catalog-layout .bpal-filter-size-button { min-height: 32px; height: 32px; }
}


/* Theme 0.30.11 — fixed-geometry, crisp size tiles and inline collar sizes.
 * Click / hover never alters borders, corners, positions or animations.
 * Keyboard focus is indicated through text decoration, not an extra outline.
 */
.bpal-catalog-layout .bpal-filter-panel,
.bpal-catalog-layout .bpal-filter-panel *,
.bpal-catalog-layout .bpal-filter-chips * {
  transition: none !important;
  animation: none !important;
}
.bpal-catalog-layout .bpal-filter-size-button,
.bpal-catalog-layout .bpal-filter-size-button:hover,
.bpal-catalog-layout .bpal-filter-size-button:active,
.bpal-catalog-layout .bpal-filter-size-button:focus,
.bpal-catalog-layout .bpal-filter-size-button:focus-within {
  background: var(--bpal-white);
  color: var(--bpal-primary);
  border: 1px solid rgba(14,39,66,0.19);
  border-radius: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  transform: none !important;
}
.bpal-catalog-layout .bpal-filter-size-button.is-selected,
.bpal-catalog-layout .bpal-filter-size-button.is-selected:hover,
.bpal-catalog-layout .bpal-filter-size-button.is-selected:active,
.bpal-catalog-layout .bpal-filter-size-button.is-selected:focus-within,
.bpal-catalog-layout .bpal-filter-size-button:has(> input:checked),
.bpal-catalog-layout .bpal-filter-size-button:has(> input:checked):hover,
.bpal-catalog-layout .bpal-filter-size-button:has(> input:checked):active,
.bpal-catalog-layout .bpal-filter-size-button:has(> input:checked):focus-within {
  background: var(--bpal-primary);
  color: var(--bpal-white);
  border: 1px solid var(--bpal-primary); /* same colour as fill: no grey/transparent corner pixels */
  border-radius: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  transform: none !important;
}
.bpal-catalog-layout .bpal-filter-size-button > input:focus,
.bpal-catalog-layout .bpal-filter-size-button > input:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}
/* Keyboard focus on a size tile is a ring around the tile, set at the end of hover-stability.css. */
/* Theme 0.30.12 — selected letter size occupies one clear full-width row.
 * Its linked collar sizes sit immediately to the RIGHT of the parent as small,
 * native, separately selectable checkboxes: 3XL  [x]47  [x]48.
 * All other sizes remain compact four-across tiles. None of these elements
 * animate, zoom, gain focus borders on mouse clicks, or change tile dimensions.
 * IMPORTANT: an expanded parent naturally creates its own row (requested);
 * that deliberate layout change is not an animation.
 */
.bpal-catalog-layout .bpal-filter-letter-list:has(.bpal-filter-collar-links) {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px;
  width: 100%;
}
.bpal-catalog-layout .bpal-filter-letter-list > .bpal-filter-letter-size,
.bpal-catalog-layout .bpal-filter-letter-list > .bpal-filter-letter-size.bpal-filter-letter-size--many-collars {
  display: block;
  grid-column: auto;
  width: 100%;
  min-width: 0;
  height: 29px;
  min-height: 29px;
  margin: 0;
}
.bpal-catalog-layout .bpal-filter-letter-list > .bpal-filter-letter-size > .bpal-filter-size-button {
  width: 100%;
  height: 29px;
  min-height: 29px;
  margin: 0;
  padding: 0;
}
/* Expand only the selected letter; one row includes its child checkboxes. */
.bpal-catalog-layout .bpal-filter-letter-list > .bpal-filter-letter-size:has(> .bpal-filter-size-button > input:checked):has(> .bpal-filter-collar-links) {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  grid-column: 1 / -1;
  width: 100%;
  height: 29px;
  min-height: 29px;
}
.bpal-catalog-layout .bpal-filter-letter-list > .bpal-filter-letter-size:has(> .bpal-filter-size-button > input:checked) > .bpal-filter-size-button {
  flex: 0 0 46px;
  width: 46px;
  min-width: 46px;
  max-width: 46px;
  height: 29px;
}
/* Do not reserve fake, invisible tiles beside unselected letters. */
.bpal-catalog-layout .bpal-filter-letter-list .bpal-filter-letter-size > .bpal-filter-collar-links,
.bpal-catalog-layout .bpal-filter-letter-list .bpal-filter-letter-size.has-collar-links > .bpal-filter-collar-links {
  display: none;
  visibility: hidden;
  pointer-events: none;
}
.bpal-catalog-layout .bpal-filter-letter-list .bpal-filter-letter-size:has(> .bpal-filter-size-button > input:checked) > .bpal-filter-collar-links {
  position: static;
  display: inline-flex;
  flex: 0 1 auto;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 11px;
  width: auto;
  height: 29px;
  min-height: 29px;
  min-width: 0;
  padding: 0;
  margin: 0;
  border: 0;
  opacity: 1;
  overflow: visible;
  visibility: visible;
  pointer-events: auto;
}
/* Short connector communicates a dependent (child) size, without an extra row. */
.bpal-catalog-layout .bpal-filter-letter-list .bpal-filter-collar-links::before {
  content: '–' !important;
  display: inline !important;
  position: static !important;
  flex: 0 0 auto;
  border: 0 !important;
  color: #8a939d;
  font-weight: 400;
  line-height: 1;
}
.bpal-catalog-layout .bpal-filter-letter-list .bpal-filter-collar-option::before {
  content: none !important;
  display: none !important;
}
/* Collar sizes are CHECKBOXES, not full-size tiles; even when checked they
 * retain a neutral label. Only the native small square turns dark blue. */
.bpal-catalog-layout .bpal-filter-letter-list .bpal-filter-letter-size .bpal-filter-collar-option,
.bpal-catalog-layout .bpal-filter-letter-list .bpal-filter-letter-size .bpal-filter-collar-option:hover,
.bpal-catalog-layout .bpal-filter-letter-list .bpal-filter-letter-size .bpal-filter-collar-option:focus-within,
.bpal-catalog-layout .bpal-filter-letter-list .bpal-filter-letter-size .bpal-filter-collar-option.is-selected,
.bpal-catalog-layout .bpal-filter-letter-list .bpal-filter-letter-size .bpal-filter-collar-option:has(> input:checked) {
  position: static;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-start;
  gap: 5px;
  width: auto;
  min-width: 0;
  height: 23px;
  min-height: 23px;
  padding: 0;
  margin: 0;
  background: transparent !important;
  color: #4d5966 !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  transition: none !important;
  animation: none !important;
  font-size: 0.72rem;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
}
.bpal-catalog-layout .bpal-filter-letter-list .bpal-filter-letter-size .bpal-filter-collar-option > input {
  position: static !important;
  display: inline-block !important;
  flex: 0 0 13px;
  width: 13px !important;
  height: 13px !important;
  min-width: 13px;
  min-height: 13px;
  padding: 0 !important;
  margin: 0 !important;
  opacity: 1 !important;
  clip: auto !important;
  clip-path: none !important;
  overflow: visible !important;
  appearance: auto !important;
  accent-color: var(--bpal-primary);
  vertical-align: middle;
  box-shadow: none !important;
}
.bpal-catalog-layout .bpal-filter-letter-list .bpal-filter-letter-size .bpal-filter-collar-option > input:focus:not(:focus-visible) {
  outline: none !important;
}
/* Preserve keyboard discoverability without making the last clicked tile
 * look like an additional selected state. */
.bpal-catalog-layout .bpal-filter-letter-list .bpal-filter-letter-size .bpal-filter-collar-option > input:focus-visible {
  outline: 1px solid var(--bpal-primary);
  outline-offset: 2px;
}
@media (max-width: 359px) {
  .bpal-catalog-layout .bpal-filter-letter-list:has(.bpal-filter-collar-links) {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .bpal-catalog-layout .bpal-filter-letter-list .bpal-filter-letter-size:has(> .bpal-filter-size-button > input:checked) > .bpal-filter-collar-links {
    gap: 7px;
  }
}

/* 0.30.16 — approved shirt-fit illustrations; no interaction motion or layout changes. */
.bpal-filter-fit-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
.bpal-filter-fit-option { display:flex; position:relative; align-items:center; flex-direction:column; gap:3px; min-width:0; padding:5px 2px; border:1px solid rgba(14,39,66,.17); background:#fff; color:var(--bpal-primary); text-align:center; cursor:pointer; transition:none; }
.bpal-filter-fit-option input { position:absolute; width:1px; height:1px; opacity:0; left:5px; top:5px; }
.bpal-filter-fit-option img { display:block; width:63px; max-width:90%; height:69px; object-fit:contain; pointer-events:none; }
.bpal-filter-fit-option__label { font-size:.68rem; font-weight:600; line-height:1.2; min-height:2.2em; }
.bpal-filter-fit-option__count { font-size:.64rem; line-height:1; color:#66717c; }
.bpal-filter-fit-option:has(input:checked) { background:#f1f5f8; border-color:var(--bpal-primary); }
.bpal-filter-fit-option:has(input:checked)::after { content:'✓'; position:absolute; right:4px; top:2px; font:700 11px Arial,sans-serif; color:var(--bpal-primary); }
.bpal-filter-fit-option:has(input:focus-visible) { outline:2px solid var(--bpal-primary); outline-offset:2px; }
.bpal-filter-color-option__swatch.is-other { background:#89919a; box-shadow:0 0 0 2px #fff; }
.bpal-filter-color-option__swatch.is-other::before { content:'•••'; position:absolute; inset:0; display:grid; place-items:center; font:bold 11px Arial,sans-serif; letter-spacing:1px; color:#fff; }
.bpal-filter-color-option__input:checked + .bpal-filter-color-option__swatch.is-other::before { content:''; }

/* 0.30.18 — textile-reference swatches; cosmetic only, family keys/counts unchanged. */
.bpal-filter-color-option__swatch[data-bpal-swatch-family] { background-size: cover; background-position: center; background-repeat: no-repeat; }
.bpal-filter-color-option__swatch[data-bpal-swatch-family="blauw"] { background-image: url("../images/color-swatches/blauw.webp"); }
.bpal-filter-color-option__swatch[data-bpal-swatch-family="wit"] { background-image: url("../images/color-swatches/wit.webp"); }
.bpal-filter-color-option__swatch[data-bpal-swatch-family="rood"] { background-image: url("../images/color-swatches/rood.webp"); }
.bpal-filter-color-option__swatch[data-bpal-swatch-family="grijs"] { background-image: url("../images/color-swatches/grijs.webp"); }
.bpal-filter-color-option__swatch[data-bpal-swatch-family="zwart"] { background-image: url("../images/color-swatches/zwart.webp"); }
.bpal-filter-color-option__swatch[data-bpal-swatch-family="bruin"] { background-image: url("../images/color-swatches/bruin.webp"); }
.bpal-filter-color-option__swatch[data-bpal-swatch-family="groen"] { background-image: url("../images/color-swatches/groen.webp"); }
.bpal-filter-color-option__swatch[data-bpal-swatch-family="beige"] { background-image: url("../images/color-swatches/beige.webp"); }
.bpal-filter-color-option__swatch[data-bpal-swatch-family="geel"] { background-image: url("../images/color-swatches/geel.webp"); }
.bpal-filter-color-option__swatch[data-bpal-swatch-family="oranje"] { background-image: url("../images/color-swatches/oranje.webp"); }
.bpal-filter-color-option__swatch[data-bpal-swatch-family="paars"] { background-image: url("../images/color-swatches/paars.webp"); }
.bpal-filter-color-option__swatch[data-bpal-swatch-family="roze"] { background-image: url("../images/color-swatches/roze.webp"); }
.bpal-filter-color-option__swatch.is-mixed,
.bpal-filter-color-option__swatch.is-other { background-image: none; }
.bpal-filter-color-option__input:checked + .bpal-filter-color-option__swatch[data-bpal-swatch-family="beige"]::after,
.bpal-filter-color-option__input:checked + .bpal-filter-color-option__swatch[data-bpal-swatch-family="wit"]::after,
.bpal-filter-color-option__input:checked + .bpal-filter-color-option__swatch[data-bpal-swatch-family="geel"]::after { color: #0e2742; text-shadow: none; }
.bpal-filter-color-option__input[data-partial="true"] + .bpal-filter-color-option__swatch[data-bpal-swatch-family="beige"]::after,
.bpal-filter-color-option__input[data-partial="true"] + .bpal-filter-color-option__swatch[data-bpal-swatch-family="wit"]::after,
.bpal-filter-color-option__input[data-partial="true"] + .bpal-filter-color-option__swatch[data-bpal-swatch-family="geel"]::after { color: #0e2742; text-shadow: none; }

/* Theme 0.40.0 - the size filter in sections (Jeansmaten, Lettermaten, riemen/dassen/bretels, sokken, One size, Overige maten).
 * Plain <details>: they open and close without script and the visitor's choice is kept like that of the filter groups. The
 * tiles inside are the ones of before; only One size and the odd sizes get wide tiles (a 4-column tile cut "One Size" to "One Siz"). */
.bpal-filter-group__body:has(> .bpal-size-section) { gap: 0; }

.bpal-size-section {
  border-top: 1px solid rgba(14, 39, 66, 0.09);
}

.bpal-size-section:first-child { border-top: 0; }

.bpal-size-section > summary {
  position: relative;
  display: grid;
  align-content: center;
  gap: 1px;
  min-height: 40px;
  padding: 7px 24px 7px 0;
  color: var(--bpal-primary);
  cursor: pointer;
  list-style: none;
}

.bpal-size-section > summary::-webkit-details-marker { display: none; }

.bpal-size-section > summary::after {
  position: absolute;
  top: 50%;
  right: 1px;
  content: "+";
  transform: translateY(-50%);
  color: #737b83;
  font-family: var(--bpal-body);
  font-size: 0.94rem;
  font-weight: 400;
  pointer-events: none;
}

.bpal-size-section[open] > summary::after { content: "−"; }

.bpal-size-section > summary:focus-visible {
  outline: 1px solid var(--bpal-primary);
  outline-offset: 2px;
}

.bpal-size-section__title {
  font-size: 0.8rem;
  font-weight: 600;
  line-height: 1.3;
}

.bpal-size-section__hint {
  color: #5d6770;
  font-size: 0.68rem;
  font-weight: 400;
  line-height: 1.3;
}

.bpal-size-section__body {
  display: grid;
  gap: 9px;
  padding: 2px 0 12px;
}

.bpal-size-section .bpal-filter-size-label { white-space: nowrap; }

.bpal-catalog-layout .bpal-filter-size-list.bpal-filter-size-list--wide {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 1023px) {
  .bpal-size-section > summary { min-height: 44px; }
}