/* ==========================================
   生产统计系统 - 设计系统
   ========================================== */

/* --- 设计令牌 --- */
:root {
    --primary: #4f46e5;
    --primary-light: #818cf8;
    --primary-dark: #3730a3;
    --sidebar-bg: #1e1b4b;
    --sidebar-hover: #312e81;
    --sidebar-text: #c7d2fe;
    --success: #10b981;
    --warning: #f59e0b;
    --danger: #ef4444;
    --info: #06b6d4;
    --gray-50: #f9fafb;
    --gray-100: #f3f4f6;
    --gray-200: #e5e7eb;
    --gray-300: #d1d5db;
    --gray-600: #4b5563;
    --gray-800: #1f2937;
    --radius: 10px;
    --radius-sm: 6px;
    --shadow-sm: 0 1px 2px rgba(0,0,0,.05);
    --shadow: 0 4px 6px -1px rgba(0,0,0,.07), 0 2px 4px -2px rgba(0,0,0,.05);
    --shadow-lg: 0 10px 15px -3px rgba(0,0,0,.1), 0 4px 6px -4px rgba(0,0,0,.05);
    --transition: all .2s ease;
    --sidebar-width: 240px;
    --sidebar-collapsed: 64px;
    --topbar-height: 56px;
}

/* --- 全局重置 --- */
* { box-sizing: border-box; }
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: var(--gray-50); margin: 0; min-height: 100vh; }

