/* ==========================================================
   站点主题样式（全站前台页面统一） —— 对齐参考稿（2026-09-18 版）
   ----------------------------------------------------------
   仅覆盖视觉样式，不改动任何 HTML 结构、文案与脚本逻辑。
   色板沿用参考稿的 Okabe–Ito 色觉障碍安全色：
   深蓝主色 #0072B2 / 天蓝 #56B4E9 / 橙 #E69F00
   ========================================================== */
:root {
	--ink: #1b2a38;
	--ink-soft: #4a5d70;
	--ink-mute: #6b7f92;
	--primary: #0072B2;
	--primary-dark: #00527f;
	--primary-soft: #e8f2fa;
	--sky: #56B4E9;
	--sky-soft: #eaf6fd;
	--orange: #E69F00;
	--orange-ink: #7a5200;
	--orange-soft: #fdf3dd;
	--teal: #009E73;
	--teal-soft: #e4f5ef;
	--line: #dfe8f0;
	--bg: #f4f8fc;
	--radius-card: 18px;
	--shadow-sm: 0 2px 6px rgba(15, 40, 60, .05), 0 10px 24px rgba(15, 40, 60, .05);
	--shadow-md: 0 6px 14px rgba(15, 40, 60, .08), 0 18px 38px rgba(15, 40, 60, .10);
	--transition-smooth: all .25s cubic-bezier(.2, 0, 0, 1);
}

body {
	background:
		radial-gradient(1000px 500px at 85% -10%, rgba(86, 180, 233, .14), transparent 60%),
		radial-gradient(900px 480px at -10% 0%, rgba(0, 114, 178, .10), transparent 55%),
		var(--bg);
	color: var(--ink);
}

/* ---------- 顶部菜单栏 ---------- */
/* 全站统一字体栈：任何页面内联样式不得另设 body 字体 */
body {
	font-family: "HarmonyOS Sans SC", -apple-system, BlinkMacSystemFont, "Segoe UI",
		Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif !important;
}

