/**
 * Andrew Print Gallery
 *
 * Turns a Kadence Advanced Gallery (opted in with the "af-print-grid" class) into a
 * clean table-top print layout. The grid is a regular X-column set of invisible square
 * slots, and each image is centered inside its slot as an equal-area portrait or
 * landscape print.
 */

.af-print-grid.kb-gallery-ul,
.af-print-grid .kb-gallery-ul {
	display: grid !important;
	grid-template-columns: repeat(var(--af-cols, 3), minmax(0, 1fr));
	grid-auto-rows: auto;
	grid-auto-flow: row;
	gap: var(--af-gap, clamp(18px, 3vw, 44px));
	max-width: 100%;
	/* Kadence masonry/column layouts sometimes set these on the list itself. */
	margin: 0 auto;
	padding: 0;
	list-style: none;
}

/* Neutralize Kadence per-item column widths/margins so the grid controls sizing. */
.af-print-grid.kb-gallery-ul .kadence-blocks-gallery-item,
.af-print-grid .kadence-blocks-gallery-item {
	margin: 0 !important;
	width: auto !important;
	max-width: none !important;
	padding: 0 !important;
	position: static !important;
	top: auto !important;
	left: auto !important;
	transform: none !important;
	visibility: visible !important;
	opacity: 1 !important;
	grid-column: auto !important;
	grid-row: auto !important;
	aspect-ratio: 1 / 1;
	background: transparent;
	display: flex !important;
	align-items: center;
	justify-content: center;
	--af-print-width: 66.6667%;
	--af-print-height: 100%;
}

/* Equal-area print sizes inside each square slot. */
.af-print-grid.kb-gallery-ul .af-r23.af-port,
.af-print-grid .af-r23.af-port { --af-print-width: 66.6667%; --af-print-height: 100%; }
.af-print-grid.kb-gallery-ul .af-r23.af-land,
.af-print-grid .af-r23.af-land { --af-print-width: 100%; --af-print-height: 66.6667%; }
.af-print-grid.kb-gallery-ul .af-r34.af-port,
.af-print-grid .af-r34.af-port { --af-print-width: 75%; --af-print-height: 100%; }
.af-print-grid.kb-gallery-ul .af-r34.af-land,
.af-print-grid .af-r34.af-land { --af-print-width: 100%; --af-print-height: 75%; }

/* Center the print inside the slot. */
.af-print-grid.kb-gallery-ul .kadence-blocks-gallery-item-inner,
.af-print-grid.kb-gallery-ul .kb-gallery-figure,
.af-print-grid .kadence-blocks-gallery-item-inner,
.af-print-grid .kb-gallery-figure {
	display: flex !important;
	align-items: center;
	justify-content: center;
	height: 100%;
	width: 100%;
	max-width: none !important;
	margin: 0;
}

.af-print-grid.kb-gallery-ul .kb-gallery-item-link,
.af-print-grid .kb-gallery-item-link,
.af-print-grid.kb-gallery-ul .kb-gallery-figure:not(.kb-gallery-item-has-link) .kb-gal-image-radius,
.af-print-grid .kb-gallery-figure:not(.kb-gallery-item-has-link) .kb-gal-image-radius {
	display: block !important;
	width: var(--af-print-width) !important;
	height: var(--af-print-height) !important;
	max-width: none !important;
	margin: 0;
}

.af-print-grid.kb-gallery-ul .kb-gallery-item-link .kb-gal-image-radius,
.af-print-grid.kb-gallery-ul .kb-gallery-image-contain,
.af-print-grid.kb-gallery-ul .kb-gallery-image-contain picture,
.af-print-grid .kb-gallery-item-link .kb-gal-image-radius,
.af-print-grid .kb-gal-image-radius,
.af-print-grid .kb-gallery-image-contain,
.af-print-grid .kb-gallery-image-contain picture {
	display: block !important;
	height: 100%;
	width: 100%;
	max-width: none !important;
	margin: 0;
}

.af-print-grid.kb-gallery-ul .kadence-blocks-gallery-item .kadence-blocks-gallery-item-inner figure .kb-gallery-image-contain.kadence-blocks-gallery-intrinsic,
.af-print-grid .kb-gallery-ul .kadence-blocks-gallery-item .kadence-blocks-gallery-item-inner figure .kb-gallery-image-contain.kadence-blocks-gallery-intrinsic {
	height: 100% !important;
	position: static !important;
}

.af-print-grid.kb-gallery-ul .kb-gallery-image-contain,
.af-print-grid .kb-gallery-image-contain {
	padding-bottom: 0 !important;
}

.af-print-grid.kb-gallery-ul .kadence-blocks-gallery-item img,
.af-print-grid .kadence-blocks-gallery-item img {
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	object-fit: cover;
	display: block;
	position: static !important;
	top: auto !important;
	right: auto !important;
	bottom: auto !important;
	left: auto !important;
	visibility: visible !important;
	opacity: 1 !important;
}
