/* 1.4.116 additions. Loaded after the main stylesheets on every page. */

/* Article rows become a slider when more cards are added than fit across the
   row (three on the home page, four elsewhere), using the theme's own arrows. */
@media (min-width: 1101px) {
	.blog[data-home-blog] .blog-grid:has(> .blog-card:nth-child(4)),
	.blog:not([data-home-blog]) .blog-grid:not(.blog-archive-grid):has(> .blog-card:nth-child(5)) {
		display: flex;
		overflow: auto hidden;
		scroll-snap-type: x mandatory;
	}
	.blog[data-home-blog] .blog-grid:has(> .blog-card:nth-child(4)) > .blog-card {
		flex: 0 0 calc((100% - 2 * var(--s3)) / 3);
		min-width: 0;
		scroll-snap-align: start;
	}
	.blog:not([data-home-blog]) .blog-grid:not(.blog-archive-grid):has(> .blog-card:nth-child(5)) > .blog-card {
		flex: 0 0 calc((100% - 3 * var(--s3)) / 4);
		min-width: 0;
		scroll-snap-align: start;
	}
	.blog .blog-grid:has(> .blog-card:nth-child(4)) ~ .slider-bottom-controls:not(.is-static),
	.blog .slider-control-host:has(.blog-grid > .blog-card:nth-child(4)) .slider-bottom-controls:not(.is-static) {
		display: flex;
	}
}

/* Card layout chosen in the editor (Card layout panel): grid or slider. */
.alarmto-cols-1 { --alarmto-cols: 1; }
.alarmto-cols-2 { --alarmto-cols: 2; }
.alarmto-cols-3 { --alarmto-cols: 3; }
.alarmto-cols-4 { --alarmto-cols: 4; }
.alarmto-cols-5 { --alarmto-cols: 5; }
.alarmto-layout-grid,
.alarmto-layout-slider {
	--alarmto-gap: var(--s3, 12px);
	gap: var(--alarmto-gap) !important;
}
.alarmto-layout-grid {
	display: grid !important;
	grid-template-columns: repeat(var(--alarmto-cols, 3), minmax(0, 1fr)) !important;
	grid-auto-flow: row !important;
	overflow: visible !important;
}
.alarmto-layout-grid > * {
	flex: none !important;
	width: auto !important;
	min-width: 0 !important;
	max-width: none !important;
}
.alarmto-layout-slider {
	display: flex !important;
	flex-wrap: nowrap !important;
	overflow: auto hidden !important;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	overscroll-behavior-x: contain;
}
.alarmto-layout-slider::-webkit-scrollbar { display: none; }
.alarmto-layout-slider > * {
	flex: 0 0 calc((100% - (var(--alarmto-cols, 3) - 1) * var(--alarmto-gap)) / var(--alarmto-cols, 3)) !important;
	width: auto !important;
	min-width: 0 !important;
	max-width: none !important;
	scroll-snap-align: start;
}
@media (max-width: 1100px) {
	.alarmto-layout-grid:not(.alarmto-cols-1) { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
	.alarmto-layout-slider:not(.alarmto-cols-1) > * { flex-basis: calc((100% - var(--alarmto-gap)) / 2) !important; }
}
@media (max-width: 760px) {
	.alarmto-layout-grid { grid-template-columns: minmax(0, 1fr) !important; }
	.alarmto-layout-slider > * { flex-basis: 85% !important; }
}
/* Arrows added for sliders the theme does not already control. */
.alarmto-slider-arrows {
	display: flex;
	justify-content: center;
	gap: 12px;
	margin-top: 16px;
}
.alarmto-slider-arrows.is-static { display: none; }
