/* ========== CSS 变量定义 ========== */
:root {
	/* 主题色 - 清新蓝绿 */
	--primary-color: #2DD4BF;
	--primary-dark: #0D9488;
	--primary-light: #99F6E4;
	--primary-bg: #F0FDFA;
	
	/* 顶部区域 */
	--top-bar-bg: #0D9488;
	--top-bar-text: #FFFFFF;
	--toolbar-bg: #FFFFFF;
	--toolbar-border: #E2E8F0;
	
	/* 侧边栏 */
	--sidebar-bg: #FFFFFF;
	--sidebar-hover: #F1F5F9;
	--sidebar-active-bg: #F0FDFA;
	--sidebar-active-bg1: #e4fcf6;
	--sidebar-active-text: #0D9488;
	--sidebar-border: #E2E8F0;
	
	/* 内容区 */
	--theme-toggle-bg: #f4f4f4;
	--theme-toggle-border: #e1e4e8;
	--content-bg: #F8FAFC;
	--card-bg: #FFFFFF;
	--card-hover-bg: #EFF6FF;
	--card-border: #E2E8F0;
	--card-border-hover: #e8f4fd;
	
	/* 右侧信息栏 */
	--info-panel-bg: #FFFFFF;
	--calendar-today-bg: #2DD4BF;
	--calendar-today-text: #FFFFFF;
	/* --calendar-weekend: #FEE2E2; */
	--calendar-weekend-bg: #E5E7EB;
	--calendar-hover-bg: #FB923C;
	--calendar-hover-text: #FFFFFF;
	--calendar-solar-term-bg: #FCD34D;
	--calendar-solar-term-text: #1E293B;
	--calendar-holiday-bg: #F87171;
	--calendar-holiday-text: #FFFFFF;
	
	/* 文字 */
	--text-primary: #1E293B; /* #1E293B #141c28*/
	--text-secondary: #64748B;
	--text-muted: #94A3B8;
	--text-light: #F1F5F9;

	--info-card-border: #FED6D2;
	
	/* 阴影 */
	--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
	--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
	--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
	
	/* 尺寸 */
	--top-bar-height: 28px;
	--toolbar-height: 56px;
	--sidebar-width: 240px;
	--info-panel-width: 280px;
	
	/* 图标颜色 */
	--icon-color: #64748B;
	--icon-hover-color: #2DD4BF;

	--swpage-bg: #fff;
	--swpage-border: #FED6D2;
	--primary-light: #e8f4fd;
	--code-not-pre-code: #e74c3c;
	--code-not-pre-code-bg: #f1f3f5;
	--pre-bg-color: #f6f8fa;
	--pre-color: #000;
	--border-light: #eee;
	--line-number-btn: #fff;
	--line-number-btn-bg: #B2B4B6;
	--line-number-btn-hover: #D2D4D6;
	--alink: #006dff;
	--alink-primary: #006dff;
	--alink-bg: #fff;
	--alink-hover: #fff;
	--alink-hover-bg: #006dff;
	--blockquote: #24292e;
	--blockquote-bg: #f8f9fa;
	--blockquote-border: #0366d6;
	--blockquote-border-left: #0366d6;
	--context-menu: #0F0308;
	--context-menu-bg: #fff;
	--context-menu-ulli-bg-hover: #f1f1f1;
	--code-action-btn: #6a737d;
	--code-action-btn-bg: transparent;
	--code-action-btn-border: #e1e4e8;
	--code-action-btn-hover: #24292e;
	--code-action-btn-hover-bg: #f1f3f5;
	--code-action-btn-hover-border: #586069;
	--code-action-btn-copied-active: #31a476;
	--code-action-btn-copied-active-border: #31a476;
	
	--table-altrowstable: #fff;
	--table-altrowstable-border: #9b9a9a;
	--table-altrowstable-thtd-border: #ddd;
	--table-oddrowcolor: #fff;
	--table-evenrowcolor: #F6F8FA;
	--table-theadrowcolor: #F6F8FA;
	--table-header-bg: #F8FAFC;
	--table-evenrowcolor: #fbfbfb;

	--table-tr-hover-bg: #e8f4fd;
	--table-bg: #fff;
	--table-even-tr-bg-color: #fbfbfb;

	--fieldset-bg: #f9f9f9;
	--fieldset-border: #ccc;
	--legend-bg: #f9f9f9;
	--legend-text: #333;
	--alt-legend-bg: #007bff;
	--alt-legend-text: #FFFFFF;

	--layer-popup: #000;
	--layer-popup-bg: #fff;
}

