@charset "UTF-8";

/*
	cijian_forum —— 版块栏目美化样式

	设计令牌取自此间主题（plugin/kehua_theme/view/css/style.css）的真实取值：
		--color-primary:#0066ff   --color-primary-dark:#0052cc   --color-text:#333
		--color-text-light:#666   --color-border:#e8e8e8          --color-bg:#f5f6f8
		--radius:12px             --shadow-sm:0 1px 3px rgba(0,0,0,.08)
		--shadow-md:0 2px 8px rgba(0,0,0,.1)                      --border:1px solid rgba(0,0,0,.05)

	卡片基础阴影 / hover 阴影沿用该主题 .kehua-post-card 的真实取值：
		base : rgba(15,23,42,.06) 0 2px 12px
		hover: rgba(15,23,42,.09) 0 4px 18px + border-color rgba(0,0,0,.09)

	说明：本插件的目标就是复刻外部主题的视觉，因此使用自定义 .cf-* 类而非 Bootstrap .card，
	以免 Bootstrap 的圆角/内边距/阴影与目标设计互相覆盖。所有颜色走 CSS 变量，
	后台改主色或切「跟随站点主题色」时自动生效。
*/

/* ============ 令牌 ============ */

.cf-forums {
	/* 模板会用后台配置覆盖这两个值 */
	--cf-primary: #0066ff;
	--cf-primary-rgb: 0, 102, 255;

	/* 排行榜前三名配色（红 / 橙 / 紫，与主色区分；4 名以后用灰色） */
	--cf-rank-1: #f5222d;
	--cf-rank-2: #fa8c16;
	--cf-rank-3: #722ed1;

	--cf-text: #333;
	--cf-text-light: #666;
	--cf-text-muted: #9ca3af;
	--cf-border: #e8e8e8;
	--cf-bg: #f5f6f8;
	--cf-card-bg: #fff;
	--cf-radius: 12px;
	--cf-line: 1px solid rgba(0, 0, 0, 0.05);
	--cf-shadow-sm: rgba(15, 23, 42, 0.06) 0 2px 12px;
	--cf-shadow-md: rgba(15, 23, 42, 0.09) 0 4px 18px;

	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
		"Hiragino Sans GB", "Microsoft YaHei", sans-serif;
	font-size: 14px;
	line-height: 1.5;
	color: var(--cf-text);
}

/* ============ 分区 ============ */

.cf-forums .cf-section {
	margin-bottom: 22px;
}

.cf-forums .cf-section:last-child {
	margin-bottom: 0;
}

.cf-forums .cf-section-head {
	position: relative;
	padding-left: 14px;
	margin-bottom: 12px;
}

.cf-forums .cf-section-mark {
	position: absolute;
	left: 0;
	top: 5px;
	width: 4px;
	height: 16px;
	border-radius: 999px;
	background: var(--cf-primary);
}

.cf-forums .cf-section-title {
	display: flex;
	align-items: center;
	gap: 7px;
	margin: 0;
	font-size: 18px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--cf-text);
}

.cf-forums .cf-section-title > i {
	font-size: 19px;
	color: var(--cf-primary);
}

.cf-forums .cf-section-desc {
	margin: 4px 0 0;
	font-size: 13px;
	color: var(--cf-text-light);
	line-height: 1.5;
}

/* ============ 卡片网格 ============ */

