/* ===================== wb_theme.css =====================
 * 全站配色「总色卡」：把 ERP 主系统的颜色集中到本文件统一管理。
 * @@ wb-theme @@ 20261002
 * ---------------------------------------------------------------------------
 * 位置：/opt/wugan_project1/pc_web/wb_theme.css，由 index.html 引入
 *       （配套 wb_theme.js 做主题切换 + 右上角入口）。
 * 回滚：删掉 index.html 里 wb_theme.css 与 wb_theme.js 这两行即可，
 *       系统100%回到本文件接入之前的样子（本文件不改动任何既有文件的一个字节）。
 *
 * 三段结构：
 *   1) 总色卡：15 个规范令牌 + 派生色（本文件是全站唯一的颜色来源）
 *   2) 主题层：默认「青绿清爽」写在 :root；「深色（旧版）」写在 :root[data-theme="dark"]，
 *       两套就是同一批变量的两组取值。以后想加第三套，照抄一段 :root[data-theme="xxx"] 即可。
 *   3) 落地层：把主包 assets/index-*.css 里写死的颜色，改成引用变量。
 *
 * 为什么「深色」能100%还原：
 *   所有青绿风的落地规则都挂在 :root[data-theme="green"] 前缀下方，
 *   切到 dark 时这一段整块失效，页面回到打包产物自带的原生样式，与改造前逐像素一致。
 *
 * 注意：
 *   本文件只管「主系统（Vue SPA）」；external/*.html 那批独立页面是各写各的硬编码色值，
 *   不归本文件管（后续分批接入）。
 * ========================================================================= */

/* ========== 1) 总色卡：默认主题 = 青绿清爽风（hcs168.cn 品牌风） ========== */
:root {
  /* --- 规范 15 个令牌 --- */
  --brand: #009580;               /* 品牌主绿：主操作 / 强调 */
  --brand-deep: #007e6b;          /* 主绿按下 / hover 加深 */
  --brand-weak: #e6f4f1;          /* 浅绿底：选中项 / 聚焦 */
  --bg: #f7f9f9;                  /* 页面背景：极浅灰绿 */
  --card: #ffffff;                /* 卡片背景：纯白 */
  --ink: #1d2b2a;                 /* 主文字：深墨绿黑 */
  --ink-2: #5b6b69;               /* 次级文字 */
  --ink-3: #8a9794;               /* 三级 / 辅助文字 */
  --line: #e3ece9;                /* 分割线 / 描边 */
  --green: #009580;               /* 成功 / 完成 */
  --amber: #d97706;               /* 警示 / 待处理 */
  --red: #dc2626;                 /* 危险 / 异常 */
  --radius: 10px;                 /* 按钮 / 小卡片圆角 */
  --radius-lg: 14px;              /* 大卡片 / 弹窗圆角 */
  --shadow: 0 1px 2px rgba(29, 43, 42, .04), 0 4px 16px -8px rgba(29, 43, 42, .12);

  /* --- 派生：状态药丸（规范第四节） --- */
  --green-weak: #d9f2ec;
  --green-line: #b7e3d8;
  --amber-weak: #fef3e2;
  --amber-line: #f5d9a8;
  --red-weak: #fdeaea;
  --red-line: #f5c6c6;
  --gray-weak: #eef1f0;
  --gray-fg: #8a9794;
  --brand-line: #b7e3d8;
  --ring: rgba(0, 149, 128, .12);  /* 输入框聚焦光环 */
  --shadow-lg: 0 24px 60px -12px rgba(29, 43, 42, .28);

  /* --- 派生：数据表格 --- */
  --thead-bg: #f2f6f5;            /* 表头底 */
  --row-hover: #f7faf9;           /* 行 hover */
  --row-alt: #fafcfc;             /* 斑马纹（隔行） */
  --glass-bg: #ffffff;            /* 表格容器面板底（原来是一层半透明深蓝） */
  --input-bg: #ffffff;            /* 输入框底 */
  --mask-bg: rgba(20, 30, 28, .45); /* 弹窗遮罩 */

  /* --- 派生：左侧导航（绿实底） --- */
  --sidebar-w: 180px;             /* 想换成规范的 220px，只改这一个数即可 */
  --sidebar-bg: #009580;
  --sidebar-fg: #ffffff;          /* 选中字色 */
  --sidebar-muted: rgba(255, 255, 255, .82);  /* 未选中字色 */
  --sidebar-hover: rgba(255, 255, 255, .12);
  --sidebar-active-bg: #ffffff;   /* 选中项：白底 + 绿字 */
  --sidebar-active-fg: #007e6b;
  --sidebar-active-bar: #ffffff;  /* 左侧 3px 条 */
  --sidebar-line: rgba(255, 255, 255, .18);
  --sidebar-sub-bg: rgba(0, 0, 0, .10);
  --sidebar-btn-bg: rgba(255, 255, 255, .14);
  --sidebar-btn-line: rgba(255, 255, 255, .22);
  --sidebar-chip-bg: rgba(255, 255, 255, .16);
  --sidebar-chip-line: rgba(255, 255, 255, .28);

  /* --- 桥接：把主包原有的 12 个变量接到总色卡上（一处改、全站跟） --- */
  --primary-bg: var(--bg);
  --secondary-bg: var(--card);
  --card-bg: var(--card);
  --accent-color: var(--brand);
  --accent-hover: var(--brand-deep);
  --text-primary: var(--ink);
  --text-secondary: var(--ink-2);
  --border-color: var(--line);
  --success-color: var(--green);
  --warning-color: var(--amber);
  --danger-color: var(--red);
  --info-color: #0d9488;
}