/* ---------- 全站字体：鸿蒙 HarmonyOS Sans SC（子集化自托管） ---------- */
@font-face {
	font-family: "HarmonyOS Sans SC";
	src: url("/fonts/HarmonyOS_Sans_SC_Regular_Full.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "HarmonyOS Sans SC";
	src: url("/fonts/HarmonyOS_Sans_SC_Bold_Full.woff2") format("woff2");
	font-weight: 600 900;
	font-style: normal;
	font-display: swap;
}

/* 顶栏专用小字包（菜单 8 项 + logo，约 37KB，优先加载先渲染导航） */
@font-face {
	font-family: "HarmonyOS Sans SC Nav";
	src: url("/fonts/HarmonyOS_Sans_SC_Medium.woff2") format("woff2");
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: "HarmonyOS Sans SC Nav";
	src: url("/fonts/HarmonyOS_Sans_SC_Bold.woff2") format("woff2");
	font-weight: 600 900;
	font-style: normal;
	font-display: swap;
}

.top-nav,
.top-nav .nav-links a,
.top-nav .user-btn,
.top-nav .user-name,
.logo,
.logo > span {
	font-family: "HarmonyOS Sans SC Nav", "HarmonyOS Sans SC", -apple-system, BlinkMacSystemFont,
		"Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
}

/* 图标字体不受顶栏字体影响（必须在上面之后声明） */
.top-nav .layui-icon {
	font-family: "layui-icon" !important;
}

.top-nav {
	background:
		radial-gradient(820px 140px at 88% -40%, rgba(30, 136, 229, .22), transparent 72%),
		linear-gradient(135deg, #16283a 0%, #0d1a27 100%);
	border-bottom: 3px solid var(--primary);
	box-shadow: 0 8px 24px rgba(10, 25, 40, .3);
}

.top-nav .layui-container {
	max-width: 1300px;
	gap: 20px;
}

.logo {
	gap: 14px;
	font-size: 1.26rem;
	font-weight: 800;
	letter-spacing: 1px;
	padding: 16px 0;
}

/* 全站统一 logo 尺寸（覆盖各页内联 height:3rem） */
.logo img {
	height: 3.4rem !important;
	width: auto;
	filter: drop-shadow(0 4px 10px rgba(0, 0, 0, .35));
}

/* 站点标识：主名下方补一行英文副标题 */
.logo > span {
	display: flex;
	flex-direction: column;
	line-height: 1.2;
}

.logo > span::after {
	content: "DATA SHARING LIBRARY";
	font-size: .64rem;
	font-weight: 500;
	color: #9fc3dc;
	letter-spacing: 2.4px;
	margin-top: 4px;
}

.nav-links {
	gap: 6px;
}

.top-nav .nav-links a {
	color: rgba(255, 255, 255, .86);
	padding: 10px 18px;
	border: 1px solid transparent;
	border-radius: 40px;
	font-size: .92rem;
	font-weight: 700;
	letter-spacing: .5px;
}

.top-nav .nav-links a:hover {
	background: rgba(255, 255, 255, .1);
	border-color: rgba(255, 255, 255, .16);
	color: #fff;
}

.top-nav .nav-links a.active {
	background: linear-gradient(120deg, #1273c4, #3a9fee);
	color: #fff;
	border-color: transparent;
	box-shadow: 0 6px 16px rgba(14, 110, 190, .5);
}

.top-nav .nav-links a.highlight {
	background: rgba(230, 159, 0, .18);
	color: #ffd98a;
	border-color: rgba(230, 159, 0, .4);
}

.top-nav .nav-links a.highlight:hover {
	background: rgba(230, 159, 0, .3);
	color: #ffe7b3;
}

/* 顶栏登录 / 注册按钮 */
.top-nav .user-btn {
	background: transparent;
	border: 1px solid rgba(255, 255, 255, .35);
	font-weight: 600;
}

.top-nav .user-btn:hover {
	background: rgba(255, 255, 255, .14);
	transform: none;
}

.top-nav .user-btn.primary {
	background: var(--primary);
	border-color: var(--primary);
}

.top-nav .user-btn.primary:hover {
	background: #0084cd;
	border-color: #0084cd;
}

/* 顶栏小屏适配 */
@media (max-width: 1500px) {
	.top-nav .nav-links a { padding: 10px 12px; font-size: .88rem; letter-spacing: .2px; }
	.nav-links { gap: 3px; }
	.logo { font-size: 1.18rem; gap: 10px; }
	.logo img { height: 3rem !important; }
}

@media (max-width: 1100px) {
	.top-nav .nav-links a { padding: 9px 13px; font-size: .86rem; letter-spacing: 0; }
	.nav-links { gap: 2px; }
	.logo { font-size: 1.16rem; gap: 10px; }
	.logo img { height: 2.9rem !important; }
}

@media (max-width: 760px) {
	.top-nav .layui-container { gap: 8px; padding-bottom: 8px; }
	.logo { padding: 10px 0; }
	.logo img { height: 2.5rem !important; }
	.nav-links a { padding: 6px 10px !important; font-size: .8rem !important; }
}

/* ---------- 区域标题：左侧色条 + 底部细线 ---------- */
.module-title {
	border-left: none;
	padding-left: 0;
	padding-bottom: 14px;
	margin-bottom: 14px;
	border-bottom: 2px solid var(--primary-soft);
	font-size: 1.12rem;
	font-weight: 700;
	color: var(--ink);
	gap: 10px;
}

.module-title::before {
	content: "";
	width: 5px;
	height: 20px;
	border-radius: 4px;
	background: var(--primary);
	flex-shrink: 0;
}

.module-title i {
	margin-right: 0;
	font-size: 1.15rem;
	color: var(--primary);
}

/* ---------- 卡片 ---------- */
.module-card {
	border-color: var(--line);
	padding: 22px 24px;
}

.module-card:hover {
	border-color: rgba(0, 114, 178, .35);
}

/* ---------- 公告条 ---------- */
.notice-bar {
	background: linear-gradient(135deg, var(--orange-soft), #fff9ec);
	border: 1px solid #f3dfae;
	border-radius: 14px;
	height: auto;
	padding: 9px 16px;
	margin: 22px 0 6px;
}

.notice-icon {
	background: var(--orange);
	color: #3d2b00;
	font-weight: 700;
	border-radius: 30px;
	padding: 5px 14px;
}

.notice-scroll {
	height: 30px;
}

.notice-list li {
	color: var(--orange-ink);
	font-size: .84rem;
	line-height: 30px;
}

.notice-more {
	color: var(--orange-ink);
	font-weight: 600;
	border-radius: 30px;
	padding: 5px 12px;
}

.notice-more:hover {
	background: rgba(230, 159, 0, .18);
	color: var(--orange-ink);
}

/* ---------- 新闻条目 ---------- */
.news-list li {
	padding: 13px 10px;
	margin: 0 -10px;
	border-bottom: 1px dashed var(--line);
	border-radius: 12px;
}

.news-list li:hover {
	background: var(--sky-soft);
	padding: 13px 10px;
	margin: 0 -10px;
	transform: translateX(3px);
}

.news-title {
	color: var(--ink);
	font-weight: 500;
}

.news-date {
	background: var(--bg);
	border: 1px solid var(--line);
	color: var(--ink-soft);
	padding: 3px 12px;
}

/* 标签改为软底色（HTML 里写死的行内色在此统一覆盖） */
.news-list .tag {
	border: 1px solid transparent;
	letter-spacing: .5px;
	padding: 3px 10px;
}

.news-list .tag-new {
	background: var(--sky-soft) !important;
	color: #0b6a9d !important;
	border-color: #a8d8f0 !important;
}

.news-list .tag-hot {
	background: var(--orange-soft) !important;
	color: var(--orange-ink) !important;
	border-color: #ecc878 !important;
}

.news-list .tag-top {
	background: var(--primary-soft) !important;
	color: var(--primary-dark) !important;
	border-color: #bcd9ee !important;
}

/* ---------- 资料卡片 ---------- */
.doc-preview-area {
	background: linear-gradient(145deg, #eef6fc 0%, #e2eef8 100%);
	border-bottom-color: var(--line);
}

.preview-image {
	box-shadow: 0 8px 20px rgba(10, 40, 70, .12);
}

.doc-card-item:hover .preview-image {
	transform: translateY(-4px) scale(1.02);
}

.doc-badge {
	font-weight: 700;
}

.doc-title {
	color: var(--ink);
}

.doc-desc {
	color: var(--ink-soft);
}

.doc-meta {
	color: var(--ink-mute);
}

.read-btn {
	border-radius: 40px;
	font-weight: 600;
}

.more-btn-outline {
	color: var(--primary-dark);
	font-weight: 700;
}

.more-btn-outline:hover {
	box-shadow: 0 10px 22px rgba(0, 114, 178, .28);
}

.extra-resource {
	background: var(--sky-soft);
	border-color: #c9e6f7;
	border-radius: 14px;
}

.footer-elegant {
	border-top-color: var(--line);
	color: var(--ink-mute);
}

/* ---------- 移动端导航折叠（汉堡按钮由 user-common.js 注入） ---------- */
.nav-toggle {
	display: none;
	background: rgba(255, 255, 255, .08);
	border: 1px solid rgba(255, 255, 255, .28);
	border-radius: 10px;
	color: #fff;
	font-size: 1.25rem;
	line-height: 1;
	padding: 7px 13px;
	cursor: pointer;
	margin-left: auto;
	flex-shrink: 0;
}
.nav-toggle:hover { background: rgba(255, 255, 255, .18); }

@media (max-width: 760px) {
	/* 收起：只留 logo + 汉堡按钮，菜单与登录/注册都藏进去 */
	.top-nav .nav-toggle { display: block; }
	.top-nav .nav-links, .top-nav .user-btns { display: none; }
	/* 展开：菜单一行换行铺满，登录/注册靠右 */
	.top-nav.menu-open .nav-links {
		display: flex; flex-wrap: wrap; flex: 0 0 100%; padding-bottom: 10px;
	}
	.top-nav.menu-open .user-btns {
		display: flex; flex: 0 0 100%; justify-content: flex-end; padding-bottom: 12px;
	}
}

/* 窄屏保险：栅格列不允许把页面撑出横向滚动 */
@media (max-width: 767.98px) {
	[class*="layui-col-"] { max-width: 100%; min-width: 0; }
}