.cf-forums .cf-grid {
	display: grid;
	gap: 12px;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.cf-forums .cf-grid.cf-cols-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cf-forums .cf-grid.cf-cols-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.cf-forums .cf-grid.cf-cols-4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* ============ 版块卡片 ============ */

.cf-forums .cf-card {
	position: relative;
	background: var(--cf-card-bg);
	border: var(--cf-line);
	border-radius: var(--cf-radius);
	box-shadow: var(--cf-shadow-sm);
	overflow: hidden;
	transition: box-shadow 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.cf-forums .cf-card:hover {
	box-shadow: var(--cf-shadow-md);
	border-color: rgba(0, 0, 0, 0.09);
	transform: translateY(-2px);
}

.cf-forums .cf-card-main {
	display: block;
	padding: 14px 16px;
	color: inherit;
	text-decoration: none;
}

.cf-forums .cf-card-top {
	display: flex;
	align-items: center;
	gap: 12px;
	min-width: 0;
}

.cf-forums .cf-card-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	flex-shrink: 0;
	border-radius: 12px;
	background: rgba(var(--cf-primary-rgb), 0.08);
	color: var(--cf-primary);
	font-size: 26px;
	overflow: hidden;
}

.cf-forums .cf-card-icon img {
	width: 48px;
	height: 48px;
	object-fit: cover;
	border-radius: 12px;
}

.cf-forums .cf-card-info {
	display: flex;
	flex-direction: column;
	gap: 3px;
	flex: 1 1 auto;
	min-width: 0;
}

.cf-forums .cf-card-name {
	min-width: 0;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.35;
	color: var(--cf-text);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	transition: color 0.2s ease;
}

.cf-forums .cf-card:hover .cf-card-name {
	color: var(--cf-primary);
}

.cf-forums .cf-card-stats {
	font-size: 12px;
	color: var(--cf-text-muted);
	white-space: nowrap;
}

.cf-forums .cf-card-today {
	display: inline-flex;
	align-items: center;
	gap: 2px;
	flex-shrink: 0;
	padding: 1px 6px;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 600;
	color: #e53935;
	background: rgba(229, 57, 53, 0.1);
}

.cf-forums .cf-card-desc {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	margin-top: 10px;
	font-size: 13px;
	color: var(--cf-text-light);
	line-height: 1.5;
	word-break: break-word;
}

.cf-forums .cf-card-last {
	display: flex;
	align-items: center;
	gap: 4px;
	margin-top: 8px;
	font-size: 12px;
	color: var(--cf-text-muted);
	min-width: 0;
}

.cf-forums .cf-card-last > i {
	flex-shrink: 0;
}

.cf-forums .cf-card-last-by {
	color: var(--cf-text-light);
	flex-shrink: 0;
}

.cf-forums .cf-card-last-time {
	margin-left: auto;
	flex-shrink: 0;
}

.cf-forums .cf-card-actions {
	display: flex;
	justify-content: flex-end;
	padding: 0 16px 12px;
}

/* ============ 版主 / 底部按钮 / 空态 ============ */

.cf-forums .cf-mods {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 5px;
	margin-top: 9px;
	font-size: 12px;
	color: var(--cf-text-muted);
}

.cf-forums .cf-mods > i {
	color: var(--cf-primary);
}

.cf-forums .cf-mods a {
	color: var(--cf-text-light);
	text-decoration: none;
}

.cf-forums .cf-mods a:hover {
	color: var(--cf-primary);
}

.cf-forums .cf-mods-sep {
	opacity: 0.5;
}

.cf-forums .cf-foot {
	display: flex;
	justify-content: center;
	margin-top: 26px;
}

.cf-forums .cf-post-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 9px 26px;
	border-radius: 999px;
	background: var(--cf-primary);
	color: #fff;
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
	box-shadow: rgba(var(--cf-primary-rgb), 0.22) 0 1px 2px,
		rgba(var(--cf-primary-rgb), 0.18) 0 2px 10px;
	transition: filter 0.2s ease, transform 0.2s ease;
}

.cf-forums .cf-post-btn:hover {
	color: #fff;
	filter: brightness(1.06);
	transform: translateY(-1px);
}

.cf-forums .cf-empty {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 56px 16px;
	color: var(--cf-text-muted);
}

.cf-forums .cf-empty > i {
	font-size: 34px;
	opacity: 0.5;
}

/* ===================== 模块卡片（活跃会员 / 阅读榜 / 今日推荐） ===================== */

.cf-forums .cf-mod {
	margin-bottom: 16px;
	padding: 16px;
	background: var(--cf-card-bg);
	border: var(--cf-line);
	border-radius: var(--cf-radius);
	box-shadow: var(--cf-shadow-sm);
}

