/**
 * Site-wide lightbox rule - trigger affordance only.
 *
 * Every bit of popup chrome already exists in the compiled style.css (69 mfp-
 * rules, built from sass/plugins/). All this file adds is the cue on the
 * images the rule actually enabled, plus two corrections for the fact that the
 * image now sits inside an anchor that did not used to be there.
 *
 * It lives here rather than in sass/ because style.css is a CodeKit build and
 * cannot be recompiled in this environment - hand-edits to it would be thrown
 * away by the next compile. css/video-facade.css sits outside sass/ for the
 * same reason.
 */

a.lightbox-link {
	text-decoration: none;
	border: 0;
}

/*
 * inc/lightbox.php copies the alignment class onto the anchor, because the
 * anchor is what owns the box now. .aligncenter is display:block with auto
 * margins (style.css:2242), so without this the anchor would span the whole
 * column and the click target would extend far past the image. Browsers with
 * no fit-content support fall back to that full-width block, where the image's
 * own auto margins still centre it correctly.
 */
a.lightbox-link.aligncenter {
	width: -moz-fit-content;
	width: fit-content;
}

/*
 * .alignleft / .alignright float and add a 1.5em side margin. Now that the
 * anchor carries them, the image inside must not apply them a second time.
 */
a.lightbox-link.alignleft > img,
a.lightbox-link.alignright > img {
	float: none;
	margin-left: 0;
	margin-right: 0;
}

/*
 * Only images the rule enabled advertise themselves. Links that did not
 * qualify have had their href removed in js/lightbox.js, so they already
 * present as plain images.
 */
a.lightbox-link.lightbox-enabled {
	cursor: zoom-in;
}

a.lightbox-link.lightbox-enabled:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
}
