/**
 * Kategorie-Filter-Leiste (.cat-filter): Blog-/Archiv-Templates, horizontaler Scroll auf kleinen Viewports.
 */

.cat-filter {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 2rem;
}

@media (max-width: 781px) {
	.cat-filter {
		flex-wrap: nowrap;
		overflow-x: auto;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
		overscroll-behavior-x: contain;
		scrollbar-width: thin;
		padding-bottom: 4px;
		/* Über Seiten-/Root-Padding bis zum Viewport-Rand ausbrechen */
		margin-left: calc(-1 * var(--wp--style--root--padding-left, var(--wp--preset--spacing--medium, 1.5rem)));
		margin-right: calc(-1 * var(--wp--style--root--padding-right, var(--wp--preset--spacing--medium, 1.5rem)));
		padding-left: var(--wp--style--root--padding-left, var(--wp--preset--spacing--medium, 1.5rem));
		padding-right: var(--wp--style--root--padding-right, var(--wp--preset--spacing--medium, 1.5rem));
		box-sizing: border-box;
		width: auto;
		max-width: none;
	}

	.cat-filter > .wp-block-button,
	.cat-filter > button {
		flex: 0 0 auto;
	}
}

.cat-filter button {
	cursor: pointer;
}