/* --- 侧边栏 --- */
.sidebar {
    position: fixed; top: 0; left: 0; bottom: 0; width: var(--sidebar-width);
    background: var(--sidebar-bg); color: var(--sidebar-text);
    display: flex; flex-direction: column; z-index: 1040;
    transition: var(--transition); overflow: hidden;
}
.sidebar-header { padding: 16px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(255,255,255,.08); }
/* 品牌区：上层 logo+公司名称，下层系统名称 */
.sidebar-brand-wrap { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.sidebar-company { color: #fff; text-decoration: none; font-weight: 700; font-size: 1.25rem; display: flex; align-items: center; gap: 10px; min-width: 0; }
.sidebar-company .company-logo { width: 40px; height: 40px; object-fit: contain; border-radius: 4px; background: #fff; flex-shrink: 0; }
.sidebar-company .company-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sidebar-brand { color: #fff; text-decoration: none; font-weight: 700; font-size: 1rem; display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.sidebar-brand i { font-size: 1.3rem; color: var(--primary-light); }
.sidebar-toggle { background: none; border: none; color: var(--sidebar-text); cursor: pointer; padding: 4px 8px; border-radius: var(--radius-sm); }
.sidebar-toggle:hover { background: var(--sidebar-hover); }
.sidebar-nav { flex: 1; overflow-y: auto; padding: 12px 0; }
.nav-group { margin-bottom: 8px; }
.nav-group-title { font-size: .7rem; text-transform: uppercase; letter-spacing: .5px; padding: 8px 16px 4px; color: rgba(255,255,255,.4); }
.sidebar-nav .nav-link { display: flex; align-items: center; gap: 12px; padding: 10px 16px; color: var(--sidebar-text); text-decoration: none; font-size: .9rem; border-radius: 0; transition: var(--transition); white-space: nowrap; }
.sidebar-nav .nav-link:hover { background: var(--sidebar-hover); color: #fff; }
.sidebar-nav .nav-link.active { background: var(--primary); color: #fff; border-radius: var(--radius-sm); margin: 0 8px; }
.sidebar-nav .nav-link i { width: 20px; text-align: center; flex-shrink: 0; }

/* --- 侧边栏用户信息（顶部）--- */
.sidebar-user { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid rgba(255,255,255,.08); flex-shrink: 0; }
.sidebar-user .avatar-circle { width: 38px; height: 38px; flex-shrink: 0; }
.sidebar-user .user-meta { display: flex; flex-direction: column; min-width: 0; }
.sidebar-user .user-name { color: #fff; font-weight: 600; font-size: .9rem; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sidebar-user .user-name:hover { text-decoration: underline; }
.sidebar-user .user-role { color: rgba(255,255,255,.5); font-size: .75rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* --- 侧边栏底部（使用说明等）--- */
.sidebar-footer { flex-shrink: 0; border-top: 1px solid rgba(255,255,255,.08); padding: 8px 0; }
.sidebar-footer-item { display: flex; align-items: center; gap: 12px; width: 100%; padding: 10px 16px; background: none; border: none; color: var(--sidebar-text); text-decoration: none; font-size: .9rem; cursor: pointer; white-space: nowrap; text-align: left; }
.sidebar-footer-item:hover { background: var(--sidebar-hover); color: #fff; }
.sidebar-footer-item i { width: 20px; text-align: center; flex-shrink: 0; }
.sidebar-footer-item.text-danger { color: #fca5a5; }
.sidebar-footer-item.text-danger:hover { color: #fff; }

/* 折叠模式 */
.sidebar.collapsed { width: var(--sidebar-collapsed); }
.sidebar.collapsed .brand-text, .sidebar.collapsed .nav-group-title, .sidebar.collapsed .nav-link span { display: none; }
.sidebar.collapsed .company-name { display: none; }
.sidebar.collapsed .nav-link { justify-content: center; padding: 12px; }
.sidebar.collapsed .sidebar-header { justify-content: center; }
.sidebar.collapsed .sidebar-toggle i { transform: rotate(180deg); }
.sidebar.collapsed .sidebar-user { justify-content: center; padding: 14px 0; }
.sidebar.collapsed .sidebar-user .user-meta { display: none; }
.sidebar.collapsed .sidebar-footer-item { justify-content: center; padding: 12px; }
.sidebar.collapsed .sidebar-footer-item span { display: none; }

/* --- 主区域 --- */
.main-wrapper {
    margin-left: var(--sidebar-width);
    min-height: 100vh;
    transition: var(--transition);
}
.sidebar.collapsed ~ .main-wrapper { margin-left: var(--sidebar-collapsed); }

/* --- 顶部栏 --- */
.top-bar {
    min-height: var(--topbar-height); display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
    padding: 8px 24px; background: #fff; border-bottom: 1px solid var(--gray-200);
    position: sticky; top: 0; z-index: 100;
}
.page-title { font-size: 1.1rem; font-weight: 600; margin: 0; color: var(--gray-800); flex: 0 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.top-bar-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; justify-content: flex-end; }
/* 顶栏按钮区间距由全局统一控制（不使用各页面手写的 gap-2，避免相邻按钮间隔过小）*/
.top-bar-actions #pageActions { gap: 12px; }
/* --- 顶栏分区（标题 · 间隔 · 搜索框+搜索按钮 · 筛选区域 · 间隔 · 按钮区域）--- */
.top-spacer { flex: 1 1 auto; min-width: 8px; }
.tb-zone { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
/* 搜索框 + 搜索按钮：合并为同一行 */
.tb-search #pageSearch { display: flex; align-items: center; gap: 8px; flex-wrap: nowrap; }
/* 搜索区内按页签显隐的按钮组（如人事管理「人员管理」搜索）同样保持一行 */
.tb-search #pageSearch .pa-group { display: flex; align-items: center; gap: 8px; flex-wrap: nowrap; }
.tb-search .form-control { min-width: 160px; width: auto; flex-shrink: 1; }
/* 顶栏搜索区：下拉与按钮不被挤压（空间不足时由搜索框伸缩），避免按钮文字折行 */
.tb-search #pageSearch .form-select, .tb-search #pageSearch .btn { flex-shrink: 0; }
.tb-search #pageSearch .form-select { width: auto; min-width: 110px; max-width: 160px; }
/* Select2 接管后的容器（原生 select 被隐藏）：同步限幅且不伸缩 */
.tb-search #pageSearch .select2-container--bootstrap-5 { flex-shrink: 0; min-width: 110px; max-width: 170px; }
/* 搜索区字段组（标题 + 控件）：标题与下拉同一行、紧贴控件，高度与搜索框对齐 */
.tb-search #pageSearch .filter-field { display: flex; align-items: center; gap: 6px; flex-shrink: 0; }
.tb-search #pageSearch .filter-field > .form-label { margin-bottom: 0; white-space: nowrap; font-size: .85rem; color: var(--gray-600); }
/* 筛选标题 + 筛选框：合并为同一行，并适当收紧筛选框宽度 */
.tb-filters .toolbar-filters { align-items: center; }
.tb-filters .toolbar-filters > div { display: flex; align-items: center; gap: 6px; }
.tb-filters .toolbar-filters > div > .form-label { margin-bottom: 0; white-space: nowrap; }
.tb-filters .form-select-sm { width: auto; min-width: 110px; }
.tb-filters .form-control-sm { width: auto; min-width: 120px; }
/* 筛选区日期/月份输入框：与下拉筛选框同宽同高，保证所有筛选框尺寸统一 */
.tb-filters .toolbar-filters > div > input.form-control-sm[type="date"],
.tb-filters .toolbar-filters > div > input.form-control-sm[type="month"] { width: 170px; min-width: 170px; }
.avatar-btn { padding: 4px; border: none; background: none; }
.avatar-circle {
    width: 34px; height: 34px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, var(--primary), var(--primary-light));
    color: #fff; font-weight: 600; font-size: .9rem;
}

/* --- 内容区 --- */
.content-area { padding: 24px; }

/* --- 卡片 --- */
.card { border: none; border-radius: var(--radius); box-shadow: var(--shadow-sm); background: #fff; }
.card:hover { box-shadow: var(--shadow); }
.card-header { background: none; border-bottom: 1px solid var(--gray-100); font-weight: 600; padding: 16px 20px; }
.card-body { padding: 20px; }

/* --- 表格 --- */
.table { margin-bottom: 0; }
.table thead th { background: var(--gray-50); font-size: .8rem; text-transform: uppercase; letter-spacing: .3px; color: var(--gray-600); font-weight: 600; border-bottom: 2px solid var(--gray-200); position: sticky; top: 0; z-index: 1; }
.table tbody tr:nth-child(even) { background: var(--gray-50); }
.table tbody tr:hover { background: rgba(79,70,229,.04); }
.table-responsive { border-radius: var(--radius); overflow: hidden; }

/* --- 按钮 --- */
/* white-space:nowrap 补齐本 Bootstrap 构建缺失的上游基础规则：
   顶栏一行拥挤时，按钮宽度被压缩，中文（如「搜索」）可在字间任意断行而竖排两行 */
.btn { border-radius: var(--radius-sm); font-weight: 500; transition: var(--transition); white-space: nowrap; }
.btn-primary { background: var(--primary); border-color: var(--primary); }
.btn-primary:hover { background: var(--primary-dark); }
.btn-success { background: var(--success); border-color: var(--success); }
.btn-outline-primary { color: var(--primary); border-color: var(--primary); }
.btn-outline-primary:hover { background: var(--primary); color: #fff; }

/* --- 徽章 --- */
.badge { border-radius: 20px; font-weight: 500; padding: .35em .75em; }

/* --- 表单 --- */
.form-control, .form-select { border-radius: var(--radius-sm); border-color: var(--gray-300); }
.form-control:focus, .form-select:focus { border-color: var(--primary-light); box-shadow: 0 0 0 3px rgba(79,70,229,.1); }
.form-label { font-weight: 500; color: var(--gray-600); }

/* --- 工具栏 --- */
.toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 16px; padding: 12px 16px; background: #fff; border-radius: var(--radius); box-shadow: var(--shadow-sm); }
.toolbar-filters { display: flex; flex-wrap: wrap; gap: 8px; align-items: end; }

/* --- 分页 --- */
.card-pager { font-size: .85rem; }
.card-pager .pagination { gap: 2px; }
.card-pager .page-link { border-radius: var(--radius-sm); min-width: 32px; text-align: center; }
.card-pager .page-item.active .page-link { background: var(--primary); border-color: var(--primary); }

/* --- 标签页 --- */
.nav-tabs .nav-link { border-radius: var(--radius-sm) var(--radius-sm) 0 0; color: var(--gray-600); border: none; padding: 10px 16px; }
.nav-tabs .nav-link.active { background: var(--primary); color: #fff; }
.nav-tabs { border-bottom: 2px solid var(--gray-200); }
/* 标签栏容器：仅保留页签，页签撑满行宽以恢复贯穿整页的下划线 */
.settings-tab-bar { display: flex; align-items: flex-end; }
.settings-tab-bar .nav-tabs { margin-bottom: 0; flex: 1 1 auto; width: 100%; }
/* 员工批量操作工具条（独立一行， flex 布局） */
#empBatchBar { display: flex; align-items: center; }

/* --- 模态框：业务弹窗统一规范（biz-modal） ---
   适用范围：新增/编辑/详情/导入/配置等「业务弹窗」；
   提醒、警告、二次确认类弹窗不在本规范内（保持原生轻量样式）。
   统一要素：头部（主色渐变 + 白色图标标题 + 固定高度）、三档宽度、主体留白与超高滚动、
             底部按钮尺寸与排序（次要在前、主操作在后）、弹窗内语义色对齐设计令牌、
             标签一律使用系统统一标签（uiTag / .ui-tag-*，由「系统设置→标签管理」维护）。 */

/* 外壳：去边框、统一圆角与投影（overflow:hidden 让头部渐变贴合圆角） */
.biz-modal .modal-content { border: none; border-radius: var(--radius); box-shadow: var(--shadow-lg); overflow: hidden; }

/* 三档宽度：sm=表单录入 560 / md=详情列表 760 / lg=复杂表格 1080（替代 Bootstrap 默认档与 modal-lg/xl 混用） */
.biz-modal .biz-modal-sm { max-width: 560px; }
.biz-modal .biz-modal-md { max-width: 760px; }
.biz-modal .biz-modal-lg { max-width: 1080px; }

/* 头部：固定 52px 高 + 主色渐变，标题字号/字重/图标间距统一 */
.biz-modal .modal-header {
    background: linear-gradient(135deg, var(--primary-dark), var(--primary) 55%, var(--primary-light));
    color: #fff; border: none; border-radius: 0; padding: 0 20px; min-height: 52px; align-items: center;
}
.biz-modal .modal-title { display: flex; align-items: center; font-size: 1rem; font-weight: 600; color: #fff; line-height: 1.3; }
.biz-modal .modal-title i { margin-right: .5rem; font-size: .95em; opacity: .9; }
.biz-modal .modal-header .btn-close { filter: invert(1) grayscale(100) brightness(2); opacity: .85; }
.biz-modal .modal-header .btn-close:hover { opacity: 1; }

/* 主体：统一内边距与表单项间距，内容超高自动滚动（预留头部+底部高度） */
.biz-modal .modal-body { padding: 20px; max-height: calc(100vh - 170px); overflow-y: auto; }
.biz-modal .modal-body > .mb-3 { margin-bottom: 14px !important; }
/* 字段标签：弹窗内一律统一字重与颜色（含内联业务弹窗的非 modal-body 容器） */
.biz-modal .form-label { font-weight: 600; color: var(--gray-600); margin-bottom: .3rem; }

/* 底部：统一分隔线与内边距，按钮同尺寸同最小宽度 */
.biz-modal .modal-footer { padding: 12px 20px; border-top: 1px solid var(--gray-200); gap: 8px; }
.biz-modal .modal-footer .btn { min-width: 84px; }

/* 语义色对齐设计令牌：弹窗作用域内重写 Bootstrap 调色板，
   bg-*/text-*/border-*/alert-* 及进度条随令牌联动，且兼容 bg-opacity-* 用法 */
.biz-modal {
    --bs-primary: var(--primary);     --bs-primary-rgb: 79, 70, 229;
    --bs-success: var(--success);     --bs-success-rgb: 16, 185, 129;
    --bs-info: var(--info);           --bs-info-rgb: 6, 182, 212;
    --bs-warning: var(--warning);     --bs-warning-rgb: 245, 158, 11;
    --bs-danger: var(--danger);       --bs-danger-rgb: 239, 68, 68;
    --bs-secondary: var(--gray-600);  --bs-secondary-rgb: 107, 114, 128;
    --bs-light: var(--gray-50);       --bs-light-rgb: 249, 250, 251;
    --bs-dark: var(--gray-800);       --bs-dark-rgb: 31, 41, 55;
}
.biz-modal .btn-success { background: var(--success); border-color: var(--success); }
.biz-modal .btn-outline-info { color: var(--info); border-color: var(--info); }
.biz-modal .btn-outline-info:hover { background: var(--info); border-color: var(--info); color: #fff; }

/* 弹窗内表格：表头统一为深灰（与页面表格观感一致），消除 table-light/table-dark 混用 */
.biz-modal .table thead th { background-color: var(--gray-800) !important; color: #fff; border-bottom: 0; }
/* 合计行（tfoot）统一为浅底深字，与深灰表头形成固定层次 */
.biz-modal .table tfoot > tr > td { background-color: var(--gray-100) !important; color: var(--gray-800); border-bottom: 0; }

/* 弹窗内可点击计数标签：外观取自系统统一标签，仅去掉链接下划线与悬停反馈 */
.biz-modal a.biz-count { text-decoration: none; opacity: .92; }
.biz-modal a.biz-count:hover { opacity: 1; }

/* --- 空状态 --- */
.empty-state { text-align: center; padding: 48px 24px; color: var(--gray-600); }
.empty-state i { font-size: 3rem; margin-bottom: 12px; color: var(--gray-300); }

/* --- Select2 主题 --- */
.select2-container--default .select2-results__option--highlighted { background: var(--primary); }
/* 全局 Select2：高度/内边距/字号完全交给主题库按 rem 计算（与 .form-select / 搜索框 .form-control-sm 同公式、随全局字号联动），
   文字靠主题库 line-height:1.5 天然垂直居中；这里禁止再写死 px 高度与 line-height，否则与主题 padding 叠加导致内容偏移、与搜索框高度脱钩 */
.select2-container--bootstrap-5 .select2-selection--single { height: auto; border-radius: var(--radius-sm); border-color: var(--gray-300); }
/* 筛选区紧凑档：仅统一宽度 170px，高度与同行搜索框/日期框自动一致 */
.tb-filters .select2-container--bootstrap-5 { width: 170px !important; }
/* 聚焦/展开态与原生表单控件一致（必须置于 .tb-filters 尺寸规则之后，同特异性下后者会覆盖边框色） */
.select2-container--bootstrap-5.select2-container--focus .select2-selection--single, .select2-container--bootstrap-5.select2-container--open .select2-selection--single, .tb-filters .select2-container--bootstrap-5.select2-container--focus .select2-selection--single, .tb-filters .select2-container--bootstrap-5.select2-container--open .select2-selection--single { border-color: var(--primary-light); box-shadow: 0 0 0 3px rgba(79,70,229,.1); }
/* 下拉面板与搜索框聚焦色统一为项目主色（选择器需与主题库同构且后加载才能覆盖） */
.select2-container--bootstrap-5 .select2-dropdown { border-color: var(--primary-light); }
.select2-container--bootstrap-5 .select2-dropdown .select2-search .select2-search__field:focus { border-color: var(--primary-light); box-shadow: 0 0 0 3px rgba(79,70,229,.1); }
/* 筛选下拉面板：按最宽选项展开，选项内容强制一行显示完毕（超出上限时面板内横向滚动） */
.filter-fit-dropdown { width: max-content !important; min-width: 260px; max-width: min(640px, 92vw); }
.filter-fit-dropdown .select2-results { overflow-x: auto; }
.filter-fit-dropdown .select2-results__option { white-space: nowrap; }
/* 下拉面板顶部搜索框：与输入控件风格统一 */
.select2-dropdown .select2-search--dropdown .select2-search__field { border-radius: var(--radius-sm); }

/* --- 员工筛选下拉（部门分组 / 可收叠 / 配色，配合 common.js mountDeptEmployeeSelect）--- */
.de-select { position: relative; display: block; width: 100%; }
.de-select-toggle {
    display: flex; align-items: center; gap: 6px; width: 100%; min-height: 31px;
    padding: .25rem .6rem; font-size: .875rem; line-height: 1.5; text-align: left;
    background: #fff; color: var(--gray-800); border: 1px solid var(--gray-300);
    border-radius: var(--radius-sm); cursor: pointer; transition: var(--transition);
}
.de-select-toggle:hover { border-color: var(--primary-light); }
.de-select.open .de-select-toggle { border-color: var(--primary-light); box-shadow: 0 0 0 3px rgba(79,70,229,.1); }
.de-select-label { flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.de-select-caret { flex: 0 0 auto; font-size: .7rem; color: var(--gray-600); transition: transform .2s; }
.de-select.open .de-select-caret { transform: rotate(180deg); }
.de-select-dot { flex: 0 0 auto; width: 10px; height: 10px; border-radius: 50%; background: transparent; display: none; }
.de-select-toggle.has-value .de-select-dot { display: inline-block; }
/* 筛选区尺寸与其它 Select2 下拉对齐（170px） */
.tb-filters .de-select { width: 170px; }
.de-select-menu {
    position: absolute; top: calc(100% + 2px); left: 0; z-index: 2000; display: none;
    min-width: 240px; max-width: 320px; padding: 6px; background: #fff;
    border: 1px solid var(--primary-light); border-radius: var(--radius-sm); box-shadow: var(--shadow-lg);
}
.de-select.open .de-select-menu { display: block; }
/* 弹窗内为整行选择框，下拉面板跟随触发器宽度 */
.modal .de-select-menu { min-width: 100%; max-width: none; }
.de-select-search { margin-bottom: 6px; }
.de-select-search .form-control { font-size: .82rem; }
.de-select-list { max-height: 260px; overflow-y: auto; }
.de-item { padding: 5px 10px; border-radius: var(--radius-sm); font-size: .85rem; cursor: pointer; white-space: nowrap; }
.de-item:hover { background: rgba(79,70,229,.08); }
.de-all { color: var(--gray-600); }
.de-group { margin-top: 2px; border-left: 3px solid var(--de-color, transparent); }
.de-group-header {
    display: flex; align-items: center; gap: 6px; padding: 5px 8px; cursor: pointer; user-select: none;
    font-weight: 600; font-size: .82rem; color: var(--de-color); background: var(--gray-50);
    border-radius: var(--radius-sm);
}
.de-group-header:hover { background: var(--gray-100); }
.de-chevron { font-size: .65rem; color: var(--de-color); transition: transform .2s; }
.de-group.collapsed .de-chevron { transform: rotate(-90deg); }
.de-group.collapsed .de-group-body { display: none; }
.de-dot { flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; background: var(--de-color); }
.de-name { flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.de-count { flex: 0 0 auto; font-size: .7rem; color: var(--gray-600); background: rgba(0,0,0,.06); border-radius: 10px; padding: 0 6px; }
.de-group-body { padding-left: 8px; }
.de-emp { position: relative; padding-left: 12px; }
.de-emp::before { content: ''; position: absolute; left: 3px; top: 50%; transform: translateY(-50%); width: 4px; height: 4px; border-radius: 50%; background: var(--de-color); opacity: .6; }
.de-badge-left { margin-left: 6px; font-size: .7rem; color: #fff; background: var(--danger); border-radius: 8px; padding: 0 5px; }

/* --- 甘特图 --- */
:root { --gantt-label-w: 120px; --gantt-track-h: 22px; }
/* 日期轴：与下方每一行的轨道列对齐（先占位标签宽度，再放轴刻度） */
.gantt-axis { display: flex; align-items: center; gap: 6px; padding: 0 2px 5px; margin-bottom: 3px; border-bottom: 1px dashed var(--gray-200); font-size: .68rem; line-height: 1; color: var(--gray-600); }
.gantt-axis-spacer { flex: 0 0 auto; width: var(--gantt-label-w); }
.gantt-axis-track { position: relative; flex: 1 1 auto; min-width: 0; display: flex; justify-content: space-between; }
.gantt-axis-track span { white-space: nowrap; }
.gantt-row { display: flex; align-items: center; gap: 6px; padding: 3px 0; }
.gantt-label { flex: 0 0 auto; width: var(--gantt-label-w); min-width: 0; }
.gantt-name { display: flex; align-items: center; gap: 4px; font-size: .8rem; font-weight: 600; color: var(--gray-800); }
.gantt-name-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gantt-sub { font-size: .7rem; line-height: 1.3; color: var(--gray-600); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 轨道：绝对定位容器 + 10% 间隔参考网格线 */
.gantt-track {
    position: relative; flex: 1 1 auto; min-width: 0; height: var(--gantt-track-h);
    background-color: var(--gray-100);
    background-image: repeating-linear-gradient(to right, rgba(0,0,0,.06) 0, rgba(0,0,0,.06) 1px, transparent 1px, transparent 10%);
    border-radius: 4px;
}
/* 条：按日期区间定位（left/width 由 JS 以百分比给出），底色为色值的浅透明度版本 */
.gantt-bar { position: absolute; top: 12%; bottom: 12%; left: 0; min-width: 6px; border: 1px solid transparent; border-radius: 4px; }
/* 完成度填充：必须占满条的高度，否则色度条不可见 */
.gantt-bar-fill { height: 100%; width: 0; border-radius: 2px; opacity: .9; }
/* 日期提示：挂在轨道上而非条内， nowrap + 省略号，避免空间不足时逐字换行 */
.gantt-bar-tip {
    position: absolute; top: 50%; transform: translateY(-50%); max-width: 92%;
    font-size: .66rem; line-height: 1; color: var(--gray-600);
    background: rgba(255,255,255,.82); border-radius: 3px; padding: 1px 3px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; pointer-events: none;
}

/* --- 仪表盘进度看板：三卡等高 + 行距/字号随本页条数缩放 --- */
#progressBoard {
    --board-body-h: 560px;   /* 内容区固定高度，三卡等高基准 */
    --board-fs: .8rem;
    --board-fs-sub: .7rem;
    --board-track-h: 22px;
    --board-bar-h: 6px;
    --board-item-py: 4px;
    --board-row-max: 56px;   /* 行高上限：超出部分转为行间距，避免条目少时行体夸张拉长 */
}
/* 紧凑（本页 ≥15 条）与宽松（本页 ≤6 条）两档密度，由 JS 切换 class */
#progressBoard.board-compact { --board-fs: .72rem; --board-fs-sub: .64rem; --board-track-h: 15px; --board-bar-h: 4px; --board-item-py: 1px; }
#progressBoard.board-loose { --board-fs: .88rem; --board-fs-sub: .78rem; --board-track-h: 26px; --board-bar-h: 8px; --board-item-py: 8px; }
#progressBoard .card { display: flex; flex-direction: column; }
#progressBoard .card-body { display: flex; flex-direction: column; }
/* 进度条 / 甘特图两个视图共用同一固定高度，保证卡片齐平 */
#progressBoard .view-progress,
#progressBoard .view-gantt { height: var(--board-body-h); display: flex; flex-direction: column; overflow: hidden; }
#progressBoard .card-pager { flex: 0 0 auto; }
/* 行高随本页条数伸缩（上限 56px），剩余空间均分为行间距 */
#progressBoard .view-progress > .list-group, #progressBoard .gantt-body { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; justify-content: space-evenly; }
#progressBoard .gantt-axis { flex: 0 0 auto; }
#progressBoard .gantt-row { flex: 1 1 0; min-height: 0; max-height: var(--board-row-max); padding-top: 0; padding-bottom: 0; }
#progressBoard .view-progress .list-group-item { flex: 1 1 0; min-height: 0; max-height: var(--board-row-max); display: flex; flex-direction: column; justify-content: center; overflow: hidden; padding-top: var(--board-item-py); padding-bottom: var(--board-item-py); font-size: var(--board-fs); }
#progressBoard .view-progress .progress { height: var(--board-bar-h); }
/* 表格视图：非宽松档拉伸行高填满，宽松档回归自然行高并居中 */
#progressBoard .view-progress .table-responsive { flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; justify-content: center; }
#progressBoard .table { height: 100%; }
#progressBoard.board-loose .table { height: auto; }
#progressBoard .table th, #progressBoard .table td { font-size: var(--board-fs); }
/* 甘特图字号与轨道高度跟随密度档位 */
#progressBoard .gantt-name { font-size: var(--board-fs); }
#progressBoard .gantt-sub, #progressBoard .gantt-bar-tip, #progressBoard .gantt-axis { font-size: var(--board-fs-sub); }
#progressBoard .gantt-track { height: var(--board-track-h); }
/* 空数据 / 加载中占位：居中而非堆在顶部 */
#progressBoard .board-empty { flex: 1 1 auto; display: flex; align-items: center; justify-content: center; }

/* --- 统计卡片 --- */
.stat-card { display: flex; align-items: center; gap: 16px; padding: 20px; }
.stat-icon { width: 48px; height: 48px; border-radius: var(--radius); display: flex; align-items: center; justify-content: center; font-size: 1.3rem; }
.stat-value { font-size: 1.5rem; font-weight: 700; color: var(--gray-800); }
.stat-label { font-size: .8rem; color: var(--gray-600); }

/* --- 打印样式 --- */
@media print {
    .sidebar, .top-bar, .btn, .toolbar, .card-pager, .no-print { display: none !important; }
    .main-wrapper { margin-left: 0 !important; }
    .content-area { padding: 0; }
    .card { box-shadow: none; border: 1px solid #ddd; }
    /* 打印时所有表格统一显示完整横竖网格线（参照工价表，与框架 table-bordered 分层规则解耦）；
       选择器同时覆盖 tr 与单元格，压过 Bootstrap 把横线画在 tr、竖线画在 td 的分层实现 */
    .table { --bs-table-bg: transparent; --bs-table-border-color: #000; border-collapse: collapse !important; }
    /* 线宽 2px：防止 Chrome 缩放打印时 1px 细线被舍入丢失 */
    .table, .table th, .table td, .table tr, .table > :not(caption) > *, .table > :not(caption) > * > * { border: 2px solid #000 !important; }
    .table thead th { border-bottom-width: 3px !important; }
    .table th { background-color: #e2e6ea !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* --- 登录页 --- */
.login-page { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, var(--primary-dark), var(--primary), var(--info)); }
.login-card { width: 100%; max-width: 400px; border-radius: var(--radius); box-shadow: var(--shadow-lg); }

/* --- 首页快捷方式（PC：单行六列铺满，按钮均分宽度·规定行数内不换行） --- */
.quick-actions .quick-grid { display: flex; flex-wrap: nowrap; gap: 10px; }
.quick-actions .quick-grid .quick-btn { flex: 1 1 0; min-width: 0; width: auto; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