.cf-forums .cf-mod:last-child {
	margin-bottom: 0;
}

.cf-forums .cf-mod-head {
	position: relative;
	display: flex;
	align-items: center;
	gap: 8px;
	padding-left: 13px;
	margin-bottom: 12px;
}

.cf-forums .cf-mod-mark {
	position: absolute;
	left: 0;
	top: 3px;
	width: 4px;
	height: 15px;
	border-radius: 999px;
	background: var(--cf-primary);
}

.cf-forums .cf-mod-title {
	margin: 0;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
	color: var(--cf-text);
}

/* ===================== 顶部大图轮播 ===================== */

.cf-forums .cf-hero {
	position: relative;
	margin-bottom: 16px;
	border-radius: var(--cf-radius);
	overflow: hidden;
	background: #e9edf2;
	box-shadow: var(--cf-shadow-sm);
}

.cf-forums .cf-hero-track {
	position: relative;
}

.cf-forums .cf-hero-slide {
	display: none;
	position: relative;
	aspect-ratio: 21 / 8;
	text-decoration: none;
}

.cf-forums .cf-hero-slide.is-active {
	display: block;
}

.cf-forums .cf-hero-img {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.cf-forums .cf-hero-shade {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 42%, rgba(0, 0, 0, 0.55) 100%);
}

.cf-forums .cf-hero-caption {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 0 24px 20px;
}

.cf-forums .cf-hero-title {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	font-size: 20px;
	font-weight: 700;
	line-height: 1.4;
	color: #fff;
	text-shadow: 0 1px 6px rgba(0, 0, 0, 0.35);
}

.cf-forums .cf-hero-nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 34px;
	height: 34px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	color: #fff;
	background: rgba(0, 0, 0, 0.28);
	opacity: 0;
	cursor: pointer;
	transition: opacity 0.2s ease, background 0.2s ease;
}

.cf-forums .cf-hero:hover .cf-hero-nav {
	opacity: 1;
}

.cf-forums .cf-hero-nav:hover {
	background: rgba(0, 0, 0, 0.5);
}

.cf-forums .cf-hero-nav--prev {
	left: 12px;
}

.cf-forums .cf-hero-nav--next {
	right: 12px;
}

.cf-forums .cf-hero-dots {
	position: absolute;
	right: 16px;
	bottom: 16px;
	display: flex;
	align-items: center;
	gap: 5px;
}

.cf-forums .cf-hero-dot {
	width: 7px;
	height: 7px;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.5);
	cursor: pointer;
	transition: width 0.2s ease, background 0.2s ease;
}

.cf-forums .cf-hero-dot.is-active {
	width: 20px;
	background: #fff;
}

/* ===================== 活跃会员 ===================== */

.cf-forums .cf-members-scroller {
	overflow-x: auto;
	overflow-y: hidden;
}

.cf-forums .cf-members-list {
	display: flex;
	gap: 4px;
	margin: 0;
	padding: 0 2px 4px;
	list-style: none;
}

.cf-forums .cf-members-item {
	flex: 0 0 auto;
}

.cf-forums .cf-members-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	width: 84px;
	padding: 6px 4px;
	border-radius: 10px;
	color: inherit;
	text-decoration: none;
	transition: background 0.15s ease;
}

.cf-forums .cf-members-card:hover {
	background: rgba(var(--cf-primary-rgb), 0.06);
}

.cf-forums .cf-members-avatar-wrap {
	line-height: 0;
}

