/* CSS变量定义 - 日间主题 */
:root {
	--primary-color: #007bff;
	--secondary-color: #6c757d;
	--background-color: #f8f9fa;
	--surface-color: #ffffff;
	--text-color: #212529;
	--border-color: #dee2e6;
	--shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	--f-shadow: 0 -2px 4px rgba(0, 0, 0, 0.1);
	--card-radius: 8px;
}

/* 夜晚主题变量 */
.dark-theme {
	--primary-color: #0d6efd;
	--secondary-color: #adb5bd;
	--background-color: #121212;
	--surface-color: #1e1e1e;
	--text-color: #f8f9fa;
	--border-color: #343a40;
	--shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
	--f-shadow: 0 -2px 4px rgba(0, 0, 0, 0.3);
}

/* 基础样式 */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	transition: background-color 0.3s, color 0.3s, border-color 0.3s;
}

body {
	font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
	background-color: var(--background-color);
	color: var(--text-color);
	line-height: 1.6;
}

body::after {
	content: "";
	left: 0px;
	top: 0px;
	position: fixed;
	z-index: -1;
	width: 100vw;
	height: 100vh;
	background: url('../images/xmn.png') no-repeat center;
	opacity: 0.8;
}

/* 数据加载loading弹窗 */
.loading-box {
	position: fixed;
	z-index: 999;
	min-width: 150px;
	top: 30vh;
	left: 50%;
	transform: translateX(-50%);
	background-color: var(--surface-color);
	box-shadow: var(--shadow);
	padding: 10px 30px;
	display: none;
	opacity: 0.8;
	border-radius: var(--card-radius);
}

.loading-title {
	height: 32px;
	line-height: 32px;
	font-size: 18px;
	font-weight: bolder;
	text-align: center;
}

.loading-content {
	padding: 5px 10px;
	font-size: 16px;
	font-weight: bolder;
	text-align: center;
}

@media (max-width: 768px) {
	body::after {
		background-size: 100%;
	}
}