/* 主题二：温暖紫粉 */
[data-theme="purple"] {
	--primary-color: #C084FC;
	--primary-dark: #A855F7;
	--primary-light: #E9D5FF;
	--primary-bg: #FAF5FF;
	
	--top-bar-bg: #A855F7;
	
	--sidebar-active-bg: #FAF5FF;
	--sidebar-active-bg1: #FFF1F2;
	--sidebar-active-text: #A855F7;
	
	--card-hover-bg: #FFF1F2;
	
	--calendar-today-bg: #C084FC;
	
	--icon-color: #64748B;
	--icon-hover-color: #C084FC;
}

/* 主题三：Dark 深色模式 */
[data-theme="dark"] {
	--primary-color: #2DD4BF;
	--primary-dark: #0D9488;
	--primary-light: #0D9488;
	--primary-bg: rgba(45, 212, 191, 0.1);
	
	--top-bar-bg: #1E293B;
	--top-bar-text: #E2E8F0;
	--toolbar-bg: #1E293B;
	--toolbar-border: #334155;
	
	--sidebar-bg: #1E293B;
	--sidebar-hover: #334155;
	--sidebar-active-bg: rgba(45, 212, 191, 0.15);
	--sidebar-active-bg1: rgba(70, 212, 193, 0.15);
	--sidebar-active-text: #2DD4BF;
	--sidebar-border: #334155;
	
	--theme-toggle-bg: #0F172A;
	--theme-toggle-border: #30363d;
	--content-bg: #0F172A;
	--card-bg: #1E293B;
	--card-hover-bg: #334155;
	--card-border: #445266;
	--card-border-hover: #677b98;
	
	--info-panel-bg: #1E293B;
	--calendar-today-bg: #2DD4BF;
	--calendar-today-text: #0F172A;
	/* --calendar-weekend: rgba(220, 38, 38, 0.2); */
	--calendar-weekend-bg: #374151;
	--calendar-hover-bg: #FB923C;
	--calendar-hover-text: #0F172A;
	--calendar-solar-term-bg: #FCD34D;
	--calendar-solar-term-text: #0F172A;
	--calendar-holiday-bg: #F87171;
	--calendar-holiday-text: #FFFFFF;
	
	--text-primary: #F1F5F9;
	--text-secondary: #94A3B8;
	--text-muted: #64748B;
	--text-light: #F1F5F9;

	--info-card-border: #0D9488;
	
	--icon-color: #94A3B8;
	--icon-hover-color: #2DD4BF;
	
	--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
	--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.4);
	--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.5);

	--swpage-bg: #000;
	--swpage-border: #30363d;
	--primary-light: #1f3d5c;
	--code-not-pre-code: #e74c3c;
	--code-not-pre-code-bg: #262c36;
	--pre-bg-color: #1c2128;
	--pre-color: #F5F5F5;
	--border-light: #21262d;
	--line-number-btn: #B2B4B6;
	--line-number-btn-bg: #fff;
	--line-number-btn-hover: #D2D4D6;
	--alink: #2DD4BF;
	--alink-primary: #2DD4BF;
	--alink-bg: #000;
	--alink-hover: #fff;
	--alink-hover-bg: #0D9488;
	--blockquote: #c9d1d9;
	--blockquote-bg: #161b22;
	--blockquote-border: #58a6ff;
	--blockquote-border-left: #58a6ff;
	--context-menu: #0F0308;
	--context-menu-bg: #fff;
	--context-menu-ulli-bg-hover: #f1f1f1;
	--code-action-btn: #6a737d;
	--code-action-btn-bg: transparent;
	--code-action-btn-border: #30363d;
	--code-action-btn-hover: #c9d1d9;
	--code-action-btn-hover-bg: #21262d;
	--code-action-btn-hover-border: #8b949e;
	--code-action-btn-copied-active: #31a476;
	--code-action-btn-copied-active-border: #31a476;
	
	--table-altrowstable: #000;
	--table-altrowstable-border: #696969;
	--table-altrowstable-thtd-border: #4e4e4e;
	--table-oddrowcolor: #2b2b2b;
	--table-evenrowcolor: #1c2128;
	--table-theadrowcolor: #333;
	--table-header-bg: #333;
	--table-evenrowcolor: #1c2128;

	--table-tr-hover-bg: #1f3d5c;
	--table-bg: #222;
	--table-even-tr-bg-color: #0d1117;

	--fieldset-bg: #2e4359;
	--fieldset-border: #ccc;
	--legend-bg: #2e4359;
	--legend-text: #FFFFFF;
	--alt-legend-bg: #2e4359;
	--alt-legend-text: #FFFFFF;

	--layer-popup: #fff;
	--layer-popup-bg: #555;
}

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

body {
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans SC', sans-serif;
	background: var(--content-bg);
	color: var(--text-primary);
	line-height: 1.6;
	height: 100vh;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	transition: all 0.3s ease;
	min-width: 1100px;
}

