/* Instant Frames Gallery – front-end styles. */

.ifg {
	--ifg-width: 260px;
	--ifg-gap: 28px;
	--ifg-frame: #fff;
	--ifg-caption-color: #333;
	--ifg-bg: transparent;
	--ifg-ratio: 1 / 1;
	/* Item width. Percentages resolve against the gallery's own content width. */
	--ifg-item-w: min(var(--ifg-width), 100%);
	--ifg-pad: min(calc(var(--ifg-item-w) * 0.06), 3vw);

	/* Fill the available width even when a parent shrink-wraps its content (common in Elementor
	   flex containers): 100vw gives the parent a large natural size, max-width:100% then clamps it. */
	width: 100vw;
	max-width: 100%;
	box-sizing: border-box;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
	gap: var(--ifg-gap);
	margin: 1.5em 0;
	padding: calc(var(--ifg-gap) / 2);
	background: var(--ifg-bg);
}

.ifg *,
.ifg *::before,
.ifg *::after {
	box-sizing: border-box;
}

.ifg--align-left { justify-content: flex-start; }
.ifg--align-right { justify-content: flex-end; }

.ifg-empty {
	padding: 1em;
	border: 1px dashed currentColor;
	text-align: center;
}

/* ---------------------------------------------------------------- Items */

.ifg-item {
	position: relative;
	flex: 0 0 auto;
	width: var(--ifg-item-w);
	margin: 0;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.ifg-link {
	display: block;
	color: inherit;
	text-decoration: none;
	box-shadow: none;
	cursor: pointer;
}
.ifg-link[data-ifg-lb] { cursor: zoom-in; }
.ifg-link:focus-visible { outline: 3px solid #2271b1; outline-offset: 2px; }

.ifg-photo {
	position: relative;
	display: block;
	overflow: hidden;
	aspect-ratio: var(--ifg-ratio);
	background: rgba(0, 0, 0, 0.06);
}
.ifg-photo img {
	/* Pinned to all four edges so the photo always fills the whole window, whatever the theme does to <img>. */
	position: absolute;
	inset: 0;
	display: block;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	min-height: 0;
	margin: 0 !important;
	padding: 0 !important;
	border: 0;
	border-radius: 0;
	object-fit: cover;
	object-position: center;
}
.ifg--ratio-original .ifg-photo { aspect-ratio: auto; }
.ifg--ratio-original .ifg-photo img,
.ifg--masonry .ifg-photo img {
	position: static;
	height: auto !important;
}

/* ------------------------------------------------------------- Polaroid */

.ifg--polaroid .ifg-item {
	padding: var(--ifg-pad) var(--ifg-pad) 0;
	background: var(--ifg-frame);
	transform: rotate(var(--ifg-rot, 0deg));
}
.ifg--polaroid.ifg--shadow .ifg-item {
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.18), 0 8px 18px rgba(0, 0, 0, 0.14);
}
.ifg--polaroid .ifg-photo::after {
	content: "";
	position: absolute;
	inset: 0;
	box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.28);
	pointer-events: none;
}
.ifg--polaroid.ifg--cap-hover .ifg-item,
.ifg--polaroid .ifg-item--nocap { padding-bottom: var(--ifg-pad); }

.ifg--polaroid.ifg--hover .ifg-item:hover,
.ifg--polaroid.ifg--hover .ifg-item:focus-within {
	z-index: 5;
	transform: rotate(0deg) scale(1.06);
}
.ifg--polaroid.ifg--hover.ifg--shadow .ifg-item:hover,
.ifg--polaroid.ifg--hover.ifg--shadow .ifg-item:focus-within {
	box-shadow: 0 6px 10px rgba(0, 0, 0, 0.2), 0 18px 34px rgba(0, 0, 0, 0.22);
}

/* ---------------------------------------------------------- Decorations */

.ifg--polaroid.ifg--deco-tape .ifg-item::before {
	content: "";
	position: absolute;
	top: -11px;
	left: 50%;
	z-index: 3;
	width: 34%;
	height: 24px;
	background: rgba(255, 236, 170, 0.7);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
	transform: translateX(-50%) rotate(-3deg);
	pointer-events: none;
}
.ifg--polaroid.ifg--deco-pin .ifg-item::before {
	content: "";
	position: absolute;
	top: -7px;
	left: 50%;
	z-index: 3;
	width: 16px;
	height: 16px;
	margin-left: -8px;
	border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, #ff8a80 0, #d32f2f 55%, #8e1b1b 100%);
	box-shadow: 0 3px 4px rgba(0, 0, 0, 0.35);
	pointer-events: none;
}

/* ------------------------------------------------------------- Captions */

.ifg-caption {
	display: block;
	margin: 0;
	color: var(--ifg-caption-color);
	font-size: 1rem;
	line-height: 1.3;
	text-align: center;
	overflow-wrap: anywhere;
}
.ifg--font-hand .ifg-caption {
	font-family: "Segoe Print", "Bradley Hand", "Chalkboard SE", "Marker Felt", "Comic Sans MS", cursive;
}
.ifg--font-serif .ifg-caption {
	font-family: Georgia, "Times New Roman", serif;
}

.ifg--polaroid.ifg--cap-below .ifg-caption {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 3.4em;
	padding: calc(var(--ifg-pad) * 0.5) 0;
}

.ifg--grid.ifg--cap-below .ifg-caption,
.ifg--masonry.ifg--cap-below .ifg-caption {
	margin-top: 0.5em;
	font-size: 0.9rem;
}