.cf-forums .cf-members-name {
	max-width: 100%;
	font-size: 13px;
	color: var(--cf-text);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.cf-forums .cf-members-time {
	font-size: 12px;
	color: var(--cf-text-muted);
}

/* ===================== 最新发布（v1.5.0，对齐首页「最新内容」样式，两列） ===================== */

.cf-forums .cf-latest-head {
	align-items: center;
}

.cf-forums .cf-latest-head .cf-mod-title {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.cf-forums .cf-latest-head .cf-mod-title i {
	font-size: 16px;
	color: var(--cf-text-muted);
}

/* 标题行最右侧的「更多」（对齐首页 .xkh-sec-more） */
.cf-forums .cf-latest-more {
	margin-left: auto;
	display: inline-flex;
	align-items: center;
	gap: 2px;
	font-size: 12px;
	color: var(--cf-text-muted);
	text-decoration: none;
	white-space: nowrap;
	transition: color 0.2s ease;
}

.cf-forums .cf-latest-more:hover {
	color: var(--cf-primary);
}

.cf-forums .cf-latest-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 2px 16px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.cf-forums .cf-latest-item {
	min-width: 0;
}

/* 单行：图标 + 标题（单行省略） + 时间，与首页 .xkh-latest-list 一致 */
.cf-forums .cf-latest-link {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 7px 4px;
	border-radius: 6px;
	font-size: 13px;
	line-height: 1.5;
	color: var(--cf-text);
	text-decoration: none;
	transition: background 0.2s ease, color 0.2s ease;
}

.cf-forums .cf-latest-link:hover {
	background: rgba(var(--cf-primary-rgb), 0.06);
	color: var(--cf-primary);
}

.cf-forums .cf-latest-link > i {
	flex: 0 0 auto;
	font-size: 14px;
	color: var(--cf-text-muted);
}

.cf-forums .cf-latest-text {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.cf-forums .cf-latest-date {
	flex: 0 0 auto;
	font-size: 12px;
	color: var(--cf-text-muted);
}

/* ===================== 邀请好友（v1.5.0，右栏今日推荐上方的轻量标签） ===================== */

.cf-forums .cf-invite-tag {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-bottom: 16px;
	padding: 9px 14px;
	border-radius: 8px;
	border: var(--cf-line);
	background: rgba(var(--cf-primary-rgb), 0.08);
	font-size: 13px;
	font-weight: 500;
	color: var(--cf-primary);
	text-decoration: none;
	transition: background 0.2s ease, border-color 0.2s ease;
}

.cf-forums .cf-invite-tag:hover {
	background: rgba(var(--cf-primary-rgb), 0.14);
	border-color: rgba(var(--cf-primary-rgb), 0.35);
	color: var(--cf-primary);
}

.cf-forums .cf-invite-tag > i:first-child {
	font-size: 16px;
}

.cf-forums .cf-invite-tag-text {
	flex: 1 1 auto;
}

.cf-forums .cf-invite-tag > i:last-child {
	font-size: 14px;
	opacity: 0.6;
}

/* ===================== 精彩导读（头条 / 最新榜单） ===================== */

.cf-forums .cf-read {
	padding: 0;
}

.cf-forums .cf-read-head {
	display: flex;
	gap: 0;
	padding: 0;
	border-bottom: var(--cf-line);
}

.cf-forums .cf-read-tab {
	position: relative;
	flex: 1 1 0;
	min-width: 0;
	padding: 14px 4px 11px;
	border: 0;
	background: none;
	font-size: 14px;
	line-height: 1.3;
	color: var(--cf-text-light);
	text-align: center;
	white-space: nowrap;
	cursor: pointer;
	transition: color 0.2s ease;
}

.cf-forums .cf-read-tab:hover {
	color: var(--cf-text);
}

.cf-forums .cf-read-tab.is-active {
	color: var(--cf-text);
	font-weight: 600;
}

.cf-forums .cf-read-tab.is-active::after {
	content: "";
	position: absolute;
	left: 20%;
	right: 20%;
	bottom: -1px;
	height: 2px;
	border-radius: 2px;
	background: var(--cf-primary);
}

.cf-forums .cf-read-panel {
	padding: 8px 16px 14px;
}

.cf-forums .cf-read-panel.is-hidden {
	display: none;
}

.cf-forums .cf-read-empty {
	padding: 18px 0;
	font-size: 13px;
	color: var(--cf-text-muted);
	text-align: center;
}

.cf-forums .cf-hot-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.cf-forums .cf-hot-list a {
	display: flex;
	align-items: center;
	gap: 9px;
	padding: 7px 0;
	color: var(--cf-text);
	text-decoration: none;
}

.cf-forums .cf-hot-list a:hover .cf-hot-title {
	color: var(--cf-primary);
}

.cf-forums .cf-hot-num {
	flex: 0 0 auto;
	width: 17px;
	height: 17px;
	border-radius: 4px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 11px;
	font-weight: 600;
	line-height: 1;
	color: var(--cf-text-muted);
	background: rgba(0, 0, 0, 0.05);
}

.cf-forums .cf-hot-num--rest {
	color: var(--cf-text-muted);
	background: transparent;
}

.cf-forums .cf-hot-num--1 {
	color: #fff;
	background: var(--cf-rank-1);
}

.cf-forums .cf-hot-num--2 {
	color: #fff;
	background: var(--cf-rank-2);
}

.cf-forums .cf-hot-num--3 {
	color: #fff;
	background: var(--cf-rank-3);
}

.cf-forums .cf-hot-title {
	min-width: 0;
	font-size: 13px;
	line-height: 1.5;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	transition: color 0.2s ease;
}

/* ===================== 我要发帖 CTA ===================== */

.cf-forums .cf-cta {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	margin-bottom: 16px;
	padding: 11px 16px;
	border-radius: 8px;
	background: var(--cf-primary);
	color: #fff;
	font-size: 15px;
	font-weight: 500;
	text-decoration: none;
	box-shadow: rgba(var(--cf-primary-rgb), 0.22) 0 1px 2px,
		rgba(var(--cf-primary-rgb), 0.18) 0 2px 10px;
	transition: filter 0.2s ease;
}

.cf-forums .cf-cta:hover {
	color: #fff;
	filter: brightness(1.06);
}

/* ===================== 今日推荐 ===================== */

.cf-forums .cf-rec-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.cf-forums .cf-rec-item + .cf-rec-item {
	border-top: var(--cf-line);
}

.cf-forums .cf-rec-link {
	display: block;
	padding: 10px 0;
	color: inherit;
	text-decoration: none;
}

.cf-forums .cf-rec-row1 {
	display: flex;
	align-items: flex-start;
	gap: 8px;
}

.cf-forums .cf-rec-num {
	flex: 0 0 auto;
	margin-top: 1px;
	width: 17px;
	height: 17px;
	border-radius: 4px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 11px;
	font-weight: 600;
	line-height: 1;
	color: var(--cf-text-muted);
	background: transparent;
}

/* 前三名同样用红 / 橙 / 紫区分 */
.cf-forums .cf-rec-num--1 {
	color: #fff;
	background: var(--cf-rank-1);
}

.cf-forums .cf-rec-num--2 {
	color: #fff;
	background: var(--cf-rank-2);
}

.cf-forums .cf-rec-num--3 {
	color: #fff;
	background: var(--cf-rank-3);
}

.cf-forums .cf-rec-subject {
	font-size: 13px;
	line-height: 1.5;
	color: var(--cf-text);
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
}

.cf-forums .cf-rec-link:hover .cf-rec-subject {
	color: var(--cf-primary);
}

.cf-forums .cf-rec-row2 {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	margin-top: 6px;
	padding-left: 25px;
}

.cf-forums .cf-rec-user {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	min-width: 0;
}

.cf-forums .cf-rec-name {
	font-size: 12px;
	color: var(--cf-text-light);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.cf-forums .cf-rec-views {
	flex: 0 0 auto;
	font-size: 12px;
	color: var(--cf-text-muted);
}

/* ============ 暗色适配（XIUNOX 用 data-bs-theme，不用 prefers-color-scheme） ============ */

[data-bs-theme="dark"] .cf-forums {
	--cf-text: #e6e6e6;
	--cf-text-light: #9aa0a6;
	--cf-text-muted: #7c8288;
	--cf-border: #2a2d31;
	--cf-bg: #16181b;
	--cf-card-bg: #1b1e21;
	--cf-line: 1px solid rgba(255, 255, 255, 0.06);
	--cf-shadow-sm: rgba(0, 0, 0, 0.4) 0 2px 12px;
	--cf-shadow-md: rgba(0, 0, 0, 0.5) 0 4px 18px;
}

[data-bs-theme="dark"] .cf-forums .cf-card:hover {
	border-color: rgba(255, 255, 255, 0.12);
}

[data-bs-theme="dark"] .cf-forums .cf-hot-num--rest {
	background: rgba(255, 255, 255, 0.08);
}

[data-bs-theme="dark"] .cf-forums .cf-hero {
	background: #22262b;
}

/* ===================== 广告位（v1.3.0） ===================== */

.cf-forums .cf-ads .cf-mod-head {
	align-items: center;
}

.cf-forums .cf-ads-buy {
	margin-left: auto;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	padding: 5px 14px;
	border-radius: 999px;
	background: var(--cf-primary);
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.5;
	text-decoration: none;
	white-space: nowrap;
	box-shadow: 0 1px 3px rgba(var(--cf-primary-rgb), 0.35);
	transition: opacity 0.2s ease;
}

.cf-forums .cf-ads-buy:hover {
	opacity: 0.88;
	color: #fff;
}

.cf-forums .cf-ads-buy i {
	font-size: 15px;
}

/* 空位「此广告位招租」占位（与站内既有广告位插件风格一致） */
.cf-forums .cf-ads-empty {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 56px;
	padding: 12px 8px;
	border: 1px dashed rgba(var(--cf-primary-rgb), 0.35);
	border-radius: 8px;
	background: rgba(var(--cf-primary-rgb), 0.03);
	font-size: 13px;
	color: var(--cf-text-muted);
	text-decoration: none;
	transition: color 0.2s ease, border-color 0.2s ease;
}

.cf-forums .cf-ads-empty:hover {
	color: var(--cf-primary);
	border-color: var(--cf-primary);
}

.cf-forums .cf-ads-image,
.cf-forums .cf-ads-text {
	display: grid;
	gap: 8px;
}

.cf-forums .cf-ads-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); }
.cf-forums .cf-ads-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cf-forums .cf-ads-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cf-forums .cf-ads-cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cf-forums .cf-ads-cols-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.cf-forums .cf-ads-cols-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }

.cf-forums .cf-ads-item {
	display: block;
	overflow: hidden;
	border-radius: 8px;
	border: var(--cf-line);
	background: var(--cf-card-bg);
}

.cf-forums .cf-ads-item img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 260px;
	object-fit: cover;
}