/* ========== 2) 主题层：深色（改造前的原配色，切到这里 = 100% 回到过去） ========== */
:root[data-theme="dark"] {
  --primary-bg: #0f172a;
  --secondary-bg: #1e293b;
  --card-bg: #1e293bcc;
  --accent-color: #3b82f6;
  --accent-hover: #2563eb;
  --text-primary: #f8fafc;
  --text-secondary: #cbd5e1;
  --border-color: #334155;
  --success-color: #10b981;
  --warning-color: #f59e0b;
  --danger-color: #ef4444;
  --info-color: #8b5cf6;
}

/* ========== 3) 字体：补齐规范的系统字体栈（两套主题都用，含中文回退） ==========
 * 打包产物写的是 *{font-family:...Segoe UI,Inter,sans-serif}，缺 PingFang / 雅黑，
 * Windows 上中文会掉到宋体。这里用同样的 * 选择器、后加载覆盖。 */
*,
html,
body,
button,
input,
select,
textarea,
th,
td {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
}

/* ==========================================================================
 * ========== 4) 落地层（仅青绿主题生效；深色主题下整段不参与，原样不动） ==========
 * ========================================================================== */

/* ---- 页面底色 / 内容区留白 ---- */
:root[data-theme="green"] body {
  background-color: var(--bg) !important;
  color: var(--ink) !important;
}
:root[data-theme="green"] #app .main-content {
  padding: 22px !important;
}
:root[data-theme="green"] #app .header {
  margin-bottom: 18px !important;
}
:root[data-theme="green"] #app .page-title {
  color: var(--ink) !important;
  font-size: 20px !important;
  font-weight: 600 !important;
}

/* ---- 左侧导航：本次「保持左侧颜色不变」，不参与浅色化 ----
 * 做法：把主包深色主题的那 12 个变量在 .sidebar 子树里还原，wb_theme 在 :root
 * 上的桥接（--secondary-bg: var(--card) 等）就进不到侧栏里，左侧导航与接入前
 * 逐像素一致；右侧内容区照常走青绿浅色。 */
:root[data-theme="green"] #app .sidebar {
  --primary-bg: #0f172a;
  --secondary-bg: #1e293b;
  --card-bg: #1e293bcc;
  --accent-color: #3b82f6;
  --accent-hover: #2563eb;
  --text-primary: #f8fafc;
  --text-secondary: #cbd5e1;
  --border-color: #334155;
  --success-color: #10b981;
  --warning-color: #f59e0b;
  --danger-color: #ef4444;
  --info-color: #8b5cf6;
}

/* ---- 左侧 logo：打包产物 .logo-text 用渐变文字，-webkit-text-fill-color:transparent，
 * 浅色化后必须压成实色白字，否则退化成墨绿黑字（rgb(29,43,42)）。 */
:root[data-theme="green"] #app .sidebar .logo-icon {
  color: #fff !important;
}
:root[data-theme="green"] #app .sidebar .logo-text {
  color: #fff !important;
  background: none !important;
  -webkit-text-fill-color: #fff !important;
  -webkit-background-clip: border-box !important;
  font-size: 15px !important;
  letter-spacing: 0 !important;
  white-space: nowrap !important;
}

