/* =====================================================================
 * OA 系统 PC 端 UI 优化覆盖层 (oa-ui-polish.css)
 * ---------------------------------------------------------------------
 * 设计目标：在不修改任何 .vue 源码 / 菜单结构的前提下，统一并提升
 * PC 端视觉表现。本文件通过 Nginx sub_filter 注入 <link> 加载，
 * 每次前端重新部署后依然生效（零源码改动）。
 *
 * 作用范围：
 *   1. 统一 Element Plus 主题色（之前按钮橙色、开关/复选/标签/分页等仍是蓝）
 *   2. 中文排版字体栈 + 基础可读性
 *   3. 按钮 / 卡片 / 对话框 / 标签 的轻量质感与微交互
 *   4. 表格数字对齐与可读性
 *   5. 键盘焦点可达性（a11y）
 *   6. 侧边栏对比度与激活态（仅视觉，不改菜单项/顺序）
 *
 * 注意：侧边栏样式在 MainLayout.vue 中以 scoped 形式存在，本文件用
 *   !important 覆盖其非 important 声明，仅调整视觉，不改变 DOM/菜单。
 * ===================================================================== */

/* ========== 1. Element Plus 主题色统一（橙系） ========== */
:root {
  /* 主色（与现有 OA 主按钮 #ff6a00 保持一致） */
  --el-color-primary: #ff6a00;
  --el-color-primary-light-3: #ff974d; /* hover / 次强调 */
  --el-color-primary-light-5: #ffb580;
  --el-color-primary-light-7: #ffd2b3;
  --el-color-primary-light-8: #ffe1cc;
  --el-color-primary-light-9: #fff0e6; /* 极浅底，用于选中背景 */
  --el-color-primary-dark-2: #cc5500;  /* active / pressed */

  /* 让链接、滑块、步骤条等也跟随主色 */
  --el-color-link: #ff6a00;

  /* 圆角尺度（与现有 6/8/12 体系对齐，避免组件间圆角不一致） */
  --el-border-radius-base: 6px;
  --el-border-radius-small: 4px;
  --el-border-radius-round: 14px;

  /* 中性底色微调：内容区更干净 */
  --el-bg-color-page: #f5f6f8;

  /* ============ 设计令牌：中性灰阶（全站统一，消除各组件灰色不一致） ============ */
  --oa-text-1: #1f2d3d;   /* 标题 / 主文本 */
  --oa-text-2: #3d4f63;   /* 常规正文 */
  --oa-text-3: #6b7e90;   /* 次要说明 */
  --oa-text-4: #9aa9b8;   /* 占位 / 极弱 */
  --oa-border: #e7ebf0;   /* 主分割线 */
  --oa-border-soft: #eef1f5; /* 浅分割线 */
  --oa-surface: #ffffff;  /* 卡片 / 浮层 */
  --oa-bg: #f4f6f9;       /* 页面底 */
  --oa-fill-hover: #f6f8fb; /* 列表悬浮浅底 */

  /* ============ 设计令牌：字号梯度（统一层级，避免大小混乱） ============ */
  --oa-fs-xs: 12px;
  --oa-fs-sm: 13px;
  --oa-fs-base: 14px;
  --oa-fs-md: 15px;
  --oa-fs-lg: 16px;
  --oa-fs-xl: 18px;
  --oa-fs-2xl: 20px;
  --oa-fs-3xl: 24px;
  --oa-lh-tight: 1.35;
  --oa-lh-base: 1.6;

  /* ============ 设计令牌：间距梯度（4 的倍数，统一留白节奏） ============ */
  --oa-sp-1: 4px;
  --oa-sp-2: 8px;
  --oa-sp-3: 12px;
  --oa-sp-4: 16px;
  --oa-sp-5: 20px;
  --oa-sp-6: 24px;
  --oa-sp-8: 32px;

  /* ============ 设计令牌：阴影（柔和分层，统一层次感） ============ */
  --oa-shadow-sm: 0 1px 4px rgba(16, 24, 40, 0.05);
  --oa-shadow-md: 0 6px 20px rgba(16, 24, 40, 0.08);
  --oa-shadow-lg: 0 14px 48px rgba(16, 24, 40, 0.16);
}

