/* Winners gallery page styles.
 *
 * Lifted out of template-aivagallery.php, which carried two separate inline <style> blocks —
 * one above the markup and one at the very bottom, after the scripts. Everything below the
 * first two rules came from that second block and was missed on the first pass, which is why
 * the award seal and the pagination lost their styling.
 *
 * Version: 2026.08.25.05
 */

.filter-select { max-width: 250px; }
.winners-gallery .winner-item:nth-child(n+4) { display: block !important; }

/* The award seal hangs past the top-right corner of the card, positioned against
 * .winner-item__link — .winner-item__image is overflow:hidden and would clip it. */
.winner-item__badge {
	position: absolute;
	z-index: 2;
	width: 95px;
	right: -20px;
	top: -20px;
	display: block;
}

.fancybox-container.fancybox-show-controls { display: none !important; }

.navigation { padding-top: 50px; }

/*
 * Pagination.
 *
 * The shared runtime renders real <button> elements with a disabled attribute in place of the
 * href="#"-plus-onclick anchors this page used to emit, so the original .paging__list /
 * .paging__item / .paging__link selectors matched nothing at all and the control rendered
 * unstyled. Same measurements, colours and divider, restated against the markup that is
 * actually there.
 *
 * The chevrons were <span class="paging__link--icon">&lt;</span> inside the link text, which a
 * screen reader reads out as part of the control's name. As generated content they stay
 * decorative and keep the hover nudge the original had.
 */
.rm-winners__pagination {
	padding: 11px 0;
	color: #6b6b6b;
	font-size: 18px;
}

.rm-winners__pagination ul {
	display: flex;
	justify-content: center;
	margin: 0;
	padding: 0;
	list-style: none;
}

.rm-winners__pagination li {
	position: relative;
	padding: 0 6px;
}

.rm-winners__pagination li:after {
	content: "";
	left: 0;
	top: 4px;
	bottom: 4px;
	width: 1px;
	position: absolute;
	background-color: currentColor;
}

.rm-winners__pagination li:first-child:after { display: none; }

.rm-winners__pagination button {
	/* A button inherits neither the anchor's colour nor its type. */
	-webkit-appearance: none;
	appearance: none;
	background: none;
	border: 0;
	margin: 0;
	padding: 0;
	font: inherit;
	cursor: pointer;
	text-decoration: none;
	color: #ff440f;
	display: inline-flex;
	align-items: center;
	gap: 0 4px;
}

.rm-winners__pagination button[disabled] {
	pointer-events: none;
	color: currentColor;
	cursor: default;
}

.rm-winners__pagination button:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

.rm-winners__pagination li:first-child button:before,
.rm-winners__pagination li:last-child button:after {
	transition: transform .35s cubic-bezier(.3, .86, .36, .95);
	line-height: 1;
	margin-top: -1px;
}

.rm-winners__pagination li:first-child button:before { content: "<"; }
.rm-winners__pagination li:last-child button:after { content: ">"; }

.rm-winners__pagination li:first-child button:hover:before { transform: translateX(-5px); }
.rm-winners__pagination li:last-child button:hover:after { transform: translateX(5px); }

@media (prefers-reduced-motion: reduce) {
	.rm-winners__pagination li:first-child button:before,
	.rm-winners__pagination li:last-child button:after {
		transition: none;
	}
}

/*
 * The copy-link control is a <button> rather than an <a href="#"> with an onclick, so that it
 * is announced and operated as the control it actually is. .share sets colour on a #121212
 * bar and a button inherits neither that colour nor the anchor's type, so it rendered as dark
 * text on a dark bar — effectively invisible. This makes the two controls identical again.
 */
.share__list--link {
	color: inherit;
}

button.share__list--link {
	padding: 0;
	border: 0;
	background: none;
	font: inherit;
	line-height: inherit;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
}

button.share__list--link:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

/*
 * Where a page change stops. The runtime scrolls the marked heading into view; this is the gap
 * left above it, and it is the one number that was per-site in the originals — this gallery
 * scrolled to `#winnerlisttitle` less 250px, which put the filter bar back on screen with it.
 */
[data-rm-winners-top] {
	scroll-margin-top: 250px;
}