﻿
/* 基础样式重置 */
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

body {
	background-color: #f6f7f9;
	color: #333;
	line-height: 1.6;
}

/* 主容器 */
.page-container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 30px 15px;
}

/* 卡片容器 */
.content-card {
	background-color: #fff;
	border-radius: 8px;
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
	margin-bottom: 30px;
	overflow: hidden;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
	position: relative;
}

	.content-card:hover {
		transform: translateY(-3px);
		box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
	}

/* 卡片头部 */
.card-header {
	padding: 20px 25px;
	border-bottom: 1px solid #eaeaea;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

/* 卡片标题 */
.card-title {
	color: #044093;
	font-size: 18px;
	font-weight: bold;
	display: flex;
	align-items: center;
	position: relative;
}

	.card-title:before {
		content: "";
		width: 5px;
		height: 20px;
		background: linear-gradient(to bottom, #044093, #0D3DA3);
		margin-right: 12px;
		border-radius: 3px;
	}

/* 卡片内容 */
.card-body {
	padding: 20px 25px;
}

/* 通知横幅 */
.notification-banner {
	padding: 15px 20px;
	background: linear-gradient(to right, #f0f5ff, #f8fbff);
	border-left: 4px solid #044093;
	margin-bottom: 20px;
	display: flex;
	align-items: center;
}

.notification-icon {
	margin-right: 15px;
	color: #044093;
}

.notification-text {
	flex: 1;
	font-size: 15px;
	color: #333;
}

/* 更新项样式 */
.update-item {
	padding: 15px 0;
	border-bottom: 1px dotted #eaeaea;
}

	.update-item:last-child {
		border-bottom: none;
	}

.update-title {
	font-size: 16px;
	color: #044093;
	font-weight: 600;
	margin-bottom: 10px;
	display: flex;
	align-items: center;
	scroll-margin-top: 100px;
}

.update-date {
	font-size: 14px;
	color: #666;
	margin-left: 10px;
	font-weight: normal;
}

.update-content {
	font-size: 14px;
	color: #555;
	line-height: 1.7;
	padding-left: 15px;
	margin-top: 5px;
}

/* 表格样式优化 */
.custom-table {
	width: 100%;
	border-collapse: collapse;
}

	.custom-table th {
		background-color: #f8f9fa;
		padding: 12px 15px;
		text-align: left;
		color: #044093;
		font-weight: 600;
		border-bottom: 2px solid #eaeaea;
	}

	.custom-table td {
		padding: 12px 15px;
		border-bottom: 1px solid #eaeaea;
	}

	.custom-table tr:hover {
		background-color: #f6f9fe;
	}

/* 按钮样式 */
.btn {
	display: inline-block;
	padding: 8px 15px;
	background: linear-gradient(to right, #044093, #0D3DA3);
	color: white;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	font-size: 14px;
	font-weight: 500;
	text-align: center;
	transition: all 0.3s;
	box-shadow: 0 2px 5px rgba(4, 64, 147, 0.2);
	text-decoration: none;
}

	.btn:hover {
		box-shadow: 0 4px 8px rgba(4, 64, 147, 0.3);
		transform: translateY(-1px);
	}

.btn-icon {
	margin-right: 6px;
	vertical-align: middle;
}

/* 滚动区域 */
.scroll-area {
	padding-right: 10px;
	scrollbar-width: thin;
	scrollbar-color: #c1c1c1 #f1f1f1;
}

	.scroll-area::-webkit-scrollbar {
		width: 6px;
	}

	.scroll-area::-webkit-scrollbar-track {
		background: #f1f1f1;
		border-radius: 10px;
	}

	.scroll-area::-webkit-scrollbar-thumb {
		background: #c1c1c1;
		border-radius: 10px;
	}

		.scroll-area::-webkit-scrollbar-thumb:hover {
			background: #a8a8a8;
		}

/* 链接样式 */
.link {
	color: #044093;
	text-decoration: none;
	transition: color 0.2s;
}

	.link:hover {
		color: #0D3DA3;
		text-decoration: underline;
	}

/* 徽章样式 */
.badge {
	display: inline-block;
	padding: 3px 8px;
	border-radius: 3px;
	font-size: 12px;
	font-weight: 500;
	margin-right: 8px;
}

.badge-new {
	background-color: #e8f4ff;
	color: #044093;
	border: 1px solid #d0e6ff;
}

/* 响应式设计 */
@media (max-width: 768px) {
	.page-container {
		padding: 15px 10px;
	}

	.card-header, .card-body {
		padding: 15px;
	}

	.card-title {
		font-size: 16px;
	}

	.update-title {
		font-size: 15px;
		scroll-margin-top: 100px;
	}

	.custom-table {
		display: block;
		overflow-x: auto;
		white-space: nowrap;
	}
}