/* ---- 右上角用户胶囊：原来是深墨绿底+浅青字（为深色页设计），白底页上看不清 ---- */
:root[data-theme="green"] .wb-tu {
  background: #fff !important;
  border: 1px solid var(--line) !important;
  box-shadow: var(--shadow) !important;
}
:root[data-theme="green"] .wb-tu:hover {
  border-color: var(--brand-line) !important;
}
:root[data-theme="green"] .wb-tu .wb-tu-name {
  color: var(--ink) !important;
}
:root[data-theme="green"] .wb-tu .wb-tu-role {
  color: var(--brand-deep) !important;
  background: var(--brand-weak) !important;
  border: 1px solid var(--brand-line) !important;
}
:root[data-theme="green"] .wb-tu .wb-tu-sep {
  background: var(--line) !important;
}
:root[data-theme="green"] .wb-tu .wb-tu-btn {
  color: var(--ink-3) !important;
}
:root[data-theme="green"] .wb-tu .wb-tu-btn:hover {
  background: var(--brand-weak) !important;
  color: var(--brand-deep) !important;
}
:root[data-theme="green"] .wb-tu.wb-tu-btn.wb-tu-logout:hover,
:root[data-theme="green"] .wb-tu .wb-tu-btn.wb-tu-logout:hover {
  background: var(--red-weak) !important;
  color: var(--red) !important;
}
:root[data-theme="green"] .wb-tu.wb-tu-fixed {
  background: #fff !important;
}
:root[data-theme="green"] .wb-tu.wb-tu-fixed .wb-tu-dot {
  border-color: #fff !important;
}

/* ---- 卡片：白底 + 淡描边 + 柔和阴影 + 大圆角 ---- */
:root[data-theme="green"] #app .stat-card,
:root[data-theme="green"] #app .aging-card,
:root[data-theme="green"] #app .trend-container,
:root[data-theme="green"] #app .settings-menu,
:root[data-theme="green"] #app .settings-content,
:root[data-theme="green"] #app .role-list,
:root[data-theme="green"] #app .permission-category,
:root[data-theme="green"] #app .login-log {
  background-color: var(--card) !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow) !important;
}
:root[data-theme="green"] #app .dashboard-stats,
:root[data-theme="green"] #app .aging-cards {
  gap: 14px !important;
}
:root[data-theme="green"] #app .aging-card::before,
:root[data-theme="green"] #app .aging-card:before {
  border-radius: var(--radius-lg) var(--radius-lg) 0 0 !important;
  height: 4px !important;
}
:root[data-theme="green"] #app .settings-title {
  border-bottom: 1px solid var(--line) !important;
}
:root[data-theme="green"] #app .permission-category h4 {
  color: var(--ink) !important;
}
:root[data-theme="green"] #app .settings-item:hover,
:root[data-theme="green"] #app .settings-item.active {
  color: var(--brand-deep) !important;
  border-left-color: var(--brand) !important;
  background-color: var(--brand-weak) !important;
}
:root[data-theme="green"] #app .role-item:hover {
  background-color: var(--brand-weak) !important;
}
:root[data-theme="green"] #app .role-item.active {
  border-color: var(--brand) !important;
  background-color: var(--brand-weak) !important;
}

/* ---- 数据表格（ERP 核心）：原来整块是一层半透明深蓝 #161c2d99 ---- */
:root[data-theme="green"] #app .data-table-container {
  background: var(--glass-bg) !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow) !important;
  -webkit-backdrop-filter: none;
  backdrop-filter: none !important;
}
:root[data-theme="green"] #app .table-header {
  border-bottom: 1px solid var(--line) !important;
}
:root[data-theme="green"] #app thead {
  background-color: var(--thead-bg) !important;
}
:root[data-theme="green"] #app th {
  color: var(--ink-2) !important;
  background: transparent !important;
  border-bottom: 1px solid var(--line) !important;
  border-right: 1px solid var(--line) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  padding: 10px 14px !important;
  letter-spacing: .2px !important;
}
:root[data-theme="green"] #app td {
  color: var(--ink) !important;
  border-bottom: 1px solid var(--line) !important;
  border-right: 1px solid var(--line) !important;
  font-size: 13px !important;
  padding: 9px 14px !important;
}
:root[data-theme="green"] #app tbody tr {
  background-color: transparent !important;
}
:root[data-theme="green"] #app tbody tr:nth-child(even) {
  background-color: var(--row-alt) !important;
}
:root[data-theme="green"] #app tbody tr:hover {
  background-color: var(--row-hover) !important;
}

