/**
 * StayRent property slider layout refinements.
 *
 * Kept separate from the theme so shortcode sliders remain consistent in the
 * frontend fallback UI and Shortcode Studio as well.
 */

.srm-slider {
	min-width: 0;
	container-name: srm-property-slider;
	container-type: inline-size;
}

.srm-slider-track,
.srm-slider-luxury,
.srm-slider-overlay,
.srm-slider-editorial,
.srm-slider-glass,
.srm-slider-list,
.srm-slider-split,
.srm-slider-portrait {
	grid-auto-columns: 100%;
	overscroll-behavior-inline: contain;
}

.srm-slider-controls {
	z-index: 2;
}

.srm-slider-controls button:disabled {
	border-color: var(--srm-line, #e7e3e8);
	background: var(--srm-paper, #fff);
	box-shadow: none;
	color: var(--srm-ink-soft, #625d68);
	cursor: default;
	opacity: .42;
	pointer-events: none;
	transform: none;
}

@container srm-property-slider (min-width: 640px) {
	.srm-slider-track,
	.srm-slider-luxury,
	.srm-slider-overlay,
	.srm-slider-editorial,
	.srm-slider-glass,
	.srm-slider-list,
	.srm-slider-split,
	.srm-slider-portrait {
		grid-auto-columns: calc((100% - 20px) / 2);
	}

	.srm-slider-list,
	.srm-slider-split {
		grid-auto-columns: 100%;
	}
}

@container srm-property-slider (min-width: 1080px) {
	.srm-slider-track,
	.srm-slider-portrait {
		grid-auto-columns: calc((100% - 60px) / 4);
	}

	.srm-slider-luxury,
	.srm-slider-overlay,
	.srm-slider-editorial,
	.srm-slider-glass {
		grid-auto-columns: calc((100% - 40px) / 3);
	}

	.srm-slider-list,
	.srm-slider-split {
		grid-auto-columns: calc((100% - 20px) / 2);
	}
}