/**
 * Preluence News — ad containers and layout protection.
 *
 * Styles only the theme's container around an ad: spacing, a neutral label,
 * reserved height (so the page does not jump when the ad arrives) and a
 * collapse when the network returns no ad. The ad itself is never restyled,
 * recoloured, animated or overlaid.
 */

/* ---------- Container ---------- */
.pn-ad {
	--pn-ad-h: var(--pn-ad-h-d, 0);
	position: relative;
	display: block;
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	margin-block: clamp(1.25rem, 3vw, 2rem);
	margin-inline: auto;
	padding-block: 0.5rem 0.75rem;
	border-block: 1px solid var(--pn-border);
	text-align: center;
	clear: both;
	overflow: hidden;
}

/* Distinct from editorial content: no card surface, no shadow, no hover. */
.pn-ad,
html[data-visual] .pn-ad {
	background: transparent;
	box-shadow: none;
	transform: none;
	filter: none;
	backdrop-filter: none;
	animation: none;
}

.pn-ad__label {
	display: block;
	margin-block-end: 0.4rem;
	color: var(--pn-text-muted);
	font-family: var(--pn-font-ui, inherit);
	font-size: 0.6875rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	line-height: 1.2;
	text-transform: uppercase;
}

.pn-ad__unit {
	display: block;
	width: 100%;
	max-width: var(--pn-ad-w, 100%);
	margin-inline: auto;
}

.pn-ad__unit > ins,
.pn-ad__unit iframe {
	max-width: 100%;
}

.pn-ad__image {
	display: block;
	max-width: 100%;
	height: auto;
	margin-inline: auto;
}

.pn-ad__link {
	display: inline-block;
	max-width: 100%;
}

/* ---------- Reserved space (layout-shift prevention) ---------- */
.pn-ad--reserve .pn-ad__unit {
	min-height: var(--pn-ad-h);
}

@media (max-width: 1023px) {

	.pn-ad {
		--pn-ad-h: var(--pn-ad-h-t, var(--pn-ad-h-d, 0));
	}
}

@media (max-width: 599px) {

	.pn-ad {
		--pn-ad-h: var(--pn-ad-h-m, var(--pn-ad-h-t, 0));
	}
}

/* No ad returned by the network: give the space back. */
.pn-ad:has(ins.adsbygoogle[data-ad-status="unfilled"]) {
	display: none;
}

/* ---------- Devices ---------- */
@media (min-width: 1024px) {

	.pn-ad--no-desktop {
		display: none;
	}
}

@media (min-width: 600px) and (max-width: 1023px) {

	.pn-ad--no-tablet {
		display: none;
	}
}

@media (max-width: 599px) {

	.pn-ad--no-mobile {
		display: none;
	}
}

/* ---------- Placement contexts ---------- */

/* Homepage rows sit between whole sections. */
.pn-fp-section--ad .pn-ad {
	margin-block: 0;
}

/* Article body: a clear break between paragraphs. */
.pn-article__content .pn-ad,
.entry-content .pn-ad {
	margin-block: 2rem;
}

/* Archive / search: always a whole row, never a card-sized cell. */
.pn-ad-row {
	grid-column: 1 / -1;
	min-width: 0;
}

.pn-ad-row .pn-ad {
	margin-block: 0.5rem;
}

/* Tablet: the lead story spans the row so the ad follows complete rows. */
@media (min-width: 600px) and (max-width: 1023px) {

	.pn-archive--grid:has(> .pn-ad-row) > .pn-card:first-child:not(:only-child) {
		grid-column: 1 / -1;
	}
}

/* Sidebar: no rules, compact. */
.pn-layout__sidebar .pn-ad,
.pn-sidebar .pn-ad {
	margin-block: 0 var(--pn-gap, 1.5rem);
	border-block: 0;
	padding-block: 0;
}

/* Header zone: keeps the header's advert column. */
.pn-header-ad--engine {
	aspect-ratio: auto;
	width: min(728px, 100%);
	overflow: visible;
}

.pn-header-ad--engine .pn-ad {
	margin: 0;
	padding: 0;
	border: 0;
}

.pn-header-ad--engine .pn-ad__label {
	margin-block-end: 0.2rem;
	text-align: end;
}

/* ---------- Overlay formats (anchor ads) ---------- */

/* Keep the theme's floating controls clear of a bottom anchor ad. */
@media (max-width: 1023px) {

	.pn-has-anchor-space .pn-back-to-top {
		inset-block-end: calc(1.25rem + 100px);
	}
}

/* ---------- Preview & debug (administrators only) ---------- */
.pn-ad__placeholder {
	display: grid;
	place-content: center;
	gap: 0.25rem;
	min-height: max(var(--pn-ad-h), 90px);
	border: 2px dashed color-mix(in srgb, var(--pn-text-muted) 55%, transparent);
	border-radius: 4px;
	background:
		repeating-linear-gradient(135deg, transparent 0 10px, color-mix(in srgb, var(--pn-text-muted) 8%, transparent) 10px 20px);
	color: var(--pn-text-muted);
	font-family: var(--pn-font-ui, inherit);
	font-size: 0.8125rem;
}

.pn-ad__placeholder strong {
	color: var(--pn-text);
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.pn-ad__debug {
	display: block;
	margin-block-end: 0.35rem;
	padding: 0.2rem 0.5rem;
	background: #0b5cff;
	color: #fff;
	font: 600 0.6875rem/1.4 ui-monospace, SFMono-Regular, Menlo, monospace;
	text-align: start;
}

.pn-ad-skipped {
	margin-block: 0.5rem;
	padding: 0.35rem 0.6rem;
	border: 1px dashed #b45309;
	color: #b45309;
	font: 600 0.6875rem/1.4 ui-monospace, SFMono-Regular, Menlo, monospace;
}

.pn-ad-debug .pn-ad {
	outline: 2px solid #0b5cff;
	outline-offset: 2px;
}

/* Zero specificity: never overrides a sticky or positioned composition. */
:where(.pn-ad-debug .preluence-protected) {
	position: relative;
}

.pn-ad-debug .preluence-protected {
	outline: 2px dashed #15803d;
	outline-offset: -2px;
}

.pn-ad-debug .preluence-protected::after {
	content: "PROTECTED — no ads inside";
	position: absolute;
	inset-block-start: 0;
	inset-inline-end: 0;
	z-index: 5;
	padding: 0.15rem 0.45rem;
	background: #15803d;
	color: #fff;
	font: 600 0.625rem/1.4 ui-monospace, SFMono-Regular, Menlo, monospace;
	pointer-events: none;
}

.pn-ad-debug .pn-ticker.preluence-protected::after,
.pn-ad-debug .pn-header.preluence-protected::after {
	inset-block-start: auto;
	inset-block-end: 0;
}