/**
 * Artwork Registry — Slider
 * ar-slider.css | ArtworkRegistry v1.3.3
 *
 * Loaded lazily only when [ar_slider] shortcode renders.
 */

/* ============================================================
   Container
   ============================================================ */

.ar-slider {
	position: relative;
	font-family: var(--wp--preset--font-family--primary, inherit);
	-webkit-user-select: none;
	user-select: none;
	background: transparent;
	border-radius: 0;
	box-shadow: none;
	--ar-slider-fade-duration: 650ms;
	--ar-slider-crossfade-duration: 900ms;
}

/* ============================================================
   Viewport — fixed height, no letterbox, no background
   ============================================================ */

.ar-slider__viewport {
	position: relative;
	height: clamp(260px, 60vw, 800px);
	overflow: hidden;
	background: transparent;
	border-radius: 0;
	box-shadow: none;
}

/* ============================================================
   Slides — stacked absolutely, centred
   ============================================================ */

.ar-slider__slide {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
}

.ar-slider__slide.is-active {
	pointer-events: auto;
}

.ar-slider__link {
	display: block;
	height: 100%;
	text-decoration: none;
	color: inherit;
}

.ar-slider__image {
	display: block;
	height: 100%;
	width: auto;
	max-width: 100%;
	background: transparent;
	border-radius: 0;
	box-shadow: none;
}

/* ============================================================
   Caption — below viewport, plain text
   ============================================================ */

.ar-slider__caption {
	display: flex;
	align-items: baseline;
	justify-content: center;
	flex-wrap: wrap;
	gap: 4px 10px;
	padding: 12px 0 0;
	min-height: 2.2em;
	text-align: center;
}

.ar-slider__caption--meta-left {
	justify-content: flex-start;
	text-align: left;
}

.ar-slider__caption--meta-center {
	justify-content: center;
	text-align: center;
}

.ar-slider__caption--meta-right {
	justify-content: flex-end;
	text-align: right;
}

.ar-slider__caption-title {
	font-family: var(--ar-font-body-selected, var(--wp--preset--font-family--primary, sans-serif));
	font-size: calc(14px * var(--ar-body-scale, 1));
	font-weight: 500;
	color: var(--ar-text-strong);
	letter-spacing: 0.01em;
}

.ar-slider__caption-year {
	font-family: var(--ar-font-body-selected, var(--wp--preset--font-family--primary, sans-serif));
	font-size: calc(13px * var(--ar-body-scale, 1));
	color: var(--ar-muted-strong);
}

.ar-slider__caption-desc {
	width: 100%;
	font-family: var(--ar-font-body-selected, var(--wp--preset--font-family--primary, sans-serif));
	font-size: calc(13px * var(--ar-body-scale, 1));
	color: var(--ar-muted-soft);
	line-height: 1.5;
}

/* ============================================================
   Arrows — hidden globally; sliders still autoplay/swipe/keyboard
   ============================================================ */

.ar-slider__arrow {
	display: none;
}

/* ============================================================
   Transitions — FADE
   ============================================================ */

.ar-slider[data-transition="fade"] .ar-slider__slide {
	opacity: 0;
	transition: opacity var(--ar-slider-fade-duration) ease;
}

.ar-slider[data-transition="fade"] .ar-slider__slide.is-active {
	opacity: 1;
}

/* ============================================================
   Transitions — CROSSFADE (fade + subtle zoom)
   ============================================================ */

.ar-slider[data-transition="crossfade"] .ar-slider__slide {
	opacity: 0;
	transform: scale(1.04);
	transition: opacity var(--ar-slider-crossfade-duration) ease, transform var(--ar-slider-crossfade-duration) ease;
}

.ar-slider[data-transition="crossfade"] .ar-slider__slide.is-active {
	opacity: 1;
	transform: scale(1);
}

/* ============================================================
   Transitions — SLIDE (managed via inline styles in JS)
   ============================================================ */

.ar-slider[data-transition="slide"] .ar-slider__slide {
	opacity: 0;
}

.ar-slider[data-transition="slide"] .ar-slider__slide.is-active {
	opacity: 1;
}

/* ============================================================
   Responsive
   ============================================================ */

@media (max-width: 480px) {
	.ar-slider__caption {
		padding: 10px 0 0;
	}

	.ar-slider__caption-title,
	.ar-slider__caption-year {
		font-size: calc(12px * var(--ar-body-scale, 1));
	}

	.ar-slider__caption-desc {
		display: none;
	}
}