/* 布局：侧栏、顶部固定，内容区独立滚动 */
.app { display:flex; height:100vh; overflow:hidden; }
.sidebar { width:210px; background:#0e2c63; color:#fff; flex:0 0 210px; padding:18px 0;
  position:fixed; left:0; top:0; height:100vh; overflow-y:auto; z-index:30; }
.side-logo { font-size:20px; font-weight:800; text-align:center; padding:6px 0 18px; border-bottom:1px solid rgba(255,255,255,.12); margin-bottom:10px; }
.side-nav a { display:block; color:#cdd8ee; text-decoration:none; padding:11px 22px; font-size:14px; cursor:pointer; border-left:3px solid transparent; }
.side-nav a:hover { background:rgba(255,255,255,.08); color:#fff; }
.side-nav a.active { background:rgba(255,255,255,.14); color:#fff; border-left-color:#5b9bff; }
.main { flex:1; display:flex; flex-direction:column; margin-left:210px; height:100vh;
  /* min-width:0 为 flex 子项关键属性：允许内容触发横向滚动（如列表智能横滚），
     否则 min-width:auto 会被子内容的最小宽度撑破布局，溢出被 .app 的 overflow:hidden 静默裁掉 */
  min-width:0; }
.topbar { height:56px; background:#fff; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; padding:0 24px; flex-shrink:0; z-index:20; }
.crumb { font-size:16px; font-weight:700; color:var(--blue); }
.top-right { display:flex; align-items:center; gap:14px; }
.user-info { font-size:13px; color:var(--muted); cursor:pointer; padding:6px 10px; border-radius:8px; transition:background .15s; user-select:none; }
.user-info:hover { background:#f0f4fa; color:var(--blue); }
/* 用户下拉菜单 */
.user-menu { position:relative; }
.user-dropdown { position:absolute; right:0; top:40px; width:230px; background:#fff; border:1px solid var(--line); border-radius:12px; box-shadow:0 10px 36px rgba(0,10,40,.16); z-index:220; overflow:hidden; padding:8px 0; animation:toastIn .15s ease; }
.user-dropdown .ud-head { padding:12px 16px; border-bottom:1px solid #f0f2f5; margin-bottom:6px; }
.user-dropdown .ud-head b { font-size:14px; color:#1c2c4e; display:block; }
.user-dropdown .ud-head span { font-size:12px; color:var(--muted); }
.user-dropdown .ud-item { display:flex; align-items:center; gap:8px; padding:10px 16px; font-size:13px; color:#445; text-decoration:none; cursor:pointer; transition:background .12s; }
.user-dropdown .ud-item:hover { background:#f4f7fc; color:var(--blue); }
.user-dropdown .ud-item.ud-danger:hover { background:#fdecea; color:#c0392b; }
.btn-logout { background:none; border:1px solid var(--line); color:var(--muted); padding:6px 12px; border-radius:6px; cursor:pointer; font-size:13px; }
.btn-logout:hover { color:var(--blue); border-color:var(--blue); }
/* 右上角：新手指引入口 */
.guide-link { display:inline-flex; align-items:center; gap:4px; background:#eaf3de; border:1px solid #c0dd97; color:#2f6b10; padding:5px 12px; border-radius:6px; font-size:13px; text-decoration:none; cursor:pointer; transition:all .15s; }
.guide-link:hover { background:#dceec3; border-color:#9cc76b; color:#1e4a0a; }
.content { flex:1; overflow-y:auto; padding:22px 24px; position:relative; z-index:1; }
/* 当内容区第一个子元素是吸顶功能区时，去掉顶部 padding，改由吸顶卡片自身用 padding-top 保留间距，
   确保 sticky 固定点就在内容区最顶部，避免卡片上方露出内容区背景导致滚动内容“穿模”。 */
.content.pt-0 { padding-top:0; }

/* ===== 桌面端侧栏可收起（icon 模式，2026-09-12） =====
 * 仅用户点击「收起」后切换，默认展开；纯加法，不影响任何页面初始外观。
 * 收起态：隐藏文字仅留图标，侧栏 210px → 60px，主区 margin-left 同步收窄，
 * 给列表表格腾出约 150px 横向空间（解决「导航太宽挤窄右侧列」）。 */
.sidebar.collapsed { width:60px; flex:0 0 60px; }
.sidebar.collapsed .side-logo { display:none; }
.sidebar.collapsed .nav-num,
.sidebar.collapsed .nav-label,
.sidebar.collapsed .navg-name { display:none; }
.sidebar.collapsed .side-nav a { padding:11px 0; text-align:center; justify-content:center; }
.sidebar.collapsed .nav-group-head { justify-content:center; padding:8px 0; }
.sidebar.collapsed .nav-group-head .navg-arrow { margin:0; }
.sidebar.collapsed .nav-group-body { display:block; } /* icon 模式下全部图标常显，不被分组折叠掩盖 */
.main.collapsed { margin-left:60px; }
/* 收起/展开按钮：fixed 钉在侧栏底部视口角，宽度随侧栏态同步 */
#nav { padding-bottom:46px; } /* 防止最后一项被底部按钮遮挡 */
.side-collapse-btn { position:fixed; left:0; bottom:0; width:210px; border:none;
  background:#0a2350; color:#cdd8ee; padding:11px 0; cursor:pointer; font-size:13px; z-index:31;
  border-top:1px solid rgba(255,255,255,.15); transition:background .15s, color .15s; }
.side-collapse-btn:hover { background:#13346b; color:#fff; }
.sidebar.collapsed .side-collapse-btn { width:60px; }