/*
 * Hadof Reading V21.
 *
 * Keeps long catalogs visually ready and reduces control walls on narrow screens.
 */

:root {
	--hr21-surface: #edf2f4;
	--hr21-line: #d6dfe5;
	--hr21-copy: #526277;
	--hr21-blue: #245ac4;
}

/* A quiet solid surface reads as intentional while documentary media downloads. */
body.hadof-v2-content :is(
	.hx-route-grid,
	.hadof-equipment-grid,
	.hadof-case-grid,
	.hadof-v2-card-grid,
	.hx-case-catalog
) figure,
body.hadof-v2-content [data-hx-solution-card] figure {
	background-color: var(--hr21-surface) !important;
	background-image: none !important;
}

body.hadof-v2-content :is(
	.hx-route-grid,
	.hadof-equipment-grid,
	.hadof-case-grid,
	.hadof-v2-card-grid,
	.hx-case-catalog
) figure[data-hr21-image-error]::after,
body.hadof-v2-content [data-hx-solution-card] figure[data-hr21-image-error]::after {
	align-items: center;
	color: var(--hr21-copy);
	content: "Visual unavailable";
	display: flex;
	font-size: .78rem;
	inset: 0;
	justify-content: center;
	position: absolute;
}

/* Equipment cards keep the image useful without making each result a full screen. */
body.hadof-v2-content .hadof-equipment-card figure {
	height: clamp(220px, 18vw, 255px);
}

body.hadof-v2-content .hadof-equipment-card__actions {
	border-top: 1px solid var(--hr21-line) !important;
	gap: 0;
	margin-top: 1rem;
}

body.hadof-v2-content .hadof-equipment-card__actions label {
	background: transparent !important;
	color: var(--hr21-copy);
	min-height: 44px;
	padding: .65rem .25rem !important;
}

body.hadof-v2-content .hadof-equipment-card__actions label + label {
	border-left: 0 !important;
}

body.hadof-v2-content .hadof-equipment-card__actions input:checked + span {
	color: var(--hr21-blue);
}

@media (max-width: 720px) {
	/* Each filter group becomes one calm horizontal choice rail. */
	body.hadof-v2-content .hx-solutions-hub .hx-solution-finder__buttons,
	body.hadof-v2-content .hadof-equipment-filterbar [role="group"] {
		display: flex;
		flex-wrap: nowrap;
		overflow-x: auto;
		overflow-y: hidden;
		padding-bottom: .3rem;
		scroll-snap-type: x proximity;
		scrollbar-width: none;
	}

	body.hadof-v2-content .hx-solutions-hub .hx-solution-finder__buttons::-webkit-scrollbar,
	body.hadof-v2-content .hadof-equipment-filterbar [role="group"]::-webkit-scrollbar {
		display: none;
	}

	body.hadof-v2-content .hx-solutions-hub [data-hx-solution-filter],
	body.hadof-v2-content .hadof-equipment-filterbar [role="group"] button {
		flex: 0 0 auto;
		scroll-snap-align: start;
		white-space: nowrap;
	}

	body.hadof-v2-content .hx-solutions-hub .hx-solution-finder__controls {
		gap: 1.25rem;
		padding: 1.25rem;
	}

	body.hadof-v2-content .hadof-equipment-card figure {
		height: 220px;
	}
}