/* ---- 按钮：绿主 / 白幽灵 / 红危险 ---- */
:root[data-theme="green"] #app .btn,
:root[data-theme="green"] #app .btn-primary,
:root[data-theme="green"] #app .btn-secondary,
:root[data-theme="green"] #app .btn-small {
  border-radius: var(--radius) !important;
}
:root[data-theme="green"] #app .btn-primary {
  background-color: var(--brand) !important;
  color: #fff !important;
}
:root[data-theme="green"] #app .btn-primary:hover {
  background-color: var(--brand-deep) !important;
}
:root[data-theme="green"] #app .btn-secondary {
  color: var(--ink-2) !important;
  background-color: #fff !important;
  border: 1px solid var(--line) !important;
}
:root[data-theme="green"] #app .btn-secondary:hover {
  color: var(--brand-deep) !important;
  background-color: var(--brand-weak) !important;
  border-color: var(--brand-line) !important;
}
/* 原来 .btn-edit 写死蓝色 rgba(59,130,246,.1) */
:root[data-theme="green"] #app .btn-edit {
  color: var(--brand-deep) !important;
  background-color: var(--brand-weak) !important;
  border: 1px solid var(--brand-line) !important;
}
:root[data-theme="green"] #app .btn-edit:hover {
  background-color: #d5ece6 !important;
}
:root[data-theme="green"] #app .btn-upload {
  color: var(--green) !important;
  background-color: var(--green-weak) !important;
  border: 1px solid var(--green-line) !important;
}
:root[data-theme="green"] #app .btn-upload:hover {
  background-color: #c9ebe1 !important;
}
:root[data-theme="green"] #app .btn-record {
  color: var(--info-color) !important;
  background-color: #e0f2f1 !important;
  border: 1px solid #b7e3d8 !important;
}
:root[data-theme="green"] #app .logout-btn {
  color: var(--red) !important;
  background: var(--red-weak) !important;
  border: 1px solid var(--red-line) !important;
}
:root[data-theme="green"] #app .logout-btn:hover {
  background: #fbdcdc !important;
}

/* ---- 状态药丸（规范第四节） ---- */
:root[data-theme="green"] #app .status-badge {
  border-radius: 999px !important;
  font-weight: 500 !important;
}
:root[data-theme="green"] #app .status-normal,
:root[data-theme="green"] #app .status-settled {
  color: var(--green) !important;
  background-color: var(--green-weak) !important;
  border: 1px solid var(--green-line) !important;
}

/* ---- 中性状态药丸：欠款管理「未确认 / 未开票 / 未设到期」（20261004）----
 * 这三列原本复用 .status-overdue（=红色），容易被误读成"异常/逾期"。
 * 改为中性灰：正常文字色 + 浅灰底，不再报红。 */
:root[data-theme="green"] #app .status-neutral {
  color: var(--gray-fg) !important;
  background-color: var(--gray-weak) !important;
  border: 1px solid var(--line) !important;
}
:root[data-theme="green"] #app .status-warning {
  color: var(--amber) !important;
  background-color: var(--amber-weak) !important;
  border: 1px solid var(--amber-line) !important;
}
:root[data-theme="green"] #app .status-overdue,
:root[data-theme="green"] #app .status-danger {
  color: var(--red) !important;
  background-color: var(--red-weak) !important;
  border: 1px solid var(--red-line) !important;
}

/* ---- 金额 / 统计数字 ---- */
:root[data-theme="green"] #app .paid-amount {
  color: var(--green) !important;
}
:root[data-theme="green"] #app .total-amount,
:root[data-theme="green"] #app .stat-item-value {
  color: var(--brand) !important;
}
:root[data-theme="green"] #app .overdue-amount {
  color: var(--red) !important;
}
:root[data-theme="green"] #app .unpaid-amount,
:root[data-theme="green"] #app .stat-value,
:root[data-theme="green"] #app .aging-value {
  color: var(--ink) !important;
}
:root[data-theme="green"] #app .stat-title,
:root[data-theme="green"] #app .aging-label,
:root[data-theme="green"] #app .aging-trend,
:root[data-theme="green"] #app .chart-label,
:root[data-theme="green"] #app .y-axis,
:root[data-theme="green"] #app .stat-item-label {
  color: var(--ink-2) !important;
}
:root[data-theme="green"] #app .trend-up {
  color: var(--green) !important;
}
:root[data-theme="green"] #app .trend-down {
  color: var(--red) !important;
}

/* ---- 图表：品牌绿主色 ----
 * 数据看板的柱状图不是 ECharts，是自绘 div.bar-body（写死 #3b82f6 蓝），
 * 一并收进品牌绿；hover 深绿同理。 */
:root[data-theme="green"] #app .chart-bar,
:root[data-theme="green"] #app .bar-body {
  background-color: var(--brand) !important;
}
:root[data-theme="green"] #app .chart-bar:hover {
  background-color: var(--brand-deep) !important;
}
:root[data-theme="green"] #app .chart-container {
  border-bottom: 1px solid var(--line) !important;
}

/* ---- 表单：白底 + 聚焦绿描边 + 淡绿光环 ---- */
:root[data-theme="green"] #app .form-input,
:root[data-theme="green"] #app .form-input-sm,
:root[data-theme="green"] #app .form-group input,
:root[data-theme="green"] #app .form-group select,
:root[data-theme="green"] #app .form-group textarea,
/* 兜底：各页面自己起的输入框类名太多（系统设置页就是 .form-input-sm，且外层没有 .form-group），
 * 干脆把 #app 里所有文本类输入框都收进来，只排除染了会出问题的原生控件 */