/* 覆盖 Element Plus 使用主色的关键组件（无需改组件代码即生效） */
.el-link.el-link--primary { --el-link-text-color: #ff6a00; }
.el-checkbox__input.is-checked .el-checkbox__inner,
.el-checkbox__input.is-indeterminate .el-checkbox__inner {
  background-color: #ff6a00;
  border-color: #ff6a00;
}
.el-radio__input.is-checked .el-radio__inner {
  background-color: #ff6a00;
  border-color: #ff6a00;
}
.el-switch.is-checked .el-switch__core { background-color: #ff6a00; border-color: #ff6a00; }
.el-tabs__active-bar { background-color: #ff6a00; }
.el-tabs__item.is-active { color: #ff6a00; }
.el-tabs__item:hover { color: #ff974d; }
.el-pagination .el-pager li.is-active { color: #ff6a00; }
.el-pagination .el-pager li:hover { color: #ff6a00; }
.el-tree-node__expand-icon:hover,
.el-tree-node.is-current > .el-tree-node__content { color: #ff6a00; }
.el-step__head.is-process,
.el-step__head.is-finish { color: #ff6a00; border-color: #ff6a00; }
.el-slider__bar { background-color: #ff6a00; }
.el-slider__button { border-color: #ff6a00; }
.el-rate { --el-rate-fill-color: #ff6a00; }
.el-progress__text { color: #ff6a00; }

/* ========== 2. 中文排版字体栈 + 基础可读性 ========== */
body,
.el-body,
#app {
  font-family: 'PingFang SC', 'Microsoft YaHei', '微软雅黑',
    -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue',
    'Hiragino Sans GB', 'WenQuanYi Micro Hei', Arial, sans-serif !important;
  /* 数字与英文用更整齐的等宽数字，数据表格更专业 */
  font-variant-numeric: tabular-nums;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.el-main,
.main-content { line-height: 1.6; }

/* 表单标签与正文基准字号统一（PC 端 14px 更舒适） */
.el-form-item__label { font-size: 14px; color: #303133; }
.el-descriptions__label { font-weight: 600; }

/* ========== 3. 按钮：质感 + 微交互 ========== */
.el-button {
  border-radius: 6px !important;
  font-weight: 500 !important;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
  -webkit-tap-highlight-color: transparent;
}
.el-button:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(255, 106, 0, 0.18); }
.el-button:active { transform: translateY(0) scale(0.97); box-shadow: none; }

/* 主按钮：沿用现有橙色渐变，统一圆角与悬浮 */
.el-button--primary {
  background: linear-gradient(135deg, #ff8a65, #ff6a00) !important;
  border-color: #ff6a00 !important;
  color: #fff !important;
}
.el-button--primary:hover {
  background: linear-gradient(135deg, #ff9a75, #ff7a20) !important;
  box-shadow: 0 6px 16px rgba(255, 106, 0, 0.28);
}
.el-button--primary:active { background: linear-gradient(135deg, #ff7a45, #cc5500) !important; }

/* 文字/链接/朴素变体：不能强制白字+渐变底，否则在白色卡片上不可见 */
.el-button--primary.is-text,
.el-button--primary.is-link,
.el-button--primary.el-button--text {
  background: transparent !important;
  border-color: transparent !important;
  color: var(--el-color-primary) !important;
  box-shadow: none !important;
}
.el-button--primary.is-text:hover,
.el-button--primary.is-link:hover,
.el-button--primary.el-button--text:hover {
  color: #ff974d !important;
  background: rgba(255, 106, 0, 0.08) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* 朴素按钮保留边框 */
.el-button--primary.is-plain {
  background: transparent !important;
  border-color: currentColor !important;
  color: var(--el-color-primary) !important;
  box-shadow: none !important;
}
.el-button--primary.is-plain:hover {
  color: #ff974d !important;
  background: rgba(255, 106, 0, 0.08) !important;
  border-color: currentColor !important;
  box-shadow: none !important;
}

/* 次要/朴素按钮悬浮也用主色淡底，保持体系 */
.el-button--default:hover,
.el-button--info:hover {
  color: #ff6a00 !important;
  border-color: #ffb580 !important;
  background-color: #fff0e6 !important;
}

/* ========== 4. 卡片 / 对话框 / 标签 一致性 ========== */
.el-card {
  border-radius: 10px !important;
  border: 1px solid #ebeef5 !important;
  box-shadow: 0 1px 4px rgba(16, 24, 40, 0.04) !important;
  transition: box-shadow 0.3s ease, transform 0.2s ease !important;
}
.el-card:hover { box-shadow: 0 8px 24px rgba(16, 24, 40, 0.08) !important; }

:where(.el-card__header) {
  font-weight: 600;
  color: #1f2d3d;
  border-bottom: 1px solid #f0f2f5 !important;
  padding: 16px 20px;
}

.el-dialog {
  border-radius: 14px !important;
  overflow: hidden;
  box-shadow: 0 12px 48px rgba(16, 24, 40, 0.18) !important;
}
.el-dialog__header {
  padding: 20px 24px 16px !important;
  border-bottom: 1px solid #f0f2f5;
  margin-right: 0 !important;
}
.el-dialog__title { font-weight: 600; color: #1f2d3d; }
.el-dialog__body { padding: 20px 24px !important; max-height: 70vh; overflow-y: auto; }

.el-tag { border-radius: 5px !important; font-weight: 500; }
.el-tag--plain { background: #fff !important; }

.el-dropdown-menu {
  border-radius: 10px !important;
  box-shadow: 0 8px 28px rgba(16, 24, 40, 0.12) !important;
  padding: 6px !important;
}
.el-dropdown-menu__item:not(.is-disabled):hover { background-color: #fff0e6 !important; color: #ff6a00 !important; }

.el-message,
.el-notification { border-radius: 10px !important; }

/* ========== 5. 表格：数字对齐 + 可读性 ========== */
.el-table {
  border-radius: 10px;
  overflow: hidden;
  --el-table-border-color: #eef0f3;
}
.el-table th.el-table__cell {
  background: #fafbfc !important;
  font-weight: 700 !important;
  color: #1f2d3d !important;
  font-size: 12.5px !important;
  border-bottom: 2px solid #ebeef5 !important;
}
.el-table td.el-table__cell,
.el-table td .cell { font-size: 13px !important; color: #303133; }
/* 数字列更整齐（金额/数量等） */
.el-table .cell { font-variant-numeric: tabular-nums; }
.el-table .el-table__row:hover > td.el-table__cell { background-color: #fff6ef !important; }
.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell { background: #fcfcfd !important; }

/* 表格单元格：默认最多显示两行，超出省略（公司名称/客户名称等）
   需要完整展开的列单独覆盖 */
.el-table .cell {
  white-space: normal !important;
  word-break: break-word !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

/* 表头：无 tooltip 内容，强制单行 */
.el-table th.el-table__cell .cell {
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: block !important;
  -webkit-line-clamp: unset !important;
}

/* 全局：第2列（通常为序号/ID）强制单行不换行 */
.el-table__body td:nth-child(2) .cell {
  white-space: nowrap !important;
  word-break: keep-all !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: block !important;
  -webkit-line-clamp: unset !important;
}

/* 长文本列（源码设 show-overflow-tooltip → .cell 带 el-tooltip 类）：同样最多两行 */
.el-table .cell.el-tooltip {
  white-space: normal !important;
  word-break: break-word !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
  width: auto !important;
}

/* =====================================================================
 * 跟进计划：「计划名称」列完整换行显示（零源码改动）
 * JS 通过表头文本定位该列并添加 .oa-plan-name-wrap 类，此处解除省略。
 * ===================================================================== */
.oa-plan-name-wrap .cell,
.oa-plan-name-wrap .cell.el-tooltip {
  white-space: normal !important;
  word-break: break-word !important;
  overflow: visible !important;
  text-overflow: clip !important;
  display: block !important;
  -webkit-line-clamp: unset !important;
}

/* =====================================================================
 * 工作报告：「工作报告详情」预览弹窗全屏显示（零源码改动）
 * JS 通过弹窗标题文本定位并添加 .oa-work-report-wide 类。
 * ===================================================================== */
.el-dialog.oa-work-report-wide {
  width: 100vw !important;
  height: 100vh !important;
  min-width: 100vw !important;
  max-width: 100vw !important;
  min-height: 100vh !important;
  max-height: 100vh !important;
  margin: 0 !important;
  top: 0 !important;
  left: 0 !important;
  border-radius: 0 !important;
  transform: none !important;
}
.el-dialog.oa-work-report-wide .el-dialog__header {
  border-bottom: 1px solid #f0f2f5;
}
.el-dialog.oa-work-report-wide .el-dialog__body {
  max-height: calc(100vh - 62px) !important;
  height: calc(100vh - 62px) !important;
  overflow-y: auto !important;
  padding: 20px 24px !important;
}

/* ===== 跟进记录表（.follow-view）精确控制 =====
   列序：1复选框 2.ID 3.客户名称 4.跟进方式 5.跟进内容 6.状态 7.跟进时间 8.负责人 9.创建时间 10.操作
   规则：短标识列（ID/状态/时间/负责人/创建时间/操作）单行不拆；
        客户名称最多两行；跟进方式标签单独一行、联系人放下方；跟进内容允许完整换行。
   用 nth-child 精确定位，不依赖 EP 运行时是否加 .el-tooltip 类，100% 生效。 */
.follow-view .el-table .cell {
  -webkit-line-clamp: 2 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: -webkit-box !important;
  -webkit-box-orient: vertical !important;
}
.follow-view .el-table__body td:nth-child(2) .cell,
.follow-view .el-table__body td:nth-child(6) .cell,
.follow-view .el-table__body td:nth-child(7) .cell,
.follow-view .el-table__body td:nth-child(8) .cell,
.follow-view .el-table__body td:nth-child(9) .cell,
.follow-view .el-table__body td:nth-child(10) .cell {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  display: block !important;
  -webkit-line-clamp: unset !important;
}

/* 跟进记录表：跟进方式列（第4列）标签单独一行，联系人文本放下方 */
.follow-view .el-table__body td:nth-child(4) .cell {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 4px !important;
  white-space: normal !important;
  -webkit-line-clamp: unset !important;
  overflow: visible !important;
  text-overflow: clip !important;
}
.follow-view .el-table__body td:nth-child(4) .cell .el-tag {
  flex-shrink: 0 !important;
}
.follow-view .el-table__body td:nth-child(4) .cell > .el-tag ~ span {
  display: block !important;
  width: 100% !important;
  white-space: normal !important;
  word-break: keep-all !important;
  color: #666 !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}
.follow-view .el-table__body td:nth-child(4) .cell .contact-item {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  white-space: normal !important;
  word-break: break-word !important;
  overflow: visible !important;
  text-overflow: clip !important;
  line-height: 1.45 !important;
}

/* 跟进记录表：跟进内容列（第5列）允许完整换行 */
.follow-view .el-table__body td:nth-child(5) .cell {
  white-space: normal !important;
  word-break: break-word !important;
  overflow: visible !important;
  text-overflow: clip !important;
  display: block !important;
  -webkit-line-clamp: unset !important;
}

.el-pagination { font-weight: 500; }
.el-pagination .el-pager li,
.el-pagination button { border-radius: 6px !important; }

/* ========== 6. 键盘焦点可达性 (a11y) ========== */
.el-button:focus-visible,
.el-input__wrapper.is-focus,
.el-textarea__inner:focus,
.el-select__wrapper.is-focused,
.el-checkbox:focus-visible .el-checkbox__inner,
.el-radio:focus-visible .el-radio__inner,
.el-tabs__item:focus-visible {
  outline: 2px solid #ff6a00 !important;
  outline-offset: 1px;
}
.el-input__wrapper.is-focus { box-shadow: 0 0 0 1px #ff6a00 inset !important; }
.el-textarea__inner:focus { box-shadow: 0 0 0 1px #ff6a00 inset !important; }

/* ========== 7. 侧边栏轻量视觉增强（仅视觉，不改菜单项/顺序） ========== */
/* 说明：以下覆盖 MainLayout.vue 中 scoped 的非 important 声明。
   只改颜色对比与激活态观感，DOM 与菜单结构完全不变。 */
.sidebar {
  background: linear-gradient(180deg, #161b29 0%, #131a27 45%, #161d2c 100%) !important;
  box-shadow: 2px 0 24px rgba(0, 0, 0, 0.18) !important;
}
.sidebar-logo { border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important; }

.menu-primary { color: #a7b8c9 !important; font-size: 13.5px !important; }
.menu-primary:hover {
  color: #eaf1f7 !important;
  background-color: rgba(255, 255, 255, 0.07) !important;
}
.menu-primary.active {
  color: #fff !important;
  background: linear-gradient(90deg, rgba(255, 106, 0, 0.20), rgba(255, 106, 0, 0.06)) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 138, 101, 0.25);
}
.menu-primary.active::before {
  background: linear-gradient(180deg, #ff8a65, #ff6a00) !important;
  width: 3px !important;
}

.menu-sub-item { color: #8aa0b3 !important; font-size: 13px !important; }
.menu-sub-item:hover { color: #e3edf4 !important; background-color: rgba(255, 255, 255, 0.06) !important; }
.menu-sub-item.active {
  color: #ffa875 !important;
  background-color: rgba(255, 106, 0, 0.10) !important;
  font-weight: 600;
}
.menu-sub-item.active::before { background: #ff6a00 !important; }

.menu-subsub-item { color: #768ca0 !important; font-size: 12.5px !important; }
.menu-subsub-item:hover { color: #e3edf4 !important; background-color: rgba(255, 255, 255, 0.05) !important; }
.menu-subsub-item.active { color: #ffa875 !important; background-color: rgba(255, 106, 0, 0.08) !important; }
.menu-subsub-item.active::before { background: #ff8a65 !important; }

.sub-group-title { color: #557089 !important; }

/* 折叠态图标居中已由组件处理，这里仅加固悬浮反馈 */
.sidebar[style*="64px"] .menu-primary:hover { background-color: rgba(255, 255, 255, 0.08) !important; }

/* ========== 8. 顶栏 / 面包屑 轻量统一 ========== */
.header { border-bottom: 1px solid #eceef2 !important; box-shadow: 0 1px 10px rgba(16, 24, 40, 0.05) !important; }
.header-tab:hover,
.header-tab.active { color: #ff6a00 !important; }
.header-tab.active::after { background: #ff6a00 !important; }
.collapse-btn:hover,
.search-btn:hover { color: #ff6a00 !important; background: #fff0e6 !important; }

/* =====================================================================
 * 9. 排版体系：统一字号梯度 + 行高（消除各页面大小不一）
 * ===================================================================== */
html { font-size: 14px; }
body { font-size: var(--oa-fs-base); color: var(--oa-text-2); line-height: var(--oa-lh-base); }

/* 标题层级（用于页面大标题 / 区块标题 / 卡片标题） */
h1, .oa-h1 { font-size: var(--oa-fs-3xl); line-height: var(--oa-lh-tight); color: var(--oa-text-1); font-weight: 700; }
h2, .oa-h2 { font-size: var(--oa-fs-2xl); line-height: var(--oa-lh-tight); color: var(--oa-text-1); font-weight: 700; }
h3, .oa-h3 { font-size: var(--oa-fs-xl); line-height: var(--oa-lh-tight); color: var(--oa-text-1); font-weight: 600; }
h4, .oa-h4 { font-size: var(--oa-fs-lg); color: var(--oa-text-1); font-weight: 600; }

.el-card__header,
.el-card__title { font-size: var(--oa-fs-md) !important; font-weight: 600; color: var(--oa-text-1) !important; }
.el-dialog__title { font-size: var(--oa-fs-lg) !important; }
.el-descriptions__title,
.el-page-header__title { font-size: var(--oa-fs-md) !important; color: var(--oa-text-1); }
.el-breadcrumb__inner,
.el-breadcrumb__item .el-breadcrumb__inner { color: var(--oa-text-3) !important; font-weight: 500; font-size: var(--oa-fs-sm); }
.el-breadcrumb__item:last-child .el-breadcrumb__inner { color: var(--oa-text-1) !important; }
.el-breadcrumb__separator { color: var(--oa-text-4) !important; }

/* 正文字号梯度下拉到组件内部，统一阅读体验 */
.el-form-item__label { font-size: var(--oa-fs-base) !important; color: var(--oa-text-2) !important; line-height: var(--oa-lh-base); }
.el-table td .cell { font-size: var(--oa-fs-sm) !important; color: var(--oa-text-2); }
.el-table th.el-table__cell .cell { font-size: var(--oa-fs-sm) !important; }
.el-tag { font-size: var(--oa-fs-xs) !important; }
.el-input__inner,
.el-textarea__inner { font-size: var(--oa-fs-base) !important; color: var(--oa-text-1); }
.el-input__inner::placeholder,
.el-textarea__inner::placeholder { color: var(--oa-text-4); }

/* =====================================================================
 * 10. 配色协调：统一中性灰 + 状态色，消除组件间灰色/色相不一致
 * ===================================================================== */
/* 文本色统一到中性灰阶（覆盖 EP 默认 #303133/#606266/#909399 杂色） */
.el-text,
.el-link,
.el-radio__label,
.el-checkbox__label,
.el-select__placeholder,
.el-dropdown-selfdefine { color: var(--oa-text-2); }
.el-step__title { color: var(--oa-text-2) !important; }
.el-step__description { color: var(--oa-text-3) !important; }

/* 边框 / 分割线统一 */
.el-divider { background-color: var(--oa-border-soft) !important; }
.el-border,
.el-card,
.el-input__wrapper,
.el-textarea__inner,
.el-select__wrapper { border-color: var(--oa-border) !important; }

/* 状态色向暖色系微调，与橙色主色更协调（语义不变） */
.el-tag--success { --el-color-success: #2ba471; }
.el-tag--warning { --el-color-warning: #e6a23c; }
.el-tag--danger  { --el-color-danger:  #f56c6c; }
.el-tag--info    { --el-color-info:    #8a97a8; }
.el-alert--success { border-color: #bfe6d3 !important; }
.el-alert--warning { border-color: #f5dcb0 !important; }
.el-alert--info    { border-color: #d9e0e8 !important; }

/* =====================================================================
 * 11. 间距系统：统一留白节奏（4 倍数），消除拥挤/松散不一
 * ===================================================================== */
/* 页面内容区内边距（更舒展） */
.el-main,
.main-content { padding: var(--oa-sp-6) var(--oa-sp-6) !important; }

/* 卡片内边距：仅给未自定义的卡片一个舒适默认值；用 :where() 保持最低优先级，让 scoped 组件自定义不被覆盖 */
:where(.el-card__body) { padding: var(--oa-sp-5); }
:where(.el-card__header) { padding: var(--oa-sp-4) var(--oa-sp-5); }

/* 工作台快捷入口 / 模块入口显式保留可见与布局 */
.shortcuts,
.module-actions {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}
.shortcuts { flex-wrap: wrap; gap: 16px; justify-content: center; }
.module-actions { flex-wrap: wrap; gap: 4px; }

/* 隐藏工作台模块卡片的"数据来源"行（零源码改动） */
.module-source { display: none !important; }

/* 隐藏"客户CRM"卡片中的"合同管理"文字（零源码改动）
   客户CRM卡片的按钮为 el-button--success，与财务 primary / 进销存 warning 区分 */
.module-card:has(.module-actions .el-button--success) .module-desc {
  font-size: 0 !important;
  color: transparent !important;
}
.module-card:has(.module-actions .el-button--success) .module-desc::after {
  content: "客户管理、商机跟进、AI智能分析";
  font-size: 14px;
  color: #666;
  display: block;
}
.module-card:has(.module-actions .el-button--success) .module-actions .el-button:nth-child(3) {
  display: none !important;
}

/* 表单项的纵向间距更舒适 */
.el-form-item { margin-bottom: var(--oa-sp-5) !important; }
.el-form--label-top .el-form-item__label { margin-bottom: var(--oa-sp-2) !important; }
.el-form-item__content { line-height: var(--oa-lh-base); }

/* 表格单元格纵向留白 */
.el-table td.el-table__cell { padding: 11px 0 !important; }
.el-table th.el-table__cell { padding: 12px 0 !important; }
.el-table .cell { padding-left: var(--oa-sp-4) !important; padding-right: var(--oa-sp-4) !important; }

/* 对话框内边距 */
.el-dialog__body { padding: var(--oa-sp-5) var(--oa-sp-6) !important; }
.el-dialog__header { padding: var(--oa-sp-5) var(--oa-sp-6) var(--oa-sp-4) !important; }

/* 区块之间的留白：仅给相邻的 .el-row 之间加间距，不强制覆盖每一行/列 */
.el-row + .el-row { margin-top: var(--oa-sp-4); }

/* 分页与上方表格留白 */
.el-pagination { margin-top: var(--oa-sp-4) !important; padding: var(--oa-sp-2) 0 !important; }

/* =====================================================================
 * 12. 界面风格：统一圆角 / 柔和阴影 / 层次，提升整体质感
 * ===================================================================== */
/* 全局圆角统一（按钮/输入/卡片/浮层遵循同一尺度） */
.el-input__wrapper,
.el-textarea__inner,
.el-select__wrapper { border-radius: 6px !important; }
.el-input-number,
.el-cascader,
.el-date-editor { border-radius: 6px !important; }

/* 柔和分层阴影（卡片/浮层不再扁平死板） */
.el-card { box-shadow: var(--oa-shadow-sm) !important; }
.el-card:hover { box-shadow: var(--oa-shadow-md) !important; }
.el-popper,
.el-dropdown-menu,
.el-select-dropdown,
.el-picker__popper { box-shadow: var(--oa-shadow-md) !important; border-radius: 10px !important; }
.el-message,
.el-notification,
.el-message-box { box-shadow: var(--oa-shadow-lg) !important; border-radius: 10px !important; }

/* 输入控件聚焦时的柔和主色环（替代生硬蓝边） */
.el-input__wrapper.is-focus { box-shadow: 0 0 0 1px var(--el-color-primary) inset, 0 0 0 3px rgba(255,106,0,0.12) !important; }
.el-textarea__inner:focus { box-shadow: 0 0 0 1px var(--el-color-primary) inset, 0 0 0 3px rgba(255,106,0,0.12) !important; }
.el-select__wrapper.is-focused { box-shadow: 0 0 0 1px var(--el-color-primary) inset, 0 0 0 3px rgba(255,106,0,0.12) !important; }

/* 空状态更柔和 */
.el-empty__description { color: var(--oa-text-3) !important; font-size: var(--oa-fs-sm); }

/* 滚动条细化为现代浅灰（不影响功能） */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #d6dde6; border-radius: 8px; border: 2px solid var(--oa-bg); }
::-webkit-scrollbar-thumb:hover { background: #c2ccd8; }
::-webkit-scrollbar-track { background: transparent; }

/* =====================================================================
 * 13. 品牌文字替换：企业OA → 嘉士德OA系统（纯视觉，不改 DOM/源码/菜单）
 *     原 .logo-text 文本保留在 DOM 中（Vue 重渲染不丢失），仅将其隐藏
 *     并用 ::after 伪元素显示新品牌名，继承原渐变观感。
 * ===================================================================== */
.sidebar-logo .logo-text,
.mobile-drawer .logo-text {
  font-size: 0 !important; /* 隐藏原文本节点 */
}
.sidebar-logo .logo-text::after,
.mobile-drawer .logo-text::after {
  content: "嘉士德OA系统";
  display: inline-block;
  font-size: 16px;
  font-weight: 700;
  letter-spacing: 0.5px;
  white-space: nowrap;
  background: linear-gradient(135deg, #ff8a65, #ff6a00);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* =====================================================================
 * 14. 视觉收口深化（B 轮：建议项 1–7，全部仅视觉，不碰菜单内容/结构/路由）
 *     此前已完成配色/排版/间距/风格基底与侧边栏/顶栏基础统一，本轮在其上
 *     精致化并补齐遗漏。选择器均指向具体业务类或 EP 标准类；不对
 *     .el-card__body / .el-row / .el-col 强加全局 margin，避免再次压垮 scoped 组件。
 * ===================================================================== */

/* ---- 14.1 侧边栏菜单精致化（菜单项文字/顺序/权限完全不变） ---- */
.menu-primary,
.menu-sub-item,
.menu-subsub-item { border-radius: 8px !important; transition: background-color .2s ease, color .2s ease; }
/* 分组标题上下留白 + 更弱字号，强化层级而不改文字内容 */
.sub-group-title { margin: 10px 8px 4px !important; font-size: 11.5px !important; letter-spacing: .4px; }
/* 激活项发光更柔和精致（叠加于第 7 节渐变底之上） */
.menu-primary.active,
.menu-sub-item.active {
  box-shadow: inset 0 0 0 1px rgba(255, 138, 101, .22), 0 2px 10px rgba(255, 106, 0, .12) !important;
}
/* 侧边栏内部滚动条细化（与主滚动条风格一致，仅视觉） */
.sidebar ::-webkit-scrollbar { width: 7px; }
.sidebar ::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, .14); border-radius: 8px;
  border: 2px solid transparent; background-clip: padding-box;
}
.sidebar ::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, .24); }

/* ---- 14.2 顶栏精致化 ---- */
.header .el-input__wrapper { border-radius: 8px !important; }
.header .el-input__wrapper.is-focus {
  box-shadow: 0 0 0 1px var(--el-color-primary) inset, 0 0 0 3px rgba(255, 106, 0, .10) !important;
}
.header .el-badge__content { background-color: #ff6a00 !important; border-color: #ff6a00 !important; }
.header .el-dropdown:hover,
.header .el-badge:hover { color: #ff6a00; }

/* ---- 14.3 表格精致化 ---- */
/* 右对齐数字列（金额/数量等）更整齐 */
.el-table .el-table__cell.is-right .cell { text-align: right; font-variant-numeric: tabular-nums; }
/* 排序图标跟随主色 */
.el-table .sort-caret.ascending { border-bottom-color: #ff6a00; }
.el-table .sort-caret.descending { border-top-color: #ff6a00; }
.el-table .caret-wrapper:hover .sort-caret { border-bottom-color: #ff974d; }
/* 非 striped 表格也补极淡斑马纹，行更分明（极淡，错位也无碍） */
.el-table__body tr:nth-child(even) > td.el-table__cell { background-color: #fcfcfd; }
/* 表头吸顶时底部阴影，增强层次 */
.el-table__header-wrapper { box-shadow: 0 2px 6px rgba(16, 24, 40, .04); }
.el-table .el-table__row:hover > td.el-table__cell { transition: background-color .15s ease; }

/* ---- 14.4 对话框 / 抽屉精致化 ---- */
.el-overlay { background-color: rgba(16, 24, 40, .45) !important; backdrop-filter: blur(2px); }
.el-dialog__footer { padding: 14px 24px 20px !important; border-top: 1px solid #f0f2f5; }
.el-drawer { box-shadow: 0 14px 48px rgba(16, 24, 40, .18) !important; }
.el-drawer__header { color: var(--oa-text-1) !important; font-weight: 600; }

/* ---- 14.5 卡片精致化（hover 轻抬升 + 标题左侧强调条，仅视觉，不影响内容） ---- */
:where(.el-card):hover { transform: translateY(-2px); box-shadow: var(--oa-shadow-md) !important; }
.el-card__header { position: relative; }
.el-card__header::before {
  content: ""; position: absolute; left: 0; top: 14px; bottom: 14px; width: 3px;
  border-radius: 3px; background: linear-gradient(180deg, #ff8a65, #ff6a00);
}

/* ---- 14.6 表单控件精致化 ---- */
.el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label::before { color: #ff6a00 !important; }
.el-form-item.is-error .el-input__wrapper { box-shadow: 0 0 0 1px #f56c6c inset !important; }
.el-form-item__error { color: #f56c6c !important; font-size: 12px; padding-top: 2px; }
.el-input-group__append,
.el-input-group__prepend {
  background: #f7f9fb !important; color: var(--oa-text-2) !important;
  border-color: var(--oa-border) !important; border-radius: 6px !important;
}
.el-radio__label,
.el-checkbox__label { color: var(--oa-text-2) !important; }

/* ---- 14.7 状态徽章精致化 ---- */
.el-tag { padding: 0 9px !important; height: 22px !important; line-height: 20px !important; border-radius: 5px !important; }
.el-tag--primary { --el-color-primary: #ff6a00; color: #ff6a00; background: #fff0e6; border-color: #ffd2b3; }
.el-tag--primary.is-plain { background: #fff !important; }

/* =====================================================================
 * 15. 骨架屏 / 加载态 / 空状态 三态统一（品牌化，纯 CSS，低风险）
 *     - 加载遮罩：半透明浅底 + 主色 spinner
 *     - 骨架屏 shimmer：调成暖橙淡色，与主题协调
 *     - 空状态：图标柔和 + 文案统一灰阶
 * ===================================================================== */
.el-loading-mask { background-color: rgba(255, 255, 255, 0.72) !important; }
.el-loading-spinner .path { stroke: var(--el-color-primary) !important; }
.el-loading-spinner .el-loading-text { color: var(--oa-text-3) !important; font-size: var(--oa-fs-sm); }
.el-loading-spinner .circular { animation: oa-rotate 1.8s linear infinite; }
@keyframes oa-rotate { to { transform: rotate(360deg); } }

.el-skeleton__item { background: linear-gradient(90deg, #eef1f5 25%, #e3e8ee 37%, #eef1f5 63%); }
.el-skeleton.is-animated .el-skeleton__item {
  background: linear-gradient(90deg, #f3f5f8 25%, #e9edf2 37%, #f3f5f8 63%);
  background-size: 400% 100%;
}
.el-skeleton__button, .el-skeleton__circle, .el-skeleton__p { border-radius: 6px; }

.el-empty__image { opacity: 0.85; }
.el-empty__description { color: var(--oa-text-3) !important; font-size: var(--oa-fs-sm); }

/* =====================================================================
 * 16. 图表区容器统一（纯 CSS 仅能做容器卡片化；canvas 内部配色需 ECharts 主题）
 *     - ECharts 由业务代码 setOption 配置，canvas 渲染，纯 CSS 无法改其
 *       内部配色 / 坐标轴文字颜色。此处只统一「容器」外观，避免突兀。
 *     - 真正配色统一需在前端注入 ECharts 暗色主题（动 JS / 构建），
 *       不在本次「不改代码」边界内，留作后续独立任务。
 * ===================================================================== */
/* AI / 图表结果卡片已知 class（AiAcquireView 等使用），统一圆角留白 */
.result-card {
  border-radius: 10px !important;
  overflow: hidden;
}
/* 通用图表容器：统一最小高度，避免加载时布局抖动 */
.chart-container,
.echarts,
.echart-box { min-height: 280px; }

/* =====================================================================
 * 17. 暗色模式（实验版 · 可切换 · 默认浅色，不影响生产观感）
 *     - 生效条件：<html data-theme="dark">，由 oa-dark-mode.js 注入浮动切换
 *       按钮 + localStorage 记忆（默认浅色，用户手动开启）。
 *     - 原理：Element Plus 组件颜色基本来自 CSS 变量，本层重定义一套 dark
 *       变量表覆盖 :root；主色橙保持品牌不变。
 *     - 局限性（已如实告知）：ECharts canvas 图表、图片在暗色下仍浅色；
 *       个别业务硬编码色需多轮验收迭代。属实验版，可一键回退。
 * ===================================================================== */
[data-theme="dark"] {
  /* EP 中性变量（参考官方 dark 主题） */
  --el-color-white: #141414;
  --el-color-black: #000;
  --el-bg-color: #1a2027;
  --el-bg-color-page: #0f141a;
  --el-bg-color-overlay: #1d242c;
  --el-text-color-primary: #e6edf3;
  --el-text-color-regular: #cfd6de;
  --el-text-color-secondary: #a7b0bb;
  --el-text-color-placeholder: #828c99;
  --el-text-color-disabled: #626b76;
  --el-border-color: #2c343d;
  --el-border-color-light: #262d35;
  --el-border-color-lighter: #222932;
  --el-border-color-extra-light: #1e252d;
  --el-fill-color: #262d35;
  --el-fill-color-light: #1f262e;
  --el-fill-color-lighter: #1a2027;
  --el-fill-color-blank: #1a2027;
  --el-mask-color: rgba(255, 255, 255, 0.06);

  /* 我们的设计令牌重定义 */
  --oa-text-1: #e6edf3;
  --oa-text-2: #cfd6de;
  --oa-text-3: #a7b0bb;
  --oa-text-4: #828c99;
  --oa-border: #2c343d;
  --oa-border-soft: #222932;
  --oa-surface: #1a2027;
  --oa-bg: #0f141a;
  --oa-fill-hover: #222a33;
  --oa-shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.4);
  --oa-shadow-md: 0 6px 20px rgba(0, 0, 0, 0.5);
  --oa-shadow-lg: 0 14px 48px rgba(0, 0, 0, 0.6);
}

/* ---- 17.1 关键组件暗色覆盖（此前用 !important 写死浅色处，同等优先级后出覆盖） ---- */
[data-theme="dark"] body { color: var(--oa-text-2); background: var(--oa-bg); }
[data-theme="dark"] .el-main,
[data-theme="dark"] .main-content { background: var(--oa-bg); }
[data-theme="dark"] .header { background: #161c23 !important; border-bottom-color: #262d35 !important; box-shadow: 0 1px 10px rgba(0,0,0,.3) !important; }
[data-theme="dark"] .header-tab,
[data-theme="dark"] .el-breadcrumb__inner { color: var(--oa-text-3) !important; }

[data-theme="dark"] .el-card { background: var(--oa-surface) !important; border-color: #262d35 !important; }
[data-theme="dark"] .el-card__header { border-bottom-color: #262d35 !important; }

[data-theme="dark"] .el-table { --el-table-border-color: #2c343d; background: var(--oa-surface); }
[data-theme="dark"] .el-table th.el-table__cell { background: #1d242c !important; color: var(--oa-text-1) !important; border-bottom-color: #2c343d !important; }
[data-theme="dark"] .el-table td.el-table__cell,
[data-theme="dark"] .el-table td .cell { color: var(--oa-text-2) !important; }
[data-theme="dark"] .el-table .el-table__row:hover > td.el-table__cell { background-color: #222a33 !important; }
[data-theme="dark"] .el-table__body tr:nth-child(even) > td.el-table__cell { background-color: #161c23; }
[data-theme="dark"] .el-table__header-wrapper { box-shadow: 0 2px 6px rgba(0,0,0,.3); }

[data-theme="dark"] .el-input__wrapper,
[data-theme="dark"] .el-textarea__inner,
[data-theme="dark"] .el-select__wrapper { background-color: #1a2027 !important; box-shadow: 0 0 0 1px #2c343d inset !important; }
[data-theme="dark"] .el-input__wrapper.is-focus,
[data-theme="dark"] .el-select__wrapper.is-focused { box-shadow: 0 0 0 1px var(--el-color-primary) inset, 0 0 0 3px rgba(255,106,0,0.18) !important; }
[data-theme="dark"] .el-input__inner,
[data-theme="dark"] .el-textarea__inner { color: var(--oa-text-1) !important; }
[data-theme="dark"] .el-input__inner::placeholder,
[data-theme="dark"] .el-textarea__inner::placeholder { color: var(--oa-text-4) !important; }
[data-theme="dark"] .el-input-group__append,
[data-theme="dark"] .el-input-group__prepend { background: #222a33 !important; color: var(--oa-text-3) !important; border-color: #2c343d !important; }

[data-theme="dark"] .el-checkbox__inner { background-color: #1a2027 !important; border-color: #2c343d !important; }
[data-theme="dark"] .el-radio__inner { background-color: #1a2027 !important; border-color: #2c343d !important; }

[data-theme="dark"] .el-dialog,
[data-theme="dark"] .el-drawer { background: var(--oa-surface) !important; }
[data-theme="dark"] .el-dialog__header,
[data-theme="dark"] .el-dialog__footer { border-color: #262d35 !important; }
[data-theme="dark"] .el-dialog__title,
[data-theme="dark"] .el-drawer__header { color: var(--oa-text-1) !important; }
[data-theme="dark"] .el-overlay { background-color: rgba(0, 0, 0, 0.6) !important; }

[data-theme="dark"] .el-dropdown-menu,
[data-theme="dark"] .el-select-dropdown,
[data-theme="dark"] .el-popper { background: #1d242c !important; border-color: #2c343d !important; box-shadow: var(--oa-shadow-md) !important; }
[data-theme="dark"] .el-dropdown-menu__item { color: var(--oa-text-2) !important; }
[data-theme="dark"] .el-dropdown-menu__item:not(.is-disabled):hover { background-color: #222a33 !important; color: #ff8a65 !important; }

[data-theme="dark"] .el-button--default,
[data-theme="dark"] .el-button--info { background: #262d35 !important; border-color: #2c343d !important; color: var(--oa-text-2) !important; }
[data-theme="dark"] .el-button--default:hover,
[data-theme="dark"] .el-button--info:hover { color: #ff8a65 !important; border-color: #ff974d !important; background-color: #2c343d !important; }

[data-theme="dark"] .el-empty__description { color: var(--oa-text-3) !important; }
[data-theme="dark"] .el-tag--plain { background: #1a2027 !important; }
[data-theme="dark"] .el-tag--primary { background: rgba(255,106,0,0.14); border-color: #5a3418; }
[data-theme="dark"] .el-tag--primary.is-plain { background: #1a2027 !important; }

[data-theme="dark"] .el-message,
[data-theme="dark"] .el-notification,
[data-theme="dark"] .el-message-box { background: #1d242c !important; border-color: #2c343d !important; color: var(--oa-text-1) !important; box-shadow: var(--oa-shadow-lg) !important; }

[data-theme="dark"] .el-loading-mask { background-color: rgba(15, 20, 26, 0.72) !important; }
[data-theme="dark"] .el-skeleton__item { background: linear-gradient(90deg, #20272f 25%, #2a323b 37%, #20272f 63%); }
[data-theme="dark"] .el-skeleton.is-animated .el-skeleton__item { background: linear-gradient(90deg, #232b34 25%, #2e3742 37%, #232b34 63%); background-size: 400% 100%; }

/* 侧边栏本就是深色渐变，暗色下保留；仅微调文字对比 */
[data-theme="dark"] .menu-primary { color: #b6c4d2 !important; }
[data-theme="dark"] .menu-sub-item { color: #93a6b8 !important; }
[data-theme="dark"] .menu-subsub-item { color: #7e90a1 !important; }
[data-theme="dark"] .sub-group-title { color: #6b7c8c !important; }

/* =====================================================================
 * 18. 客户列表：去掉下方横向滚动条（零源码改动）
 *     截图显示「全部客户」页面筛选区与表格之间出现横向滚动条。
 *     通过隐藏 EP 自定义滚动条轨道 + 截断原生滚动条实现。
 * ===================================================================== */
/* 隐藏客户列表页 EP 横向滚动条轨道 */
.customer-list-view .el-scrollbar__bar.is-horizontal,
.customer-pool-view .el-scrollbar__bar.is-horizontal,
.all-customer-view .el-scrollbar__bar.is-horizontal {
  display: none !important;
}

/* 截断表格 body wrapper 的原生横向滚动条 */
.customer-list-view .el-table__body-wrapper,
.customer-pool-view .el-table__body-wrapper,
.all-customer-view .el-table__body-wrapper,
.customer-list-view .el-table--scrollable-x .el-table__body-wrapper,
.customer-pool-view .el-table--scrollable-x .el-table__body-wrapper,
.all-customer-view .el-table--scrollable-x .el-table__body-wrapper {
  overflow-x: hidden !important;
}

/* 对 Webkit 滚动条同样隐藏 */
.customer-list-view .el-table__body-wrapper::-webkit-scrollbar:horizontal,
.customer-pool-view .el-table__body-wrapper::-webkit-scrollbar:horizontal,
.all-customer-view .el-table__body-wrapper::-webkit-scrollbar:horizontal,
.customer-list-view ::-webkit-scrollbar:horizontal,
.customer-pool-view ::-webkit-scrollbar:horizontal,
.all-customer-view ::-webkit-scrollbar:horizontal {
  display: none !important;
  height: 0 !important;
}

/* =====================================================================
 * 18.1 客户列表：JS 兜底隐藏所有横向滚动条（零源码改动）
 *     上一轮按 class 名猜测未命中，现注入 JS 在客户列表页运行时检测
 *     实际出现水平溢出的元素并添加 .oa-no-hscroll，CSS 截断 overflow-x。
 * ===================================================================== */
.oa-no-hscroll {
  overflow-x: hidden !important;
  scrollbar-width: none !important;
}
.oa-no-hscroll::-webkit-scrollbar:horizontal,
.oa-no-hscroll::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

/* =====================================================================
 * 19. 筛选栏：「按标签筛选」选择器/输入框长度缩短（零源码改动）
 *     JS 通过 label/placeholder/当前显示文本多路定位，把 class 加在
 *     最外层 .el-form-item（若存在）或 .el-select/.el-input 控件上；
 *     此处同时覆盖两种容器，并避免覆盖 white-space/overflow 等会干扰
 *     Element Plus select 渲染的属性。
 * ===================================================================== */
.oa-tag-filter-narrow,
.el-form-item.oa-tag-filter-narrow,
.el-form-item__content.oa-tag-filter-narrow,
.el-select.oa-tag-filter-narrow,
.el-input.oa-tag-filter-narrow {
  width: 110px !important;
  max-width: 110px !important;
  flex: 0 0 110px !important;
  min-width: 110px !important;
  margin-right: 12px !important;
}

/* 兼容：若 class 落在 .el-form-item 上，让内容区填满该宽度 */
.el-form-item.oa-tag-filter-narrow .el-form-item__content {
  width: 100% !important;
  max-width: 100% !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

/* 「按标签筛选」内部文字/placeholder 字号与相邻选择器保持一致（14px）。
   注意：不覆盖 white-space/overflow/text-overflow，避免干扰 Element Plus
   select 组件的 placeholder 渲染与下拉行为。 */
.oa-tag-filter-narrow .el-input__inner,
.oa-tag-filter-narrow .el-select .el-input__inner,
.oa-tag-filter-narrow .el-select__placeholder,
.oa-tag-filter-narrow .el-select__placeholder-text,
.oa-tag-filter-narrow input::placeholder {
  font-size: 14px !important;
}

/* =====================================================================
 * 20. 费用报销搜索/操作栏换行显示（零源码改动）
 *     截图显示费用报销菜单顶部一行包含：搜索报销单、审批编号、申请人、
 *     年份、搜索、日期范围、新建报销单、导入Excel、导出、提取发票，
 *     严重拥挤。JS 直接命中报销页 .toolbar，添加 .oa-expense-search-wrap，
 *     并让 .toolbar-right 独占第二行。
 *
 * ---- 2026-08-31 加固（重要，勿回退）----
 * 旧版在此使用**后代选择器** `.oa-expense-search-wrap .el-row` 与
 * `.oa-expense-search-wrap .el-col`。由于 JS 容器判定曾把该类误加到 app
 * shell（.el-container.main-layout）上，后代选择器导致**全站** el-row 被
 * 强制 `display:contents`、el-col 宽度失效，所有栅格塌成单列（联系人表单
 * 最明显）。现全部收窄为「JS 显式施加的类」或「直接子元素 >」，
 * 结构上不可能再泄漏到任意深度的后代。
 * ===================================================================== */
.oa-expense-search-wrap {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding-bottom: 8px !important;
}

/* 左右两栏各自内部也允许换行 */
.oa-expense-search-left,
.oa-expense-search-right {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
}

/* 操作按钮独占第二行 */
.oa-expense-search-right {
  flex: 1 0 100% !important;
}

/* 兜底：仅当 JS **显式**给某行打了 .oa-expense-search-row 才透明化；
   绝不可改回 `.oa-expense-search-wrap .el-row` 这类后代选择器。 */
.oa-expense-search-row {
  display: contents !important;
}

/* 子项不压缩，允许自然换行（仅直接子层 / 已显式标记的行） */
.oa-expense-search-wrap > .el-form-item,
.oa-expense-search-wrap > .el-input,
.oa-expense-search-wrap > .el-select,
.oa-expense-search-wrap > .el-button,
.oa-expense-search-wrap > .el-date-editor,
.oa-expense-search-row > .el-col,
.oa-expense-search-row > .el-form-item,
.oa-expense-search-row > .el-button {
  flex: 0 0 auto !important;
  margin-bottom: 8px !important;
  margin-right: 0 !important;
}

/* 覆盖 Element Plus el-col 的栅格宽度（仅直接子层） */
.oa-expense-search-wrap > .el-col,
.oa-expense-search-row > .el-col {
  width: auto !important;
  max-width: none !important;
  min-width: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 按钮高度对齐 */
.oa-expense-search-wrap > .el-button {
  flex-shrink: 0 !important;
}

/* 日期范围选择器避免过宽。
   2026-08-31 加固：限定在工具栏左右两栏内部，不使用
   `.oa-expense-search-wrap .el-date-editor` 这类可外泄的后代选择器。 */
.oa-expense-search-left .el-date-editor--daterange,
.oa-expense-search-left .el-date-editor,
.oa-expense-search-right .el-date-editor--daterange,
.oa-expense-search-right .el-date-editor {
  max-width: 280px !important;
}

/* 兼容 inline form */
.oa-expense-search-wrap.el-form--inline {
  display: flex !important;
  flex-wrap: wrap !important;
}
.oa-expense-search-wrap.el-form--inline .el-form-item {
  flex: 0 0 auto !important;
  margin-right: 0 !important;
}

/* =====================================================================
 * 20.1 费用报销搜索栏：稳定两行布局
 *     第一行=所有筛选条件（搜索框/审批编号/申请人/日期范围/年份）
 *     第二行=所有操作按钮（搜索/新建/导入/导出/提取发票）
 *     通过 order 让筛选条件优先排在第一行，按钮排在第二行。
 * ===================================================================== */

/* 筛选条件统一 order=1，固定宽度，避免被撑开 */
.oa-expense-search-wrap .oa-expense-search,
.oa-expense-search-wrap .oa-expense-serial,
.oa-expense-search-wrap .oa-expense-applicant,
.oa-expense-search-wrap .oa-expense-dateRange,
.oa-expense-search-wrap .oa-expense-year,
.oa-expense-search-wrap .oa-expense-date {
  order: 1 !important;
  flex: 0 0 auto !important;
  margin-bottom: 8px !important;
}

/* 搜索框宽度，避免独占一行 */
.oa-expense-search-wrap .oa-expense-search {
  width: 220px !important;
  max-width: 220px !important;
  min-width: 180px !important;
}
.oa-expense-search-wrap .oa-expense-search .el-input,
.oa-expense-search-wrap .oa-expense-search input {
  width: 100% !important;
}

/* 审批编号、申请人 */
.oa-expense-search-wrap .oa-expense-serial,
.oa-expense-search-wrap .oa-expense-applicant {
  width: 170px !important;
  max-width: 170px !important;
}
.oa-expense-search-wrap .oa-expense-serial .el-input,
.oa-expense-search-wrap .oa-expense-serial input,
.oa-expense-search-wrap .oa-expense-applicant .el-input,
.oa-expense-search-wrap .oa-expense-applicant input,
.oa-expense-search-wrap .oa-expense-applicant .el-select,
.oa-expense-search-wrap .oa-expense-applicant .el-input__wrapper {
  width: 100% !important;
}

/* 日期范围 */
.oa-expense-search-wrap .oa-expense-dateRange,
.oa-expense-search-wrap .oa-expense-date {
  width: 280px !important;
  max-width: 280px !important;
}

/* 年份 */
.oa-expense-search-wrap .oa-expense-year {
  width: 130px !important;
  max-width: 130px !important;
}

/* 操作按钮统一 order=2，强制排在第二行 */
.oa-expense-search-wrap .oa-expense-searchBtn,
.oa-expense-search-wrap .oa-expense-actionBtn {
  order: 2 !important;
  flex: 0 0 auto !important;
  margin-bottom: 8px !important;
}

/* 未识别到的其他元素也默认跟随第一行 */
.oa-expense-search-wrap .oa-expense-other {
  order: 1 !important;
  flex: 0 0 auto !important;
}