/**
 * Stable, lazy advertising slots.
 * Every unit keeps its final server-rendered position and reserves its size.
 */
.shaghaf-ad-slot {
	box-sizing: border-box;
	width: min(100%, 1120px);
	max-width: calc(100% - 24px);
	margin: clamp(28px, 4vw, 48px) auto;
	padding: clamp(10px, 1.6vw, 16px);
	border: 1px solid rgba(15, 23, 42, 0.08);
	border-radius: 14px;
	background: #fff;
	text-align: center;
	overflow: hidden;
	clear: both;
	position: relative;
	z-index: 1;
	min-height: 250px;
	content-visibility: auto;
	contain-intrinsic-size: auto 250px;
	contain: layout paint style;
}

.shaghaf-ad-slot[hidden] {
	display: none !important;
}

.shaghaf-ad-slot__label {
	margin: 0 0 8px;
	font: 500 11px/1.4 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	letter-spacing: .04em;
	color: #666b73;
	text-align: center;
	direction: rtl;
}

.shaghaf-ad-slot__native-shell,
.shaghaf-ad-slot__native-frame {
	max-width: 100% !important;
	margin-inline: auto;
}

.shaghaf-ad-slot__native-frame {
	display: block;
	width: 100%;
	height: 250px;
	border: 0;
	background: transparent;
}

.shaghaf-ad-slot--leaderboard {
	width: min(calc(100% - 24px), 560px);
	min-height: 108px;
	contain-intrinsic-size: auto 108px;
}

.shaghaf-ad-slot--wide-banner {
	display: none;
	width: min(calc(100% - 24px), 820px);
	min-height: 138px;
	contain-intrinsic-size: auto 138px;
}

.shaghaf-ad-responsive-banner {
	display: grid;
	width: 100%;
	clear: both;
}

.shaghaf-ad-responsive-banner > .shaghaf-ad-slot {
	grid-area: 1 / 1;
}

.shaghaf-ad-slot--mobile-banner {
	display: none;
	width: min(calc(100% - 16px), 352px);
	min-height: 88px;
	contain-intrinsic-size: auto 88px;
}

/* The 160x600 creative uses the unused outer rail only on genuinely wide screens. */
.shaghaf-ad-slot--rail {
	display: none;
}

.shaghaf-ad-slot--portrait {
	width: min(calc(100% - 24px), 202px);
	min-height: 348px;
	contain-intrinsic-size: auto 348px;
}

.shaghaf-ad-slot--native {
	height: 310px;
	min-height: 310px;
	contain-intrinsic-size: auto 310px;
}

.shaghaf-ad-slot--native .shaghaf-ad-slot__native-shell {
	height: 250px;
	min-height: 250px;
	max-height: 250px;
	overflow: hidden;
}

.shaghaf-ad-slot--rectangle {
	width: min(calc(100% - 24px), 360px);
	min-height: 300px;
	contain-intrinsic-size: auto 300px;
}

.shaghaf-ad-slot__frame-shell {
	position: relative;
	width: min(100%, var(--shaghaf-ad-width));
	margin-inline: auto;
	overflow: hidden;
	aspect-ratio: var(--shaghaf-ad-ratio);
	background: #fafafa;
}

.shaghaf-ad-slot__frame {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
	background: transparent;
}

.shaghaf-ad-slot__status {
	margin: 8px 0 0;
	color: #666b73;
	font: 600 11px/1.5 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	text-align: center;
}

.shaghaf-ad-slot__status:empty {
	display: none;
}

.shaghaf-ad-slot[data-shaghaf-ad-state="idle"] .shaghaf-ad-slot__frame-shell,
.shaghaf-ad-slot[data-shaghaf-ad-state="loading"] .shaghaf-ad-slot__frame-shell,
.shaghaf-ad-slot[data-shaghaf-ad-state="idle"] .shaghaf-ad-slot__native-shell,
.shaghaf-ad-slot[data-shaghaf-ad-state="loading"] .shaghaf-ad-slot__native-shell {
	background: #fafafa;
}

.shaghaf-ad-footer-stack {
	display: grid;
	width: min(100%, 1120px);
	margin: 12px auto 34px;
	padding: 1px 0;
}

.shaghaf-ad-footer-stack > .shaghaf-ad-slot {
	margin-block: 14px;
}

.sjn-content > .shaghaf-ad-slot,
.entry-content > .shaghaf-ad-slot,
.sja-content > .shaghaf-ad-slot,
.sja-article__content > .shaghaf-ad-slot {
	width: 100%;
	max-width: 100%;
	margin-block: 34px;
}

.mahana-home > .shaghaf-ad-slot,
.site-main > .shaghaf-ad-slot,
#primary > .shaghaf-ad-slot {
	width: min(100% - 32px, 1120px);
}

@media (max-width: 640px) {
	.shaghaf-ad-slot {
		width: calc(100% - 16px);
		max-width: calc(100% - 16px);
		margin-block: 24px;
		padding: 9px 4px;
		border-radius: 10px;
		min-height: 220px;
		contain-intrinsic-size: auto 220px;
	}

	.shaghaf-ad-slot--leaderboard {
		display: none !important;
	}

	.shaghaf-ad-slot--mobile-banner {
		display: block;
		min-height: 82px;
		contain-intrinsic-size: auto 82px;
	}

	.shaghaf-ad-slot--portrait {
		width: min(calc(100% - 16px), 184px);
		min-height: 338px;
		contain-intrinsic-size: auto 338px;
	}

	.shaghaf-ad-slot--native {
		height: 292px;
		min-height: 292px;
		contain-intrinsic-size: auto 292px;
	}

	.shaghaf-ad-slot--rectangle {
		min-height: 292px;
		contain-intrinsic-size: auto 292px;
	}

	.sjn-content > .shaghaf-ad-slot,
	.entry-content > .shaghaf-ad-slot,
	.sja-content > .shaghaf-ad-slot,
	.sja-article__content > .shaghaf-ad-slot {
		width: 100%;
		max-width: 100%;
	}
}

@media (min-width: 1100px) {
	.shaghaf-ad-slot--wide-banner {
		display: block;
	}

	.shaghaf-ad-slot--leaderboard {
		display: none;
	}
}

@media (min-width: 1720px) and (min-height: 720px) {
	.shaghaf-ad-slot--rail {
		position: absolute;
		top: 118px;
		left: 14px;
		z-index: 12;
		display: block;
		width: 182px;
		max-width: 182px;
		min-height: 646px;
		margin: 0;
		padding: 10px;
		contain-intrinsic-size: auto 646px;
	}

	.shaghaf-ad-slot--portrait {
		position: absolute;
		top: 118px;
		right: 14px;
		z-index: 12;
		width: 182px;
		max-width: 182px;
		min-height: 346px;
		margin: 0 !important;
		padding: 10px;
		contain-intrinsic-size: auto 346px;
	}
}

