/* =================================================================
   顶部一级导航 + 左侧二级菜单布局增强
   配合 assets/menu.js(A.DOMAINS) / assets/ui.js(renderTopNav)
   ================================================================= */

/* ---------- 1. 顶部一级导航（横向） ---------- */
.topnav {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 20px;
  background: linear-gradient(90deg, var(--bg-soft) 0%, var(--bg) 100%);
  border-bottom: 1px solid var(--line);
  overflow-x: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--gray-300) transparent;
  flex: 0 0 auto;
}
.topnav::-webkit-scrollbar { height: 6px; }
.topnav::-webkit-scrollbar-thumb { background: var(--gray-300); border-radius: 3px; }
.topnav.hidden { display: none; }

.topnav-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border-radius: 3px;
  border: 1px solid transparent;
  background: transparent;
  color: var(--txt-2);
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
  cursor: pointer;
  transition: background .12s, color .12s, border-color .12s;
  box-shadow: none;
}
.topnav-item:hover { background: var(--gray-50); color: var(--txt); border-color: var(--line); }
.topnav-item .ic { font-size: 14px; line-height: 1; }
.topnav-item.on {
  background: var(--brand-50);
  color: var(--brand-700);
  border: 1px solid var(--brand-200);
  font-weight: 600;
  box-shadow: none;
}
.topnav-item.on .ic { color: var(--brand-600); }

/* 窄屏：一级导航仅显示图标，节省横向空间 */
@media (max-width: 1100px) {
  .topnav-item { padding: 7px 11px; }
  .topnav-item span:not(.ic) { display: none; }
}

/* ---------- 2. 左侧二级菜单（按域过滤后） ---------- */
/* 域激活时，分组标题前的色条用主题色，强化当前业务域归属感 */
.menu-group-title .gtitle .gic { color: var(--sub); }
.menu-group.active-domain .menu-group-title .gtitle .gic { color: var(--brand-600); }

/* 当仅渲染单个域时，首组默认展开更顺手（保持交互不变，仅视觉微调） */
.side-menu .menu-group .menu-group-title { cursor: pointer; }

/* 暗黑外观适配 */
body.dark-mode .topnav { background: var(--bg-soft); border-color: var(--line); }
body.dark-mode .topnav-item:hover { background: rgba(255,255,255,0.05); }
body.dark-mode .topnav-item.on { background: rgba(59, 130, 246, 0.12); color: var(--brand-200); border-color: var(--brand-700); }

/* ---------- 3. 一级导航为空（无可见域）时的兜底 ---------- */
body.no-topnav .topnav { display: none; }