/* ========== 顶部极窄功能栏 ========== */
.top-bar {
	height: var(--top-bar-height);
	background: var(--top-bar-bg);
	color: var(--top-bar-text);
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 1rem;
	font-size: 0.75rem;
	flex-shrink: 0;
	transition: all 0.3s ease;
}

.top-bar-left {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.top-bar-right {
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

.top-bar-link {
	color: rgba(255, 255, 255, 0.9);
	text-decoration: none;
	display: flex;
	align-items: center;
	gap: 0.375rem;
	transition: all 0.2s ease;
}

.top-bar-link:hover {
	color: #FFFFFF;
	text-decoration: underline;
}

.top-bar-divider {
	width: 1px;
	height: 14px;
	background: rgba(255, 255, 255, 0.3);
}

/* ========== 工具栏 ========== */
.toolbar {
	height: var(--toolbar-height);
	background: var(--toolbar-bg);
	border-bottom: 1px solid var(--toolbar-border);
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 1.5rem;
	flex-shrink: 0;
	box-shadow: var(--shadow-sm);
	transition: all 0.3s ease;
}

.toolbar-left {
	display: flex;
	align-items: center;
	gap: 1rem;
	flex: 1;
}

.logo {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	font-size: 1.25rem;
	font-weight: 700;
	color: var(--text-primary);
	text-decoration: none;
}
.logo-name {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	color: var(--text-primary);
	text-decoration: none;
}

.logo-icon {
	width: 36px;
	height: 36px;
	background: linear-gradient(135deg, var(--primary-color), var(--primary-light));
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.25rem;
}

/* 链接导航 */
.link-nav {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.5rem 0.75rem;
	border-radius: 8px;
	background: var(--content-bg);
	border: 1px solid var(--toolbar-border);
}

.link-nav-item {
	color: var(--text-secondary);
	text-decoration: none;
	font-size: 0.875rem;
	transition: all 0.2s ease;
	display: flex;
	align-items: center;
	gap: 0.375rem;
}

.link-nav-item:hover {
	color: var(--primary-color);
}

.link-nav-separator {
	color: var(--text-muted);
	font-size: 0.75rem;
}

/* 历史记录导航 */
.history-nav {
	display: flex;
	align-items: center;
	gap: 0.25rem;
}

.history-btn {
	width: 32px;
	height: 32px;
	border: 1px solid var(--toolbar-border);
	background: var(--card-bg);
	border-radius: 6px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.2s ease;
	padding: 0;
}

.history-btn:hover:not(:disabled) {
	border-color: var(--primary-color);
	background: var(--primary-bg);
}

.history-btn:hover:not(:disabled) svg {
	stroke: var(--icon-hover-color);
}

.history-btn:disabled {
	opacity: 0.4;
	cursor: not-allowed;
}

.history-btn svg {
	width: 24px;
	height: 24px;
	stroke: var(--icon-color);
	stroke-width: 2.5;
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
	transition: all 0.2s ease;
}

/* 搜索框 */
.search-box {
	flex: 1;
	max-width: 450px;
	position: relative;
}

.search-wrapper, .search-form {
	display: flex;
	align-items: center;
	width: 100%;
}

.search-icon-btn {
	width: 40px;
	height: 40px;
	border: none;
	background: transparent;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	transition: all 0.2s ease;
}

.search-icon-btn:hover {
	background: var(--sidebar-hover);
}

.search-icon-btn:hover svg {
	stroke: var(--icon-hover-color);
}

.search-icon-btn svg {
	width: 24px;
	height: 24px;
	stroke: var(--icon-color);
	stroke-width: 2;
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
	transition: all 0.2s ease;
}

.search-input {
	flex: 1;
	padding: 0.625rem 1rem 0.625rem 0.5rem;
	border: 2px solid var(--toolbar-border);
	border-radius: 10px;
	font-size: 0.875rem;
	background: var(--content-bg);
	transition: all 0.2s ease;
	color: var(--text-primary);
}

.search-input:focus {
	outline: none;
	border-color: var(--primary-color);
	background: var(--card-bg);
	box-shadow: 0 0 0 3px var(--primary-light);
}

.toolbar-right {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-left: 1rem;
}

.tool-btn {
	width: 40px;
	height: 40px;
	border: 1px solid var(--toolbar-border);
	background: var(--card-bg);
	border-radius: 8px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	transition: all 0.2s ease;
}

.tool-btn:hover {
	border-color: var(--primary-color);
	background: var(--primary-bg);
}

.tool-btn:hover svg {
	stroke: var(--icon-hover-color);
}

.tool-btn.active {
	background: var(--primary-color);
	border-color: var(--primary-color);
}

.tool-btn.active svg {
	stroke: white;
}

.tool-btn svg {
	width: 24px;
	height: 24px;
	stroke: var(--icon-color);
	stroke-width: 2;
	fill: none;
	stroke-linecap: round;
	stroke-linejoin: round;
	transition: all 0.2s ease;
}

/* 主题切换滑动按钮 */
.theme-toggle {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.25rem 0.5rem;
	background: var(--theme-toggle-bg);
	border: 1px solid var(--theme-toggle-border);
	border-radius: 20px;
}

.theme-option {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	cursor: pointer;
	border: 2px solid transparent;
	transition: all 0.2s ease;
}

.theme-option:hover {
	transform: scale(1.1);
}

.theme-option.active {
	border-color: var(--text-primary);
	box-shadow: 0 0 0 2px var(--primary-light);
}

.theme-light {
	background: linear-gradient(135deg, #ddd, #ccc);
	/* box-shadow: 0 0 0 2px var(--theme-toggle-bg); */
}

.theme-purple {
	background: linear-gradient(135deg, #E9D5FF, #C084FC);
	/* box-shadow: 0 0 0 2px #C084FC; */
}

.theme-dark {
	background: linear-gradient(135deg, #1E293B, #0F172A);
	/* box-shadow: 0 0 0 2px #111; */
}

/* ========== 主体布局 ========== */
.main-container {
	flex: 1;
	display: flex;
	overflow: hidden;
	position: relative;
}

/* ========== 左侧边栏 ========== */
.sidebar {
	width: var(--sidebar-width);
	background: var(--sidebar-bg);
	border-right: 1px solid var(--sidebar-border);
	overflow-y: auto;
	transition: all 0.3s ease;
	flex-shrink: 0;
}

.sidebar.hidden {
	display: none;
}

.sidebar-nav {
	padding: 1rem 0;
}

.nav-section {
	margin-bottom: 1.5rem;
}

.nav-section-title {
	padding: 0.5rem 1.5rem;
	font-size: 0.75rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--text-muted);
}

/* 主菜单项 */
.nav-item {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding: 0.875rem 1.5rem;
	color: var(--text-secondary);
	text-decoration: none;
	transition: all 0.2s ease;
	cursor: pointer;
	border-left: 3px solid transparent;
    font-weight: 500;
}

.nav-item:hover {
	background: var(--sidebar-hover);
	color: var(--text-primary);
}

.nav-item.active {
	background: var(--sidebar-active-bg);
	color: var(--sidebar-active-text);
	border-left-color: var(--primary-color);
	font-weight: 600;
}

.nav-item.has-submenu::after {
	content: '›';
	margin-left: auto;
	font-size: 1.25rem;
	transition: transform 0.3s ease;
	color: var(--text-muted);
}

.nav-item.expanded::after {
	transform: rotate(90deg);
}

.nav-icon {
	width: 20px;
	height: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.125rem;
}

/* 子菜单容器 */
.submenu {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.3s ease;
	background: var(--content-bg);
}

.submenu.open {
	max-height: 500px;
}

/* 子菜单项 */
.submenu-item {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	/* padding: 0.625rem 1.5rem 0.625rem 3.5rem; */
	padding: 0.625rem 1.5rem 0.625rem 2.5rem;
	color: var(--text-secondary);
	text-decoration: none;
	transition: all 0.2s ease;
	cursor: pointer;
	font-size: 0.875rem;
	line-height: 1.4;
}

.submenu-item:hover {
	background: var(--sidebar-hover);
	color: var(--primary-color);
}
.submenu-item.active {
	background: var(--sidebar-active-bg1);
	color: var(--sidebar-active-text);
	font-weight: 600;
}
.submenu-item::before {
	content: '•';
	color: var(--text-muted);
	font-size: 1rem;
}

/* ========== 中间内容区 ========== */
.content-area {
	flex: 1;
	overflow-y: auto;
	padding: 2rem;
	background: var(--content-bg);
}

/* 大类栏目 */
.category-section {
	background: var(--card-bg);
	border-radius: 16px;
	padding: 2rem;
	margin-bottom: 2rem;
	box-shadow: var(--shadow-md);
	transition: all 0.3s ease;
}

.category-section:hover {
	box-shadow: var(--shadow-lg);
}

.category-header {
	display: flex;
	align-items: center;
	gap: 1rem;
	margin-bottom: 1.5rem;
	padding-bottom: 1rem;
	border-bottom: 2px solid var(--toolbar-border);
}

.category-icon {
	width: 48px;
	height: 48px;
	background: linear-gradient(135deg, var(--primary-color), var(--primary-light));
	border-radius: 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.5rem;
	color: white;
}

.category-title {
	font-size: 1.75rem;
	font-weight: 700;
	color: var(--text-primary);
}

.category-desc {
	color: var(--text-secondary);
	font-size: 0.875rem;
	margin-top: 0.25rem;
}

/* 专题 Grid */
.topic-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 1.5rem;
}

/* 修饰类1：强制1列排列（无论屏幕大小） */
.topic-grid.grid-1col {
	grid-template-columns: repeat(1, 1fr); /* 固定1列，每列等分宽度 */
	/* 可选：给1列加最小宽度，避免过窄 */
	/* grid-template-columns: repeat(1, minmax(300px, 1fr)); */
}

/* 修饰类1：强制2列排列（无论屏幕大小） */
.topic-grid.grid-2col {
	grid-template-columns: repeat(2, 1fr); /* 固定2列，每列等分宽度 */
	/* 可选：给2列加最小宽度，避免过窄 */
	/* grid-template-columns: repeat(2, minmax(300px, 1fr)); */
}

/* 修饰类2：强制3列排列 */
.topic-grid.grid-3col {
	grid-template-columns: repeat(3, 1fr);
	/* 可选：3列最小宽度 */
	/* grid-template-columns: repeat(3, minmax(250px, 1fr)); */
}

/* 修饰类3：强制4列排列（扩展） */
.topic-grid.grid-4col {
	grid-template-columns: repeat(4, 1fr);
}

/* 修饰类4：紧凑自由排列（更小的最小宽度） */
.topic-grid.grid-auto-compact {
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
.topic-grid.grid-auto-compact1 {
	grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
}
.topic-grid.grid-auto-compact2 {
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
}

.topic-card {
	background: var(--card-bg);
	border-radius: 12px;
	padding: 1.5rem;
	box-shadow: var(--shadow-sm);
	transition: all 0.3s ease;
	border: 1px solid var(--card-border);
}

.topic-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--shadow-md);
	border-color: var(--card-border-hover);
}

.topic-title {
	font-size: 1.125rem;
	font-weight: 600;
	color: var(--text-primary);
	margin-bottom: 1rem;
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

/* 文章链接 */
.article-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
	gap: 0.5rem;
}

.article-link {
	background: var(--card-bg); /* var(--content-bg) */
	padding: 0.625rem 0.875rem;
	border-radius: 8px;
	text-decoration: none;
	color: var(--text-primary); /* var(--text-secondary) #64748B */
	font-size: 0.8125rem;
	transition: all 0.2s ease;
	display: flex;
	align-items: center;
	gap: 0.5rem;
	border: 1px solid transparent;
}

.article-link:hover {
	background: var(--card-hover-bg);
	color: var(--primary-color);
	border-color: var(--primary-light);
	transform: translateX(4px);
}

/* ========== 右侧信息栏 ========== */
.info-panel {
	width: var(--info-panel-width);
	background: var(--info-panel-bg);
	border-left: 1px solid var(--sidebar-border);
	overflow-y: auto;
	padding: 1.5rem;
	transition: all 0.3s ease;
	flex-shrink: 0;
}

.info-panel.hidden {
	display: none;
}

.info-widget {
	background: var(--card-bg);
	border-radius: 12px;
	padding: 0.5rem;
	margin-bottom: 1.0rem;
	box-shadow: var(--shadow-sm);
	border: 1px solid var(--toolbar-border);
}

.widget-title {
	font-size: 1rem;
	font-weight: 600;
	color: var(--text-primary);
	margin-bottom: 1rem;
	display: flex;
	align-items: center;
	gap: 0.5rem;
}

/* 日历样式 */
.calendar {
	width: 100%;
}

.calendar-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1rem;
}

.calendar-month {
	font-size: 1.125rem;
	font-weight: 600;
	color: var(--text-primary);
}

.calendar-month span {
	font-size: 0.8rem;
	color: var(--text-muted);
}

.calendar-controls { display: flex; align-items: center; gap: 0.25rem; }

.lunar-toggle-btn {
	width: 20px;
	height: 20px;
	border: 1px solid var(--toolbar-border);
	background: var(--card-bg);
	border-radius: 4px;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.5rem;
	color: var(--text-secondary);
	margin-right: 0.25rem;
}

.lunar-toggle-btn:hover { border-color: var(--primary-color); color: var(--primary-color); }
.lunar-toggle-btn.active { background: var(--primary-color); border-color: var(--primary-color); color: white; }

.calendar-nav { display: flex; gap: 0.25rem; }

.calendar-nav {
	display: flex;
	gap: 0.25rem;
}

.calendar-nav-btn {
	width: 28px;
	height: 28px;
	border: 1px solid var(--toolbar-border);
	background: var(--card-bg);
	border-radius: 6px;
	cursor: pointer;
	font-size: 0.875rem;
	color: var(--text-secondary);
	transition: all 0.2s ease;
}

.calendar-nav-btn:hover {
	border-color: var(--primary-color);
	color: var(--primary-color);
}

.calendar-grid {
	display: grid;
	grid-template-columns: repeat(7, 1fr);
	gap: 2px;
}

.calendar-weekday {
	text-align: center;
	font-size: 0.75rem;
	font-weight: 600;
	color: var(--text-muted);
	padding: 0.5rem 0;
}

.calendar-day {
	aspect-ratio: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 0.8125rem;
	border-radius: 6px;
	cursor: pointer;
	transition: all 0.2s ease;
	color: var(--text-primary);
}

.calendar-day:hover:not(.empty):not(.today) {
	background: var(--calendar-hover-bg);
	color: var(--calendar-hover-text);
}

.calendar-day.today {
	background: var(--calendar-today-bg);
	color: var(--calendar-today-text);
	font-weight: 600;
}

.calendar-day.weekend:not(.today) {
	background: var(--calendar-weekend-bg);
	color: var(--text-primary);
}

.calendar-day.empty {
	cursor: default;
}

.calendar-day.other-month {
	color: var(--text-muted);
	opacity: 0.5;
}

.current-month {
	background: var(--calendar-today-bg);
	color: var(--calendar-today-text);
	border-radius: 6px;
	padding: 0px 3px;
}
        
.calendar-day-cell {
	display: flex;
	flex-direction: column;
	align-items: center;
	aspect-ratio: 1;
	border-radius: 6px;
	cursor: pointer;
	padding: 2px;
	position: relative;
}

.calendar-day-cell:hover:not(.empty):not(.today) { background: var(--calendar-hover-bg); }
.calendar-day-cell.today { background: var(--calendar-today-bg); }
.calendar-day-cell.weekend:not(.today) { background: var(--calendar-weekend-bg); }
.calendar-day-cell.solar-term:not(.today) { background: var(--calendar-solar-term-bg); }
.calendar-day-cell.holiday:not(.today) { background: var(--calendar-holiday-bg); }
.calendar-day-cell.empty { cursor: default; }

.calendar-day-number {
	font-size: 0.8125rem;
	color: var(--text-primary);
	font-weight: 500;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 50%;
}

.calendar-day-cell.today .calendar-day-number { color: var(--calendar-today-text); font-weight: 600; }
.calendar-day-cell.solar-term:not(.today) .calendar-day-number { color: var(--calendar-solar-term-text); font-weight: 600; }
.calendar-day-cell.holiday:not(.today) .calendar-day-number { color: var(--calendar-holiday-text); font-weight: 600; }
.calendar-day-cell:hover:not(.empty):not(.today) .calendar-day-number { color: var(--calendar-hover-text); }

.calendar-lunar {
	font-size: 0.625rem;
	color: var(--text-muted);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 50%;
}

.calendar-day-cell.today .calendar-lunar { color: var(--calendar-today-text); opacity: 0.9; }
.calendar-day-cell.solar-term:not(.today) .calendar-lunar { color: var(--calendar-solar-term-text); font-weight: 600; }
.calendar-day-cell.holiday:not(.today) .calendar-lunar { color: var(--calendar-holiday-text); font-weight: 600; }
.calendar-day-cell:hover:not(.empty):not(.today) .calendar-lunar { color: var(--calendar-hover-text); opacity: 0.9; }
.calendar-lunar.hidden { display: none; }

/* color-inverse : color-mix(in srgb, var(--text-primary), #fff 80%); */
/* .calendar-day-cell[data-solar-term]:hover::after {
	content: attr(data-solar-term);
	position: absolute;
	bottom: 100%;
	left: 50%;
	transform: translateX(-50%);
	background: var(--text-primary);
	color: color-mix(in srgb, var(--text-primary), #fff 80%);
	padding: 4px 8px;
	border-radius: 4px;
	font-size: 0.75rem;
	white-space: nowrap;
	z-index: 100;
	box-shadow: 0 4px 6px -1px  var(--text-primary);
} */

/* 快捷链接 */
.quick-links {
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
}

.quick-link {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	padding: 0.75rem;
	background: var(--content-bg);
	border-radius: 8px;
	text-decoration: none;
	color: var(--text-secondary);
	font-size: 0.875rem;
	transition: all 0.2s ease;
}

.quick-link:hover {
	background: var(--card-hover-bg);
	color: var(--primary-color);
	transform: translateX(4px);
}

/* 统计信息 */
.stats-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0.75rem;
}