:root[data-theme="green"] #app input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="file"]):not([type="range"]):not([type="color"]),
:root[data-theme="green"] #app select,
:root[data-theme="green"] #app textarea {
  background-color: var(--input-bg) !important;
  color: var(--ink) !important;
  border: 1px solid var(--line) !important;
  border-radius: 8px !important;
}
:root[data-theme="green"] #app .form-input:focus,
:root[data-theme="green"] #app .form-input-sm:focus,
:root[data-theme="green"] #app .form-group input:focus,
:root[data-theme="green"] #app .form-group select:focus,
:root[data-theme="green"] #app .form-group textarea:focus,
:root[data-theme="green"] #app input:not([type="checkbox"]):not([type="radio"]):not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="file"]):not([type="range"]):not([type="color"]):focus,
:root[data-theme="green"] #app select:focus,
:root[data-theme="green"] #app textarea:focus {
  border-color: var(--brand) !important;
  box-shadow: 0 0 0 3px var(--ring) !important;
  outline: none !important;
}
:root[data-theme="green"] #app .form-label,
:root[data-theme="green"] #app .form-group label {
  color: var(--ink-2) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

/* ---- 弹窗：白卡 + 强阴影 + 规范遮罩 ---- */
:root[data-theme="green"] #app .modal-overlay {
  background: var(--mask-bg) !important;
}
:root[data-theme="green"] #app .modal-card {
  background: var(--card) !important;
  border: 1px solid var(--line) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-lg) !important;
}
:root[data-theme="green"] #app .modal-header {
  border-bottom: 1px solid var(--line) !important;
}
:root[data-theme="green"] #app .modal-header h3 {
  color: var(--ink) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
}
:root[data-theme="green"] #app .modal-footer {
  border-top: 1px solid var(--line) !important;
}
:root[data-theme="green"] #app .close-btn {
  color: var(--ink-3) !important;
}

/* ---- 分页：当前页绿 ---- */
:root[data-theme="green"] #app .pagination {
  border-top: 1px solid var(--line) !important;
}
:root[data-theme="green"] #app .page-btn {
  color: var(--ink-2) !important;
  background-color: #fff !important;
  border: 1px solid var(--line) !important;
  border-radius: 8px !important;
}
:root[data-theme="green"] #app .page-btn:hover {
  color: var(--brand) !important;
  border-color: var(--brand) !important;
  background-color: var(--brand-weak) !important;
}
:root[data-theme="green"] #app .page-btn.active {
  color: #fff !important;
  background-color: var(--brand) !important;
  border-color: var(--brand) !important;
}
:root[data-theme="green"] #app .page-info {
  color: var(--ink-3) !important;
}
:root[data-theme="green"] #app .log-item {
  border-bottom: 1px solid var(--line) !important;
}

/* ==========================================================================
 * ---- 第二批：逐个主菜单点开验收后补的漏网件 ----
 *
 * 背景：上面的规则只覆盖到「主包里写死的颜色」，各路由自己的页面组件里
 * 还有不少**写死深色的容器**（只改了字色没改容器色，就会出现深字压深底、
 * 对比度低到 1.2 基本看不见）。这一段是按 WCAG 对比度审计结果，
 * 把实测有问题的容器和字一个个拉回来 —— 判据是数字不是肉眼。
 * ========================================================================== */

/* 1) 还在用深色的容器 / 面板 / 分页条：统一拉到白卡或页面底色 */
:root[data-theme="green"] #app .search-box,
:root[data-theme="green"] #app .pagination-container,
:root[data-theme="green"] #app .pagination,
:root[data-theme="green"] #app .data-table-card,
:root[data-theme="green"] #app .reason-card,
:root[data-theme="green"] #app .date-filter-group,
:root[data-theme="green"] #app .tax-card,
:root[data-theme="green"] #app .tax-card.list-card,
:root[data-theme="green"] #app .dash-side {
  background-color: var(--card) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
:root[data-theme="green"] #app .collected-container,
:root[data-theme="green"] #app .tax-page {
  background-color: var(--bg) !important;
  color: var(--ink) !important;
}

