/* ============================================================
* 香城人资后台主题 — 浅色现代 SaaS
* 挂载：gougu.css / layout.css 之后（base.html、index.html、login/index.html）
* 回退：删除对应 即可恢复原主题
* 规格：docs/superpowers/specs/2026-09-17-admin-theme-design.md
* ============================================================ */
/* ---------- 1. 设计 Token ---------- */
:root {
--xt-brand: #1871FC;
--xt-brand-hover: #1558D6;
--xt-brand-light: #EAF3FF;
--xt-text-1: #333333;
--xt-text-2: #666666;
--xt-text-3: #999999;
--xt-line: #E0E0E0;
--xt-line-soft: #EFF2F7;
--xt-bg-page: #F7F8FA;
--xt-green: #13BC34;
--xt-green-light: #EDF9F0;
--xt-red: #E01313;
--xt-red-light: #FDEDED;
--xt-orange: #EDA928;
--xt-orange-light: #FEF3E2;
--xt-shadow: 0 1px 4px rgba(23, 33, 56, .06);
}
/* ---------- 2. 顶栏 ---------- */
.gg-layout .layui-header {
background: #fff !important;
border-bottom: 1px solid var(--xt-line-soft);
box-shadow: 0 1px 4px rgba(23, 33, 56, .04);
}
.gg-layout .layui-header a,
.gg-layout .layui-header a cite { color: var(--xt-text-2); }
.gg-layout .layui-header a:hover { color: var(--xt-brand); }
.layui-layout-right .gg-head-item { border-left: 1px solid var(--xt-line-soft); }
.layui-layout-right .gg-head-item i.layui-icon { color: var(--xt-text-3); font-weight: 400; }
.layui-layout-right .gg-head-item i.layui-icon:hover { color: var(--xt-brand); }
.gg-head-item .layui-nav .layui-nav-item a { color: var(--xt-text-2); }
.gg-head-item .layui-nav .layui-nav-item a:hover { color: var(--xt-brand); }
.layui-layout-right .gg-message-num span { background-color: var(--xt-red); }
/* ---------- 3. 侧边栏 ---------- */
.layui-side-white,
.layui-side-menu {
background: #fff !important;
border-right: 1px solid var(--xt-line-soft);
box-shadow: none !important;
color: var(--xt-text-2);
}
.layui-side-white .layui-logo {
background: #fff !important;
border-bottom: 1px solid var(--xt-line-soft) !important;
border-right: 1px solid var(--xt-line-soft);
box-shadow: none !important;
}
/* 一级菜单项（圆角胶囊，匹配设计稿） */
.layui-side-white .layui-nav-item > a,
.layui-side-menu .layui-nav-item > a {
color: var(--xt-text-1) !important;
background: transparent !important;
font-size: 13.5px !important;
margin: 0 8px;
border-radius: 8px;
}
.layui-side-white .layui-nav-item > a:hover,
.layui-side-menu .layui-nav-item > a:hover {
color: var(--xt-brand) !important;
background: var(--xt-bg-page) !important;
}
/* 二级菜单项同款胶囊 */
.layui-side-white .layui-nav-child dd a,
.layui-side-menu .layui-nav-child dd a {
margin: 0 8px;
border-radius: 8px;
}
/* 菜单图标默认灰 */
.layui-side-menu .layui-nav-item > a .iconfont,
.layui-side-menu .layui-nav-item > a .layui-icon,
.layui-side-white .layui-nav-item > a .iconfont,
.layui-side-white .layui-nav-item > a .layui-icon { color: #B3BCC9 !important; }
/* hover 时图标同步 */
.layui-side-white .layui-nav-item > a:hover .iconfont,
.layui-side-white .layui-nav-item > a:hover .layui-icon,
.layui-side-menu .layui-nav-item > a:hover .iconfont,
.layui-side-menu .layui-nav-item > a:hover .layui-icon { color: var(--xt-brand) !important; }
/* 选中态：浅蓝胶囊 + 品牌蓝字
注意：menu_classical 把 .layui-this 打在 上（非 li），两种形态都覆盖；
旧样式为深色底设计（color:#fff!important + 半透明蓝底），必须用 !important 压过 */
.layui-side-white .layui-nav-item a.layui-this,
.layui-side-white .layui-nav-item a.layui-this:hover,
.layui-side-white .layui-nav-child dd a.layui-this,
.layui-side-white .layui-nav-child dd a.layui-this:hover,
.layui-side-white .layui-this > a,
.layui-side-white .layui-this > a:hover,
.layui-side-menu .layui-this > a,
.layui-side-menu .layui-this > a:hover,
.layui-side-white .layui-nav-child dd.layui-this,
.layui-side-white .layui-nav-child dd.layui-this a,
.layui-side-menu .layui-nav-child dd.layui-this,
.layui-side-menu .layui-nav-child dd.layui-this a {
background: var(--xt-brand-light) !important;
color: var(--xt-brand) !important;
font-weight: 600;
border-left: none !important;
}
.layui-side .layui-this > a .iconfont,
.layui-side .layui-this > a .layui-icon,
.layui-side-white .layui-nav-item a.layui-this .iconfont,
.layui-side-white .layui-nav-item a.layui-this .layui-icon,
.layui-side-white .layui-nav-child dd a.layui-this .iconfont,
.layui-side-white .layui-nav-child dd a.layui-this .layui-icon { color: var(--xt-brand) !important; }
/* 隐藏右侧滑动指示条（选中态已用胶囊表达） */
.gg-layout .layui-side .layui-nav-bar { display: none; }
/* 导航容器：layout.css 给 铺了 !important 深蓝渐变，必须显式透明化 */
.layui-side-white .layui-nav,
.layui-side-menu .layui-nav { background: transparent !important; }
/* 展开态父项（如"员工管理"展开时）：layout.css 的 `.layui-side-white .layui-nav .layui-nav-itemed>a`
（多一个 .layui-nav，特异度高我们一档）给了 color:#fff!important，浅色主题下白字白底不可见。
必须升到同特异度 (0,3,1) + 更晚加载才能覆盖；选中态（a.layui-this）再加一档恢复品牌蓝 */
.layui-side-white .layui-nav .layui-nav-itemed > a,
.layui-side-menu .layui-nav .layui-nav-itemed > a {
color: var(--xt-text-2) !important;
background: transparent !important;
}
.layui-side-white .layui-nav .layui-nav-itemed > a.layui-this,
.layui-side-menu .layui-nav .layui-nav-itemed > a.layui-this,
.layui-side-white .layui-nav .layui-this.layui-nav-itemed > a,
.layui-side-menu .layui-nav .layui-this.layui-nav-itemed > a {
color: var(--xt-brand) !important;
background: var(--xt-brand-light) !important;
}
.layui-side-white .layui-nav .layui-nav-itemed > a .iconfont,
.layui-side-white .layui-nav .layui-nav-itemed > a .layui-icon,
.layui-side-menu .layui-nav .layui-nav-itemed > a .iconfont,
.layui-side-menu .layui-nav .layui-nav-itemed > a .layui-icon { color: #B3BCC9 !important; }
/* 展开的子菜单容器：旧样式 #0a1e3a!important，同特异度压过 */
.layui-side-white .layui-nav-itemed > .layui-nav-child,
.layui-side-menu .layui-nav-itemed > .layui-nav-child,
.layui-nav-tree .layui-nav-itemed > .layui-nav-child { background: #fff !important; }
/* 二级菜单白底 */
.layui-side-menu .layui-nav-child,
.layui-side-white .layui-nav-child,
.layui-nav-tree .layui-nav-child { background: #fff !important; }
.layui-side-menu .layui-nav-child dd a,
.layui-side-white .layui-nav-child dd a { color: var(--xt-text-3) !important; }
.layui-side-menu .layui-nav-child dd a:hover,
.layui-side-white .layui-nav-child dd a:hover { color: var(--xt-brand) !important; background: var(--xt-bg-page) !important; }
/* 展开箭头 */
.layui-side-menu .layui-nav-more,
.layui-side-white .layui-nav-more { color: #C4C9D4; }
/* ---------- 4. 页签栏 ---------- */
.page-tabs {
background: #fff !important;
border-bottom: 1px solid var(--xt-line-soft);
box-shadow: none;
}
.page-tabs .gg-tabs-control { border-left: 1px solid var(--xt-line-soft); color: var(--xt-text-3); }
.page-tabs .gg-tabs-control:hover { background-color: var(--xt-bg-page); color: var(--xt-brand); }
/* 页签：旧样式对 li 有 white 色 + #1e3a6e 深蓝底等多条 !important（layout.css 266-272 行），
必须同特异度 + !important 逐一压过 */
.gg-admin-tab .layui-tab-title li,
.page-tabs .layui-tab-title li {
color: var(--xt-text-3) !important;
font-size: 13px;
border-bottom-color: transparent !important;
}
.gg-admin-tab .layui-tab-title li:hover,
.page-tabs .layui-tab-title li:hover {
color: var(--xt-text-2) !important;
background-color: var(--xt-bg-page) !important;
}
.gg-admin-tab .layui-tab-title li.layui-this,
.page-tabs .layui-tab-title li.layui-this {
color: var(--xt-brand) !important;
background-color: var(--xt-brand-light) !important;
border-bottom-color: transparent !important;
border-radius: 6px;
}
/* 隐藏旧的蓝色小条（胶囊选中态已表达；layui 默认 :after 滑条全状态隐藏） */
.gg-admin-tab .layui-tab-title li:after,
.page-tabs .layui-tab-title li:after { display: none !important; }
/* 页签「▾」下拉里的选中项 */
.page-tabs .gg-tabs-select.layui-nav .layui-nav-child dd.layui-this,
.page-tabs .gg-tabs-select.layui-nav .layui-nav-child dd.layui-this a {
background-color: var(--xt-brand-light) !important;
color: var(--xt-brand) !important;
}
/* ---------- 4b. 内容页页签（旧版 layui-tab-brief / 新版 layui-tabs 组件） ----------
选中态统一为品牌蓝：替换 layui 默认青绿 #16baaa/#16b777 与 gougu 旧蓝 #1A75FF。
这两类页签出现在各列表/详情页内容区（如 职务/职级、项目详情多页签）。 */
.layui-tab-brief > .layui-tab-title .layui-this,
.layui-tabs-header .layui-this,
.layui-tabs-header li:hover {
color: var(--xt-brand) !important;
}
.layui-tab-brief > .layui-tab-title .layui-this:after,
.layui-tab-brief > .layui-tab-more li.layui-this:after {
border: none !important;
border-radius: 0 !important;
border-bottom: 2px solid var(--xt-brand) !important;
}
.layui-tabs-header .layui-this:after {
border: none !important;
border-radius: 0 !important;
border-bottom: 3px solid var(--xt-brand) !important;
}
/* ---------- 5. 内容区 ---------- */
.gg-layout .layui-body { background: var(--xt-bg-page); }
.layui-body iframe { background: var(--xt-bg-page); }
/* ---------- 6. 按钮 ----------
⚠ 关键机制：layui.css 由 layui.js 动态注入到 head 末尾（在 theme.css 之后加载），
凡与 layui 默认样式的竞争项必须带 !important，否则被青色默认值 #16baaa 压过。
本区所有底色 / 圆角 / 内边距均按此处理。 */
.layui-btn {
background-color: var(--xt-brand) !important;
border-radius: 6px !important;
transition: background-color .15s;
}
.layui-btn:hover { background-color: var(--xt-brand-hover) !important; opacity: 1; }
.layui-btn-normal { background-color: var(--xt-brand) !important; }
.layui-btn-normal:hover { background-color: var(--xt-brand-hover) !important; }
.layui-btn-warm { background-color: var(--xt-orange) !important; }
.layui-btn-warm:hover { background-color: #D8961C !important; }
.layui-btn-danger { background-color: var(--xt-red) !important; }
.layui-btn-danger:hover { background-color: #C21010 !important; }
.layui-btn-primary {
background-color: #fff !important;
border-color: var(--xt-line) !important;
color: var(--xt-text-2) !important;
}
.layui-btn-primary:hover {
background-color: #fff !important;
border-color: var(--xt-brand) !important;
color: var(--xt-brand) !important;
}
/* 清空/重置类按钮：白底灰字（gougu 原设计）。内边距必须恢复 8px——
layui 默认 18px 会把该按钮撑到 66px 宽，导致"搜索+清空"在 150px 按钮容器里换行堆叠 */
.layui-btn-reset {
background-color: #fff !important;
color: var(--xt-text-2) !important;
padding: 0 8px !important;
}
.layui-btn-reset:hover {
background-color: #fff !important;
color: var(--xt-brand) !important;
}
.layui-btn-disabled,
.layui-btn-disabled:hover { background-color: #A8C7FA !important; }
/* layui 内置色块类（表格操作列等大量使用） */
.layui-bg-blue { background-color: var(--xt-brand) !important; }
.layui-bg-green { background-color: var(--xt-green) !important; }
.layui-bg-red { background-color: var(--xt-red) !important; }
.layui-bg-orange { background-color: var(--xt-orange) !important; }
/* ---------- 7. 表格 ---------- */
.layui-table { color: var(--xt-text-1); }
.layui-table-view { border-color: var(--xt-line-soft); border-radius: 8px; }
.layui-table-header,
.layui-table thead tr { background-color: #FAFBFC; }
.layui-table th,
.layui-table-header .layui-table-cell { color: #7A8699; font-weight: 600; }
.layui-table th, .layui-table td { border-color: var(--xt-line-soft); }
.layui-table tbody td { border-color: #F5F7FA; }
.layui-table-hover,
.layui-table tbody tr:hover { background-color: #F8FBFF !important; }
.layui-table-cell { font-size: 14px; }
/* 静态表单小表格（add/edit 页的 layui-table-min）同步字号 */
.layui-table-min th,
.layui-table-min td { font-size: 14px !important; }
.layui-table-tool { background-color: #fff; border-color: var(--xt-line-soft); }
.layui-table-page { background-color: #fff; border-top: 1px solid var(--xt-line-soft); }
.layui-table-view .layui-table[lay-skin=line] { border-color: var(--xt-line-soft); }
/* ---------- 8. 表单（同按钮区机制：layui.css 最后加载，竞争项必须 !important） ---------- */
.layui-input, .layui-textarea, .layui-select, .layui-input-split {
border-color: var(--xt-line) !important;
border-radius: 6px !important;
color: var(--xt-text-1) !important;
transition: border-color .15s, box-shadow .15s;
}
.layui-input:hover, .layui-textarea:hover { border-color: #C4C9D4 !important; }
/* 搜索栏按钮容器多为固定窄宽（150px）。"搜索"90px + 标签间空白 ≈4.5px + 10px 外边距 + "清空"46px
≈ 150.5px，恰好超出 1px 就换行堆叠——禁止容器内换行，多出的零点几像素溢出不可见 */
.gg-form-bar .layui-input-inline { white-space: nowrap; }
/* 搜索栏内标题（如"全国省市区"）：清掉浏览器 h3 默认外边距，避免撑高错位 */
.gg-form-bar h3 {
margin: 0;
font-size: 16px;
font-weight: 700;
color: var(--xt-text-1);
}
.layui-input:focus, .layui-textarea:focus {
border-color: var(--xt-brand) !important;
box-shadow: 0 0 0 3px rgba(24, 113, 252, .10) !important;
background: #fff;
}
.layui-form-label { color: var(--xt-text-2); }
.layui-form-select dl dd.layui-this { background-color: var(--xt-brand) !important; }
.layui-form-select dl dd:hover { background-color: var(--xt-bg-page) !important; }
.layui-form-checkbox[lay-skin=primary]:hover i { border-color: var(--xt-brand) !important; }
.layui-form-checked[lay-skin=primary] i {
border-color: var(--xt-brand) !important;
background-color: var(--xt-brand) !important;
}
/* 默认皮肤（无 lay-skin）的复选框选中态同样置品牌色 */
.layui-form-checked i {
border-color: var(--xt-brand) !important;
background-color: var(--xt-brand) !important;
}
.layui-form-checkbox[lay-skin=primary] span { color: var(--xt-text-2); }
.layui-form-checked[lay-skin=primary] span { color: var(--xt-brand) !important; }
.layui-form-radio > i:hover, .layui-form-radioed > i { color: var(--xt-brand) !important; }
.layui-form-onswitch { background-color: var(--xt-brand) !important; border-color: var(--xt-brand) !important; }
/* ---------- 9. 分页 ---------- */
.layui-laypage a, .layui-laypage span {
border-color: var(--xt-line) !important;
color: var(--xt-text-2) !important;
border-radius: 6px !important;
}
.layui-laypage a:hover { color: var(--xt-brand) !important; }
.layui-laypage .layui-laypage-curr .layui-laypage-em {
background-color: var(--xt-brand) !important;
border-radius: 6px !important;
}
.layui-laypage .layui-laypage-curr em { color: #fff !important; }
.layui-laypage select { border-color: var(--xt-line) !important; border-radius: 4px !important; }
/* ---------- 10. 弹窗（layer） ---------- */
.layui-layer { border-radius: 10px !important; box-shadow: 0 12px 40px rgba(23, 33, 56, .18) !important; }
.layui-layer-title {
background: #fff !important;
border-bottom: 1px solid var(--xt-line-soft) !important;
color: var(--xt-text-1) !important;
font-weight: 700;
}
.layui-layer-btn { border-top: 1px solid var(--xt-line-soft) !important; }
.layui-layer-btn .layui-layer-btn0 {
background-color: var(--xt-brand) !important;
border-color: var(--xt-brand) !important;
border-radius: 6px;
}
.layui-layer-btn a { border-radius: 6px !important; }
.layui-layer-msg, .layui-layer-tips i.layui-layer-TipsB { border-radius: 8px !important; }
/* ---------- 11. 徽标/提示 ---------- */
.layui-badge { border-radius: 999px; }
.layui-badge-rim { border-radius: 999px; }
/* ---------- 12. gougu 状态色工具类对齐品牌（原为旧蓝 #1A75FF / 旧绿 #16b777 / 旧红 #FF5823） ---------- */
.layui-color-1, .status-color-2, .check-status-color-2 { color: var(--xt-green) !important; } /* 成功/已通过 */
.layui-color-2, .status-color-1, .check-status-color-1 { color: var(--xt-brand) !important; } /* 进行中 */
.layui-color-4 { color: var(--xt-orange) !important; } /* 橙 */
.layui-color-5, .status-color-0 { color: var(--xt-red) !important; } /* 红 */
.check-status-color-0 { color: var(--xt-orange) !important; } /* 待提交 */
.check-status-color-3 { color: var(--xt-red) !important; } /* 已拒绝 */
/* ============================================================
* 精修区（2026-09-18）：操作按钮链接化 / 侧栏密度 / 表格行高 / 焦点兜底
* ============================================================ */
/* ---------- 14. 表格操作按钮：实心色块 → 文字链接风（现代后台标准做法） ---------- */
.layui-table-view .layui-btn-xs,
.layui-table-cell .layui-btn-xs {
height: 28px !important;
line-height: 28px !important;
padding: 0 10px !important;
background: transparent !important;
border: none !important;
border-radius: 6px;
color: var(--xt-brand) !important;
font-size: 13px !important;
font-weight: 500;
transition: background-color .15s;
}
.layui-table-view .layui-btn-xs:hover,
.layui-table-cell .layui-btn-xs:hover {
background: var(--xt-brand-light) !important;
color: var(--xt-brand) !important;
}
/* 删除/危险类 → 红字 + 浅红底 hover */
.layui-table-view .layui-btn-danger,
.layui-table-cell .layui-btn-danger,
.layui-table-view .layui-btn.layui-bg-red,
.layui-table-view .layui-btn.layui-bg-orange,
.layui-table-cell .layui-btn.layui-bg-red,
.layui-table-cell .layui-btn.layui-bg-orange {
background: transparent !important;
color: var(--xt-red) !important;
}
.layui-table-view .layui-btn-danger:hover,
.layui-table-cell .layui-btn-danger:hover,
.layui-table-view .layui-btn.layui-bg-red:hover,
.layui-table-view .layui-btn.layui-bg-orange:hover {
background: var(--xt-red-light) !important;
color: var(--xt-red) !important;
}
/* 表格内其它功能按钮（复制/重置密码等）统一浅灰描边 */
.layui-table-view .layui-btn-xs.layui-btn-normal,
.layui-table-view .layui-btn-xs.layui-bg-green {
background: transparent !important;
color: var(--xt-brand) !important;
}
/* ---------- 15. 侧栏密度与层级 ---------- */
.layui-side-white .layui-nav { padding-top: 6px !important; }
.layui-side-white .layui-nav-item > a,
.layui-side-menu .layui-nav-item > a {
height: 48px !important;
line-height: 48px !important;
}
.layui-side-white .layui-nav-child { padding: 2px 0 10px !important; }
.layui-side-white .layui-nav-child dd a,
.layui-side-menu .layui-nav-child dd a {
height: 38px !important;
line-height: 38px !important;
font-size: 13px !important;
padding-left: 46px !important;
}
/* 一级菜单图标定位：layout.css 对该图标同时挂着两套打架的规则——
① 绝对定位 left:16px / margin-top:-25px（按 50px 行高校准）；② 浮动 18px 宽 / 46px 行高。
本主题把行高改成 48px 后 -25px 失配（图标整体偏移），且 left:16px 与文字(padding-left:32px)重叠。
此处统一为确定性方案：绝对定位 + top:50% + 半个字高上移 = 精确垂直居中；文字左内边距让出图标区。 */
.layui-side-white .layui-nav-item > a,
.layui-side-menu .layui-nav-item > a { padding-left: 48px !important; }
.layui-side-white .layui-nav-item > a > .iconfont,
.layui-side-white .layui-nav-item > a > .layui-icon {
position: absolute !important;
float: none !important;
left: 18px !important;
top: 50% !important;
width: auto !important;
height: auto !important;
line-height: 1 !important;
margin: -9px 0 0 0 !important;
}
/* ---------- 16. 表格行高与表头密度（仅数据表格；静态表格保持原内边距） ---------- */
.layui-table-cell {
height: 40px !important;
line-height: 40px !important;
padding: 0 12px !important;
}
.layui-table-header .layui-table-cell { height: 42px !important; line-height: 42px !important; }
.layui-table-view .layui-table td,
.layui-table-view .layui-table th { padding: 0 !important; }
/* ---------- 17. 侧栏焦点/杂线兜底（消除浏览器焦点框与残余指示条） ---------- */
.layui-side .layui-nav-bar { display: none !important; }
.layui-side a:focus,
.layui-side a:focus-visible,
.layui-side a:active { outline: none !important; box-shadow: none !important; }
/* ---------- 18. 登录页（覆盖 login/index.html 内联样式，link 需在其后） ---------- */
html, body {
background: linear-gradient(135deg, #EAF3FF 0%, #F5F8FF 45%, #EEF4FF 100%) !important;
}
#container {
background: radial-gradient(ellipse at top left, rgba(24, 113, 252, .08) 0%, transparent 50%),
radial-gradient(ellipse at bottom right, rgba(109, 165, 253, .08) 0%, transparent 50%) !important;
}
.login-wrap {
box-shadow: 0 25px 60px rgba(24, 113, 252, .13), 0 0 0 1px rgba(24, 113, 252, .06) !important;
}
.login-side {
background: linear-gradient(135deg, var(--xt-brand) 0%, #3B82F6 100%) !important;
}
.login-side::after {
background: linear-gradient(135deg, rgba(24, 113, 252, .55) 0%, rgba(21, 88, 214, .35) 100%) !important;
}
.login-box .top .brand-name { color: var(--xt-text-1) !important; }
.login-box .top .brand-desc { color: var(--xt-text-3) !important; }
.login-box .layui-input {
border: 1px solid var(--xt-line) !important;
background: #FBFCFE !important;
border-radius: 10px !important;
}
.login-box .layui-input:focus {
border-color: var(--xt-brand) !important;
box-shadow: 0 0 0 3px rgba(24, 113, 252, .10) !important;
background: #fff !important;
}
.login-box .layui-btn {
background: var(--xt-brand) !important;
box-shadow: 0 4px 12px rgba(24, 113, 252, .25) !important;
}
.login-box .layui-btn:hover {
background: var(--xt-brand-hover) !important;
box-shadow: 0 6px 20px rgba(24, 113, 252, .32) !important;
}
.captcha_img img { border: 1px solid var(--xt-line) !important; }
/* ---------- 19. 按钮组（layui-btn-group）拼合圆角修补 ----------
全局 .layui-btn 圆角 6px !important 会压掉 layui 对组内首尾按钮的拼合处理，
导致组内每个按钮都呈独立圆角（连体按钮组穿帮） */
.layui-btn-group .layui-btn:first-child { border-radius: 6px 0 0 6px !important; }
.layui-btn-group .layui-btn:last-child { border-radius: 0 6px 6px 0 !important; }
.layui-btn-group .layui-btn:only-child { border-radius: 6px !important; }
/* ---------- 20. 侧栏加宽 180 → 200（菜单文字空间不足，长标题被挤） ----------
宽度分散在 layout.css 多处（容器/logo/菜单 ul/内容区 left），需成套覆盖；
各收缩/展开菜单模式（side-spread / side-spread-sm / layout-menu-expand）随后逐一回补原值，
同特异度 !important 规则按书写顺序后者生效，回补必须在本块中位于加宽规则之后 */
.gg-layout .layui-side { width: 200px !important; }
.gg-layout .layui-logo { width: 200px !important; }
.layui-side-menu .layui-nav { width: 200px !important; }
.gg-layout .page-tabs,
.gg-layout .layui-body,
.gg-layout .layui-footer,
.gg-layout .layui-layout-left { left: 200px !important; }
/* 展开型菜单模式：恢复 120 / 240 */
.layout-menu-expand .page-tabs,
.layout-menu-expand .layui-body,
.layout-menu-expand .layui-footer,
.layout-menu-expand .layui-layout-left { left: 120px !important; }
.layout-menu-expand .layui-body.expand-menu { left: 240px !important; }
/* 侧栏收缩态：恢复 52 */
.side-spread .layui-side { width: 52px !important; }
.side-spread .gg-layout .layui-logo { width: 52px !important; }
.side-spread .layui-side .layui-nav { width: 52px !important; }
.side-spread .page-tabs,
.side-spread .gg-layout .layui-body,
.side-spread .gg-layout .layui-footer,
.side-spread .gg-layout .layui-layout-left { left: 52px !important; }
.side-spread .layout-menu-expand .layui-body.expand-menu { left: 172px !important; }
.side-spread-sm .page-tabs,
.side-spread-sm .gg-layout .layui-body,
.side-spread-sm .gg-layout .layui-footer,
.side-spread-sm .gg-layout .layui-layout-left { left: 0 !important; }
/* 菜单文字超宽时以省略号收尾（原为硬裁断字） */
.layui-side-white .layui-nav-item a { text-overflow: ellipsis !important; }
/* ---------- 21. expand 双栏菜单模式专项修补 ----------
本系统 menu_mode=expand：左栏=顶级菜单，右栏=gg-second-menu 二级栏 */
/* A. 顶栏图标统一可见：左侧"伸缩 / 清空缓存"图标沿用旧深色底的白字色，白底上几乎不可见 */
.gg-head-item i.layui-icon { color: var(--xt-text-3) !important; font-weight: 400 !important; }
.gg-head-item i.layui-icon:hover { color: var(--xt-brand) !important; }
/* B. "无子菜单的顶级项"（menu_expand 模板输出 li.menu-li，不带 layui-nav-item，如"员工培训"）：
旧样式给的是 rgba(255,255,255,.75) 白字（为深色底设计）→ 白底白字完全不可见，
表现成一行"空白占位"。此处补齐与带子菜单顶级项完全一致的主题样式（48px 胶囊行） */
.layui-side-white .menu-li > a,
.layui-side-menu .menu-li > a {
color: var(--xt-text-1) !important;
background: transparent !important;
font-size: 13.5px !important;
margin: 0 8px;
border-radius: 8px;
height: 48px !important;
line-height: 48px !important;
padding-left: 48px !important;
}
.layui-side-white .menu-li > a:hover,
.layui-side-menu .menu-li > a:hover {
color: var(--xt-brand) !important;
background: var(--xt-bg-page) !important;
}
.layui-side-white .menu-li > a > .iconfont,
.layui-side-white .menu-li > a > .layui-icon,
.layui-side-menu .menu-li > a > .iconfont,
.layui-side-menu .menu-li > a > .layui-icon {
position: absolute !important;
float: none !important;
left: 18px !important;
top: 50% !important;
width: auto !important;
height: auto !important;
line-height: 1 !important;
margin: -9px 0 0 0 !important;
font-size: 18px !important;
font-weight: 600 !important;
color: #B3BCC9 !important;
}
.layui-side-white .menu-li > a:hover > .iconfont,
.layui-side-white .menu-li > a:hover > .layui-icon,
.layui-side-menu .menu-li > a:hover > .iconfont,
.layui-side-menu .menu-li > a:hover > .layui-icon {
color: var(--xt-brand) !important;
}
/* C. 二级栏 gg-second-menu：紧随左栏（left 160）+ 宽 130、左右留白 16px */
.layui-side-expand .menu-li .gg-second-menu { left: 160px !important; width: 130px !important; }
.layui-side-expand .menu-li .gg-second-menu dt strong { padding-left: 16px !important; padding-right: 16px !important; }
.layui-side-expand .menu-li .gg-second-menu dd a { padding-left: 16px !important; padding-right: 16px !important; }
/* D. 顶栏左侧图标组（伸缩 / 清空缓存）与 logo 拉开间距 */
.layout-menu-expand .layui-layout-left { left: 150px !important; }
/* E. expand 模式几何：左栏收窄到 160px（贴合菜单文字宽度，不再留大片空白）；
内容区从 160 开始（不被左栏白底遮挡）；二级栏 160 起、宽 130；
二级栏展开态（.expand-menu）内容区 = 160 + 130 = 290 */
.layout-menu-expand .layui-side,
.layout-menu-expand .gg-layout .layui-logo { width: 160px !important; }
.layout-menu-expand .page-tabs,
.layout-menu-expand .layui-body,
.layout-menu-expand .layui-footer { left: 160px !important; }
.layout-menu-expand .layui-body.expand-menu { left: 290px !important; }
/* 收缩态（side-spread / side-spread-sm）在最后重新压回原值，避免被上面的 expand 规则盖掉 */
.side-spread .layui-side { width: 52px !important; }
.side-spread .layout-menu-expand .gg-layout .layui-logo { width: 52px !important; }
.side-spread .layui-side-expand .menu-li .gg-second-menu { left: 52px !important; }
.side-spread .page-tabs,
.side-spread .gg-layout .layui-body,
.side-spread .gg-layout .layui-footer { left: 52px !important; }
.side-spread .layout-menu-expand .layui-body.expand-menu { left: 182px !important; }
.side-spread-sm .page-tabs,
.side-spread-sm .gg-layout .layui-body,
.side-spread-sm .gg-layout .layui-footer { left: 0 !important; }
/* ---------- 22. 按钮字号统一 ----------
普通按钮 14px 保持；sm / xs 从 layui 默认 12px 提到 13px，
与表格正文 14px、表内操作按钮 13px 组成同一字阶体系，整体不显碎 */
.layui-btn-sm,
.layui-btn-xs { font-size: 13px !important; }