/**
 * 广告预留位：留白、与内容区分、降低 CLS；填充后弱化占位框（:has + .is-leafs-ad-filled 双路径）.
 */

.leafs-ad-slot {
	/* 父级作 container：可按栏宽用 @container 调整内部 __frame 的 min-height */
	container-type: inline-size;
	container-name: leafs-ad;
	/* 占位框颜色随 leafs-tokens 的 --leafs-border / 深浅主题切换 */
	--leafs-ad-frame-bg: color-mix(in srgb, var(--leafs-border, #e2e8f0) 32%, transparent);
	--leafs-ad-frame-border: color-mix(in srgb, var(--leafs-border, #e2e8f0) 72%, transparent);
	--leafs-ad-slot-radius: var(--leafs-radius, 12px);
	margin: 0 auto;
	width: 100%;
	max-width: 100%;
	padding-block: 10px;
	clear: both;
	box-sizing: border-box;
}

/* 桌面栅格子项多为 min-width:0；保证广告槽占满列宽，避免延后 push 时 ins 实测宽度长期为 0 */
.leafs-layout__center > .leafs-ad-slot,
.leafs-layout__right > .leafs-ad-slot,
/* 详情页广告在 article / .leafs-entry-content 内，非 main 直接子元素，须用后代选择器 */
.leafs-inner-layout__main .leafs-ad-slot,
.leafs-inner-layout__aside .leafs-ad-slot {
	width: 100%;
	max-width: 100%;
	min-width: 0;
}

/*
 * 详情页右栏可窄至约 200px；全站广告槽的 min-width: max(250px, …) 会撑破侧栏并压盖主栏。
 * 在侧栏内改为不超出列宽，避免与正文或其它侧栏块重叠。
 */
.leafs-inner-layout__aside .leafs-ad-slot__frame {
	min-width: 0;
}

.leafs-inner-layout__aside .leafs-ad-slot__frame ins.adsbygoogle {
	min-width: min(250px, 100%) !important;
}

/* 阅读详情：正文流中的槽位避免被祖先 content-visibility 等跳过布局（与列表流内嵌位一致） */
.leafs-reading-detail .leafs-entry-content .leafs-ad-slot,
.leafs-reading-detail .leafs-single-article .leafs-ad-slot,
.leafs-reading-detail .leafs-tool-article .leafs-ad-slot {
	content-visibility: visible;
}

.leafs-ad-slot__label {
	display: table;
	margin: 0 auto 10px;
	padding: 5px 12px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--leafs-muted2);
	text-align: center;
	border-radius: 999px;
	background: color-mix(in srgb, var(--leafs-muted2) 10%, transparent);
	border: 1px solid color-mix(in srgb, var(--leafs-border) 55%, transparent);
	box-sizing: border-box;
}

.leafs-ad-slot__frame {
	margin-inline: auto;
	max-width: 100%;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: stretch;
	justify-content: flex-start;
	min-height: 0;
	/*
	 * 勿用 overflow:hidden：个别环境下 AdSense 量宽异常；圆角交由子元素裁切。
	 * min-width：父级链若在某一帧为 0 宽，max(250px, …) 保证仍有可用横向尺寸。
	 */
	overflow: visible;
	min-width: max(250px, min(100%, calc(100vw - 32px)));
	border-radius: var(--leafs-ad-slot-radius);
	background: var(--leafs-ad-frame-bg);
	border: 1px dashed var(--leafs-ad-frame-border);
	box-shadow:
		0 1px 0 color-mix(in srgb, var(--leafs-border) 35%, transparent),
		0 10px 28px color-mix(in srgb, var(--leafs-text) 4%, transparent);
	transition:
		border-color 0.25s ease,
		background-color 0.25s ease,
		border-style 0.25s ease,
		box-shadow 0.25s ease;
	/* 为 AdSense 异步填充预留最小高度，减少布局抖动 */
	box-sizing: border-box;
}

@media (max-width: 420px) {
	.leafs-ad-slot__frame {
		min-width: max(200px, min(100%, calc(100vw - 16px)));
	}

	.leafs-ad-slot {
		padding-block: 8px;
	}
}

html[data-leafs-theme="dark"] .leafs-ad-slot {
	/* 深色下略提高边框辨识度，避免占位框融进背景 */
	--leafs-ad-frame-bg: color-mix(in srgb, var(--leafs-surface2) 55%, transparent);
	--leafs-ad-frame-border: color-mix(in srgb, var(--leafs-border) 78%, var(--leafs-muted) 22%);
}

html[data-leafs-theme="dark"] .leafs-ad-slot__frame {
	box-shadow:
		0 1px 0 color-mix(in srgb, var(--leafs-border) 45%, transparent),
		0 12px 32px rgba(0, 0, 0, 0.22);
}

html[data-leafs-theme="dark"] .leafs-ad-slot__label {
	color: var(--leafs-muted);
	opacity: 0.92;
	background: color-mix(in srgb, var(--leafs-muted) 14%, transparent);
	border-color: color-mix(in srgb, var(--leafs-border) 70%, transparent);
}

/* 已请求到广告时弱化「虚线占位」观感（Google 会为 ins 写入 data-ad-status） */
.leafs-ad-slot__frame:has(ins.adsbygoogle[data-ad-status="filled"]),
.leafs-ad-slot__frame.is-leafs-ad-filled {
	background: transparent;
	border-style: solid;
	border-color: color-mix(in srgb, var(--leafs-border) 42%, transparent);
	box-shadow: none;
}

html[data-leafs-theme="dark"] .leafs-ad-slot__frame:has(ins.adsbygoogle[data-ad-status="filled"]),
html[data-leafs-theme="dark"] .leafs-ad-slot__frame.is-leafs-ad-filled {
	border-color: color-mix(in srgb, var(--leafs-border) 62%, transparent);
	box-shadow: none;
}

/* 与 script/style 并列的包裹层也要拉满宽，避免内层 ins 实测宽度为 0 */
.leafs-ad-slot__frame > *:not(script):not(style) {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

/*
 * AdSense 占位 ins：须占满容器宽度。勿对 flex 子项使用 align-items:center +
 * 无尺寸的 ins，否则 push() 时 availableWidth=0 触发 TagError。
 */
.leafs-ad-slot__frame ins.adsbygoogle {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: max(250px, min(100%, calc(100vw - 48px))) !important;
	box-sizing: border-box !important;
	margin-left: auto !important;
	margin-right: auto !important;
	border-radius: var(--leafs-ad-slot-radius);
}

/* 极窄视口：略降 ins 最小宽度，减少横向溢出（与 leafs-adsense-slot-push wideEnough 阈值一致） */
@media (max-width: 420px) {
	.leafs-ad-slot__frame ins.adsbygoogle {
		min-width: max(200px, min(100%, calc(100vw - 20px))) !important;
	}
}

.leafs-ad-slot__frame iframe {
	max-width: 100%;
	vertical-align: bottom;
}

.leafs-ad-below-header {
	padding-block: 14px 10px;
	margin-block-end: 2px;
	background: linear-gradient(
		180deg,
		color-mix(in srgb, var(--leafs-bg) 92%, var(--leafs-border)) 0%,
		color-mix(in srgb, var(--leafs-bg) 100%, transparent) 100%
	);
	border-bottom: 1px solid color-mix(in srgb, var(--leafs-border) 45%, transparent);
}

html[data-leafs-theme="dark"] .leafs-ad-below-header {
	background: linear-gradient(
		180deg,
		color-mix(in srgb, var(--leafs-surface) 88%, var(--leafs-border)) 0%,
		color-mix(in srgb, var(--leafs-bg) 100%, transparent) 100%
	);
	border-bottom-color: color-mix(in srgb, var(--leafs-border) 58%, transparent);
}

.leafs-ad-slot--below-header {
	width: 100%;
	max-width: 100%;
	padding-inline: 0;
	padding-block: 0;
}

.leafs-ad-slot--below-header .leafs-ad-slot__frame {
	min-height: 90px;
	width: 100%;
}

.leafs-ad-slot--home-below-toolbar {
	margin-top: 4px;
	margin-bottom: 14px;
	width: 100%;
}

/* 嵌入卡片流内：由 .leafs-card-list 的 gap 负责间距 */
.leafs-card-list__ad--home-toolbar .leafs-ad-slot--home-below-toolbar {
	margin-block: 0;
}

.leafs-card-list__ad--home-toolbar {
	width: 100%;
	min-width: 0;
	box-sizing: border-box;
}

.leafs-pca__list-ad {
	width: 100%;
	min-width: 0;
	margin-bottom: 32px;
	box-sizing: border-box;
}

/*
 * 分类/标签文章列表内嵌广告：避免祖先 content-visibility（或其它 containment）
 * 跳过布局导致 ins 宽长期为 0、延后 push 失败（现象与首页信息流类似）。
 */
.leafs-pca__list > .leafs-pca__list-ad {
	content-visibility: visible;
}

.leafs-pca__list-ad .leafs-ad-slot--home-below-toolbar {
	margin-block: 0;
}

.leafs-pca__list-ad .leafs-ad-slot__frame {
	min-height: 100px;
	width: 100%;
}

.leafs-ad-slot--home-below-toolbar .leafs-ad-slot__frame {
	min-height: 100px;
	width: 100%;
}

/* 每日分享列表内（第 8 位）+ AI 资源导航右侧主栏底部（主题设置中共用同一单元代码） */
.leafs-ad-slot--daily-share-tools-nav-sidebar {
	margin-block: 0;
	width: 100%;
	max-width: 100%;
}

.leafs-daily-share__list-ad {
	width: 100%;
	min-width: 0;
	margin-block: 12px 18px;
	box-sizing: border-box;
	content-visibility: visible;
}

.leafs-daily-share__list-ad .leafs-ad-slot--daily-share-tools-nav-sidebar .leafs-ad-slot__frame {
	min-height: 120px;
	width: 100%;
	content-visibility: visible;
}

.leafs-tools-nav__ad-main-bottom {
	width: 100%;
	min-width: 0;
	margin-top: 24px;
	box-sizing: border-box;
	content-visibility: visible;
}

.leafs-tools-nav__ad-main-bottom .leafs-ad-slot--daily-share-tools-nav-sidebar .leafs-ad-slot__frame {
	min-height: 100px;
	width: 100%;
}

/* 外观 → 小工具「Lumo：谷歌广告」：侧栏宽度下的竖版/自适应单元 */
.leafs-ad-slot--sidebar-widget {
	margin-block: 0 14px;
	width: 100%;
}

.leafs-ad-slot--sidebar-widget .leafs-ad-slot__frame {
	min-height: 250px;
	width: 100%;
}

.leafs-ad-slot--archive-tools-below-header {
	margin-bottom: 20px;
	width: 100%;
}

.leafs-ad-slot--archive-tools-below-header .leafs-ad-slot__frame {
	min-height: 100px;
	width: 100%;
}

/* 详情正文段落内插入：与上下段落留白（文章与工具共用；旧 class 保留兼容） */
.leafs-ad-slot--single-content-mid,
.leafs-ad-slot--single-tool-content-mid,
.leafs-ad-slot--single-post-content-mid {
	margin-block: 20px;
	width: 100%;
}

.leafs-ad-slot--single-content-mid .leafs-ad-slot__frame,
.leafs-ad-slot--single-tool-content-mid .leafs-ad-slot__frame,
.leafs-ad-slot--single-post-content-mid .leafs-ad-slot__frame {
	min-height: 120px;
	width: 100%;
}

.leafs-ad-slot--single-after-main-content {
	margin-block: 22px 18px;
	width: 100%;
}

.leafs-ad-slot--single-after-main-content .leafs-ad-slot__frame {
	min-height: 120px;
	width: 100%;
}

.leafs-ad-footer-above {
	background: color-mix(in srgb, var(--leafs-bg) 94%, var(--leafs-border));
	border-top: 1px solid color-mix(in srgb, var(--leafs-border) 65%, transparent);
}

html[data-leafs-theme="dark"] .leafs-ad-footer-above {
	background: color-mix(in srgb, var(--leafs-bg) 88%, var(--leafs-surface2));
	border-top-color: color-mix(in srgb, var(--leafs-border) 78%, transparent);
}

.leafs-ad-slot--footer-above {
	width: 100%;
	max-width: 100%;
	padding-inline: 0;
	padding-block: 10px 0;
}

.leafs-ad-slot--footer-above .leafs-ad-slot__frame {
	min-height: 90px;
	width: 100%;
}

/* 槽位宽度较窄时略降预留高度，减轻侧栏/窄正文列的空白与 CLS 折中 */
@container leafs-ad (max-width: 360px) {
	.leafs-ad-slot--below-header .leafs-ad-slot__frame {
		min-height: 76px;
	}

	.leafs-ad-slot--home-below-toolbar .leafs-ad-slot__frame,
	.leafs-pca__list-ad .leafs-ad-slot__frame {
		min-height: 88px;
	}

	.leafs-daily-share__list-ad .leafs-ad-slot--daily-share-tools-nav-sidebar .leafs-ad-slot__frame {
		min-height: 100px;
	}

	.leafs-tools-nav__ad-main-bottom .leafs-ad-slot--daily-share-tools-nav-sidebar .leafs-ad-slot__frame {
		min-height: 90px;
	}

	.leafs-ad-slot--sidebar-widget .leafs-ad-slot__frame {
		min-height: 200px;
	}

	.leafs-ad-slot--archive-tools-below-header .leafs-ad-slot__frame {
		min-height: 88px;
	}

	.leafs-ad-slot--single-content-mid .leafs-ad-slot__frame,
	.leafs-ad-slot--single-tool-content-mid .leafs-ad-slot__frame,
	.leafs-ad-slot--single-post-content-mid .leafs-ad-slot__frame,
	.leafs-ad-slot--single-after-main-content .leafs-ad-slot__frame {
		min-height: 100px;
	}

	.leafs-ad-slot--footer-above .leafs-ad-slot__frame {
		min-height: 76px;
	}
}

@container leafs-ad (max-width: 300px) {
	.leafs-ad-slot--sidebar-widget .leafs-ad-slot__frame {
		min-height: 180px;
	}

	.leafs-ad-slot--single-content-mid .leafs-ad-slot__frame,
	.leafs-ad-slot--single-tool-content-mid .leafs-ad-slot__frame,
	.leafs-ad-slot--single-post-content-mid .leafs-ad-slot__frame,
	.leafs-ad-slot--single-after-main-content .leafs-ad-slot__frame {
		min-height: 90px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.leafs-ad-slot,
	.leafs-ad-slot__frame {
		transition: none;
	}
}