/* Mobile Slider – rules apply only when JS activated the slider (.is-slider-active). */

.is-slider-active .mobile-slider__swiper {
	width: 100%;
	min-width: 0;
}

/* ---------- Query Loop ---------- */

/* Overrides Post Template grid layout (display:grid, gap, columns). */
.is-slider-active .mobile-slider__swiper .wp-block-post-template.swiper-wrapper {
	display: flex;
	gap: 0;
	grid-template-columns: none;
	margin: 0;
	padding: 0;
	list-style: none;
}

.is-slider-active .mobile-slider__swiper .wp-block-post.swiper-slide {
	height: auto;
	margin: 0;
	box-sizing: border-box;
}

/* ---------- Columns ---------- */

.wp-block-columns.is-slider-active {
	flex-wrap: nowrap !important;
	align-items: stretch;
}

.wp-block-columns.is-slider-active > .mobile-slider__swiper {
	flex: 1 1 100%;
	margin: 0;
}

/* WP forces flex-basis:100% !important on columns on mobile — reset for slides. */
.wp-block-columns.is-slider-active .wp-block-column.swiper-slide {
	flex-basis: auto !important;
	flex-shrink: 0;
	height: auto;
	margin: 0;
	box-sizing: border-box;
}

/* Variant: first column (labels) fixed, the rest slide. */
.wp-block-columns.mobile-slider--fixed-first.is-slider-active {
	gap: 8px;
}

.wp-block-columns.mobile-slider--fixed-first.is-slider-active > .wp-block-column:first-child {
	flex: 0 0 50% !important;
	min-width: 0;
	overflow-wrap: anywhere;
	hyphens: auto;
}

/* ---------- Pagination (shared) ---------- */

.is-slider-active .mobile-slider__swiper .swiper-pagination {
	position: static;
	margin-top: var(--wp--preset--spacing--small, 1rem);
}

.is-slider-active .mobile-slider__swiper .swiper-pagination-bullet {
	width: 10px;
	height: 10px;
	background: var(--wp--preset--color--contrast, #000);
	opacity: 0.25;
}

.is-slider-active .mobile-slider__swiper .swiper-pagination-bullet-active {
	background: var(--wp--preset--color--accent-1, currentColor);
	opacity: 1;
}