/* ==========================================================================
   共享头部样式 — 所有页面（主站 + 资料库子站）统一引用。
   品牌色读取页面的 --brand/--brand-deep 变量；未定义时（如资料库页）回落品牌蓝。
   ========================================================================== */

:root { --header-h: 64px; }

/* 与主站一致：不显示滚动条，页面间切换内容不横移 */
html { scrollbar-width: none; }
html::-webkit-scrollbar { display: none; }

/* 内联图标（site.js 注入 SVG） */
.ic { display: inline-flex; width: 1em; height: 1em; flex: none; }
.ic svg { width: 100%; height: 100%; fill: none; stroke: currentColor;
          stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ic.fill svg { fill: currentColor; stroke: none; }

.container { width: min(1160px, 92%); margin: 0 auto; }
@media (min-width: 1600px) { .container { width: min(1360px, 88%); } }

/* ---------- 顶部导航 ---------- */
.site-header {
  position: sticky; top: 0; z-index: 100;
  background: linear-gradient(120deg, var(--brand, #40a3e1), var(--brand-deep, #2378b2));
  border-bottom: 1px solid rgba(0, 0, 0, 0.14);   /* 老站头部下的分隔线（全站统一，无阴影） */
  /* 显式声明排版属性，隔离宿主页面（如资料库的 Foundation）的字体污染 */
  font-family: var(--h-font, -apple-system, BlinkMacSystemFont, "Segoe UI", "Microsoft YaHei",
               "PingFang SC", "Hiragino Sans GB", sans-serif);
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: normal;
}
.header-inner {
  display: flex; align-items: center; gap: 28px;
  height: var(--header-h);
}
.brand {
  display: flex; align-items: center; gap: 10px;
  color: #fff; font-size: 19px; white-space: nowrap;
}
.brand:hover { text-decoration: none; }
.brand .ic { font-size: 26px; }
.brand b { font-weight: 700; }

.main-nav { margin-left: auto; }
.main-nav ul { display: flex; list-style: none; margin: 0; padding: 0; gap: 10px; }
.main-nav li { position: relative; }
.main-nav a {
  display: block; padding: 9px 18px; border-radius: 8px;
  color: rgba(255, 255, 255, 0.92); font-size: 15px;
  letter-spacing: 0.5px;
  line-height: 24px;
}
.main-nav a:hover { background: rgba(255, 255, 255, 0.16); text-decoration: none; }
.main-nav a[aria-current="page"] { background: rgba(255, 255, 255, 0.22); font-weight: 600; }

.submenu {
  position: absolute; top: calc(100% + 6px); left: 50%;
  translate: -50% 0; min-width: 180px;
  background: #fff; border-radius: 10px; box-shadow: var(--card-shadow, 0 10px 30px rgba(20, 40, 60, 0.10));
  padding: 6px; display: none; flex-direction: column; gap: 2px;
}
.submenu::before { /* 悬停桥，防止移动到子菜单途中失效 */
  content: ""; position: absolute; top: -8px; left: 0; right: 0; height: 8px;
}
.main-nav li:hover > .submenu,
.main-nav li:focus-within > .submenu { display: flex; }
.submenu a { color: var(--ink, #22303c); padding: 9px 14px; border-radius: 8px; }
.submenu a:hover { background: var(--bg-soft, #f4f7fa); color: var(--brand, #40a3e1); text-decoration: none; }

.nav-toggle {
  display: none; margin-left: auto;
  width: 44px; height: 44px; border: 0; border-radius: 8px;
  background: rgba(255, 255, 255, 0.15); color: #fff; cursor: pointer;
}
.nav-toggle .ic { font-size: 22px; margin: auto; }

/* ---------- 移动端导航 ---------- */
@media (max-width: 960px) {
  .nav-toggle { display: inline-flex; }
  .main-nav {
    position: fixed; top: var(--header-h); left: 0; right: 0; margin: 0;
    background: var(--brand-deep, #2378b2); max-height: 0; overflow: hidden;
    transition: max-height 0.3s ease; box-shadow: 0 12px 24px rgba(0, 0, 0, 0.25);
  }
  .main-nav.open { max-height: calc(100vh - var(--header-h)); overflow-y: auto; }
  .main-nav ul { flex-direction: column; gap: 0; padding: 10px 14px 20px; }
  .main-nav a { padding: 13px 14px; font-size: 16px; }
  .submenu {
    position: static; translate: none; display: flex; min-width: 0;
    background: rgba(0, 0, 0, 0.18); box-shadow: none; border-radius: 8px;
    padding: 4px;
  }
  .submenu::before { display: none; }
  .submenu a { padding: 11px 14px; font-size: 15px; color: rgba(255, 255, 255, 0.9); }
  .submenu a:hover { background: rgba(255, 255, 255, 0.12); color: #fff; }
}

/* ==========================================================================
   资料库子站左侧栏导航 — 与主站设计统一（圆角卡片 + 品牌蓝标题栏）
   仅资料库页面存在这些结构；header.css 在每页样式最后加载，可稳定覆盖。
   ========================================================================== */
.f_position {
  top: 88px !important;
  bottom: 12px !important;              /* 延伸到页面底部，留 12px 间隔 */
  display: flex !important;
  flex-direction: column !important;
  width: 280px !important;
  border: 1px solid #e4eaf0 !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 10px 30px rgba(20, 40, 60, 0.08) !important;
  overflow: hidden !important;
}
.sidebar {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow-y: auto !important;          /* 内容超出时卡片内滚动 */
  padding: 6px 10px 14px !important;
  border-right: 0 !important;
}
.nav-title {
  left: 0 !important;
  flex: none !important;
  margin: 0 !important;
  padding: 0 18px !important;
  width: 100% !important;
  height: 52px !important;
  line-height: 52px !important;
  background: linear-gradient(120deg, #40a3e1, #2378b2) !important;
  border: 0 !important;
}
.nav-title h2 {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  font-family: inherit !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #fff !important;
  line-height: 52px !important;
}
.sidebar .side-nav li.side-title span {
  padding: 10px 0 6px 20px !important;
  border-top: 1px solid #eef2f6 !important;
  background: none !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #22303c !important;
}
.sidebar .side-nav li.show span { background: none !important; }
.sidebar .side-nav li a {
  padding: 6px 12px 6px 32px !important;
  font-family: inherit !important;
  font-size: 14px !important;
  color: #5a6b7a !important;
  border-radius: 8px;
}
.sidebar .side-nav li a:hover {
  color: #40a3e1 !important;
  background: rgba(64, 163, 225, 0.08) !important;
}
.sidebar .side-nav li.active > a:first-child { color: #40a3e1 !important; font-weight: 600 !important; }
/* 正文起始位置与 64px 头部衔接 */
#main-content { padding-top: 24px !important; }

/* 资料库页面：Foundation 将 html/body 锁为 100% 高，会使 sticky 头部的容器只有一屏，
   滚过一屏后头部失效。用 body[data-root]（仅资料库页有）限定作用域放开高度。 */
html:has(body[data-root]),
body[data-root] { height: auto !important; min-height: 100vh; }

/* 资料库侧栏：分组折叠/展开状态指示（右侧小箭头，随 .show 旋转） */
.sidebar .side-nav li.side-title { cursor: pointer; }
.sidebar .side-nav li.side-title span {
  position: relative;
  display: block !important;      /* 撑满整行，使箭头统一固定在右侧同一位置 */
  padding-right: 34px !important;
}
.sidebar .side-nav li.side-title span::after {
  content: "";
  position: absolute;
  right: 10px;
  top: 50%;
  width: 7px;
  height: 7px;
  border-right: 2px solid #40a3e1;
  border-bottom: 2px solid #40a3e1;
  transform: translateY(-30%) rotate(225deg);     /* 展开（无 .show）：箭头朝上 */
  transition: transform 0.25s ease;
}
.sidebar .side-nav li.side-title.show span::after {
  border-color: #9fb0bf;
  transform: translateY(-70%) rotate(45deg);      /* 折叠（.show）：箭头朝下 */
}