.stat-card {
	background: var(--content-bg);
	padding: 1rem;
	border-radius: 8px;
	text-align: center;
}

.stat-value {
	font-size: 1.5rem;
	font-weight: 700;
	color: var(--primary-color);
}

.stat-label {
	font-size: 0.75rem;
	color: var(--text-muted);
	margin-top: 0.25rem;
}

/* 响应式设计 */
@media (max-width: 1200px) {
	.main-container {
		overflow-x: auto; /* 允许水平滚动 */
	}

	.info-panel.hidden {
		display: none;
	}
}

@media (max-width: 768px) {
	.main-container {
		overflow-x: auto; /* 允许水平滚动 */
	}

	.sidebar.hidden {
		display: none;
	}

	.content-area {
		padding: 1rem;
	}

	.topic-grid {
		grid-template-columns: 1fr;
	}

	.article-list {
		grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	}

	.toolbar {
		padding: 0 1rem;
	}

	.search-box {
		display: none;
	}
}

/* 滚动条美化 */
::-webkit-scrollbar {
	width: 8px;
	height: 8px;
}

::-webkit-scrollbar-track {
	background: var(--content-bg);
}

::-webkit-scrollbar-thumb {
	background: var(--text-muted);
	border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
	background: var(--text-secondary);
}

