/* Only product overviews: the site header must scroll away for visitors.
   Keep every other page's header behavior and the existing mobile layout. */
body.bpal-is-product-overview .bpal-site-header {
	position: relative;
	top: auto;
}

/* The control is sitewide in Theme 0.16.1; catalog-specific rules below stay scoped. */
.bpal-catalog-back-to-top {
	position: fixed;
	right: max(20px, env(safe-area-inset-right, 0px));
	bottom: max(20px, env(safe-area-inset-bottom, 0px));
	z-index: 60;
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	padding: 0;
	background: var(--bpal-primary);
	border: 1px solid var(--bpal-primary);
	border-radius: 2px;
	color: var(--bpal-white);
	font: inherit;
	font-size: 1.6rem;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 3px 12px rgba(14, 39, 66, 0.14);
}

.bpal-catalog-back-to-top[hidden],
body.bpal-filter-panel-open .bpal-catalog-back-to-top,
html.bpal-menu-open .bpal-catalog-back-to-top {
	display: none;
}

.bpal-catalog-back-to-top:hover {
	background: var(--bpal-secondary);
}

.bpal-catalog-back-to-top:focus-visible {
	outline: 3px solid var(--bpal-accent);
	outline-offset: 3px;
}

@media (max-width: 680px) {
	.bpal-catalog-back-to-top {
		right: max(14px, env(safe-area-inset-right, 0px));
		bottom: max(14px, env(safe-area-inset-bottom, 0px));
		width: 44px;
		height: 44px;
	}
}

/* Desktop visitor view: no header or administrator offset. */
@media (min-width: 1024px) {
	body.bpal-is-product-overview .bpal-catalog-layout {
		--bpal-filter-sticky-top: 0px;
	}

	/* Account, bag and active filters meet the viewport's top edge. */
	.bpal-catalog-layout .bpal-catalog-sticky-tools {
		position: sticky;
		top: 0;
		z-index: 40;
		display: flex;
		min-height: 38px;
		align-items: flex-start;
		gap: 10px;
		margin-bottom: 4px;
		padding: 0;
		background: var(--bpal-white);
		border-bottom: 1px solid rgba(14, 39, 66, 0.1);
	}

	.bpal-catalog-layout.is-enhanced .bpal-catalog-sticky-tools > .bpal-filter-chips:not(:empty),
	.bpal-catalog-layout.bpal-catalog-layout--server-ready .bpal-catalog-sticky-tools > .bpal-filter-chips:not(:empty) {
		position: static;
		top: auto;
		z-index: auto;
		min-width: 0;
		max-height: min(40vh, 240px);
		flex: 1 1 auto;
		margin-bottom: 0;
		padding: 3px 0;
		border-bottom: 0;
	}

	/* The filter panel has no scrollbar of its own. It sticks only once catalog-scroll.js has reported its height
	   (data-bpal-panel-sized): a panel that is shorter than the viewport sticks by its top edge, one that is higher
	   sticks by its bottom edge (a negative top), so all of it can be reached by scrolling the page. Until then, and
	   without a script, it scrolls with the page, whole. */
	body.bpal-is-product-overview .bpal-catalog-layout.is-enhanced .bpal-filter-panel[data-bpal-panel-sized],
	body.bpal-is-product-overview .bpal-catalog-layout.bpal-catalog-layout--server-ready .bpal-filter-panel[data-bpal-panel-sized] {
		position: sticky;
		top: min(var(--bpal-filter-sticky-top), calc(100vh - var(--bpal-filter-panel-height) - 24px));
	}

	body.bpal-is-product-overview .bpal-catalog-layout .bpal-catalog-toolbar {
		scroll-margin-top: 56px;
	}

	.bpal-catalog-quick-actions {
		display: flex;
		flex: 0 0 auto;
		align-items: center;
		gap: 2px;
		margin-left: auto;
	}

	.bpal-catalog-quick-actions .bpal-header-action {
		width: 42px;
		height: 42px;
	}
}

/* Theme 0.33.7: account and bag in the bar only stand in for the site header, which scrolls away on overviews, so
   they show while the bar is stuck against the top (catalog-scroll.js sets .is-stuck). At the top of the page the
   header shows the same links, and a second pair beside the chips looked misplaced.
   Only with scripting: without it nothing could ever show them. The script marks a browser without
   IntersectionObserver .is-static, which keeps the icons as before. */