.cf-forums .cf-ads-text {
	margin-top: 8px;
}

.cf-forums .cf-ads-textitem {
	display: block;
	padding: 7px 10px;
	border-radius: 8px;
	background: var(--cf-bg);
	font-size: 13px;
	line-height: 1.45;
	color: var(--cf-text-light);
	text-decoration: none;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	transition: color 0.2s ease, background 0.2s ease;
}

.cf-forums .cf-ads-textitem:hover {
	color: var(--cf-primary);
	background: rgba(var(--cf-primary-rgb), 0.08);
}

.cf-forums .cf-ads-textitem--empty {
	color: var(--cf-text-muted);
	background: transparent;
	border: 1px dashed rgba(var(--cf-primary-rgb), 0.28);
	text-align: center;
}

/* ---- 广告投放页 ---- */

.cf-forums.cf-ad-page .cf-ad-head {
	margin-bottom: 16px;
}

.cf-forums.cf-ad-page .cf-ad-title {
	margin: 0 0 6px;
	font-size: 20px;
	font-weight: 600;
	color: var(--cf-text);
}

.cf-forums.cf-ad-page .cf-ad-sub {
	font-size: 13px;
	color: var(--cf-text-light);
}

.cf-forums.cf-ad-page .cf-ad-alert {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	margin-bottom: 16px;
	padding: 12px 16px;
	border-radius: 8px;
	border: 1px solid transparent;
	font-size: 13px;
	line-height: 1.6;
	background: rgba(var(--cf-primary-rgb), 0.08);
	color: var(--cf-primary);
}