/* 动画 */
@keyframes fadeIn {
	from {
		opacity: 0;
		transform: translateY(20px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.category-section {
	animation: fadeIn 0.5s ease-out;
}

/* ========== 文章相关 ========== */
iframe {
  border: none;
}
#footer {
  font-size: 12px;
  color: var(--text-secondary);
}
#footer a {
	color: var(--text-secondary);
	text-decoration: none;
}
#footer a:hover {
	color: var(--text-primary);
}

.alink {
  color: var(--alink-primary);
  background: var(--alink-bg);
}
.alink:hover {
  color: #fff;
  background: var(--alink-primary);
  border-radius: 3px;
}

blockquote {
  margin: 1rem 0;
  padding: 1px 15px;
  background-color: var(--primary-bg);
  color: var(--text-primary);
  border-left: 4px solid var(--blockquote-border);
  border: 1px solid var(--info-card-border);
  border-radius: 4px;
  word-break: break-all;
  overflow-wrap: break-word;
}

/* .article-s1 style*/
.article-s1 .alink {
  color: var(--alink-primary) !important;
  background: var(--alink-bg);
}
.article-s1 .alink:hover {
  color: #fff !important;
  background: var(--alink-primary);
  border-radius: 3px;
}

.article-s1 blockquote {
  background-color: var(--primary-bg) !important;
  color: var(--text-primary) !important;
  border-left: 4px solid var(--blockquote-border);
  border: 1px solid var(--info-card-border);
}

