/* Photo viewer: soft white backdrop, rounded photo, quiet round controls. Uses theme tokens with fallbacks. */
html.fwc-lb-open {
	overflow: hidden;
}

.fwc-lb {
	--lb-ink: var(--wp--preset--color--ink, #2a2420);
	--lb-muted: var(--wp--preset--color--muted, #675e57);
	--lb-line: var(--wp--preset--color--line, #e4ded7);
	--lb-accent: var(--wp--preset--color--caramel, #9e5b1c);
	position: fixed;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	max-height: none;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--lb-ink);
	display: grid;
	grid-template-columns: 4.5rem 1fr 4.5rem;
	grid-template-rows: auto minmax(0, 1fr);
	align-items: center;
	overflow: hidden;
}

.fwc-lb:not([open]) {
	display: none;
}

.fwc-lb::backdrop {
	background: rgba(250, 248, 245, 0.97);
	backdrop-filter: blur(10px);
}

.fwc-lb[open] {
	animation: fwc-lb-in 0.32s cubic-bezier(0.16, 1, 0.3, 1);
}

.fwc-lb[open]::backdrop {
	animation: fwc-lb-fade 0.32s ease-out;
}

.fwc-lb.is-closing,
.fwc-lb.is-closing::backdrop {
	opacity: 0;
	transition: opacity 0.18s ease-in;
}

.fwc-lb__bar {
	grid-column: 1 / -1;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	padding: max(1rem, env(safe-area-inset-top)) 1rem 0.5rem;
	min-height: 3.75rem;
}

.fwc-lb__count {
	font-size: 0.8125rem;
	letter-spacing: 0.14em;
	color: var(--lb-muted);
	font-variant-numeric: tabular-nums;
}

.fwc-lb__btn {
	display: inline-grid;
	place-items: center;
	width: 2.75rem;
	height: 2.75rem;
	border-radius: 999px;
	border: 1px solid var(--lb-line);
	background: #fff;
	color: var(--lb-ink);
	cursor: pointer;
	box-shadow: 0 6px 20px -12px rgba(42, 36, 32, 0.35);
	transition: transform 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.fwc-lb__btn:hover {
	color: var(--lb-accent);
	border-color: var(--lb-accent);
	transform: scale(1.05);
}

.fwc-lb__btn:focus-visible {
	outline: 2px solid var(--lb-accent);
	outline-offset: 3px;
}

.fwc-lb__close {
	position: absolute;
	right: 1rem;
	top: max(1rem, env(safe-area-inset-top));
}

.fwc-lb__nav {
	justify-self: center;
}

.fwc-lb.is-single .fwc-lb__nav {
	visibility: hidden;
}

.fwc-lb__stage {
	margin: 0;
	height: 100%;
	min-height: 0;
	display: grid;
	grid-template-rows: minmax(0, 1fr) auto;
	justify-items: center;
	gap: 1.1rem;
	padding-bottom: max(1.5rem, env(safe-area-inset-bottom));
}

.fwc-lb__frame {
	min-height: 0;
	width: 100%;
	display: grid;
	place-items: center;
	touch-action: pan-y;
}

.fwc-lb__img {
	max-width: 100%;
	max-height: calc(100dvh - 10.5rem);
	width: auto;
	height: auto;
	object-fit: contain;
	border-radius: var(--wp--preset--border-radius--medium, 16px);
	box-shadow: 0 30px 70px -35px rgba(42, 36, 32, 0.45);
	transition: opacity 0.28s ease, transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
	user-select: none;
	-webkit-user-drag: none;
}

.fwc-lb__img.is-leaving {
	opacity: 0;
}

.fwc-lb[data-dir="next"] .fwc-lb__img.is-leaving {
	transform: translateX(-14px);
}

.fwc-lb[data-dir="prev"] .fwc-lb__img.is-leaving {
	transform: translateX(14px);
}

.fwc-lb__caption {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 0.5rem 1.5rem;
	text-align: center;
	padding: 0 1rem;
}

.fwc-lb__title {
	font-family: var(--wp--preset--font-family--script, cursive);
	font-size: clamp(1.75rem, 3vw, 2.25rem);
	line-height: 1.1;
}

.fwc-lb__title:empty {
	display: none;
}

.fwc-lb__links {
	display: inline-flex;
	align-items: center;
	gap: 1.25rem;
}

.fwc-lb__ask {
	background: var(--lb-accent);
	color: #fff;
	text-decoration: none;
	border-radius: 999px;
	padding: 0.6rem 1.25rem;
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	transition: background 0.2s ease;
}

.fwc-lb__ask:hover,
.fwc-lb__ask:focus-visible {
	background: var(--lb-ink);
	color: #fff;
}

.fwc-lb__view {
	color: var(--lb-ink);
	font-size: 0.8125rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	border-bottom: 1px solid var(--wp--preset--color--caramel-light, #dda868);
	padding-bottom: 0.2rem;
}

.fwc-lb__view:hover,
.fwc-lb__view:focus-visible {
	color: var(--lb-accent);
}

.fwc-lb a:focus-visible {
	outline: 2px solid var(--lb-accent);
	outline-offset: 3px;
}

/* Phones: arrows sit low at the sides, the photo gets the full width. */
@media (max-width: 700px) {
	.fwc-lb {
		grid-template-columns: 1fr;
		grid-template-rows: auto minmax(0, 1fr);
	}
	.fwc-lb__nav {
		position: absolute;
		bottom: max(1.25rem, env(safe-area-inset-bottom));
		z-index: 1;
	}
	.fwc-lb__prev {
		left: 1rem;
	}
	.fwc-lb__next {
		right: 1rem;
	}
	.fwc-lb__stage {
		grid-row: 2;
		padding-inline: 0.75rem;
		padding-bottom: 5rem;
	}
	.fwc-lb__links {
		gap: 1rem;
	}
	.fwc-lb__img {
		max-height: calc(100dvh - 17rem);
	}
}

@keyframes fwc-lb-in {
	from {
		opacity: 0;
		transform: scale(0.985);
	}
}

@keyframes fwc-lb-fade {
	from {
		opacity: 0;
	}
}

@media (prefers-reduced-motion: reduce) {
	.fwc-lb[open],
	.fwc-lb[open]::backdrop {
		animation: none;
	}
	.fwc-lb__img,
	.fwc-lb__btn {
		transition: none;
	}
	.fwc-lb[data-dir] .fwc-lb__img.is-leaving {
		transform: none;
	}
}

.fwc-lb__fav {
	display: inline-grid;
	place-items: center;
	width: 2.5rem;
	height: 2.5rem;
	border-radius: 999px;
	border: 1px solid var(--lb-line);
	background: #fff;
	color: var(--lb-ink);
	cursor: pointer;
}

.fwc-lb__fav[hidden] {
	display: none;
}

.fwc-lb__fav svg {
	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;
}

.fwc-lb__fav[aria-pressed="true"] {
	color: var(--lb-accent);
	border-color: var(--lb-accent);
}

.fwc-lb__fav[aria-pressed="true"] svg {
	fill: currentColor;
}

.fwc-lb__fav:focus-visible {
	outline: 2px solid var(--lb-accent);
	outline-offset: 3px;
}