/* ----- Base slot -----
 * Aggressive resets with !important defeat host themes that wrap .adpilot-slot
 * in a card (border, padding, "PUBLICIDAD" eyebrow via ::before). The ad image
 * itself defines all visible chrome — no plugin-side wrapper.
 */
.adpilot-slot {
	display: block;
	margin: 1.5em 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	text-align: center;
	position: relative;
	color: inherit;
	font-size: inherit;
}
.adpilot-slot::before,
.adpilot-slot::after {
	content: none !important;
	display: none !important;
}
.adpilot-slot a {
	display: inline-block;
	max-width: 100%;
	text-decoration: none;
	color: inherit;
}
.adpilot-slot img {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
	border-radius: 8px;
}
.adpilot-slot .adpilot-text {
	display: inline-block;
	padding: 14px 20px;
	background: #f6f7f7;
	border-radius: 8px;
	max-width: 600px;
	line-height: 1.5;
	font-size: 15px;
	color: #1d2327;
	text-align: left;
}

/* ----- Preview badge ----- */
.adpilot-slot-preview { outline: 2px dashed #c8102e; outline-offset: 4px; }
.adpilot-preview-badge {
	position: absolute;
	top: -10px;
	left: 50%;
	transform: translateX(-50%);
	background: #c8102e;
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .15em;
	padding: 3px 10px;
	border-radius: 999px;
	z-index: 2;
}

/* ----- Sticky pill (F9 redesign) -----
 * Sized to the ad, not the viewport. Centered above the bottom edge with a
 * floating pill, drop shadow, rounded corners. Replaces the previous
 * full-width white bar that left a "small image floating in a sea of white"
 * whenever a non-leaderboard creative landed there.
 *
 * Image is capped at 90px tall on desktop / 60px on mobile — those match the
 * IAB sticky banner standards (728×90 / 320×50).
 */
.adpilot-sticky-host {
	position: fixed;
	left: 50%;
	bottom: 16px;
	transform: translateX(-50%);
	z-index: 99990;
	width: max-content;
	max-width: calc(100% - 24px);
	background: #ffffff;
	border-radius: 12px;
	box-shadow: 0 8px 28px rgba(15, 23, 42, .18);
	padding: 8px 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
}
.adpilot-sticky-host .adpilot-slot { margin: 0; display: block; }
.adpilot-sticky-host .adpilot-slot img {
	display: block;
	max-height: 90px;
	width: auto;
	height: auto;
	border-radius: 8px;
}
.adpilot-sticky-host .adpilot-slot .adpilot-text {
	padding: 4px 8px !important;
	background: transparent !important;
	border: 0 !important;
	border-left: 0 !important;
	max-width: 480px;
	font-size: 14px !important;
	color: #1d2327 !important;
	line-height: 1.4 !important;
}

/* Close button — ghost, corner-anchored. Modeled on Google/Pinterest "x":
 * tiny SVG, no chrome until hover, generous hit area via padding. The
 * .adpilot-sticky-host gap (above) reserves space so the icon never overlaps
 * the ad pixels even at the smallest viewport.
 */
.adpilot-sticky-close,
.adpilot-modal-close {
	flex: 0 0 auto;
	width: 28px;
	height: 28px;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: rgba(15, 23, 42, .55);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background .15s ease, color .15s ease;
	-webkit-appearance: none;
	appearance: none;
}
.adpilot-sticky-close:hover,
.adpilot-modal-close:hover {
	background: rgba(15, 23, 42, .08);
	color: #0f172a;
}
.adpilot-sticky-close:focus-visible,
.adpilot-modal-close:focus-visible {
	outline: 2px solid #2271b1;
	outline-offset: 2px;
}
.adpilot-sticky-close svg,
.adpilot-modal-close svg { display: block; }

@media (max-width: 600px) {
	.adpilot-sticky-host {
		bottom: 8px;
		max-width: calc(100% - 16px);
		padding: 6px 8px;
		border-radius: 10px;
		gap: 6px;
	}
	.adpilot-sticky-host .adpilot-slot img { max-height: 60px; border-radius: 6px; }
	.adpilot-sticky-close { width: 24px; height: 24px; }
}

/* ----- F10 Top banner / announcement bar -----
 * Full-width strip pinned to the top of the viewport, edge-to-edge. Carries
 * its background and text color via inline styles set on the host (so the
 * close button area paints with the same bg). Defaults match a Hello-Bar
 * style: dark slate bg, white text, yellow CTA pill.
 *
 * Admin bar offset: when a logged-in admin views the front-end, WordPress
 * fixes its admin bar at top:0 with a 32px height (46px <600px). The body
 * gets the .admin-bar class — we offset our bar so it sits below.
 */
.adpilot-top-banner-host {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 99991;
	min-height: 44px;
	padding: 8px 16px;
	background: #1d2327;
	color: #ffffff;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 16px;
	font-size: 14px;
	line-height: 1.4;
	box-shadow: 0 2px 6px rgba(15, 23, 42, .12);
}
body.admin-bar .adpilot-top-banner-host { top: 32px; }
@media screen and (max-width: 782px) {
	body.admin-bar .adpilot-top-banner-host { top: 46px; }
}

/* Reserve scroll space below the bar so fixed-positioned theme headers and
 * the first viewport slice aren't covered by it. Themes that already use
 * scroll-padding-top will keep their offset. */
body:has(.adpilot-top-banner-host) { scroll-padding-top: 60px; }

.adpilot-top-banner-host .adpilot-slot {
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	color: inherit !important;
	flex: 1 1 auto;
	min-width: 0;
	text-align: center;
}
.adpilot-top-banner-host .adpilot-slot a {
	color: inherit !important;
	display: inline-flex;
	align-items: center;
	gap: 12px;
	max-width: 100%;
	background: transparent !important;
	border: 0 !important;
	padding: 0 !important;
	text-decoration: none !important;
}
.adpilot-top-banner-host .adpilot-bar-body {
	color: inherit;
	font-weight: 500;
}
.adpilot-top-banner-host .adpilot-bar-cta {
	display: inline-flex;
	align-items: center;
	background: #ffd200;
	color: #1d2327;
	padding: 6px 14px;
	border-radius: 999px;
	font-weight: 700;
	font-size: 13px;
	letter-spacing: .02em;
	text-transform: uppercase;
	white-space: nowrap;
}
.adpilot-top-banner-host .adpilot-slot img {
	max-height: 50px;
	width: auto;
	border-radius: 4px;
}
.adpilot-top-banner-close {
	flex: 0 0 auto;
	width: 28px;
	height: 28px;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: inherit;
	opacity: .7;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: opacity .15s ease, background-color .15s ease;
	-webkit-appearance: none;
	appearance: none;
}
.adpilot-top-banner-close:hover { opacity: 1; background-color: rgba(255, 255, 255, .15); }
.adpilot-top-banner-close:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.adpilot-top-banner-close svg { display: block; }

@media (max-width: 600px) {
	.adpilot-top-banner-host {
		padding: 6px 10px;
		gap: 10px;
		font-size: 13px;
	}
	.adpilot-top-banner-host .adpilot-slot a { gap: 8px; flex-wrap: wrap; justify-content: center; }
	.adpilot-top-banner-host .adpilot-bar-cta { padding: 4px 10px; font-size: 12px; }
	.adpilot-top-banner-host .adpilot-slot img { max-height: 40px; }
	.adpilot-top-banner-close { width: 24px; height: 24px; }
}

/* ----- Modal / interstitial ----- */
.adpilot-modal-host {
	position: fixed;
	inset: 0;
	z-index: 99995;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
}
.adpilot-modal-host[hidden] { display: none; }
.adpilot-modal-overlay {
	position: absolute;
	inset: 0;
	background: rgba(15, 23, 42, .55);
	backdrop-filter: blur(2px);
	cursor: pointer;
}
.adpilot-modal-panel {
	position: relative;
	z-index: 1;
	background: #fff;
	border-radius: 10px;
	box-shadow: 0 24px 48px rgba(0, 0, 0, .35);
	max-width: 520px;
	width: 100%;
	padding: 28px;
	text-align: center;
}
.adpilot-modal-panel .adpilot-slot { margin: 0; }
.adpilot-modal-panel .adpilot-slot img { max-height: 320px; border-radius: 6px; }
.adpilot-modal-panel .adpilot-slot .adpilot-text {
	background: transparent !important;
	border: 0 !important;
	border-left: 0 !important;
	padding: 0 !important;
	max-width: none !important;
	color: #1d2327 !important;
	font-size: 16px !important;
	line-height: 1.55 !important;
}
/* Modal close — slightly larger than sticky for discoverability, same ghost style.
 * Position: absolute corner of the panel (sticky's flows inline with the ad gap). */
.adpilot-modal-close {
	position: absolute;
	top: 10px;
	right: 10px;
	width: 32px;
	height: 32px;
}

@media (max-width: 600px) {
	.adpilot-modal-host { padding: 16px; }
	.adpilot-modal-panel { padding: 20px; }
	.adpilot-modal-panel .adpilot-slot img { max-height: 240px; }
}

/* ----- Reset editorial overrides inside floating containers -----
 * Host themes commonly target .adpilot-slot, blockquote, aside, or any descendant
 * inside the slot with !important rules (red left bars on quotes, gray cards on
 * asides, etc). We aggressively strip them so the floating ad chrome stays clean.
 */
.adpilot-sticky-host .adpilot-slot,
.adpilot-modal-host .adpilot-slot {
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: transparent !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}
.adpilot-sticky-host .adpilot-slot *,
.adpilot-modal-host .adpilot-slot * {
	box-shadow: none !important;
}
.adpilot-sticky-host .adpilot-slot a,
.adpilot-modal-host .adpilot-slot a {
	border: 0 !important;
	border-left: 0 !important;
	background: transparent !important;
	padding: 0 !important;
	margin: 0 !important;
	text-decoration: none !important;
}
.adpilot-sticky-host .adpilot-slot::before,
.adpilot-sticky-host .adpilot-slot::after,
.adpilot-modal-host .adpilot-slot::before,
.adpilot-modal-host .adpilot-slot::after {
	content: none !important;
	display: none !important;
	margin: 0 !important;
}

/* ----- Admin status pills (kept from F1) ----- */
.adpilot-wrap .adpilot-status {
	display: inline-block;
	padding: 2px 8px;
	border-radius: 999px;
	font-size: 11px;
	text-transform: uppercase;
	background: #e5e5e5;
	color: #1d2327;
}
.adpilot-wrap .adpilot-status-active       { background: #d1f1d1; color: #1a4f1a; }
.adpilot-wrap .adpilot-status-paused       { background: #fff5cc; color: #6b5300; }
.adpilot-wrap .adpilot-status-archived,
.adpilot-wrap .adpilot-status-retired      { background: #f0f0f1; color: #50575e; }
.adpilot-wrap .adpilot-status-draft        { background: #e6f0ff; color: #1d4ed8; }
.adpilot-wrap .adpilot-status-rolling_out  { background: #fde8d4; color: #8a3b00; }