.cf-forums.cf-ad-page .cf-ad-alert > i {
	flex: 0 0 auto;
	margin-top: 2px;
	font-size: 16px;
}

/* 投放成功提示要醒目：绿色底 + 描边 + 加粗 */
.cf-forums.cf-ad-page .cf-ad-alert.is-ok {
	background: #f0f9eb;
	border-color: #b7eb8f;
	color: #389e0d;
	font-weight: 500;
}

.cf-forums.cf-ad-page .cf-ad-alert.is-err {
	background: rgba(245, 34, 45, 0.08);
	border-color: rgba(245, 34, 45, 0.25);
	color: #f5222d;
}

[data-bs-theme="dark"] .cf-forums.cf-ad-page .cf-ad-alert.is-ok {
	background: rgba(82, 196, 26, 0.12);
	border-color: rgba(82, 196, 26, 0.35);
	color: #95de64;
}

/* 余额不足 → 充值引导 */
.cf-forums.cf-ad-page .cf-ad-recharge {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	margin-left: 8px;
	padding: 2px 10px;
	border-radius: 999px;
	background: #f5222d;
	color: #fff;
	font-size: 12px;
	line-height: 18px;
	text-decoration: none;
	white-space: nowrap;
}

.cf-forums.cf-ad-page .cf-ad-recharge:hover {
	opacity: 0.88;
	color: #fff;
}

