/* The Leimer look for the leimer-photos plugin. The plugin sets its defaults on .leimer-gallery
   itself, so these rules use "body .leimer-gallery" to win. Only the plugin's custom properties
   are set here: no Gallery template or block is overridden. */

body .leimer-gallery,
body .leimer-work-type-links--tiles,
body .leimer-work-type-links--single {
	--leimer-gallery-gap: var(--wp--preset--spacing--20);
	--leimer-gallery-row: 260px;
	--leimer-gallery-caption-bg: linear-gradient(transparent, color-mix(in srgb, var(--wp--preset--color--ink) 80%, transparent));
	--leimer-gallery-caption-color: var(--wp--preset--color--paper);
}

/* Phones: about two photos across at 160px high (the plugin default is 105px). */
@media (max-width: 640px) {
	body .leimer-gallery,
	body .leimer-work-type-links--tiles {
		--leimer-gallery-row: 160px;
		/* At 0.65 two 4:3 or 3:2 photos fit across a 360-390px screen; rows then land near 120-230px. */
		--leimer-gallery-fit: 0.65;
		--leimer-gallery-gap: var(--wp--preset--spacing--10);
	}
}

/* Focus ring in two tones so it shows on both light and dark photos. */
body .leimer-gallery__link:focus-visible,
body .leimer-work-type-tile:focus-visible {
	outline: 3px solid var(--wp--preset--color--accent-deep);
	outline-offset: -3px;
	box-shadow: inset 0 0 0 6px var(--wp--preset--color--paper);
}

/* Lightbox (PhotoSwipe): ink backdrop, paper icons and text, Inter. */
body .pswp {
	--pswp-bg: var(--wp--preset--color--ink);
	--pswp-placeholder-bg: var(--wp--preset--color--accent-deep);
	--pswp-icon-color: var(--wp--preset--color--paper);
	--pswp-icon-color-secondary: var(--wp--preset--color--ink);
	--pswp-icon-stroke-color: var(--wp--preset--color--ink);
	--pswp-preloader-color-secondary: var(--wp--preset--color--paper);
	font-family: var(--wp--preset--font-family--sans);
}

body .pswp .pswp__leimer-caption,
body .pswp .pswp__leimer-contact,
body .pswp .pswp__counter {
	color: var(--wp--preset--color--paper);
	font-family: var(--wp--preset--font-family--sans);
}

body .pswp .pswp__leimer-contact {
	border-color: var(--wp--preset--color--line);
}

body .pswp .pswp__leimer-contact:hover,
body .pswp .pswp__leimer-contact:focus-visible {
	background: var(--wp--preset--color--accent-deep);
	outline: 2px solid var(--wp--preset--color--paper);
	outline-offset: 2px;
}

body .pswp .pswp__button:focus-visible {
	outline: 2px solid var(--wp--preset--color--paper);
	outline-offset: 2px;
}

body .pswp .leimer-share__note {
	background: var(--wp--preset--color--paper);
	color: var(--wp--preset--color--ink);
	font-family: var(--wp--preset--font-family--sans);
}