﻿/* ============ 一六八传媒ABC岗管理后台 ============ */
*{box-sizing:border-box;margin:0;padding:0;}
:root{
  --primary:#2563eb;
  --primary-dark:#1e40af;
  --primary-light:#eff6ff;
  --primary-border:#bfdbfe;
  --success:#16a34a;
  --success-light:#f0fdf4;
  --danger:#dc2626;
  --danger-light:#fef2f2;
  --purple:#7c3aed;
  --purple-light:#f5f3ff;
  --text:#1f2937;
  --text-sub:#64748b;
  --border:#e2e8f0;
  --card:#ffffff;
  --shadow:0 1px 3px rgba(15,23,42,.08),0 6px 20px rgba(15,23,42,.06);
  --bg-grad1:#f8fafc;
  --bg-grad2:#eef2f7;
  --bar-grad:linear-gradient(90deg,#1e3a8a 0%,#2563eb 60%,#0284c7 100%);
  --bar-shadow:rgba(30,58,138,.28);
  --login-grad:linear-gradient(135deg,#0f2a6e 0%,#2563eb 55%,#0e7490 100%);
  --btn-grad:linear-gradient(135deg,#3b82f6,#1e40af);
  --btn-shadow:rgba(37,99,235,.35);
  --focus-ring:rgba(37,99,235,.15);
  --result-bg:linear-gradient(180deg,#f0f7ff,#e6f0ff);
  --result-border:#bfdbfe;
  --result-text:#1e3a8a;
  /* ===== 间距系统 ===== */
  --space-xs:4px;
  --space-sm:8px;
  --space-md:12px;
  --space-lg:16px;
  --space-xl:24px;
  --space-2xl:32px;
  /* ===== 圆角系统 ===== */
  --radius-sm:6px;
  --radius-md:8px;
  --radius-lg:12px;
  --radius-xl:16px;
  --radius-full:9999px;
  /* ===== 字体大小系统 ===== */
  --font-xs:11px;
  --font-sm:12px;
  --font-md:14px;
  --font-lg:16px;
  --font-xl:20px;
  --font-2xl:28px;
  /* ===== 动画时长 ===== */
  --transition-fast:0.15s ease;
  --transition-normal:0.3s ease;
  --transition-slow:0.5s ease;
  /* ===== 补充语义色 ===== */
  --warning:#d97706;
  --warning-light:#fffbeb;
  --warning-border:#fde68a;
  --info:#0891b2;
  --info-light:#ecfeff;
  --info-border:#a5f3fc;
  --muted:#6b7280;
  --muted-light:#f9fafb;
  /* ===== 字重系统 ===== */
  --font-normal:400;
  --font-medium:500;
  --font-semibold:600;
  --font-bold:700;
  /* ===== 行高系统 ===== */
  --line-tight:1.25;
  --line-normal:1.5;
  --line-relaxed:1.75;
  /* ===== z-index系统 ===== */
  --z-dropdown:100;
  --z-sticky:200;
  --z-modal:500;
  --z-tooltip:800;
  --z-toast:900;
  --z-cmd-palette:9999;
  /* ===== 断点系统 ===== */
  --bp-mobile:720px;
  --bp-tablet:1024px;
  --bp-desktop:1280px;
}
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
/* 动画性能优化：默认使用transform和opacity做动画，触发GPU加速 */
*,*::before,*::after{backface-visibility:hidden;-webkit-backface-visibility:hidden;}
body{
  min-height:100vh;
  padding:20px;
  font-family:"PingFang SC","Microsoft YaHei","Segoe UI",system-ui,-apple-system,sans-serif;
  font-size:14px;
  color:var(--text);
  background:linear-gradient(180deg,var(--bg-grad1) 0%,var(--bg-grad2) 100%);
  background-attachment:fixed;
}

/* ============ 顶部工具栏 ============ */
.top-bar{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;
  margin-bottom:16px;
  padding:12px 20px;
  background:#ffffff;
  border:1px solid #e5e7eb;
  border-radius:12px;
  box-shadow:0 1px 3px rgba(0,0,0,0.05);
  color:#1f2937;
  font-size:13.5px;
}
.top-bar div:first-child{font-weight:600;letter-spacing:.3px;}
.top-bar button{
  background:#f3f4f6;
  color:#374151;
  box-shadow:none;
  border:1px solid #d1d5db;
}
.top-bar button:hover{background:#e5e7eb;transform:translateY(-1px);box-shadow:none;}

/* 小铃铛基础样式（手机版） */
#topNotifIcon{margin-right:12px;}

/* ============ 电脑版：小铃铛靠右边，和退出按钮同一行（修复换行bug） ============ */
@media (min-width:721px){
  .top-bar{flex-wrap:nowrap!important;overflow:hidden;}
  .top-bar-left{flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:10px;max-width:none;}
  .top-bar-left > div{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .top-logo{flex-shrink:0;width:40px!important;height:40px!important;max-width:40px!important;max-height:40px!important;}
  #topNotifIcon{position:static!important;top:auto;right:auto;left:auto;flex-shrink:0!important;margin-left:0;margin-right:4px;z-index:100;transform:none;white-space:nowrap;}
  #topRightTools{flex-shrink:0!important;white-space:nowrap;margin-left:0;}
  .mobile-logout-btn{flex-shrink:0!important;white-space:nowrap;}
}

/* ============ 选项卡 ============ */
.tab-wrap{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap;}
.tab-btn{
  padding:9px 18px;
  border:none;border-radius:10px;
  background:linear-gradient(135deg,var(--primary-light),#ffffff);
  color:var(--primary);font-size:13.5px;font-weight:700;
  border:1.5px solid var(--primary);cursor:pointer;
  box-shadow:0 1px 3px rgba(0,0,0,.06), inset 0 1px 0 rgba(255,255,255,.6);
  transition:all .18s ease;
}
.tab-btn:hover{color:var(--primary-dark);border-color:var(--primary);transform:translateY(-1px);background:linear-gradient(135deg,var(--primary-light),#f1f5f9);box-shadow:0 3px 10px var(--btn-shadow);}
.tab-btn.active{
  background:var(--btn-grad);
  color:#fff;border-color:transparent;
  box-shadow:0 4px 16px var(--btn-shadow);
  font-weight:700;
}

/* ============ 页面卡片 ============ */
.tab-page{
  display:none;
  background:var(--card);
  padding:20px;
  border-radius:14px;
  box-shadow:var(--shadow);
  border:1px solid var(--border);
  margin-bottom:20px;
}
.tab-page.show{display:block;}
.tab-page h3{
  font-size:16.5px;margin-bottom:14px;
  padding-left:12px;border-left:4px solid var(--primary);
  line-height:1.45;color:var(--text);
}
.tab-page h4{font-size:14.5px;margin:6px 0;color:var(--text);}
.tab-page h5{font-size:13.5px;margin:6px 0;color:var(--purple);}

/* ============ 表单控件 ============ */
input,select,textarea{
  padding:8px 10px;
  border:1px solid #cbd5e1;border-radius:8px;
  margin:4px 4px;
  font-size:13px;color:var(--text);
  background:#fff;
  outline:none;
  transition:border-color .15s,box-shadow .15s;
}
input[type="date"]{padding:6px 8px;}
input::placeholder,textarea::placeholder{color:#94a3b8;}
input:focus,select:focus,textarea:focus{
  border-color:var(--primary);
  box-shadow:0 0 0 3px var(--focus-ring);
}

/* ============ 按钮 ============ */
button{
  padding:7px 14px;border:none;border-radius:8px;
  background:var(--btn-grad);
  color:#fff;cursor:pointer;margin:2px;font-size:13px;font-weight:500;
  box-shadow:0 2px 6px var(--btn-shadow);
  transition:all .16s ease;
}
button:hover{filter:brightness(1.08);transform:translateY(-1px);box-shadow:0 5px 14px var(--btn-shadow);}
button:active{transform:translateY(0) scale(.97);}
button.del{background:linear-gradient(135deg,#ef4444,var(--danger));box-shadow:0 2px 6px rgba(220,38,38,.25);}
button.del:hover{box-shadow:0 5px 14px rgba(220,38,38,.35);}
button.edit{background:linear-gradient(135deg,#22c55e,var(--success));box-shadow:0 2px 6px rgba(22,163,74,.25);}
button.edit:hover{box-shadow:0 5px 14px rgba(22,163,74,.35);}
button.import-btn{background:linear-gradient(135deg,#8b5cf6,var(--purple));box-shadow:0 2px 6px rgba(124,58,237,.25);}
button.import-btn:hover{box-shadow:0 5px 14px rgba(124,58,237,.35);}
.readonly-tag{display:inline-block;font-size:12px;color:#94a3b8;background:#f1f5f9;border:1px dashed #cbd5e1;border-radius:6px;padding:2px 8px;}
.pagination{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:10px 2px;justify-content:flex-end;}
.pg-info{font-size:12px;color:#64748b;margin-right:6px;}
.pg-btn{min-width:32px;height:28px;border:1px solid #dbe3ee;border-radius:6px;background:#fff;color:#334155;font-size:12px;cursor:pointer;padding:0 9px;}
.pg-btn:hover:not(:disabled){border-color:var(--blue);color:var(--blue);}
.pg-btn.active{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:700;}
.pg-btn:disabled{opacity:.45;cursor:not-allowed;}
.pg-size{height:28px;border:1px solid #dbe3ee;border-radius:6px;font-size:12px;color:#334155;padding:0 4px;background:#fff;}
.time-btn{height:28px;border:1px solid #c7d6ea;border-radius:6px;background:#f8fafc;color:#334155;font-size:12px;cursor:pointer;padding:0 10px;}
.time-btn:hover{border-color:var(--blue);color:var(--blue);background:#eff6ff;}
.time-btn.active{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:600;}
.filter-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px;}
.time-sep{font-size:12px;color:#94a3b8;margin:0 2px 0 6px;}

/* ============ 表格 ============ */
table{
  width:100%;
  border-collapse:separate;border-spacing:0;
  margin:12px 0;
  border:1px solid var(--border);border-radius:10px;overflow:hidden;
  background:#fff;
}
th,td{border:none;border-bottom:1px solid var(--border);padding:8px 10px;text-align:center;font-size:12.5px;}
th{background:#f1f5f9;color:#334155;font-weight:600;white-space:nowrap;}
th.sortable{cursor:pointer;user-select:none;}
th.sortable:hover{color:#2563eb;background:#e2e8f0;}
.sort-arrow{font-size:11px;margin-left:2px;color:#2563eb;font-weight:700;}
tbody tr:nth-child(even){background:#f8fafc;}
tbody tr:hover{background:var(--primary-light);}
tbody tr:last-child td{border-bottom:none;}

/* ============ 文本提示 ============ */
.tip{color:var(--text-sub);font-size:13px;margin:8px 0;line-height:1.7;}
.warn{color:var(--danger);font-weight:500;}

/* ============ 汇总 / 结果块 ============ */
.summary-block{
  margin-top:14px;padding:14px 16px;
  background:#fff;border:1px solid var(--border);
  border-left:4px solid var(--primary);
  border-radius:10px;
  white-space:pre-wrap;line-height:1.9;font-size:13px;color:#334155;
}
.summary-block h4{margin-bottom:6px;color:var(--primary);font-size:14px;}
.result-block{
  margin-top:14px;padding:16px 18px;
  background:var(--result-bg);
  border:1px solid var(--result-border);border-radius:10px;
  line-height:2;font-size:14px;color:var(--result-text);
}
.filter-row{
  margin:12px 0;padding:10px 12px;
  background:#f1f5f9;border-radius:8px;
  display:flex;align-items:center;flex-wrap:wrap;gap:4px;
  font-size:13px;color:var(--text-sub);
}
.kpi-input-row{
  margin:10px 0;padding:10px 12px;
  background:var(--primary-light);border:1px solid var(--primary-border);border-radius:8px;
  font-size:13px;
}

/* ============ 弹窗 ============ */
.modal{
  position:fixed;top:0;left:0;width:100%;height:100%;
  background:rgba(15,23,42,.5);
  -webkit-backdrop-filter:blur(4px);
  backdrop-filter:blur(4px);
  display:none;align-items:center;justify-content:center;z-index:999;
}
.modal-content{
  background:#fff;padding:22px;border-radius:14px;
  width:560px;max-width:95%;max-height:90vh;overflow:auto;
  box-shadow:0 25px 60px rgba(2,6,23,.35);
  animation:modalIn .2s ease;
}
@keyframes modalIn{from{opacity:0;transform:translateY(10px) scale(.98);}to{opacity:1;transform:none;}}
.modal-content h4{
  margin-bottom:12px;padding-bottom:10px;border-bottom:1px solid var(--border);
  color:var(--text);font-size:15px;
}
.modal-content>div{line-height:2.2;font-size:13.5px;color:#334155;}

/* ============ CSV 导入盒子 ============ */
.import-box{
  border:1px dashed #a78bfa;padding:14px;border-radius:10px;margin:10px 0;
  background:#faf9ff;
}
.import-box h5{margin-bottom:6px;color:var(--purple);}

/* ===== V1.9 个性化定制页面 ===== */
.custom-section{
  background:#fff;border:1px solid var(--border);border-radius:12px;
  padding:18px;margin-bottom:16px;
}
.custom-section-title{
  font-size:15px;font-weight:700;color:var(--text);
  margin-bottom:8px;padding-bottom:10px;border-bottom:1px solid var(--border);
}
.custom-desc{
  font-size:12px;color:#64748b;margin-bottom:14px;line-height:1.6;
}
.nav-sort-list{
  border:1px solid var(--border);border-radius:8px;overflow:hidden;
  margin-bottom:14px;
}
.nav-sort-item{
  display:flex;align-items:center;padding:10px 14px;
  border-bottom:1px solid var(--border);background:#f8fafc;
  transition:background .15s;
}
.nav-sort-item:last-child{border-bottom:none;}
.nav-sort-item:hover{background:#eff6ff;}
.nav-sort-item.dragging{opacity:.5;background:#dbeafe;}
.nav-sort-num{
  width:28px;height:28px;border-radius:50%;background:var(--primary);
  color:#fff;display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;margin-right:12px;flex-shrink:0;
}
.nav-sort-name{
  flex:1;font-size:13px;color:var(--text);font-weight:500;
}
.nav-sort-btns{display:flex;gap:6px;flex-shrink:0;}
.nav-sort-btns button{
  width:32px;height:32px;border:1px solid var(--border);border-radius:6px;
  background:#fff;cursor:pointer;font-size:14px;color:#475569;
  display:flex;align-items:center;justify-content:center;transition:all .15s;
}
.nav-sort-btns button:hover{background:var(--primary);color:#fff;border-color:var(--primary);}
.nav-sort-btns button:disabled{opacity:.3;cursor:not-allowed;}
.nav-sort-btns button:disabled:hover{background:#fff;color:#475569;border-color:var(--border);}
.custom-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.custom-tip{font-size:12px;color:#16a34a;font-weight:500;}
.custom-tip.error{color:#dc2626;}

/* 手机端定制页面适配 */
@media(max-width:768px){
  .custom-section{padding:14px;}
  #mainPage{margin-left:0 !important;}
  .nav-sort-item{padding:8px 10px;}
  .nav-sort-num{width:24px;height:24px;font-size:11px;margin-right:8px;}
  .nav-sort-name{font-size:12px;}
  .nav-sort-btns button{width:28px;height:28px;font-size:12px;}
}


/* ===== V1.9.1 固定导航按钮提示 ===== */
.nav-sort-fixed-tip{
    background: linear-gradient(135deg, #fef3c7, #fde68a);
    border: 1px solid #f59e0b;
    border-radius: 8px;
    padding: 10px 14px;
    margin-bottom: 12px;
    font-size: 13px;
    color: #92400e;
    font-weight: 500;
}
@media (max-width: 768px){
    .nav-sort-fixed-tip{
        font-size: 12px;
        padding: 8px 10px;
    }
}


/* ===== V1.9.2 定制二级菜单样式 ===== */
.custom-menu-view{
    padding: 10px 0;
}
.custom-menu-category{
    margin-bottom: 24px;
}
.custom-category-title{
    font-size: 15px;
    font-weight: 600;
    color: var(--text-color, #333);
    margin-bottom: 12px;
    padding-left: 4px;
    border-left: 3px solid var(--theme-color, #4a90d9);
    padding-left: 10px;
}
.custom-menu-grid{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 12px;
}
.custom-menu-card{
    background: var(--card-bg, #fff);
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 12px;
    padding: 16px;
    cursor: pointer;
    transition: all 0.2s ease;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.custom-menu-card:hover{
    border-color: var(--theme-color, #4a90d9);
    box-shadow: 0 4px 12px rgba(74,144,217,0.15);
    transform: translateY(-2px);
}
.custom-card-icon{
    font-size: 28px;
    margin-bottom: 4px;
}
.custom-card-title{
    font-size: 15px;
    font-weight: 600;
    color: var(--text-color, #333);
}
.custom-card-desc{
    font-size: 12px;
    color: var(--text-secondary, #888);
    line-height: 1.5;
    flex: 1;
}
.custom-card-arrow{
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 24px;
    color: var(--text-secondary, #ccc);
    font-weight: 300;
}
.custom-menu-tip{
    text-align: center;
    color: var(--text-secondary, #aaa);
    font-size: 13px;
    padding: 20px 0;
}
.custom-content-view{
    padding: 10px 0;
}
.custom-content-header{
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--border-color, #e5e7eb);
}
.custom-back-btn{
    padding: 6px 14px !important;
    font-size: 13px !important;
}
.custom-content-title{
    font-size: 16px;
    font-weight: 600;
    color: var(--text-color, #333);
}
/* 手机端适配 */
@media (max-width: 768px){
    .custom-menu-grid{
        grid-template-columns: 1fr;
    }
    .custom-menu-card{
        padding: 14px;
    }
    .custom-card-icon{
        font-size: 24px;
    }
    .custom-content-title{
        font-size: 15px;
    }
}


/* ===== V1.9.3 拖拽排序样式 ===== */
.nav-sort-drag-tip{
    background: linear-gradient(135deg, #dbeafe, #bfdbfe);
    border: 1px solid #60a5fa;
    border-radius: 8px;
    padding: 8px 12px;
    margin-bottom: 12px;
    font-size: 12px;
    color: #1e40af;
}
.nav-sort-drag-handle{
    cursor: grab;
    color: #9ca3af;
    font-size: 14px;
    padding: 0 4px;
    user-select: none;
    flex-shrink: 0;
}
.nav-sort-drag-handle:active{ cursor: grabbing; }
.nav-sort-item.dragging{
    opacity: 0.5;
    transform: scale(0.98);
}
.nav-sort-item.drag-over{
    border-top: 3px solid var(--theme-color, #4a90d9) !important;
    background: rgba(74,144,217,0.05) !important;
}

/* ===== V1.9.3 菜单定制样式 ===== */
.custom-menu-actions{
    text-align: center;
    margin: 16px 0;
}
.menu-custom-list{
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 12px;
}
.menu-custom-item{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    border-bottom: 1px solid var(--border-color, #f3f4f6);
    background: var(--card-bg, #fff);
    transition: background 0.15s;
}
.menu-custom-item:last-child{ border-bottom: none; }
.menu-custom-item:hover{ background: var(--hover-bg, #f9fafb); }
.menu-custom-item.dragging{ opacity: 0.5; transform: scale(0.98); }
.menu-custom-item.drag-over{
    border-top: 3px solid var(--theme-color, #4a90d9) !important;
    background: rgba(74,144,217,0.05) !important;
}
.menu-custom-drag{
    cursor: grab;
    color: #9ca3af;
    font-size: 14px;
    user-select: none;
    flex-shrink: 0;
}
.menu-custom-drag:active{ cursor: grabbing; }
.menu-custom-num{
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--theme-color, #4a90d9);
    color: #fff;
    font-size: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.menu-custom-icon{ font-size: 20px; flex-shrink: 0; }
.menu-custom-name{
    flex: 1;
    font-size: 14px;
    font-weight: 500;
    color: var(--text-color, #333);
}
.menu-custom-name.menu-hidden{
    color: #9ca3af;
    text-decoration: line-through;
}
.menu-custom-actions{ display: flex; gap: 8px; }
.menu-toggle-btn{
    width: 36px;
    height: 36px;
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 8px;
    background: var(--card-bg, #fff);
    cursor: pointer;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s;
}
.menu-toggle-btn:hover{
    border-color: var(--theme-color, #4a90d9);
    background: rgba(74,144,217,0.05);
}
@media (max-width: 768px){
    .nav-sort-drag-handle, .menu-custom-drag{ font-size: 12px; }
    .menu-custom-item{ padding: 8px 10px; gap: 8px; }
    .menu-custom-name{ font-size: 13px; }
}


/* ===== V2.0 导航栏分组样式 ===== */
/* ===== V2.29 导航栏分组样式（优化版） ===== */
.nav-group{
    position: relative;
    display: inline-block;
    margin: 0 3px;
}
.nav-group-trigger{
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 8px 14px;
    background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
    /* V2.38 基础样式增加过渡 */
    transition: all 0.2s ease;
    cursor: pointer;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    cursor: pointer;
    font-size: 13px;
    color: #334155;
    transition: all 0.2s ease;
    user-select: none;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.nav-group-trigger:hover{
    border-color: var(--theme-color, #4a90d9);
    background: linear-gradient(135deg, #f0f7ff 0%, #e6f0ff 100%);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(74,144,217,0.15);
    /* V2.38 增加平滑过渡 */
    transition: all 0.2s ease;
}
.nav-group.open .nav-group-trigger{
    border-color: var(--theme-color, #4a90d9);
    background: linear-gradient(135deg, var(--theme-color, #4a90d9) 0%, #3a7bc8 100%);
    color: #fff;
    box-shadow: 0 4px 12px rgba(74,144,217,0.3);
}
.nav-group.open .nav-group-trigger .nav-group-arrow{
    color: #fff;
}
.nav-group-icon{ font-size: 15px; }
.nav-group-name{ font-weight: 600; }
.nav-group-arrow{
    font-size: 10px;
    color: #94a3b8;
    transition: transform 0.2s ease;
}
.nav-group.open .nav-group-arrow{
    transform: rotate(180deg);
}
.nav-dropdown{
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    min-width: 170px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.12), 0 2px 6px rgba(0,0,0,0.06);
    padding: 8px;
    z-index: 9999 !important;
    display: flex;
    flex-direction: column;
    gap: 2px;
    /* V2.38 展开/收起都有平滑动画，不用visibility避免离散值过渡问题 */
    opacity: 0;
    transform: translateY(-8px);
    transition: opacity 0.2s ease, transform 0.2s ease;
    pointer-events: none;
}
.nav-group.open .nav-dropdown{
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}
.nav-dropdown-item{
    display: block !important;
    width: 100%;
    padding: 9px 14px !important;
    background: transparent !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    color: #334155 !important;
    text-align: left !important;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}
.nav-dropdown-item:hover{
    background: linear-gradient(135deg, #f0f7ff 0%, #e6f0ff 100%) !important;
    color: var(--theme-color, #4a90d9) !important;
    transform: translateX(3px);
    /* V2.38 hover时增加左侧指示条 */
    box-shadow: inset 3px 0 0 var(--theme-color, #4a90d9);
}
.nav-dropdown-item.active{
    background: linear-gradient(135deg, var(--theme-color, #4a90d9) 0%, #3a7bc8 100%) !important;
    color: #fff !important;
    font-weight: 600;
}

/* 分组定制页面样式 */
.nav-group-mode{
    display: flex;
    gap: 10px;
    margin-bottom: 16px;
}
.group-custom-list{
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 12px;
}
.group-custom-item{
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 10px;
    overflow: hidden;
    background: var(--card-bg, #fff);
}
.group-custom-header{
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 14px;
    background: var(--hover-bg, #f9fafb);
    border-bottom: 1px solid var(--border-color, #f3f4f6);
}
.group-custom-icon{ font-size: 18px; }
.group-custom-name-input{
    flex: 1;
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 6px;
    padding: 4px 8px;
    font-size: 13px;
    background: var(--card-bg, #fff);
}
.group-custom-count{
    font-size: 12px;
    color: var(--text-secondary, #888);
    background: var(--hover-bg, #f3f4f6);
    padding: 2px 8px;
    border-radius: 10px;
}
.group-custom-items{
    padding: 8px 14px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.group-custom-subitem{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 10px;
    background: var(--hover-bg, #f9fafb);
    border-radius: 6px;
}
.group-subitem-name{
    font-size: 13px;
    color: var(--text-color, #333);
}
.group-subitem-remove{
    width: 22px;
    height: 22px;
    border: none;
    background: #fee2e2;
    color: #dc2626;
    border-radius: 50%;
    cursor: pointer;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}
.group-subitem-remove:hover{ background: #fecaca; }
.group-subitem-move{
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 6px;
    padding: 3px 6px;
    font-size: 12px;
    background: var(--card-bg, #fff);
    cursor: pointer;
}
.group-ungrouped{
    border-style: dashed;
    opacity: 0.8;
}

/* ===== V2.29 手机端适配：底部导航分组（优化版） ===== */
@media (max-width: 768px){
    /* V2.29 修复：确保分组按钮在flex容器中正确显示，可点击 */
    .nav-group{
        margin: 0 1px;
        flex: 1 0 auto;
        flex-shrink: 0;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .nav-group-trigger{
        padding: 6px 8px;
        font-size: 12px;
        flex-direction: column;
        gap: 3px;
        background: transparent;
        border: none;
        border-radius: 10px;
        box-shadow: none;
        min-width: 52px;
        min-height: 48px;
        justify-content: center;
        align-items: center;
        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
        cursor: pointer;
    }
    .nav-group-trigger:hover{
        background: rgba(74,144,217,0.08);
        transform: none;
        box-shadow: none;
    }
    .nav-group.open .nav-group-trigger{
        background: linear-gradient(135deg, var(--theme-color, #4a90d9) 0%, #3a7bc8 100%);
        color: #fff;
        box-shadow: 0 2px 8px rgba(74,144,217,0.3);
    }
    .nav-group-icon{ font-size: 20px; line-height: 1; }
    .nav-group-name{ font-size: 10px; font-weight: 500; line-height: 1; }
    .nav-group-arrow{ display: none; }
    
    /* V2.29 手机端下拉菜单：底部弹出式，z-index拉满确保不被主页覆盖 */
    .nav-dropdown{
        position: fixed;
        top: auto;
        bottom: 75px;
        left: 12px;
        right: 12px;
        min-width: auto;
        max-height: 55vh;
        overflow-y: auto;
        background: #ffffff;
        border: 1px solid #e2e8f0;
        border-radius: 16px;
        box-shadow: 0 -4px 20px rgba(0,0,0,0.15), 0 8px 30px rgba(0,0,0,0.2);
        padding: 10px;
        z-index: 99999 !important;
        animation: mobileNavSlideUp 0.25s ease;
    }
    @keyframes mobileNavSlideUp{
        from{ opacity: 0; transform: translateY(20px); }
        to{ opacity: 1; transform: translateY(0); }
    }
    .nav-dropdown-item{
        display: flex !important;
        align-items: center;
        width: 100%;
        padding: 14px 16px !important;
        background: #f8fafc !important;
        border: 1px solid #e2e8f0 !important;
        border-radius: 10px !important;
        font-size: 15px !important;
        font-weight: 500;
        color: #334155 !important;
        text-align: left !important;
        margin-bottom: 4px;
        min-height: 48px;
    }
    .nav-dropdown-item:last-child{ margin-bottom: 0; }
    .nav-dropdown-item:hover{
        background: linear-gradient(135deg, #f0f7ff 0%, #e6f0ff 100%) !important;
        color: var(--theme-color, #4a90d9) !important;
        transform: none;
        border-color: var(--theme-color, #4a90d9) !important;
    }
    .nav-dropdown-item.active{
        background: linear-gradient(135deg, var(--theme-color, #4a90d9) 0%, #3a7bc8 100%) !important;
        color: #fff !important;
        border-color: var(--theme-color, #4a90d9) !important;
        font-weight: 600;
    }
    .nav-group-mode{ flex-direction: column; }
    .group-custom-name-input{ font-size: 12px; }
}


/* ========== V2.1 支出汇总样式 ========== */
.lg-expense-summary {
  margin-top: 20px;
  padding: 16px;
  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
  border-radius: 12px;
  border: 1px solid #e2e8f0;
}
.lg-es-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
}
.lg-es-title {
  font-size: 16px;
  font-weight: 600;
  color: #1e293b;
}
.lg-es-content {
  display: flex;
  gap: 20px;
  flex-wrap: wrap;
}
.lg-es-col {
  flex: 1;
  min-width: 280px;
  background: #fff;
  border-radius: 10px;
  padding: 14px;
  border: 1px solid #e2e8f0;
}
.lg-es-col-title {
  font-size: 14px;
  font-weight: 600;
  color: #475569;
  margin-bottom: 8px;
}
.lg-es-total {
  font-size: 24px;
  font-weight: 700;
  color: #ef4444;
  margin-bottom: 12px;
}
.lg-es-total-all {
  color: #f59e0b;
}
.lg-es-list {
  max-height: 300px;
  overflow-y: auto;
}
.lg-es-item {
  margin-bottom: 10px;
}
.lg-es-item-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4px;
}
.lg-es-cat {
  font-size: 13px;
  color: #334155;
  font-weight: 500;
}
.lg-es-amt {
  font-size: 13px;
  color: #ef4444;
  font-weight: 600;
}
.lg-es-bar {
  height: 6px;
  background: #f1f5f9;
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 2px;
}
.lg-es-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #f87171, #ef4444);
  border-radius: 3px;
  transition: width 0.3s ease;
}
.lg-es-bar-fill-all {
  background: linear-gradient(90deg, #fbbf24, #f59e0b);
}
.lg-es-sub {
  font-size: 11px;
  color: #94a3b8;
}
.lg-es-empty {
  text-align: center;
  color: #94a3b8;
  font-size: 13px;
  padding: 20px 0;
}
/* 手机端适配 */
@media (max-width: 768px) {
  .lg-expense-summary {
    padding: 12px;
  }
  .lg-es-content {
    flex-direction: column;
    gap: 12px;
  }
  .lg-es-col {
    min-width: auto;
  }
  .lg-es-total {
    font-size: 20px;
  }
}


/* ============ 电脑版：我的数据报表优化 ============ */
@media (min-width:721px){
  #homeReport > div:nth-child(1){gap:12px!important;margin-bottom:16px!important;}
  #homeReport > div:nth-child(1) > div{padding:16px 8px!important;border-radius:12px!important;}
  #homeReport > div:nth-child(1) > div > div:first-child{font-size:30px!important;}
  #homeReport > div:nth-child(1) > div > div:last-child{font-size:12px!important;margin-top:4px!important;}
  #homeReport > div:nth-child(2){padding:14px!important;margin-bottom:12px!important;border-radius:12px!important;}
  #homeReport > div:nth-child(2) > div:first-child{font-size:14px!important;margin-bottom:8px!important;}
  #homeReport #homeTrendChart{height:240px!important;}
  #homeReport > div:nth-child(3){gap:12px!important;}
  #homeReport > div:nth-child(3) > div{padding:14px!important;border-radius:12px!important;}
  #homeReport > div:nth-child(3) > div > div:first-child{font-size:13px!important;margin-bottom:8px!important;}
  #homeReport #homeCompareChart{height:200px!important;}
}


/* ============ 电脑版：公司/集团数据概览报表优化 ============ */
@media (min-width:721px){
  #homeReport #homeCompanyTrend{height:260px!important;}
  #homeReport #homeCompanyPie{height:280px!important;}
  #homeReport > div:nth-child(2) > div:first-child,
  #homeReport > div:nth-child(3) > div:first-child{font-size:14px!important;margin-bottom:10px!important;}
}


/* ============ 电脑版：工作台报表中心优化 ============ */
@media (min-width:721px){
  #reportPage > div:nth-child(2){max-width:100%!important;}
  /* 统计卡片 */
  #reportPage > div:nth-child(2) > div:nth-child(1) > div{padding:20px 12px!important;border-radius:14px!important;}
  #reportPage > div:nth-child(2) > div:nth-child(1) > div > div:nth-child(2){font-size:32px!important;}
  #reportPage > div:nth-child(2) > div:nth-child(1) > div > div:nth-child(1){font-size:13px!important;}
  #reportPage > div:nth-child(2) > div:nth-child(1) > div > div:nth-child(3){font-size:12px!important;margin-top:4px!important;}
  /* 图表卡片：三列显示 */
  #reportPage > div:nth-child(2) > div:nth-child(2) > div{flex:1 1 30%!important;min-width:350px!important;padding:16px!important;border-radius:14px!important;}
  #reportPage > div:nth-child(2) > div:nth-child(2) > div > div:first-child{font-size:15px!important;margin-bottom:10px!important;}
  /* 图表高度增大 */
  #reportPage div[id^=rpt]{height:350px!important;}
}


/* ============ 电脑版：工作台报表中心优化（修正选择器） ============ */
@media (min-width:721px){
  /* 外层容器：第3个子元素（H3 + reportScopeTitle + 容器） */
  #reportPage > div:nth-child(3){max-width:100%!important;}
  /* 统计卡片行：外层容器第1个子元素 */
  #reportPage > div:nth-child(3) > div:nth-child(1) > div{padding:20px 12px!important;border-radius:14px!important;}
  #reportPage > div:nth-child(3) > div:nth-child(1) > div > div:nth-child(2){font-size:32px!important;}
  #reportPage > div:nth-child(3) > div:nth-child(1) > div > div:nth-child(1){font-size:13px!important;}
  #reportPage > div:nth-child(3) > div:nth-child(1) > div > div:nth-child(3){font-size:12px!important;margin-top:4px!important;}
  /* 图表卡片行：外层容器第2个子元素，三列显示 */
  #reportPage > div:nth-child(3) > div:nth-child(2) > div{flex:1 1 30%!important;min-width:350px!important;padding:16px!important;border-radius:14px!important;}
  #reportPage > div:nth-child(3) > div:nth-child(2) > div > div:first-child{font-size:15px!important;margin-bottom:10px!important;}
}


/* ==================== 全局命令面板（Ctrl+F） ==================== */
.cmd-palette-mask{
  display:none;
  position:fixed;
  top:0;left:0;right:0;bottom:0;
  background:rgba(0,0,0,0.5);
  z-index:9999;
  align-items:flex-start;
  justify-content:center;
  padding-top:15vh;
}
.cmd-palette-mask.show{display:flex;}
.cmd-palette{
  width:90%;
  max-width:600px;
  background:#fff;
  border-radius:12px;
  box-shadow:0 20px 60px rgba(0,0,0,0.3);
  overflow:hidden;
  animation:cmdFadeIn 0.15s ease-out;
}
@keyframes cmdFadeIn{
  from{opacity:0;transform:translateY(-10px);}
  to{opacity:1;transform:translateY(0);}
}
.cmd-palette-header{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 16px;
  border-bottom:1px solid #e5e7eb;
  background:#f9fafb;
}
.cmd-palette-icon{font-size:18px;flex-shrink:0;}
.cmd-palette-header input{
  flex:1;
  border:none;
  outline:none;
  font-size:15px;
  background:transparent;
  color:#1f2937;
  min-width:0;
}
.cmd-palette-hint{
  font-size:11px;
  color:#9ca3af;
  flex-shrink:0;
  white-space:nowrap;
}
.cmd-palette-results{
  max-height:400px;
  overflow-y:auto;
  padding:8px;
}
.cmd-palette-empty{
  padding:30px 20px;
  text-align:center;
  color:#9ca3af;
  font-size:13px;
}
.cmd-palette-item{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:8px;
  cursor:pointer;
  transition:background 0.1s;
}
.cmd-palette-item:hover,
.cmd-palette-item.active{
  background:#eff6ff;
}
.cmd-palette-item-icon{
  font-size:16px;
  flex-shrink:0;
  width:24px;
  text-align:center;
}
.cmd-palette-item-text{
  flex:1;
  font-size:13px;
  color:#1f2937;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.cmd-palette-item-cat{
  font-size:10px;
  color:#9ca3af;
  background:#f3f4f6;
  padding:2px 6px;
  border-radius:4px;
  flex-shrink:0;
}
.cmd-palette-group-title{
  padding:8px 12px 4px;
  font-size:11px;
  font-weight:600;
  color:#6b7280;
  text-transform:uppercase;
  letter-spacing:0.5px;
}
/* 手机端命令面板 */
@media (max-width:720px){
  .cmd-palette{width:95%;max-width:none;}
  .cmd-palette-hint{display:none;}
  .cmd-palette-results{max-height:50vh;}
}


/* ==================== 左侧导航栏（电脑端） ==================== */
.sidebar-nav{
  display:none; /* 默认隐藏（手机端），电脑端媒体查询中显示 */
  position:fixed;
  left:0;top:0;
  width:170px;
  height:100vh;
  background:linear-gradient(180deg,#1e293b 0%,#0f172a 100%);
  z-index:999;
  overflow-y:auto;
  overflow-x:hidden;
  flex-direction:column;
}
.sidebar-header{
  display:flex;
  align-items:center;
  gap:10px;
  padding:16px 16px;
  border-bottom:1px solid rgba(255,255,255,0.08);
}
.sidebar-logo{
  width:32px;height:32px;
  border-radius:8px;
  object-fit:cover;
  flex-shrink:0;
}
.sidebar-title{
  color:#f1f5f9;
  font-size:15px;
  font-weight:600;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.sidebar-menu{
  flex:1;
  padding:8px 0 16px;
}
.sidebar-group{
  margin-bottom:8px;
}
.sidebar-group-title{
  padding:8px 16px 4px;
  font-size:10px;
  font-weight:600;
  color:#64748b;
  text-transform:uppercase;
  letter-spacing:0.8px;
}
.sidebar-item{
  display:flex;
  align-items:center;
  gap:10px;
  padding:7px 10px;
  color:#cbd5e1;
  text-decoration:none;
  font-size:13px;
  cursor:pointer;
  transition:all 0.15s ease;
  border-left:3px solid transparent;
  position:relative;
}
.sidebar-item:hover{
  background:rgba(255,255,255,0.06);
  color:#f1f5f9;
}
.sidebar-item.active{
  background:rgba(59,130,246,0.15);
  color:#60a5fa;
  border-left-color:#3b82f6;
}
.sidebar-item span{
  flex:1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.sidebar-badge{
  display:inline-block;
  min-width:18px;
  height:18px;
  line-height:18px;
  border-radius:9px;
  background:#ef4444;
  color:#fff;
  font-size:10px;
  font-weight:700;
  text-align:center;
  padding:0 5px;
  flex-shrink:0;
}

/* 手机端：侧栏改为抽屉式（通过transform隐藏，不是display:none） */
@media (max-width:768px){
  .sidebar-nav{display:flex !important;}
  #mainPage{
    margin-left:0 !important;
    margin-right:0 !important;
    max-width:100% !important;
    width:100% !important;
    padding-left:10px !important;
    padding-right:10px !important;
    box-sizing:border-box !important;
  }
  #mainPage *{max-width:100% !important; box-sizing:border-box !important;}
  #mainPage table, #mainPage .table-container, #mainPage .data-table-wrapper{
    max-width:100% !important;
    overflow-x:auto !important;
    display:block !important;
  }
  #mainPage img{max-width:100% !important; height:auto !important;}
  .home-card{margin-left:0 !important; margin-right:0 !important;}
  .stats-grid{grid-template-columns:repeat(2, 1fr) !important; gap:10px !important;}
  .home-card, .stat-card, .info-card{
    padding:12px !important;
    margin-bottom:10px !important;
  }
  .home-card h3, .stat-card .title{
    font-size:13px !important;
  }
  .home-card .value, .stat-card .value{
    font-size:18px !important;
  }
  /* 确保所有容器不溢出 */
  .card, .panel, .widget, .module{
    max-width:100% !important;
    box-sizing:border-box !important;
    overflow:hidden !important;
  }
  /* 表格容器横向滚动 */
  .table-wrapper, .data-table, .grid-container{
    max-width:100% !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
  }
  /* 按钮文字不换行 */
  .btn, button{
    white-space:nowrap !important;
  }
}

/* 电脑端：显示左侧导航栏，隐藏顶部.tab-wrap，内容区右移 */
@media (min-width:769px){
  .sidebar-nav{display:flex; width:220px;}
  .tab-wrap{display:none !important;}
  body{
    padding-left:0 !important;
    box-sizing:border-box;
    overflow-x:hidden;
  }
  #mainPage{
    margin-left:220px !important;
    padding-left:20px !important;
    padding-right:20px !important;
    width:auto !important;
    box-sizing:border-box;
    overflow-x:auto;
    min-height:100vh;
  }
  .top-bar{
    position:static !important;
    top:auto !important;
    left:auto !important;
    right:auto !important;
    width:100%;
    max-width:none;
    margin-bottom:16px;
  }
  .tab-page{
    max-width:100%;
    box-sizing:border-box;
    overflow-x:auto;
  }
  .tab-page table{
    max-width:100%;
  }
  /* 登录页面：重置左侧导航栏占位 */
  body.login-mode #mainPage{
    margin-left:0 !important;
    padding-left:0 !important;
  }
  body.login-mode .top-bar{
    position:static !important;
    left:auto !important;
    right:auto !important;
  }
}

/* 平板（769-1024px）：窄版左侧导航 */
@media (min-width:769px) and (max-width:1024px){
  .sidebar-nav{
    display:flex;
    width:170px;
  }
  #mainPage{margin-left:170px !important;}
  .sidebar-title,
  .sidebar-group-title,
  .sidebar-item span{
    display:none;
  }
  .sidebar-item{
    justify-content:center;
    padding:12px 0;
    font-size:18px;
  }
  .sidebar-header{
    justify-content:center;
    padding:12px 0;
  }
  .tab-wrap{display:none !important;}
  body{
    padding-left:0 !important;
    box-sizing:border-box;
    overflow-x:hidden;
  }
  #mainPage{
    margin-left:170px !important;
    padding-left:16px !important;
    padding-right:16px !important;
    width:auto !important;
    box-sizing:border-box;
    overflow-x:auto;
    min-height:100vh;
  }
  .top-bar{
    position:static !important;
    top:auto !important;
    left:auto !important;
    right:auto !important;
    width:100%;
    max-width:none;
    margin-bottom:16px;
  }
  .tab-page{
    max-width:100%;
    box-sizing:border-box;
    overflow-x:auto;
  }
  /* 登录页面：重置 */
  body.login-mode #mainPage{
    margin-left:0 !important;
    padding-left:0 !important;
  }
  body.login-mode .top-bar{
    position:static !important;
    left:auto !important;
    right:auto !important;
  }
}

/* 手机端：隐藏顶部tab导航 */
@media (max-width:768px){
  .tab-wrap{display:none !important;}
}


/* ========== 左侧导航栏 - 底部用户信息 ========== */
.sidebar-footer{
  padding:10px 12px;
  border-top:1px solid rgba(255,255,255,0.08);
}
.sidebar-user{
  display:flex;
  align-items:center;
  gap:10px;
}
.sidebar-avatar{
  width:36px;height:36px;
  border-radius:50%;
  background:#2563eb;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:14px;
  font-weight:600;
  flex-shrink:0;
}
.sidebar-user-info{
  flex:1;
  min-width:0;
}
.sidebar-username{
  color:#f1f5f9;
  font-size:13px;
  font-weight:600;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.sidebar-role{
  color:#64748b;
  font-size:11px;
  margin-top:2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* 平板窄版隐藏文字 */
@media (min-width:769px) and (max-width:1024px){
  .sidebar-nav .sidebar-item{justify-content:center;padding:12px 0;}
  .sidebar-nav .sidebar-logo{justify-content:center;padding:12px 0;}
  .sidebar-nav .sidebar-footer{padding:12px 0;}
  .sidebar-nav .sidebar-user{justify-content:center;}
}


/* V5.0 确保侧栏菜单项文字显示 */
.sidebar-item .label{
    display: inline !important;
}
.sidebar-logo span{
    display: inline !important;
}
.sidebar-group-title{
    display: block !important;
}
.sidebar-user-info{
    display: block !important;
}

/* V5.0 最高优先级：强制侧栏所有内容显示 */
#sidebarNav .sidebar-item{
    display: flex !important;
}
#sidebarNav .sidebar-item .icon{
  background:transparent !important;
  border:none !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width:14px;
    margin-right:2px;
    font-size: 16px;
}
#sidebarNav .sidebar-item .label{
    display: inline !important;
    flex: 1;
    font-size: 13px;
}
#sidebarNav .sidebar-logo{
    display: flex !important;
    align-items: center;
}
#sidebarNav .sidebar-logo .logo-img{
    display: block !important;
}
#sidebarNav .sidebar-logo span{
    display: inline !important;
}
#sidebarNav .sidebar-group-title{
    display: block !important;
}
#sidebarNav .sidebar-footer{
    display: block !important;
}
#sidebarNav .sidebar-user{
    display: flex !important;
}
#sidebarNav .sidebar-user-info{
    display: block !important;
}
#sidebarNav .sidebar-username{
    display: block !important;
}
#sidebarNav .sidebar-role{
    display: block !important;
}

/* ========== V5.0 侧栏折叠功能 ========== */
.sidebar-toggle{
    margin-left:auto;
    margin-top:20px;
    background:transparent;
    border:none;
    color:#fff;
    font-size:18px;
    cursor:pointer;
    padding:4px 8px;
    border-radius:6px;
    transition:all 0.15s;
    flex-shrink:0;
}
.sidebar-toggle:hover{
    background:rgba(255,255,255,0.2);
    color:#fff;
}

/* 折叠态：60px，只显示图标 */
#sidebarNav.collapsed{
    width:60px !important;
}
#sidebarNav.collapsed .sidebar-logo{
    justify-content:center;
    padding:12px 0;
}
#sidebarNav.collapsed .sidebar-logo .logo-img{
    margin:0;
}
#sidebarNav.collapsed .sidebar-logo span{
    display:none !important;
}
#sidebarNav.collapsed .sidebar-toggle{
    display:none;
}
#sidebarNav.collapsed .sidebar-group-title{
    display:none !important;
}
#sidebarNav.collapsed .sidebar-item{
    justify-content:center;
    padding:12px 0;
}
#sidebarNav.collapsed .sidebar-item .icon{
    margin-right:0;
}
#sidebarNav.collapsed .sidebar-item .label{
    display:none !important;
}
#sidebarNav.collapsed .sidebar-item .badge{
    position:absolute;
    top:4px;
    right:4px;
}
#sidebarNav.collapsed .sidebar-footer{
    padding:12px 0;
}
#sidebarNav.collapsed .sidebar-user{
    justify-content:center;
}
#sidebarNav.collapsed .sidebar-user-info{
    display:none !important;
}
#sidebarNav.collapsed .sidebar-avatar{
    margin:0;
}

/* 折叠态hover提示 */
#sidebarNav.collapsed .sidebar-item{
    position:relative;
}
#sidebarNav.collapsed .sidebar-item:hover::after{
    content:attr(data-label);
    position:absolute;
    left:70px;
    top:50%;
    transform:translateY(-50%);
    background:#1e293b;
    color:#fff;
    padding:6px 12px;
    border-radius:6px;
    font-size:12px;
    white-space:nowrap;
    z-index:1000;
    box-shadow:0 2px 8px rgba(0,0,0,0.2);
}

/* 主内容区对应调整 */
body.sidebar-collapsed #mainPage{
    margin-left:60px !important;
}




/* ========== V5.2 手风琴式二级导航 ========== */
#sidebarNav .sidebar-group-title{
    cursor:pointer !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    padding:12px 16px 8px !important;
    user-select:none;
    transition:background 0.15s ease;
    border-radius:6px;
    margin:2px 8px 0;
}
#sidebarNav .sidebar-group-title:hover{
    background:rgba(255,255,255,0.08) !important;
}
#sidebarNav .sidebar-group-title .group-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:0.5px;
    color:#cbd5e1;
    text-transform:none;
}
#sidebarNav .sidebar-group-title .group-arrow{
    font-size:12px;
    color:#94a3b8;
    transition:transform 0.2s ease;
    flex-shrink:0;
}

/* 折叠态 */
#sidebarNav .sidebar-group.collapsed .sidebar-group-items{
    display:none !important;
}
#sidebarNav .sidebar-group.collapsed .group-arrow{
    transform:rotate(-90deg);
}

/* 菜单项容器 */
#sidebarNav .sidebar-group-items{
    padding-bottom:4px;
}

/* 折叠态（侧栏60px）下隐藏分组标题和箭头，只显示图标 */
#sidebarNav.collapsed .sidebar-group-title{
    display:none !important;
}
#sidebarNav.collapsed .sidebar-group-items{
    padding-bottom:0;
}

/* 折叠态下折叠按钮居中显示 */
#sidebarNav.collapsed .sidebar-toggle{
    display:block !important;
    margin:10px auto 0 !important;
    width:40px;
    text-align:center;
    padding:6px 0;
}
#sidebarNav.collapsed .sidebar-logo{
    padding:8px 0 !important;
    flex-direction:column;
    align-items:center;
}
#sidebarNav.collapsed .sidebar-logo img,
#sidebarNav.collapsed .sidebar-logo span{
    display:none !important;
}


/* ========== V5.0 移动端抽屉式导航 ========== */

/* 汉堡按钮：默认隐藏，手机端显示 */
.mobile-menu-btn{
  display:none;
  background:none;
  border:none;
  font-size:20px;
  color:#1e293b;
  cursor:pointer;
  padding:6px 10px;
  border-radius:6px;
  margin-right:8px;
  flex-shrink:0;
}
.mobile-menu-btn:hover{
  background:rgba(0,0,0,0.05);
}

/* 遮罩层：默认隐藏 */
.sidebar-overlay{
  display:none;
  position:fixed;
  top:0;left:0;right:0;bottom:0;
  background:rgba(0,0,0,0.5);
  z-index:998;
  opacity:0;
  transition:opacity 0.3s ease;
}

/* 手机端：侧栏改为抽屉式 */
@media (max-width:768px){
  /* 汉堡按钮显示 */
  .mobile-menu-btn{
    display:block;
  }

  /* 遮罩层显示（导航展开时） */
  body.sidebar-mobile-open .sidebar-overlay{
    display:block;
    opacity:1;
  }

  /* 侧栏固定定位，默认隐藏在屏幕左侧外 */
  .sidebar-nav{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    bottom:0 !important;
    width:260px !important;
    z-index:999 !important;
    transform:translateX(-100%);
    transition:transform 0.3s ease;
    box-shadow:2px 0 12px rgba(0,0,0,0.15);
  }

  /* 导航展开时滑入 */
  body.sidebar-mobile-open .sidebar-nav{
    transform:translateX(0);
  }

  /* 手机端折叠态不生效，始终展开显示文字 */
  .sidebar-nav.collapsed{
    width:260px !important;
  }
  .sidebar-nav.collapsed .sidebar-item .label,
  .sidebar-nav.collapsed .sidebar-group-label .label,
  .sidebar-nav.collapsed .sidebar-logo-text,
  .sidebar-nav.collapsed .sidebar-user-info,
  .sidebar-nav.collapsed .sidebar-collapse-btn{
    display:flex !important;
  }

  /* 主内容区不预留侧栏宽度 */
  #mainPage{
    margin-left:0 !important;
  }

  /* 顶部栏用户信息简化 */
  .top-bar-left > div:not(.mobile-menu-btn):not(.top-logo){
    font-size:12px;
  }
}

/* 小屏手机（<=480px）侧栏宽度调整 */
@media (max-width:480px){
  .sidebar-nav{
    width:82vw !important;
    max-width:300px;
  }
}