.article-s1 article {   padding: 10px; } .article-s1 article articlehead { display: block; font-size: 11px; font-family: iconfont; color: #888; }  .article-s1 article title {   font-size: 30px;   display: block;   text-align: center; } .article-s1 article author { margin-left: 10px;  text-align: center; } .article-s1 article date { margin-left: 10px;  text-align: center; } .article-s1 article tags { margin-left: 10px;   text-align: center; } .article-s1 article author::before {  content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="%23666" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path><circle cx="12" cy="7" r="4"></circle></svg>') !important;  padding-left: 10px;   padding-right: 5px; } .article-s1 article date::before {   content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="%23666" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><polyline points="12 6 12 12 16 14"></polyline></svg>') !important;   padding-left: 10px;   padding-right: 5px; } .article-s1 article tags::before { content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="%23666" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z"></path><line x1="7" y1="7" x2="7.01" y2="7"></line></svg>') !important;    padding-left: 10px;   padding-right: 5px; } 

.article-s1 fieldset {
	border: 1px solid var(--fieldset-border); /* 浅灰色边框 */
	border-radius: 8px; /* 圆角 */
	padding: 20px; /* 增加内边距 */
	margin-bottom: 25px; /* 底部留白 */
	background-color: var(--fieldset-bg); /* 浅背景色 */
	box-shadow: 0 2px 5px rgba(0,0,0,0.1); /* 轻微阴影 */
}

/* 如果你不想有边框，可以这样 */
.article-s1 fieldset.no-border {
	border: none;
	padding: 0;
	margin: 0;
}
.article-s1 legend {
	font-size: 1.2em; /* 字体大小 */
	font-weight: bold; /* 加粗 */
	color: var(--legend-text); /* 字体颜色 */
	padding: 0 10px; /* 左右内边距，让背景色更明显 */
	background-color: var(--fieldset-bg); /* 与fieldset背景色一致或对比 */
	border: 1px solid var(--fieldset-border); /* 也可以给legend加边框 */
	border-radius: 5px; /* 圆角 */
	margin-left: 20px; /* 调整左侧外边距，使其更靠右 */
	/* 如果想让legend在fieldset内部，而不是跨越边框 */
	/* display: block; */
	/* width: fit-content; */
}

/* 调整legend在fieldset内部的位置 */
.article-s1 fieldset.alt-legend legend {
	background-color: var(--alt-legend-bg); /* 蓝色背景 */
	color: var(--alt-legend-text); /* 白色文字 */
	padding: 5px 15px;
	border-radius: 5px;
	/* 关键：使用 transform 向上移动，并用 margin-left 调整水平位置 */
	transform: translateY(-50%);
	margin-left: 20px;
	position: relative; /* 确保transform生效 */
}

.layer-popup {
	background-color: var(--layer-popup-bg) !important;
	color: var(--layer-popup) !important;
}
.layer-popup .layui-layer-title {
	background-color: var(--layer-popup-bg) !important;
	color: var(--layer-popup) !important;
}
.layer-popup tr:nth-child(even) {
	background-color: var(--even-bg-color) !important;
}
.layer-popup tr:hover {
	background-color: var(--table-tr-hover-bg) !important;
	color: var(--text-primary);
}
.layer-popup a {
	background-color: var(--alink-bg) !important;
	color: var(--alink-primary) !important;
}
.layer-popup .layui-layer-close {
	background-color: var(--layer-popup-bg) !important;
	color: var(--layer-popup) !important;
}
.layer-popup .layui-layer-setwin {
  	background-color: var(--layer-popup-bg) !important;
}
/* .layer-popup .layer-content {
	background-color: var(--swpage-bg);
	color: var(--text-primary);
}
.layer-popup .layer-btn {
	background-color: var(--swpage-bg);
	color: var(--text-primary);
}
.layer-popup .layer-close {
	background-color: var(--swpage-bg);
	color: var(--text-primary);
} */

/** ####    card-box    #### */
.section-card-box-light-green {
  border: 1px solid #C0EDAF;
  border-radius: 5px;
  padding: 0px;
  background-color: #fff;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  margin-bottom: 5px;

}
.section-card-box-light-green .section-title{
  background-color: #C0EDAF;
  border-radius: 5px 5px 0 0;
  width: 100%;
  text-align: center;
  font-weight: bold;
  color: #fff;
  text-shadow: 
    -1px -1px 0 #8fe66f,
	 1px -1px 0 #8fe66f,
	-1px  1px 0 #8fe66f,
	 1px  1px 0 #8fe66f;
}
.info-card-box-pink {
  border: 1px solid var(--info-card-border);
  border-radius: 5px;
  padding: 5px;
  background-color: var(--content-bg);
  color: var(--text-primary);
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1);
  margin: 2px;
  font-size:14px;
}
.info-card-box-light-blue {
  border: 1px solid #C0EDAF;
  border-radius: 5px;
  padding: 5px;
  background-color: #fff;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  margin: 5px;

}
.info-card-box-pink h6 {
  font-size:14px;
  font-weight:800;
  line-height:25px;
  padding-left:10px;
  margin-bottom: 0px;
  background-repeat:repeat-x;
  background-image:url(/images/td_6.jpg);
}
.info-card-box-pink p {
  line-height:25px;
}
.info-card-box-pink a:not(.article-link):not(.alink) {
  padding-left:10px;
  padding-right:2px;
  color: var(--alink-primary); /* #006dff */
}
.info-card-box-pink a:hover:not(.article-link:hover) {
  color: #fff;
  background: var(--alink-primary);
  border-radius: 3px;
}
.info-card-box-pink table {
  background-color: var(--table-bg);
}
.info-card-box-pink table tr:hover {
  background-color: var(--table-tr-hover-bg) !important;
  color: var(--text-primary) !important;
}
.info-card-box-pink button {
  /* padding-left:10px; */
  color: #006dff;
  background: #fff;
  border: none;
  font-size: inherit;
  font-family: inherit;
}
.info-card-box-pink button:hover {
  color: #fff;
  background: #006dff;
  border-radius: 3px;
}
.title-table {
  background-color: var(--table-bg);
  color: var(--text-primary);
}
.title-table tr:nth-child(even) {
  background-color: var(--even-bg-color);
}
.title-table tr:hover {
  background-color: var(--table-tr-hover-bg);
  color: var(--text-primary);
}
.logo-site {
	display: flex;
	align-items: center;
	gap: 0.75rem;
}
.logo-icon {
  width: 48px;
  height: 48px;
}
.logo-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;    /* 保持图片比例，不拉伸 */
  display: block;         /* 消除图片默认的行内空白间隙 */
}
.login-icon {
  filter: invert(90%);
}
.login-icon.dark {
  filter: brightness(50%) invert(100%);
}