/* 余额充足时的「充值」入口：低调样式，避免被误读成告警 */
.cf-forums.cf-ad-page .cf-ad-recharge--soft {
	background: rgba(var(--cf-primary-rgb), 0.1);
	color: var(--cf-primary);
	box-shadow: none;
}

.cf-forums.cf-ad-page .cf-ad-recharge--soft:hover {
	background: rgba(var(--cf-primary-rgb), 0.18);
	color: var(--cf-primary);
	opacity: 1;
}

.cf-forums.cf-ad-page .cf-ad-cost-warn {
	margin: 0 0 10px;
	font-size: 13px;
	font-weight: 500;
	color: #f5222d;
}

/* 管理员自检行 */
.cf-forums.cf-ad-page .cf-ad-debug {
	margin-bottom: 12px;
	padding: 8px 12px;
	border-radius: 8px;
	background: var(--cf-bg);
	font-size: 12px;
	line-height: 1.7;
	color: var(--cf-text-muted);
	word-break: break-all;
}

.cf-forums.cf-ad-page .cf-ad-recharge-link {
	color: #f5222d;
	font-weight: 600;
	text-decoration: underline;
}

.cf-forums.cf-ad-page .cf-ad-hint--warn {
	color: #f5222d;
}

/* 广告类型联动：文字广告时隐藏图片字段（由 cijian_forum.js 切换） */
.cf-forums.cf-ad-page .cf-ad-field.is-hidden {
	display: none;
}

.cf-forums.cf-ad-page .cf-ad-cost {
	margin: 10px 0 8px;
	font-size: 13px;
	color: var(--cf-text-light);
}

.cf-forums.cf-ad-page .cf-ad-cost.is-err {
	color: #f5222d;
	font-weight: 600;
}

.cf-forums.cf-ad-page .cf-ad-grid2 {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
	align-items: start;
}

.cf-forums.cf-ad-page .cf-ad-field {
	margin-bottom: 14px;
}

.cf-forums.cf-ad-page .cf-ad-label {
	display: block;
	margin-bottom: 6px;
	font-size: 13px;
	color: var(--cf-text);
}

.cf-forums.cf-ad-page .cf-ad-input {
	width: 100%;
	padding: 8px 12px;
	border: var(--cf-line);
	border-radius: 8px;
	background: var(--cf-card-bg);
	font-size: 13px;
	color: var(--cf-text);
}

.cf-forums.cf-ad-page .cf-ad-input:focus {
	outline: none;
	border-color: var(--cf-primary);
}

