/* Coloring Ads — slot wrappers. Namespaced `.cph-adunit*` so they never collide with the theme's
   own `.cph-ad` placeholder class. Reserved height (CLS-safe) via inline --cph-rd/--cph-rm custom
   props: mobile reserve by default, desktop reserve above the breakpoint.
   ⚠️ The 769px breakpoint below must match CPH_ADS_MOBILE_BP (768) in includes/config.php. */

.cph-adunit {
	display: block;
	margin: 24px auto;
	text-align: center;
	min-height: var(--cph-rm, 0);   /* mobile reserve */
	box-sizing: border-box;
}
@media (min-width: 769px) {
	.cph-adunit { min-height: var(--cph-rd, 0); } /* desktop/tablet reserve */
}

.cph-adunit__label {
	display: block;
	font: 700 10px/1.4 'Nunito', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	letter-spacing: 1.4px;
	text-transform: uppercase;
	color: #B4B4BE;
	margin: 0 0 4px;
}
.cph-adunit__inner {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: inherit;   /* holds the reserved height even before Ramp fills a tag */
	/* VERTICAL BOUND. --cph-mm/--cph-md come from the unit's `max` in includes/config.php and default
	   to the reserve, so a slot is exactly the size we asked Playwire to serve. Without this a taller
	   creative (a 300x600 half page dropped into a 300x250 unit) simply stretches the box: a hole in
	   the middle of an article, or a sidebar pushed far below the text. If Playwire enables a taller
	   size on a unit, raise `max` there — do not remove the cap. */
	max-height: var(--cph-mm, none);
	overflow: hidden;
	/* HORIZONTAL BOUND: a slot never grows wider than the column it sits in. */
	max-width: 100%;
}
@media (min-width: 769px) {
	.cph-adunit__inner { max-height: var(--cph-md, none); }
}
.cph-adunit__inner > div,
.cph-adunit__inner iframe { max-width: 100%; }
/* Ramp fills only the tag matching the viewport; the other empty div collapses (no display:none). */
.cph-adunit__inner > div:empty { line-height: 0; }

/* Admin-only preview placeholder (shown when not live). */
.cph-adunit--preview {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: #F5F5F5;
	border: 1px dashed #DCDCE2;
	border-radius: 10px;
}
.cph-adunit__ph {
	font: 600 12px/1.5 'Nunito', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	color: #9A949E;
	text-align: center;
	padding: 6px 12px;
}
.cph-adunit__ph b { color: #6E6470; }