/* 优化个人信息和设置选项的样式 */
.personal-info,
.settings {
	background-color: #fff;
	border-radius: 8px;
	padding: 1.5rem;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
	margin-bottom: 2rem;
}

.info-item,
.setting-item {
	margin-bottom: 1rem;
	display: flex;
	align-items: center;
}

.info-item label,
.setting-item label {
	flex: 0 0 100px;
	margin-right: 1rem;
}

.info-item input,
.info-item select,
.setting-item input {
	flex: 1;
	padding: 0.5rem;
	border: 1px solid #ccc;
	border-radius: 4px;
}

.btn {
	padding: 0.5rem 1rem;
	background-color: #8b2323;
	color: white;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	transition: background-color 0.3s;
}

.btn:hover {
	background-color: #a52a2a;
}

/* 夜间模式基础样式 */
body.dark-mode {
	background-color: #1a1a1a;
	color: #e0e0e0;
}

/* 导航栏 */
.dark-mode header nav {
	background-color: #121212;
	border-bottom: 1px solid #333;
}

.dark-mode header nav a {
	color: #e0e0e0;
}

/* 内容区域 */
.dark-mode .banner {
	background-color: #242424;
}

.dark-mode .personal-info,
.dark-mode .settings {
	background-color: #242424;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

.dark-mode .info-item input,
.dark-mode .info-item select,
.dark-mode .setting-item input {
	background-color: #333;
	color: #e0e0e0;
	border: 1px solid #444;
}

/* 按钮 */
.dark-mode .btn {
	background-color: #a52a2a;
	color: #ffffff;
}

.dark-mode .btn:hover {
	background-color: #c0392b;
}

/* 页脚 */
.dark-mode .footer-container {
	background-color: #121212;
	color: #e0e0e0;
}