/* =========================================================================
   MODULE 4 — In-article / in-feed / loop ad styles (save as `ads-extra.css`)
   Layout-neutral: full-width block that never breaks grids or flex loops.
   ========================================================================= */

.lp-inline-ad {
	display: block;
	width: 100%;
	clear: both;
	margin: 20px 0;
	padding: 10px;
	background: #f7f9ff;
	border: 1px solid rgba(33, 89, 229, 0.12);
	border-radius: 14px;
	box-shadow: 0 2px 10px rgba(33, 89, 229, 0.08);
	box-sizing: border-box;
	contain: layout paint; /* isolates the ad from the host layout */
	font-family: "Hind Siliguri", "Noto Sans Bengali", system-ui, sans-serif;
	/* Center by default (was previously left-aligned with no way to change it). */
	text-align: center;
}

/* Admin-selectable alignment (Popup Ads → Ad Placement). Centers the ad
   card's own content (image, title, description, button) — the outer
   card itself stays full-width so it never breaks a host grid/loop. */
.lp-inline-ad.lp-align-left   { text-align: left; }
.lp-inline-ad.lp-align-center { text-align: center; }
.lp-inline-ad.lp-align-right  { text-align: right; }

.lp-inline-ad .lp-ad-media,
.lp-inline-ad .lp-ad-body {
	display: block;
	margin: 0 auto;
}

.lp-inline-ad__label {
	display: block;
	margin-bottom: 6px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: #6b7280;
	text-transform: uppercase;
}

.lp-inline-ad img {
	display: block;
	max-width: 100%;
	height: auto;
	border-radius: 10px;
	margin: 0 auto; /* text-align doesn't center a block-level img on its own */
}

.lp-inline-ad.lp-align-left img  { margin-left: 0; }
.lp-inline-ad.lp-align-right img { margin-right: 0; }

/* Inside a job listing grid/list, span the whole row. */
.job_listings .lp-inline-ad,
.jst-listings .lp-inline-ad {
	grid-column: 1 / -1;
	flex-basis: 100%;
}

.lp-inline-ad--in-feed { margin: 12px 0; }