.wp-block-group.alignfull:has(.is-style-slider-mobile-grid),
.wp-block-group.alignfull:has(.is-style-slider),
.wp-block-group.alignfull:has(.is-style-slider-mobile) {
	overflow: hidden;
}

/* Navigation container — match production frontend.css */
.slider-nav {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	width: 100%;
	margin-top: var(--wp--preset--spacing--60);
}

.slider-nav--hidden {
	display: none;
}

/* Arrows — production size + Qterra blue (#1251c2) */
.slider-arrow {
	width: 25px;
	height: 25px;
	border-radius: 50%;
	border: 0;
	cursor: pointer;
	display: grid;
	place-items: center;
	line-height: 1;
	font-size: 17px;
	padding: 0;
	background: #5C9AFF;
	color: var(--wp--preset--color--base, #fff);
}

.slider-arrow svg {
	display: block;
	width: 1em;
	height: 1em;
}

.slider-arrow--prev {
	justify-self: start;
}

.slider-arrow--next {
	justify-self: end;
}

.slider-arrow:disabled {
	cursor: default;
	background: var(--wp--preset--color--midtone);
	color: var(--wp--preset--color--base, #fff);
	opacity: 1;
}

/* Dots — white with blue border; active = blue (not primary orange) */
.slider-dots {
	justify-self: center;
	display: flex;
	gap: 4px;
}

.slider-dot {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background-color: #fff;
	border: 1px solid #5C9AFF;
	cursor: pointer;
	padding: 0;
}

.slider-dot.is-active {
	background-color: #5C9AFF;
	border-color: #5C9AFF;
}

/* Mobile Grid Slider */
.editor-styles-wrapper .wp-block-query.is-style-slider ul.wp-block-post-template,
.editor-styles-wrapper .wp-block-query.is-style-slider-mobile-grid ul.wp-block-post-template {
	display: flex !important;
	flex-wrap: nowrap !important;
	gap: var(--wp--preset--spacing--50, 24px);
	overflow-x: auto !important;
	overflow-y: hidden !important;
	padding-bottom: 8px;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
}

.editor-styles-wrapper .wp-block-query.is-style-slider ul.wp-block-post-template > li {
	flex: 0 0 calc((100% - (4 * var(--wp--preset--spacing--50, 24px))) / 5);
	min-width: calc((100% - (4 * var(--wp--preset--spacing--50, 24px))) / 5);
	scroll-snap-align: start;
}

.editor-styles-wrapper .wp-block-query.is-style-slider ul.wp-block-post-template:active {
	cursor: grabbing;
}

@media screen and (max-width: 767px) {
	.wp-block-post-template.keen-slider:has(.ks-page) {
		width: 100%;
		overflow: hidden;
	}
}
