/* =========================================================
   Archive & Empty State (iro-archive / iro-none)
   ========================================================= */

.iro-archive {
	position: relative;
}

.iro-archive-hero {
	position: relative;
	max-width: 860px;
	margin: 0 auto 32px;
	padding: 40px 32px 32px;
	text-align: center;
}

.iro-archive-hero-inner {
	position: relative;
	z-index: 1;
}

.iro-archive-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	border-radius: 50%;
	font-size: 28px;
	color: #fff;
	background: linear-gradient(135deg, #f6a7b8 0%, #c084fc 100%);
	box-shadow: 0 10px 30px rgba(240, 140, 170, .35),
		0 4px 10px rgba(192, 132, 252, .25),
		inset 0 1px 0 rgba(255, 255, 255, .35);
	margin-bottom: 18px;
	animation: iro-float 4s ease-in-out infinite;
}

.iro-archive-title {
	margin: 0 0 10px;
	font-size: 38px;
	font-weight: 800;
	letter-spacing: 2px;
	line-height: 1.2;
	background: linear-gradient(120deg, #3a3a3a 0%, #8b5a72 60%, #b06a8f 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.iro-archive-desc {
	margin: 0 auto 18px;
	max-width: 560px;
	font-size: 15px;
	line-height: 1.7;
	color: rgba(60, 60, 70, .78);
}

.iro-archive-desc-fallback {
	letter-spacing: 1px;
	font-style: italic;
}

.iro-archive-line {
	display: block;
	width: 120px;
	height: 3px;
	margin: 6px auto 0;
	border-radius: 999px;
	background: linear-gradient(90deg,
		transparent 0%,
		#f0b4c4 30%,
		#c084fc 70%,
		transparent 100%);
	opacity: .8;
}

@keyframes iro-float {

	0%,
	100% {
		transform: translateY(0);
	}

	50% {
		transform: translateY(-6px);
	}
}

/* ----------------- Empty State Card ----------------- */

.iro-none {
	position: relative;
	max-width: 860px;
	margin: 24px auto 40px;
	padding: 0 16px;
}

.iro-none-card {
	position: relative;
	overflow: hidden;
	border-radius: 18px;
	background: rgba(255, 255, 255, .72);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	border: 1px solid rgba(255, 255, 255, .7);
	box-shadow:
		0 20px 50px rgba(180, 120, 150, .12),
		0 4px 12px rgba(60, 60, 80, .06);
}

.iro-none-glow {
	position: absolute;
	inset: -40% -20% auto;
	height: 60%;
	background:
		radial-gradient(circle at 20% 40%, rgba(244, 167, 190, .35), transparent 60%),
		radial-gradient(circle at 80% 20%, rgba(192, 132, 252, .30), transparent 60%),
		radial-gradient(circle at 60% 80%, rgba(140, 200, 255, .25), transparent 60%);
	filter: blur(24px);
	pointer-events: none;
	z-index: 0;
}

.iro-none-body {
	position: relative;
	z-index: 1;
	padding: 44px 36px 36px;
	text-align: center;
}

.iro-none-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 76px;
	height: 76px;
	border-radius: 50%;
	font-size: 30px;
	color: #fff;
	background: linear-gradient(135deg, #f6a7b8 0%, #c084fc 100%);
	box-shadow: 0 12px 30px rgba(240, 140, 170, .35),
		0 4px 10px rgba(192, 132, 252, .25);
	margin-bottom: 20px;
	animation: iro-float 4s ease-in-out infinite;
}

.iro-none-title {
	margin: 0 0 10px;
	font-size: 30px;
	font-weight: 800;
	letter-spacing: 1px;
	color: #2c2c36;
}

.iro-none-hint {
	margin: 0 0 22px;
	font-size: 15px;
	color: rgba(60, 60, 70, .7);
}

/* Search form */
.iro-none-search {
	max-width: 420px;
	margin: 0 auto 26px;
}

.iro-none-search form,
.iro-none-search .search-form {
	display: flex;
	align-items: stretch;
	border-radius: 999px;
	background: #fff;
	border: 1px solid rgba(220, 200, 215, .9);
	box-shadow: 0 4px 14px rgba(200, 140, 170, .10);
	overflow: hidden;
	transition: box-shadow .25s ease, transform .25s ease;
}

.iro-none-search form:focus-within,
.iro-none-search .search-form:focus-within {
	box-shadow: 0 8px 22px rgba(200, 140, 170, .22);
	transform: translateY(-1px);
}

.iro-none-search input[type="search"],
.iro-none-search .search-field {
	flex: 1 1 auto;
	min-width: 0;
	padding: 12px 18px;
	border: none;
	background: transparent;
	font-size: 14px;
	color: #3a3a44;
	outline: none;
}

.iro-none-search input[type="search"]::placeholder {
	color: rgba(120, 110, 130, .55);
}

.iro-none-search input[type="submit"],
.iro-none-search .search-submit {
	padding: 0 22px;
	border: none;
	background: linear-gradient(135deg, #f6a7b8 0%, #c084fc 100%);
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 1px;
	cursor: pointer;
	transition: filter .2s ease;
}

.iro-none-search input[type="submit"]:hover,
.iro-none-search .search-submit:hover {
	filter: brightness(1.06);
}

/* Suggestion list */
.iro-none-block {
	margin: 26px auto 0;
	max-width: 640px;
	text-align: left;
}

.iro-none-block-title {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 12px;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 1px;
	color: rgba(80, 70, 90, .85);
}

.iro-none-block-title i {
	color: #c06a90;
}

.iro-none-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 10px 14px;
}

.iro-none-list li a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 12px 16px;
	border-radius: 12px;
	background: rgba(255, 255, 255, .75);
	border: 1px solid rgba(230, 210, 220, .8);
	color: #3a3a44;
	text-decoration: none;
	transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.iro-none-list li a:hover {
	transform: translateY(-2px);
	border-color: rgba(200, 150, 180, .6);
	box-shadow: 0 10px 24px rgba(200, 140, 170, .18);
}

.iro-none-list-title {
	flex: 1 1 auto;
	font-size: 14px;
	line-height: 1.4;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
}

.iro-none-list-date {
	flex: 0 0 auto;
	font-size: 12px;
	color: rgba(120, 110, 130, .55);
	font-variant-numeric: tabular-nums;
}

/* Tag chips */
.iro-none-tags {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.iro-none-tags li a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	border-radius: 999px;
	font-size: 13px;
	color: #6b4a5a;
	background: rgba(248, 226, 232, .85);
	border: 1px solid rgba(230, 195, 210, .7);
	text-decoration: none;
	transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}

.iro-none-tags li a i {
	font-size: 12px;
	color: #b06a8f;
}

.iro-none-tags li a:hover {
	transform: translateY(-2px);
	background: #f6d7e0;
	box-shadow: 0 6px 16px rgba(200, 140, 170, .2);
}

/* CTA buttons */
.iro-none-cta {
	margin: 30px 0 0;
}

.iro-none-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 28px;
	border-radius: 999px;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 1px;
	color: #fff;
	background: linear-gradient(135deg, #f6a7b8 0%, #c084fc 100%);
	box-shadow: 0 10px 24px rgba(220, 130, 170, .32);
	text-decoration: none;
	transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}

.iro-none-btn:hover {
	transform: translateY(-2px);
	filter: brightness(1.06);
	box-shadow: 0 14px 30px rgba(220, 130, 170, .42);
}

.iro-none-btn-ghost {
	background: transparent;
	color: #8b5a72;
	border: 1px solid rgba(200, 150, 180, .55);
	box-shadow: none;
}

.iro-none-btn-ghost:hover {
	background: rgba(248, 226, 232, .6);
}

/* Responsive */
@media (max-width: 720px) {
	.iro-archive-hero {
		padding: 28px 20px 22px;
	}

	.iro-archive-title {
		font-size: 28px;
	}

	.iro-archive-icon,
	.iro-none-icon {
		width: 60px;
		height: 60px;
		font-size: 24px;
	}

	.iro-none-body {
		padding: 32px 22px 26px;
	}

	.iro-none-title {
		font-size: 22px;
	}

	.iro-none-list {
		grid-template-columns: 1fr;
	}
}

/* Dark mode compatibility */
body.dark .iro-none-card,
body.dark .iro-none-list li a {
	background: rgba(35, 35, 45, .6);
	border-color: rgba(80, 70, 90, .5);
}

/* =========================================================
   Fallback: 文章卡片可见性兑底
   主题默认 .post-list-thumb opacity:0 需 JS 加 .post-list-show 才显示；
   当外部 CDN (s.nmxc.ltd) 被 ORB 拦截时，smoothscroll.js 加载失败，
   渐入逻辑不会运行，导致首页一片空白。这里强制可见。
   ========================================================= */
.post-list-thumb {
	opacity: 1 !important;
	content-visibility: auto !important;
}

/* 取消 lazyload 占位 SVG，直接展示真实图 */
.post-list-thumb .post-thumb img.lazyload[src*="puff-load"],
.post-list-thumb .post-thumb img.lazyload:not([src]) {
	content-visibility: auto;
}

.post-list-thumb .post-thumb img.lazyload[data-src]:not([src^="http"]) {
	background: linear-gradient(135deg, #f6e2ea 0%, #e2d9f3 100%);
}

/* =========================================================
   首页 Hero 本地随机封面
   主题 JS 默认会用 cover_api 重写 background-image，
   这里用 !important 锁定 inline 注入的本地图。
   ========================================================= */
#centerbg.iro-local-cover {
	background-size: cover !important;
	background-position: center center !important;
	background-repeat: no-repeat !important;
}

/* =========================================================
   首页 Hero 加载兑底（关键稳定性修复）
   主题 style.css 默认 .headertop { height: 0 }，
   依赖 app.js 异步初始化把它撑到 100vh；
   一旦 cache_cover 走 IndexedDB 失败 / JS 报错，
   头图整块会空白。这里给头图一个合理的默认布局，
   JS 正常运行时依然能覆盖，失效时也能正常显示。
   ========================================================= */
section .headertop {
	min-height: 100vh;
	height: 100vh;
}

section .headertop #centerbg {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

/* =========================================================
   全站字体统一为小米 MiSans
   通过 header.php 加载小米官方 HyperOS CDN，
   这里以最高优先级覆盖所有 font-family 声明，
   让正文、标题、代码块、按钮、导航等全部使用 MiSans。
   ========================================================= */
html, body,
body, p, span, div, a, li, td, th,
h1, h2, h3, h4, h5, h6,
input, textarea, select, button,
.entry-content, .post-content, .pattern-center,
.site-footer, .footer-nav, .footer-bottom,
.header-info, .focusinfo, .center-text,
.element, .header-tou, .top-social,
pre, code, kbd, samp, tt {
	font-family: 'MiSans', -apple-system, BlinkMacSystemFont, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif !important;
}

/* 图标字体不能被覆盖，保持 FontAwesome */
.fa, .fas, .far, .fal, .fad, .fab,
[class^="fa-"], [class*=" fa-"],
i[class*="fa-"] {
	font-family: 'Font Awesome 6 Free', 'Font Awesome 6 Brands', 'Font Awesome 5 Free', 'FontAwesome' !important;
}

body.dark .iro-archive-title {
	background: linear-gradient(120deg, #f2d9e2 0%, #c9a7d8 60%, #a580c0 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

body.dark .iro-archive-desc,
body.dark .iro-none-hint {
	color: rgba(230, 220, 235, .7);
}

body.dark .iro-none-title {
	color: #f0e6ee;
}

body.dark .iro-none-search form,
body.dark .iro-none-search .search-form {
	background: rgba(50, 50, 62, .8);
	border-color: rgba(90, 80, 100, .6);
}

body.dark .iro-none-search input[type="search"],
body.dark .iro-none-search .search-field {
	color: #f0e6ee;
}

body.dark .iro-none-tags li a {
	background: rgba(60, 50, 68, .7);
	border-color: rgba(110, 90, 110, .6);
	color: #e6c9d8;
}

body.dark .iro-none-list li a {
	color: #f0e6ee;
}