/* Slider
======================================== */
.module-slider{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	display: grid;
	grid-template-rows: var(--height-header--s) 1fr var(--height-header--s);
	row-gap: var(--m-blocks);
	background-color: var(--color-bg);
	touch-action: pinch-zoom;
	z-index: 2;
}
.module-slider.transition{
	pointer-events: none;
}

/* Track */
.module-slider--track{
	grid-area: 1 / 1 / -1 / -1;
	display: grid;
	grid-auto-rows: 100%;
	grid-auto-columns: 100%;
	z-index: 1;
}

/* Slides */
.module-slider--slide{
	position: relative;
	width: 100%;
	height: 100%;
	grid-area: 1 / 1;
	overflow: hidden;
}
.module-slider--slide:not(.active){
	display: none;
}
.module-slider--slide:has(+ .active),
.module-slider--slide.active + .module-slider--slide,
.module-slider--track:has(> .active:last-child:not(:only-child)) > :first-child,
.module-slider--track:has(> .active:first-child:not(:only-child)) > :last-child{
	display: block;
	visibility: hidden;
	pointer-events: none;
}
.module-slider--slide:has(.lazy, .lazyvideo, .lazyload, .lazyloading),
.module-slider--slide:has(.lazy, .lazyvideo, .lazyload, .lazyloading) *{
	pointer-events: none !important;
}
.module-slider--slide:has(.lazy, .lazyvideo, .lazyload, .lazyloading, .autoplay-failed)::after{
	content: 'Loading…';
	position: absolute;
	top: 50%;
	left: 50%;
	font-family: var(--font-sans--300);
	font-size:   var(--font-sans--size-s);
	font-weight: 300;
	line-height: var(--font-sans--leading-s);
	transform: translate(-50%, -50%);
	pointer-events: none;
}
.module-slider--slide:has(.autoplay-failed)::after{
	content: 'Video playback failed';
}

/* Thumb */
.module-slider--slide .thumb{
	position: absolute;
	top: -1px;
	left: -1px;
	right: -1px;
	bottom: -1px;
	width: calc(100% + 2px);
	height: calc(100% + 2px);
	object-fit: contain;
}
.module-slider--slide .thumb.autoplay-failed{
	display: none;
}
@media (min-width: 841px){
	.module-slider--slide .thumb{
		pointer-events: all;
	}
}

/* Navigation */
.module-slider--prev,
.module-slider--next{
	width: 50%;
	height: 100%;
	grid-area: 2 / 1;
	cursor: none;
	pointer-events: all;
	z-index: 3;
}
.module-slider--next{
	justify-self: flex-end;
}
@media (min-width: 841px){
	.desktop .module-slider--prev,
	.desktop .module-slider--next{
		width: 30%;
	}
}

/* Header */
.module-slider--header{
	padding: 0 var(--page-sides--m);
	grid-area: 2 / 1;
	align-self: center;
	display: grid;
	grid-auto-flow: column;
	grid-auto-rows: min-content;
	grid-auto-columns: 1fr max-content;
	column-gap: var(--cols-items);
	align-items: center;
	-webkit-user-select: none;
		-moz-user-select: none;
		 -ms-user-select: none;
			  user-select: none;
	color: white;
	mix-blend-mode: difference;
	transition: opacity var(--global-speed) linear;
	pointer-events: none;
	z-index: 2;
}
body[data-layout="category"] .module-slider--header > *,
body[data-layout="series"] .module-slider--header > *{
	margin: var(--font-serif--mblock-m);
}
body[data-layout="moodboard"] .module-slider--header > *,
body[data-layout="project"] .module-slider--header > *{
	margin: var(--font-sans--mblock-m);
}
.module-slider:has(.active .lazy, .active .lazyvideo, .active .lazyload, .active .lazyloading) .module-slider--header{
	opacity: 0;
}

/* Info */
.module-slider--info{
	display: grid;
	grid-auto-rows: min-content;
}
.module-slider--caption:empty{
	display: none;
}
/* @media (min-width: 841px){
	.module-slider--counter{
		display: none;
	}
} */

/* Footer */
.module-slider--footer{
	position: relative;
	padding: var(--page-sides--s);
	grid-area: 3 / 1;
	align-self: flex-end;
	-webkit-user-select: none;
		-moz-user-select: none;
		 -ms-user-select: none;
			  user-select: none;
	color: white;
	mix-blend-mode: difference;
	transition: opacity var(--global-speed) linear;
	z-index: 2;
}
.module-slider:has(.active .lazy, .active .lazyvideo, .active .lazyload, .active .lazyloading) .module-slider--footer{
	opacity: 0;
}

/* Miniatures */
.module-slider--miniatures{
	--gap: calc(var(--page-sides--s) - var(--page-top));
	--col: calc(var(--page-sides--s)/2);
	padding: 0 var(--col) calc(var(--page-top) + var(--gap));
	grid-area: 3 / 1;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	z-index: 2;
}
.module-slider--miniature{
	padding: 0 var(--col);
	/* transition:
		filter var(--global-speed) var(--global-ease--movement),
		transform var(--global-speed) var(--global-ease--movement); */
	cursor: pointer;
}
.module-slider--miniature.active{
	pointer-events: none;
}
.module-slider--miniature.active,
.desktop .module-slider--miniature:hover{
	filter: grayscale(1) invert(1);
	/* transform: scale(.9); */
}
.module-slider--miniature .thumb{
	width: auto;
	height: calc(var(--height-logo) - var(--gap));
}
@media (max-width: 840px){
	.module-slider--miniatures{
		display: none !important;
	}
}