.ifg--cap-hover .ifg-caption {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	padding: 1.6em 0.8em 0.6em;
	color: #fff;
	background: linear-gradient(to top, rgba(0, 0, 0, 0.72), rgba(0, 0, 0, 0));
	opacity: 0;
	transition: opacity 0.2s ease;
	pointer-events: none;
}
.ifg--cap-hover .ifg-item:hover .ifg-caption,
.ifg--cap-hover .ifg-item:focus-within .ifg-caption {
	opacity: 1;
}
@media (hover: none) {
	.ifg--cap-hover .ifg-caption { opacity: 1; }
}

/* -------------------------------------------------- Grid & masonry extras */

.ifg--grid .ifg-photo { border-radius: 4px; }
.ifg--masonry .ifg-photo { border-radius: 4px; aspect-ratio: auto; }

.ifg--masonry {
	display: block;
	column-width: var(--ifg-width);
	column-gap: var(--ifg-gap);
}
.ifg--masonry .ifg-item {
	width: auto;
	margin: 0 0 var(--ifg-gap);
	break-inside: avoid;
}

/* --------------------------------------------------------------- Mobile */

/* Photos per row: desktop, then tablet, then phone. */
.ifg--fixd {
	--ifg-cols: var(--ifg-cols-d);
	--ifg-item-w: calc((100% - (var(--ifg-cols) - 1) * var(--ifg-gap)) / var(--ifg-cols) - 0.1px);
}
.ifg--masonry.ifg--fixd { column-width: auto; column-count: var(--ifg-cols-d); }

@media (max-width: 900px) {
	.ifg { --ifg-item-w: min(var(--ifg-width), 100%); }
	.ifg--masonry { column-width: var(--ifg-width); column-count: auto; }
	.ifg--fixt {
		--ifg-cols: var(--ifg-cols-t);
		--ifg-item-w: calc((100% - (var(--ifg-cols) - 1) * var(--ifg-gap)) / var(--ifg-cols) - 0.1px);
	}
	.ifg--masonry.ifg--fixt { column-width: auto; column-count: var(--ifg-cols-t); }
}

@media (max-width: 560px) {
	.ifg { --ifg-item-w: min(var(--ifg-width), 100%); }
	.ifg--masonry { column-width: var(--ifg-width); column-count: auto; }
	.ifg--fixm {
		--ifg-cols: var(--ifg-cols-m);
		--ifg-item-w: calc((100% - (var(--ifg-cols) - 1) * var(--ifg-gap)) / var(--ifg-cols) - 0.1px);
	}
	.ifg--masonry.ifg--fixm { column-width: auto; column-count: var(--ifg-cols-m); }
}

@media (prefers-reduced-motion: reduce) {
	.ifg-item,
	.ifg--cap-hover .ifg-caption { transition: none; }
}

/* ------------------------------------------------------------- Lightbox */

html.ifg-lb-open { overflow: hidden; }

.ifg-lb {
	--ifg-frame: #fff;
	--ifg-caption-color: #333;
	position: fixed;
	inset: 0;
	z-index: 999999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 3vh 4vw;
	background: rgba(10, 10, 10, 0.9);
}
.ifg-lb[hidden] { display: none; }

.ifg-lb__figure {
	position: relative;
	display: flex;
	flex-direction: column;
	max-width: 100%;
	margin: 0;
}
.ifg-lb__img {
	display: block;
	max-width: min(92vw, 1400px);
	max-height: 78vh;
	width: auto;
	height: auto;
	margin: 0 auto;
	object-fit: contain;
	transition: opacity 0.2s ease;
}
.ifg-lb--loading .ifg-lb__img { opacity: 0.25; }

.ifg-lb__caption {
	margin: 0;
	padding: 0.7em 0.5em 0;
	color: #fff;
	font-size: 1rem;
	line-height: 1.4;
	text-align: center;
}
.ifg-lb__caption:empty { display: none; }

.ifg-lb--polaroid .ifg-lb__figure {
	padding: 14px 14px 0;
	background: var(--ifg-frame);
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5);
}
.ifg-lb--polaroid .ifg-lb__img { max-height: 70vh; }
.ifg-lb--polaroid .ifg-lb__caption {
	min-height: 56px;
	padding: 14px 6px;
	color: var(--ifg-caption-color);
	font-size: 1.1rem;
}
.ifg-lb--polaroid .ifg-lb__caption:empty { display: block; }
.ifg-lb--polaroid[data-font="hand"] .ifg-lb__caption {
	font-family: "Segoe Print", "Bradley Hand", "Chalkboard SE", "Marker Felt", "Comic Sans MS", cursive;
}
.ifg-lb--polaroid[data-font="serif"] .ifg-lb__caption {
	font-family: Georgia, "Times New Roman", serif;
}

.ifg-lb__btn {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	color: #fff;
	font-size: 28px;
	line-height: 1;
	background: rgba(255, 255, 255, 0.14);
	cursor: pointer;
	transition: background 0.15s ease;
}
.ifg-lb__btn:hover { background: rgba(255, 255, 255, 0.3); }
.ifg-lb__btn:focus-visible { outline: 3px solid #fff; outline-offset: 2px; }
.ifg-lb__close { top: 14px; right: 14px; }
.ifg-lb__prev { top: 50%; left: 12px; transform: translateY(-50%); }
.ifg-lb__next { top: 50%; right: 12px; transform: translateY(-50%); }
.ifg-lb__count {
	position: absolute;
	top: 22px;
	left: 20px;
	color: #fff;
	font-size: 14px;
	opacity: 0.8;
}

@media (prefers-reduced-motion: reduce) {
	.ifg-lb__img,
	.ifg-lb__btn { transition: none; }
}