/* 2) 原本配深色底的浅色字，现在压在白底上看不见 —— 换成规范墨色 */
:root[data-theme="green"] #app .trend-title,
:root[data-theme="green"] #app .bar-value,
:root[data-theme="green"] #app .stat-label,
:root[data-theme="green"] #app .filter-label,
:root[data-theme="green"] #app .foot-tip,
:root[data-theme="green"] #app .permission-item,
:root[data-theme="green"] #app .hcs-ip-txt,
:root[data-theme="green"] #app .sf-btn,
:root[data-theme="green"] #app .role-tag,
:root[data-theme="green"] #app .role-tag.admin,
:root[data-theme="green"] #app .role-tag.staff,
:root[data-theme="green"] #app .muted,
:root[data-theme="green"] #app .link-none,
:root[data-theme="green"] #app .td-zero {
  color: var(--ink-2) !important;
}
/* 金额 / 数值：要强调，但必须保证在白底上读得清 */
:root[data-theme="green"] #app .value-number,
:root[data-theme="green"] #app .total-num,
:root[data-theme="green"] #app .value-number.total-num {
  color: var(--amber) !important;
}
/* 客户管理的状态小标签：按规范的药丸语言（浅绿底 + 深绿字） */
:root[data-theme="green"] #app .hcs-st {
  background-color: var(--green-weak) !important;
  color: var(--green) !important;
  border-color: var(--brand-weak) !important;
}

/* 3) 按钮与标签：原来是「浅字 + 浅底」，改成实底白字或白底深字 */
:root[data-theme="green"] #app .tab-btn.active {
  background-color: var(--brand-weak) !important;
  color: var(--brand-deep) !important;
  border-color: var(--brand) !important;
}
:root[data-theme="green"] #app .btn-outline-green {
  background-color: var(--card) !important;
  color: var(--brand-deep) !important;
  border-color: var(--brand) !important;
}
:root[data-theme="green"] #app .btn-info {
  background-color: var(--card) !important;
  color: var(--ink-2) !important;
  border-color: var(--line) !important;
}
:root[data-theme="green"] #app .btn-warning {
  background-color: var(--amber) !important;
  color: #fff !important;
  border-color: var(--amber) !important;
}
:root[data-theme="green"] #app .btn-delete {
  background-color: var(--red) !important;
  color: #fff !important;
  border-color: var(--red) !important;
}
:root[data-theme="green"] #app .link-btn.danger {
  color: var(--red) !important;
}

/* 第二轮复检剩下的：税负管理、退件管理里几个给深色底配的浅色字 */
:root[data-theme="green"] #app h2 {
  color: var(--ink) !important;
}
:root[data-theme="green"] #app .reason-board-title {
  color: var(--ink) !important;
}
:root[data-theme="green"] #app .side-name {
  color: var(--ink-2) !important;
}
:root[data-theme="green"] #app .side-val {
  color: var(--ink) !important;
}

/* ==========================================================================
 * ---- 主题切换入口（右上角色彩圆盘 + 下拉面板，由 wb_theme.js 建造） ----
 * ========================================================================== */
.wb-theme-btn {
  width: 28px !important;
  height: 28px !important;
  margin-right: 2px !important;
  padding: 0 !important;
  border: none !important;
  border-radius: 50% !important;
  background: transparent !important;
  color: inherit !important;
  cursor: pointer !important;
  font-size: 13px !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background .16s ease, color .16s ease, transform .12s ease !important;
}
.wb-theme-btn:hover {
  transform: scale(1.06) !important;
}
.wb-theme-btn:active {
  transform: scale(.94) !important;
}
:root[data-theme="green"] .wb-theme-btn {
  color: var(--ink-3) !important;
}
:root[data-theme="green"] .wb-theme-btn:hover {
  background: var(--brand-weak) !important;
  color: var(--brand-deep) !important;
}
:root[data-theme="dark"] .wb-theme-btn:hover {
  background: rgba(45, 212, 191, .16) !important;
  color: #5eead4 !important;
}

