/**
 * Single marketplace listing gallery (one image or slider).
 * Markup: iola_gazette_blocks_render_marketplace_gallery().
 *
 * Listings render inside the shared Kadence "Gazette Single Post" element,
 * so colors come from the theme's --global-palette* variables. Selectors are
 * scoped under .iola-marketplace-gallery to beat the theme's button:hover rules.
 */

/* Marketplace singles only: tighter gap between the title and the image. */
body.single-marketplace .entry-content h1.wp-block-kadence-advancedheading {
	margin-bottom: 0;
}

.iola-marketplace-listing__media--gallery {
	display: block;
	margin: 0 0 1.5rem;
	padding: 0;
}

/* Same 680px measure as the listing title and text. */
.iola-marketplace-gallery {
	margin-inline: auto;
	max-width: 42.5rem;
	position: relative;
	width: 100%;
}

.iola-marketplace-gallery__track {
	border-radius: 4px;
	display: flex;
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-behavior: smooth;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
}

.iola-marketplace-gallery__track::-webkit-scrollbar {
	display: none;
}

.iola-marketplace-gallery__track:focus {
	outline: none;
}

.iola-marketplace-gallery__track:focus-visible {
	outline: 2px solid var(--global-palette1, #088ccb);
	outline-offset: 2px;
}

.iola-marketplace-gallery__slide {
	align-items: center;
	aspect-ratio: 4 / 3;
	background: var(--global-palette7, #fcfcfc);
	display: flex;
	flex: 0 0 100%;
	justify-content: center;
	margin: 0;
	overflow: hidden;
	position: relative;
	scroll-snap-align: center;
}

/* Blurred copy of the photo fills the frame around short or tall images. */
.iola-marketplace-gallery__slide::before {
	background-image: var(--iola-gallery-backdrop, none);
	background-position: center;
	background-size: cover;
	content: "";
	filter: blur(24px) brightness(0.9);
	inset: -3rem;
	position: absolute;
}

.iola-marketplace-gallery:not(.iola-marketplace-gallery--slider) .iola-marketplace-gallery__slide {
	aspect-ratio: auto;
	background: transparent;
}

.iola-marketplace-gallery__image {
	display: block;
	height: 100%;
	object-fit: contain;
	position: relative;
	width: 100%;
}

.iola-marketplace-gallery:not(.iola-marketplace-gallery--slider) .iola-marketplace-gallery__image {
	height: auto;
}

/* Arrows: the theme's primary button (like "Today's paper"). */
.iola-marketplace-gallery .iola-marketplace-gallery__nav {
	align-items: center;
	background: var(--global-palette-btn-bg, #088ccb);
	border: 0;
	border-radius: 4px;
	box-shadow: none;
	color: var(--global-palette-btn, #fff);
	cursor: pointer;
	display: flex;
	font-size: 1.5rem;
	height: 2.5rem;
	justify-content: center;
	line-height: 1;
	padding: 0 0 0.2rem;
	position: absolute;
	top: calc(50% - 1.25rem - 1.25rem);
	transition: background-color 0.2s ease, opacity 0.2s ease;
	width: 2.5rem;
	z-index: 1;
}

.iola-marketplace-gallery .iola-marketplace-gallery__nav[hidden] {
	display: none;
}

.iola-marketplace-gallery .iola-marketplace-gallery__nav:hover,
.iola-marketplace-gallery .iola-marketplace-gallery__nav:focus,
.iola-marketplace-gallery .iola-marketplace-gallery__nav:active {
	background: var(--global-palette-btn-bg-hover, #0670a2);
	box-shadow: none;
	color: var(--global-palette-btn-hover, #fff);
}

.iola-marketplace-gallery .iola-marketplace-gallery__nav:focus {
	outline: none;
}

.iola-marketplace-gallery .iola-marketplace-gallery__nav:focus-visible {
	outline: 2px solid var(--global-palette3, #232424);
	outline-offset: 2px;
}

.iola-marketplace-gallery .iola-marketplace-gallery__nav:disabled {
	background: var(--global-palette-btn-bg, #088ccb);
	cursor: default;
	opacity: 0.3;
}

.iola-marketplace-gallery .iola-marketplace-gallery__nav--prev {
	left: 0.75rem;
}

.iola-marketplace-gallery .iola-marketplace-gallery__nav--next {
	right: 0.75rem;
}

.iola-marketplace-gallery__footer {
	align-items: center;
	display: flex;
	gap: 0.75rem;
	justify-content: center;
	margin-top: 0.75rem;
	min-height: 1.75rem;
}

.iola-marketplace-gallery__dots {
	display: flex;
	flex-wrap: wrap;
	gap: 0.125rem;
	justify-content: center;
}

.iola-marketplace-gallery__dots[hidden] {
	display: none;
}

/* Reset the theme's button look; only the ::before circle shows. */
.iola-marketplace-gallery .iola-marketplace-gallery__dot,
.iola-marketplace-gallery .iola-marketplace-gallery__dot:hover,
.iola-marketplace-gallery .iola-marketplace-gallery__dot:focus,
.iola-marketplace-gallery .iola-marketplace-gallery__dot:active {
	background: transparent;
	border: 0;
	border-radius: 50%;
	box-shadow: none;
	cursor: pointer;
	height: 1.5rem;
	outline: none;
	padding: 0;
	position: relative;
	width: 1.5rem;
}

.iola-marketplace-gallery .iola-marketplace-gallery__dot:focus-visible {
	outline: 2px solid var(--global-palette1, #088ccb);
}

.iola-marketplace-gallery__dot::before {
	background: var(--global-palette8, #dedede);
	border-radius: 50%;
	content: "";
	height: 0.5rem;
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	transition: background-color 0.2s ease;
	width: 0.5rem;
}

.iola-marketplace-gallery__dot:hover::before {
	background: var(--global-palette6, #777);
}

.iola-marketplace-gallery__dot[aria-current="true"]::before,
.iola-marketplace-gallery__dot[aria-current="true"]:hover::before {
	background: var(--global-palette1, #088ccb);
}

.iola-marketplace-gallery__count {
	color: var(--global-palette6, #777);
	font-size: 0.8125rem;
	margin: 0;
	white-space: nowrap;
}

.iola-marketplace-gallery .screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	height: 1px;
	overflow: hidden;
	position: absolute;
	white-space: nowrap;
	width: 1px;
}

@media (max-width: 600px) {
	.iola-marketplace-gallery .iola-marketplace-gallery__nav {
		font-size: 1.25rem;
		height: 2.25rem;
		top: calc(50% - 1.125rem - 1.25rem);
		width: 2.25rem;
	}

	.iola-marketplace-gallery .iola-marketplace-gallery__nav--prev {
		left: 0.5rem;
	}

	.iola-marketplace-gallery .iola-marketplace-gallery__nav--next {
		right: 0.5rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.iola-marketplace-gallery__track {
		scroll-behavior: auto;
	}

	.iola-marketplace-gallery .iola-marketplace-gallery__nav,
	.iola-marketplace-gallery__dot::before {
		transition: none;
	}
}