/* Pioniro Gallery — tiled layouts. Sizes come from flex ratios set inline by PHP. */
.pioniro-gallery {
	--pg-gap: 4px;
	display: flex;
	flex-direction: column;
	gap: var(--pg-gap);
	margin-block: 0 1.5em;
	clear: both;
}
.pioniro-gallery .pg-row {
	display: flex;
	gap: var(--pg-gap);
	aspect-ratio: var(--pg-ratio);
}
.pioniro-gallery .pg-group {
	display: flex;
	flex-direction: column;
	gap: var(--pg-gap);
	flex: var(--pg-grow) 1 0;
	min-width: 0;
}
.pioniro-gallery .pg-item {
	flex: var(--pg-grow) 1 0;
	position: relative;
	min-width: 0;
	min-height: 0;
	margin: 0;
	padding: 0;
	overflow: hidden;
}
.pioniro-gallery .pg-row--grid .pg-item {
	flex: 1 1 0;
	aspect-ratio: 1;
}
.pioniro-gallery .pg-item a,
.pioniro-gallery .pg-item > img {
	position: absolute;
	inset: 0;
}
.pioniro-gallery .pg-item a {
	display: block;
	border: 0;
	box-shadow: none;
	background: none;
}
.pioniro-gallery .pg-item img {
	display: block;
	width: 100%;
	height: 100% !important; /* Themes often force height: auto on content images. */
	max-width: none;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	object-fit: cover;
}
.pioniro-gallery.pioniro-carousel .pg-item img {
	cursor: zoom-in;
}

/* Circles */
.pioniro-gallery--circle .pg-item {
	border-radius: 50%;
}
.pioniro-gallery--circle .pg-caption {
	display: none;
}

/* Captions: on hover/focus, always visible on touch screens. */
.pioniro-gallery .pg-caption {
	position: absolute;
	inset: auto 0 0;
	margin: 0;
	padding: 8px 10px;
	background: rgb(255 255 255 / 0.85);
	color: #222;
	font-size: 13px;
	line-height: 1.4;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	opacity: 0;
	transform: translateY(100%);
	transition: opacity 0.2s, transform 0.2s;
	pointer-events: none;
}
.pioniro-gallery .pg-item:hover .pg-caption,
.pioniro-gallery .pg-item:focus-within .pg-caption {
	opacity: 1;
	transform: none;
}
@media (hover: none) {
	.pioniro-gallery .pg-caption {
		opacity: 1;
		transform: none;
	}
}
.pioniro-gallery .pg-gallery-caption {
	text-align: center;
	font-size: 0.9em;
}
@media (prefers-reduced-motion: reduce) {
	.pioniro-gallery .pg-caption {
		transition: none;
	}
}