.wb-theme-wrap {
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
}
.wb-theme-panel {
  position: absolute !important;
  top: calc(100% + 8px) !important;
  right: 0 !important;
  z-index: 1200 !important;
  min-width: 188px !important;
  padding: 6px !important;
  border-radius: 12px !important;
  list-style: none !important;
}
.wb-theme-panel[hidden] {
  display: none !important;
}
:root[data-theme="green"] .wb-theme-panel {
  background: #fff !important;
  border: 1px solid var(--line) !important;
  box-shadow: 0 12px 32px -8px rgba(29, 43, 42, .22) !important;
}
:root[data-theme="dark"] .wb-theme-panel {
  background: #1e293b !important;
  border: 1px solid #334155 !important;
  box-shadow: 0 12px 32px -8px rgba(0, 0, 0, .55) !important;
}
.wb-theme-item {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  width: 100% !important;
  padding: 8px 10px !important;
  border: none !important;
  border-radius: 8px !important;
  background: transparent !important;
  cursor: pointer !important;
  font-size: 13px !important;
  text-align: left !important;
  white-space: nowrap !important;
}
:root[data-theme="green"] .wb-theme-item {
  color: var(--ink) !important;
}
:root[data-theme="green"] .wb-theme-item:hover {
  background: var(--brand-weak) !important;
}
:root[data-theme="green"] .wb-theme-item[aria-checked="true"] {
  background: var(--brand-weak) !important;
  color: var(--brand-deep) !important;
  font-weight: 600 !important;
}
:root[data-theme="dark"] .wb-theme-item {
  color: #e2e8f0 !important;
}
:root[data-theme="dark"] .wb-theme-item:hover {
  background: rgba(59, 130, 246, .14) !important;
}
:root[data-theme="dark"] .wb-theme-item[aria-checked="true"] {
  background: rgba(59, 130, 246, .18) !important;
  color: #93c5fd !important;
  font-weight: 600 !important;
}
.wb-theme-swatch {
  flex: 0 0 auto !important;
  width: 16px !important;
  height: 16px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(0, 0, 0, .10) !important;
}
.wb-theme-name {
  flex: 1 1 auto !important;
}
.wb-theme-tick {
  flex: 0 0 auto !important;
  font-size: 11px !important;
  opacity: 0 !important;
}
.wb-theme-item[aria-checked="true"] .wb-theme-tick {
  opacity: 1 !important;
}
.wb-theme-note {
  margin: 2px 10px 6px !important;
  font-size: 11px !important;
  line-height: 1.5 !important;
}
:root[data-theme="green"] .wb-theme-note {
  color: var(--ink-3) !important;
}
:root[data-theme="dark"] .wb-theme-note {
  color: #94a3b8 !important;
}

/* 胶囊不可用（业务员精简页）时，退化成视口右上角一枚独立圆盘 */
.wb-theme-btn.wb-theme-fixed {
  position: fixed !important;
  top: 12px !important;
  right: 16px !important;
  z-index: 901 !important;
  width: 32px !important;
  height: 32px !important;
  background: var(--card) !important;
  border: 1px solid var(--line) !important;
  box-shadow: var(--shadow) !important;
  color: var(--ink-2) !important;
  font-size: 14px !important;
}

/* ==========================================================================
 * wb-colrow-20261004  收款管理列表：金额列配色 + 已审核整行绿
 *
 * 背景：上面第 290 行已有
 *   :root[data-theme="green"] #app td { color: var(--ink) !important; }
 * 这条 !important 会连内联 style 一起压掉 —— 所以金额列蓝色/绿色、
 * 以及 tr 上的行级绿色全部失效（表现：全是深墨绿 #1d2b2a，看着像黑色）。
 *
 * 破法：给目标 td 加 class，用「td.xxx」这种更高特异性的选择器 + !important，
 * 按 CSS 特异性规则（更高特异性 + 双方都 !important → 高者胜）覆盖上面那条。
 * 放在文件末尾，同样特异性时后者胜，双保险。
 * ========================================================================== */

/* 1) 金额列基础色（未审核时） */
:root[data-theme="green"] #app td.wb-c-recv { color: #64748b !important; }  /* 应收账款 灰 */
:root[data-theme="green"] #app td.wb-c-amt  { color: var(--ink) !important; }  /* 收款金额 默认黑，审核后由 tr.wb-row-ok 覆盖为绿 */
:root[data-theme="green"] #app td.wb-c-off  { color: var(--ink) !important; }  /* 核销金额 默认黑，审核后由 tr.wb-row-ok 覆盖为绿 */
:root[data-theme="green"] #app td.wb-c-fee  { color: #64748b !important; }  /* 手续费   灰 */
:root[data-theme="green"] #app td.wb-c-com  { color: #64748b !important; }  /* 佣金     灰 */

/* 2) 已审核整行变绿：tr.wb-row-ok 下所有 td 统一 #059669，
 *    特异性 0,1,2,2 > 上面 0,1,1,1，且放最后 → 必定胜出。 */
:root[data-theme="green"] #app tr.wb-row-ok td,
:root[data-theme="green"] #app tr.wb-row-ok td.wb-c-recv,
:root[data-theme="green"] #app tr.wb-row-ok td.wb-c-amt,
:root[data-theme="green"] #app tr.wb-row-ok td.wb-c-off,
:root[data-theme="green"] #app tr.wb-row-ok td.wb-c-fee,
:root[data-theme="green"] #app tr.wb-row-ok td.wb-c-com {
  color: #059669 !important;
}
/* 已审核行里的操作按钮图标不要跟着变绿，保持按钮自身颜色 */
:root[data-theme="green"] #app tr.wb-row-ok td i {
  color: inherit;
}

/* ===== end wb-colrow-20261004 ===== */