@media (min-width: 1024px) and (scripting: enabled) {
	/* Hidden, not removed: their space stays, so the chips do not move when they appear. visibility also takes
	   them out of the tab order while they are not shown. */
	.bpal-catalog-layout .bpal-catalog-sticky-tools:not(.is-static) .bpal-catalog-quick-actions {
		opacity: 0;
		visibility: hidden;
		transition: opacity 120ms ease, visibility 0s linear 120ms;
	}

	.bpal-catalog-layout .bpal-catalog-sticky-tools.is-stuck .bpal-catalog-quick-actions {
		opacity: 1;
		visibility: visible;
		transition-delay: 0s;
	}

	/* No active filters: the bar would be an empty strip of about 43 px between the toolbar and the first cards. It
	   takes no height then; the icons hang below it and a white strip with the bar's line is drawn behind them while
	   stuck. Its height stays 0 in both states, so nothing moves when the bar sticks. */
	.bpal-catalog-layout .bpal-catalog-sticky-tools:not(.is-static):has(> .bpal-filter-chips:empty) {
		height: 0;
		min-height: 0;
		margin-bottom: 0;
		background: transparent;
		border-bottom: 0;
	}

	.bpal-catalog-layout .bpal-catalog-sticky-tools:not(.is-static):has(> .bpal-filter-chips:empty)::before {
		content: "";
		position: absolute;
		z-index: -1;
		top: 0;
		right: 0;
		left: 0;
		height: 43px;
		background: var(--bpal-white);
		border-bottom: 1px solid rgba(14, 39, 66, 0.1);
		opacity: 0;
		transition: opacity 120ms ease;
	}

	.bpal-catalog-layout .bpal-catalog-sticky-tools.is-stuck:not(.is-static):has(> .bpal-filter-chips:empty)::before {
		opacity: 1;
	}
}

/* Same selectors as above: a shorter one would lose on specificity. */
@media (min-width: 1024px) and (scripting: enabled) and (prefers-reduced-motion: reduce) {
	.bpal-catalog-layout .bpal-catalog-sticky-tools:not(.is-static) .bpal-catalog-quick-actions,
	.bpal-catalog-layout .bpal-catalog-sticky-tools:not(.is-static):has(> .bpal-filter-chips:empty)::before {
		transition: none;
	}
}

/* Mobile chips keep their original sticky rules and header iconography. */
@media (max-width: 1023px) {
	.bpal-catalog-sticky-tools { display: contents; }
	.bpal-catalog-quick-actions { display: none; }

	body.bpal-filter-panel-open {
		overscroll-behavior: none;
	}

	body.bpal-is-product-overview .bpal-catalog-layout.is-enhanced .bpal-filter-panel,
	body.bpal-is-product-overview .bpal-catalog-layout.bpal-catalog-layout--server-ready .bpal-filter-panel {
		top: 0;
		bottom: auto;
		height: var(--bpal-filter-viewport-height, 100dvh);
		max-height: var(--bpal-filter-viewport-height, 100dvh);
		overflow: hidden;
		overscroll-behavior: none;
	}

	body.bpal-is-product-overview .bpal-filter-groups {
		min-height: 0;
		overflow-x: hidden;
		overflow-y: auto;
		overscroll-behavior-x: none;
		overscroll-behavior-y: contain;
		scrollbar-gutter: stable;
		-webkit-overflow-scrolling: touch;
	}
}

/* Theme v0.5.0: interaction parity and native gesture ownership. */
.bpal-filter-price input[type="range"] {
	touch-action: pan-x;
}

@media (min-width: 1024px) {
	.bpal-catalog-layout.is-enhanced .bpal-filter-chips:not(:empty),
	.bpal-catalog-layout.bpal-catalog-layout--server-ready .bpal-filter-chips:not(:empty) {
		overscroll-behavior-x: contain;
		overscroll-behavior-y: auto;
	}
}

@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) {
		overscroll-behavior-x: contain;
		overscroll-behavior-y: auto;
	}
}