.cf-forums.cf-ad-page .cf-ad-radios {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.cf-forums.cf-ad-page .cf-ad-radio {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: var(--cf-text-light);
	cursor: pointer;
}

.cf-forums.cf-ad-page .cf-ad-hint {
	margin-top: 6px;
	font-size: 12px;
	color: var(--cf-text-muted);
}

.cf-forums.cf-ad-page .cf-ad-submit {
	width: 100%;
	border: 0;
	cursor: pointer;
}

.cf-forums.cf-ad-page .cf-ad-list {
	display: flex;
	flex-direction: column;
}

.cf-forums.cf-ad-page .cf-ad-item {
	padding: 10px 0;
	border-top: var(--cf-line);
}

.cf-forums.cf-ad-page .cf-ad-item:first-child {
	border-top: 0;
	padding-top: 0;
}

.cf-forums.cf-ad-page .cf-ad-item-main {
	display: flex;
	align-items: center;
	gap: 8px;
}

.cf-forums.cf-ad-page .cf-ad-item-title {
	font-size: 13px;
	color: var(--cf-text);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.cf-forums.cf-ad-page .cf-ad-badge {
	flex: 0 0 auto;
	padding: 1px 7px;
	border-radius: 10px;
	font-size: 11px;
	line-height: 18px;
	color: #fff;
	background: var(--cf-text-muted);
}

.cf-forums.cf-ad-page .cf-ad-badge--0 { background: #fa8c16; }
.cf-forums.cf-ad-page .cf-ad-badge--1 { background: #52c41a; }
.cf-forums.cf-ad-page .cf-ad-badge--2 { background: #f5222d; }
.cf-forums.cf-ad-page .cf-ad-badge--3 { background: var(--cf-text-muted); }

.cf-forums.cf-ad-page .cf-ad-item-meta {
	margin-top: 4px;
	font-size: 12px;
	color: var(--cf-text-muted);
}

.cf-forums.cf-ad-page .cf-ad-item-reason {
	margin-top: 4px;
	font-size: 12px;
	color: #f5222d;
}

@media (max-width: 767.98px) {
	.cf-forums.cf-ad-page .cf-ad-grid2 {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ===================== 右栏：窄屏不隐藏 ===================== */

/*
	核心三栏骨架把右栏写成 `d-none d-xl-block col-xl-3`（视口 < 1200px 时 display:none）。
	版块页的右栏承载「榜单 + 我要发帖 + 今日推荐」，整块消失体验很差，
	因此 1200px 以下改为堆叠到主栏下方。
	本 CSS 只在 route=forums 时被 header_link_after.htm 注入，不影响其他页面。
*/
@media (max-width: 1199.98px) {
	#body .row > .d-none.d-xl-block.col-xl-3 {
		display: block !important;
		flex: 0 0 100%;
		width: 100%;
		max-width: 100%;
	}
}

@media (max-width: 575.98px) {
	.cf-forums .cf-latest-list {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* ===================== 响应式 ===================== */

@media (max-width: 1199.98px) {

	.cf-forums .cf-grid.cf-cols-4,
	.cf-forums .cf-grid.cf-cols-3 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 767.98px) {
	.cf-forums .cf-section-title {
		font-size: 17px;
	}

	.cf-forums .cf-grid,
	.cf-forums .cf-grid.cf-cols-2,
	.cf-forums .cf-grid.cf-cols-3,
	.cf-forums .cf-grid.cf-cols-4 {
		grid-template-columns: minmax(0, 1fr);
	}

	.cf-forums .cf-card-stats {
		gap: 8px;
	}

	.cf-forums .cf-hero-title {
		font-size: 16px;
	}

	.cf-forums .cf-hero-caption {
		padding: 0 16px 14px;
	}

	.cf-forums .cf-members-card {
		width: 76px;
	}

	.cf-forums .cf-card-icon {
		width: 42px;
		height: 42px;
	}

	.cf-forums .cf-card-icon img {
		width: 42px;
		height: 42px;
	}
}

@media (prefers-reduced-motion: reduce) {

	.cf-forums .cf-card,
	.cf-forums .cf-card-name,
	.cf-forums .cf-post-btn {
		transition: none;
	}

	.cf-forums .cf-card:hover,
	.cf-forums .cf-post-btn:hover {
		transform: none;
	}
}