/* ==========================================================================
 * wb-btn-novouch-20261004  未上传水单时的灰色「水单」占位按钮
 * 说明：JS 在「无凭证」时渲染 <span class="btn btn-small wb-btn-novouch">
 *      内有 <i class="fas fa-eye"> 与文字「 水单 」。
 * 需求：灰色（不是绿色主色），视觉上明显不可点，但仍占位对齐。
 * ========================================================================== */
:root[data-theme="green"] #app .btn.wb-btn-novouch,
:root[data-theme="green"] #app .btn.wb-btn-novouch span,
:root[data-theme="green"] #app .btn.wb-btn-novouch i,
#app .btn.wb-btn-novouch,
#app .btn.wb-btn-novouch span,
#app .btn.wb-btn-novouch i {
  color: #9aa4ad !important;
}
:root[data-theme="green"] #app .btn.wb-btn-novouch,
#app .btn.wb-btn-novouch {
  background: #f1f3f5 !important;
  border: 1px solid #dfe3e8 !important;
  cursor: not-allowed !important;
  opacity: 1 !important;
  box-shadow: none !important;
}
:root[data-theme="green"] #app .btn.wb-btn-novouch:hover,
#app .btn.wb-btn-novouch:hover {
  background: #f1f3f5 !important;
  border-color: #dfe3e8 !important;
}

/* 已审核行整行变绿时，不要把这个灰色占位按钮也染绿 */
:root[data-theme="green"] #app tr.wb-row-ok td .btn.wb-btn-novouch,
:root[data-theme="green"] #app tr.wb-row-ok td .btn.wb-btn-novouch span,
:root[data-theme="green"] #app tr.wb-row-ok td .btn.wb-btn-novouch i {
  color: #9aa4ad !important;
}

/* ===== end wb-btn-novouch-20261004 ===== */


/* ==========================================================================
 * ledgertop-20261004  台账总表顶部搜索条美化（原半透明深灰 → 白底浅绿描边卡片）
 * 范围：仅 /#/ledger 页（.search-section 全站仅台账模块使用）
 * 回滚：删除本段即可
 * ========================================================================== */
.page-content.active .search-section {
  background: #ffffff !important;
  border: 1px solid #e6eeec !important;
  box-shadow: 0 1px 3px rgba(16, 24, 40, 0.04) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  padding: 14px 18px !important;
  margin-bottom: 16px !important;
}
.page-content.active .search-section .search-box {
  background: #ffffff !important;
  border: 1px solid #dbe6e3 !important;
}
.page-content.active .search-section .search-box:focus-within {
  background: #ffffff !important;
  border-color: #009580 !important;
  box-shadow: 0 0 0 3px rgba(0, 149, 128, 0.12) !important;
}
.page-content.active .search-section .search-box input {
  color: #1f2d2b !important;
}
.page-content.active .search-section .search-box input::placeholder {
  color: #9db3ae !important;
}
.page-content.active .search-section .search-icon {
  color: #9db3ae !important;
}
.page-content.active .search-section .filter-select {
  background: #ffffff !important;
  border: 1px solid #dbe6e3 !important;
  color: #1f2d2b !important;
}
.page-content.active .search-section .filter-select:hover {
  background: #f0faf8 !important;
  border-color: #009580 !important;
  color: #00796e !important;
}
/* ===== end ledgertop-20261004 ===== */


/* ==========================================================================
 * ledgermonths-20261004  台账总表：有数据月份淡绿 / 无数据月份白
 * 配合 Ledger chunk 里月份 td 的 class：wb-mcell + wb-m-has|wb-m-empty
 * 回滚：删除本段即可（JS 里 class 保留也不影响）
 * ========================================================================== */
.page-content.active table td.wb-mcell {
  font-variant-numeric: tabular-nums;
}
.page-content.active table td.wb-mcell.wb-m-has {
  background: #eef8f5 !important;
}
.page-content.active table td.wb-mcell.wb-m-empty {
  background: #ffffff !important;
}
/* 悬浮行时给有数据格一点加深，保持可读 */
.page-content.active table tbody tr:hover td.wb-mcell.wb-m-has {
  background: #e2f3ed !important;
}
/* ===== end ledgermonths-20261004 ===== */

/* ===== ledgerblack-20261004 台账总表：金额文字统一黑色 =====
   回滚：删除本段，并把 index.html 的 wb_theme.css?v=20261004i 改回 v=20261004h */
.page-content.active table td.wb-mcell{color:#1f2d2b!important}
.page-content.active table tr:has(> td.wb-mcell) > td:nth-last-child(2),
.page-content.active table tr:has(> td.wb-mcell) > td:last-child{color:#1f2d2b!important}
.page-content.active table tr:has(> td.wb-mcell) > td:nth-last-child(2) *,
.page-content.active table tr:has(> td.wb-mcell) > td:last-child *{color:#1f2d2b!important}
