/* ============================================================
   正奇石材ERP系统 - 统一样式表 (zhengqi.css)
   基于版本: zhengqi-backup.css
   整合来源: A.html 现代化表格/按钮/输入框样式
   创建日期: 2026-04-18
   修改日期: 2026-04-25
   说明: 合并原有ERP样式与现代化UI样式,增加UniDBGrid表格、
         操作按钮及UniGUI输入控件的现代化显示
         聚焦效果:使用蓝色系（#4096ff）
         按钮hover时禁用颜色变化(保持原色)
         主色调:蓝色 #1677ff（依据 login.html 色调风格）
   ============================================================ */


/* ============================================================
   一、CSS变量定义
   ============================================================ */
:root {
    /* 主色调 */
    --primary-color: #1677ff;
    --primary-dark: #0958d9;
    --primary-light: #4096ff;
    --accent-color: #4096ff;

    /* 语义色 */
    --success-color: #52c41a;
    --warning-color: #faad14;
    --danger-color: #ff4d4f;
    --info-color: #1677ff;

    /* 灰度 */
    --dark-color: #212121;
    --light-color: #FAFAFA;
    --gray-50: #FAFAFA;
    --gray-100: #F5F5F5;
    --gray-200: #EEEEEE;
    --gray-300: #E0E0E0;
    --gray-400: #BDBDBD;
    --gray-500: #9E9E9E;
    --gray-600: #757575;
    --gray-700: #616161;
    --gray-800: #424242;
    --gray-900: #212121;

    /* 圆角 */
    --border-radius-sm: 6px;
    --border-radius-md: 8px;
    --border-radius-lg: 12px;

    /* 阴影 */
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.03), 0 1px 6px -1px rgba(0, 0, 0, 0.02), 0 2px 4px 0 rgba(0, 0, 0, 0.02);
    --shadow-md: 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
    --shadow-lg: 0 10px 30px 0 rgba(0, 0, 0, 0.10), 0 6px 12px -4px rgba(0, 0, 0, 0.12), 0 12px 36px 12px rgba(0, 0, 0, 0.06);

    /* 过渡 */
    --transition-fast: 150ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-medium: 250ms cubic-bezier(0.4, 0, 0.2, 1);
    --transition-slow: 350ms cubic-bezier(0.4, 0, 0.2, 1);

    /* Toast */
    --toast-bg-success: rgba(82, 196, 26, 0.95);
    --toast-bg-warning: rgba(250, 173, 20, 0.95);
    --toast-bg-error: rgba(255, 77, 79, 0.95);
    --toast-bg-info: rgba(22, 119, 255, 0.95);
    --toast-text-light: rgba(255, 255, 255, 0.95);
    --toast-text-dark: rgba(33, 33, 33, 0.95);

    /* 页面背景 */
    --page-bg-gradient: #F0F2F5;

    /* 焦点 - 蓝色外发光(与hover同色) */
    --focus-color: #4096ff;
    --focus-shadow: 0 0 0 2px rgba(22, 119, 255, 0.1);

    /* ---- 新增: 现代化ERP配色 ---- */
    --zq-primary: #1677ff;
    --zq-primary-hover: #4096ff;
    --zq-primary-active: #0958d9;
    --zq-success: #52c41a;
    --zq-success-hover: #73d13d;
    --zq-success-active: #389e0d;
    --zq-danger: #ff4d4f;
    --zq-danger-hover: #ff7875;
    --zq-danger-active: #d9363e;
    --zq-warning: #faad14;
    --zq-warning-hover: #ffc53d;
    --zq-warning-active: #d48806;
    --zq-info: #17a2b8;
    --zq-info-hover: #138496;
    --zq-info-active: #117a8b;
    --zq-purple: #17a2b8;
    --zq-purple-hover: #20b2c8;
    --zq-purple-active: #117a8b;
    --zq-cyan: #13c2c2;
    --zq-cyan-hover: #36cfc9;
    --zq-cyan-active: #08979c;
    --zq-orange: #fa8c16;
    --zq-orange-hover: #ffa940;
    --zq-orange-active: #d46b08;
    --zq-secondary: #6c757d;
    --zq-secondary-hover: #5a6268;
    --zq-secondary-active: #545b62;
    --zq-text-primary: #333333;
    --zq-text-regular: #666666;
    --zq-text-secondary: #999999;
    --zq-text-placeholder: #c0c4cc;
    --zq-border-base: #d9d9d9;
    --zq-border-light: #e8e8e8;
    --zq-border-lighter: #f0f0f0;
    --zq-bg-page: #f0f2f5;
    --zq-bg-card: #ffffff;
    --zq-bg-hover: #f5f7fa;
    --zq-bg-selected: #e6f4ff;
    --zq-radius-base: 4px;
    --zq-radius-lg: 8px;
    --zq-font-size-base: 14px;
    --zq-font-size-sm: 12px;
    --zq-font-size-lg: 16px;
    --zq-font-family: 'Microsoft YaHei', 'PingFang SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}


/* ============================================================
   二、全局样式重置
   ============================================================ */

/* 防止关闭标签/布局重排时,body 默认白底从视口边缘闪现
   把 html/body 背景设成与 ERP 主区一致的中性灰 */
html,
body,
.x-viewport {
    background: #F0F2F5 !important;
    background-color: #F0F2F5 !important;
    outline: none !important;
}

/* TUniFrame 主容器背景 - 确保浅灰色,只影响直接子元素 */
/* 注: 通过 .UniFrameBase 类设置,见下方 */

/* Tab 面板内所有内容区域 - 强制浅灰色背景，顶部品牌蓝边框 */
.x-tab-panel-body,
.x-tabpanel-body,
.x-tab-panel-body-default,
.x-tabpanel-body-default,
.x-tab-panel > .x-panel-body,
.x-tabpanel > .x-panel-body {
    background: #F0F2F5 !important;
    background-color: #F0F2F5 !important;
    border-top: 2px solid #4096ff !important;
}

/* TabSheet 内部面板也强制浅灰色背景 */
.x-tab-panel-body .x-panel-body,
.x-tabpanel-body .x-panel-body {
    background: #F0F2F5 !important;
    background-color: #F0F2F5 !important;
}

/* TabSheet 内的 x-panel-body-default 强制浅灰色背景 */
.x-tab-panel-body .x-panel-body-default,
.x-tabpanel-body .x-panel-body-default {
    background: #F0F2F5 !important;
    background-color: #F0F2F5 !important;
}

/* ============================================================
   UniFrameBase 样式类 (TUniFrame 通过 cls 设置)
   强制设置 Frame 背景为主题浅灰色，不影响子组件
   ============================================================ */
.UniFrameBase,
.x-panel.UniFrameBase {
    background: #F0F2F5 !important;
    background-color: #F0F2F5 !important;
}

.UniFrameBase > .x-panel-body,
.x-panel.UniFrameBase > .x-panel-body {
    background: #F0F2F5 !important;
    background-color: #F0F2F5 !important;
}

/* UniFrameBase 内部子组件保持原有背景 */
.UniFrameBase .x-panel-body .x-panel-body,
.UniFrameBase .x-container,
.UniFrameBase .x-form-item,
.UniFrameBase .x-grid {
    background: inherit !important;
}




/* 可见焦点环：键盘导航显示品牌色描边（仅输入类控件保留；按钮类一律不显示焦点框，见文件末尾 C 段） */
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
}
/* 鼠标点击/按压态不显示焦点环（仅键盘导航显示） */
button:active,
input:active,
select:active,
textarea:active {
    outline: none;
}
/* 移除移动端点击高亮闪烁（保留键盘焦点环） */
.x-btn,
.x-btn * {
    -webkit-tap-highlight-color: transparent;
}
@media (prefers-reduced-motion: reduce) {
    * { transition: none !important; animation: none !important; }
}


/* ============================================================
   三、全局文字与辅助颜色类
   ============================================================ */
.text-blue { color: #1677ff; }
.text-green { color: #52c41a; }
.text-purple { color: #9C27B0; }
.text-red { color: #ff4d4f; }
.text-orange { color: #faad14; }
.text-indigo { color: #3F51B5; }
.text-teal { color: #009688; }
.text-gray { color: #757575; }


/* ============================================================
   三、遮罩层
   ============================================================ */
/* 默认隐藏所有 .x-mask 防止关闭标签/布局重排时整个页面闪白边 */
.x-mask {
    background-color: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    display: none !important;
}

/* 模态弹窗(MessageDlg/ShowMask)的 mask: 当 UniGUI 把它显示出来时
   (即未带 inline display:none / 未加 .x-hidden 类)才放行显示。
   这样:
   - 关闭弹窗时 UniGUI 给 mask 设 display:none → :not 命中 → 不显示,页面可操作
   - 打开弹窗时 mask 无 display:none → :not 通过 → 显示半透明黑底 */
body > .x-mask:not([style*="display: none"]):not([style*="display:none"]):not(.x-hidden):not(.x-hidden-display):not(.x-hide-display),
html > .x-mask:not([style*="display: none"]):not([style*="display:none"]):not(.x-hidden):not(.x-hidden-display):not(.x-hide-display),
.x-viewport > .x-mask:not([style*="display: none"]):not([style*="display:none"]):not(.x-hidden):not(.x-hidden-display):not(.x-hide-display) {
    display: block !important;
    background-color: rgba(0, 0, 0, 0.45) !important;
}

/* 组件数据加载遮罩: 隐藏(只保留 ShowMask 和 MessageDlg 的全屏遮罩)
   - 这些是嵌套在数据组件内部的局部遮罩
   - body / 顶层窗体的 .x-mask 不受影响(用于 ShowMask / MessageDlg 模态背景) */
.x-grid .x-mask,
.x-grid .x-mask-msg,
.x-dataview .x-mask,
.x-dataview .x-mask-msg,
.x-tree-grid .x-mask,
.x-tree-grid .x-mask-msg,
.x-tree-panel .x-mask,
.x-tree-panel .x-mask-msg,
.x-tree-view .x-mask,
.x-boundlist .x-mask,
.x-boundlist .x-mask-msg,
.x-combo-list .x-mask,
.x-column-header .x-mask,
.x-tab-bar .x-mask,
.x-tab-panel .x-mask,
.x-tab-panel .x-mask-msg,
.x-tabpanel .x-mask,
.x-tabpanel .x-mask-msg,
.x-tab-panel-body .x-mask,
.x-tab-panel-body .x-mask-msg,
.x-tabpanel-body .x-mask,
.x-tabpanel-body .x-mask-msg,
.x-portlet .x-mask,
.x-pivotgrid .x-mask,
.x-locking .x-mask,
.x-grid-body .x-mask,
.x-grid-view .x-mask,
.x-grid-header .x-mask,
.x-grid-title .x-mask,
.x-dataview-atom .x-mask {
    display: none !important;
}


/* ============================================================
   ShowMask 提示框 - 现代化样式(白色卡片 + CSS 蓝色 spinner)
   只作用于顶层 .x-mask-msg(ShowMask 创建),不影响已被上方隐藏的组件内遮罩
   ============================================================ */

/* 全屏遮罩背景 - 半透明黑 */
.x-mask {
    background-color: rgba(0, 0, 0, 0.45) !important;
}

/* 消息卡片 - 白底、圆角、阴影、横向布局 */
.x-mask-msg,
div.x-mask-msg {
    background: #ffffff !important;
    background-image: none !important;
    border: none !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.06) !important;
    padding: 18px 24px !important;
    color: #333333 !important;
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
    font-size: 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    white-space: nowrap !important;
}

/* 清除 ExtJS 默认 loading 图(背景图) */
.x-mask-msg,
.x-mask-msg * {
    background-image: none !important;
}

/* 内部容器和文字 - 透明背景,深灰字 */
.x-mask-msg > div,
.x-mask-msg .x-mask-msg-inner,
.x-mask-msg .x-mask-msg-text {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    color: #555555 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 1.5 !important;
    white-space: nowrap !important;
}

/* 自定义蓝色 spinner - 双圈浅蓝底 + 蓝色顶边,旋转 */
.x-mask-msg::before {
    content: '' !important;
    display: inline-block !important;
    width: 22px !important;
    height: 22px !important;
    margin-right: 12px !important;
    border: 2.5px solid #e6f4ff !important;
    border-top-color: #1677ff !important;
    border-radius: 50% !important;
    animation: zhengqiMaskSpin 0.7s linear infinite !important;
    box-sizing: border-box !important;
    flex-shrink: 0 !important;
}

@keyframes zhengqiMaskSpin {
    to { transform: rotate(360deg); }
}


/* ============================================================
   四、单据号与状态标签样式 (DrawColumnCell专用Cls)
   ============================================================ */


/* --- 1. 单据号样式 --- */
/* ========== 单据号样式（强制蓝色，带下划线） ========== */
.x-grid-cell .bill-no,
.x-grid-cell-inner .bill-no,
.bill-no {
    color: #1677ff !important;
    text-decoration: underline !important;
    cursor: pointer !important;
    font-weight: 500 !important;
    padding: 0 4px !important;
    white-space: nowrap !important;
}

.x-grid-cell .bill-no:hover,
.x-grid-cell-inner .bill-no:hover,
.bill-no:hover {
    color: #4096ff !important;
    text-decoration: underline !important;
}

/* ========== 状态标签样式（徽章效果） ========== */


/* 基础徽章样式 - 文字水平和垂直居中，边框刚好包裹文字 */
.status-tag {
    display: inline-block !important;
    padding: 2px 8px !important;
    border-radius: 12px !important;
    font-size: 12px !important;
    line-height: 18px !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
    text-align: center !important;
    vertical-align: middle !important;
}

/* 状态列单元格内容水平居中
   徽章本身是 inline-block + auto 宽度,默认贴在单元格左侧。
   通过给单元格 .x-grid-cell 设置 text-align:center 让徽章居中。
   覆盖两种渲染方式:
   - 类名在 .x-grid-cell 上 (DrawColumnCell 给 cell 设置 Cls)
   - 类名在 .x-grid-cell-inner 上 (DrawColumnCell 给 inner 设置 Cls),
     用 :has() 定位其父单元格
   - .status-tag 作为子元素存在的情况 */
.x-grid-cell.status-draft,
.x-grid-cell.status-formal,
.x-grid-cell.status-void,
.x-grid-cell.status-approved,
.x-grid-cell.status-rejected,
.x-grid-cell.status-submitted,
.x-grid-cell.status-closed,
.x-grid-cell.status-enabled,
.x-grid-cell.status-disabled,
.x-grid-cell:has(.status-tag),
.x-grid-cell:has(.x-grid-cell-inner.status-draft),
.x-grid-cell:has(.x-grid-cell-inner.status-formal),
.x-grid-cell:has(.x-grid-cell-inner.status-void),
.x-grid-cell:has(.x-grid-cell-inner.status-approved),
.x-grid-cell:has(.x-grid-cell-inner.status-rejected),
.x-grid-cell:has(.x-grid-cell-inner.status-submitted),
.x-grid-cell:has(.x-grid-cell-inner.status-closed),
.x-grid-cell:has(.x-grid-cell-inner.status-enabled),
.x-grid-cell:has(.x-grid-cell-inner.status-disabled) {
    text-align: center !important;
}

.x-grid-cell-inner .status-tag,
.x-grid-cell-inner .status-draft,
.x-grid-cell-inner .status-formal,
.x-grid-cell-inner .status-void,
.x-grid-cell-inner .status-approved,
.x-grid-cell-inner .status-rejected,
.x-grid-cell-inner .status-submitted,
.x-grid-cell-inner .status-closed,
.x-grid-cell-inner .status-enabled,
.x-grid-cell-inner .status-disabled {
    display: inline-block !important;
    position: relative !important;
    width: auto !important;
    height: auto !important;
    box-sizing: content-box !important;
}

/* 当 DrawColumnCell 只设置 Cls 类名时，单元格内容显示为徽章（只包裹文字） */
/* 方案：在 x-grid-cell 上设置类名时，通过子选择器影响 x-grid-cell-inner */
/* 关键：使用 inline-block 让宽高只包裹文字 */

/* 草稿 - 金色 */
.x-grid-cell.status-draft > .x-grid-cell-inner,
.x-grid-cell-inner.status-draft {
    background: #faad14 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 12px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    padding: 2px 10px !important;
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    line-height: 1 !important;
}

/* 正式 - 翠绿色 */
.x-grid-cell.status-formal > .x-grid-cell-inner,
.x-grid-cell-inner.status-formal {
    background: #52c41a !important;
    color: #fff !important;
    border: none !important;
    border-radius: 12px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    padding: 2px 10px !important;
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    line-height: 1 !important;
}

/* 作废 - 红色 */
.x-grid-cell.status-void > .x-grid-cell-inner,
.x-grid-cell-inner.status-void {
    background: #ff4d4f !important;
    color: #fff !important;
    border: none !important;
    border-radius: 12px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    padding: 2px 10px !important;
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    line-height: 1 !important;
}

/* 已审核 - 蓝色 */
.x-grid-cell.status-approved > .x-grid-cell-inner,
.x-grid-cell-inner.status-approved {
    background: #1677ff !important;
    color: #fff !important;
    border: none !important;
    border-radius: 12px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    padding: 2px 10px !important;
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    line-height: 1 !important;
}

/* 驳回 - 橙色 */
.x-grid-cell.status-rejected > .x-grid-cell-inner,
.x-grid-cell-inner.status-rejected {
    background: #fa8c16 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 12px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    padding: 2px 10px !important;
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    line-height: 1 !important;
}

/* 已提交 - 青色 */
.x-grid-cell.status-submitted > .x-grid-cell-inner,
.x-grid-cell-inner.status-submitted {
    background: #13c2c2 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 12px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    padding: 2px 10px !important;
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    line-height: 1 !important;
}

/* 已关闭 - 深灰色 */
.x-grid-cell.status-closed > .x-grid-cell-inner,
.x-grid-cell-inner.status-closed {
    background: #595959 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 12px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    padding: 2px 10px !important;
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    line-height: 1 !important;
}

/* 启用 - 绿色 */
.x-grid-cell.status-enabled > .x-grid-cell-inner,
.x-grid-cell-inner.status-enabled {
    background: #52c41a !important;
    color: #fff !important;
    border: none !important;
    border-radius: 12px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    padding: 2px 10px !important;
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    line-height: 1 !important;
}

/* 停用 - 中性灰 */
.x-grid-cell.status-disabled > .x-grid-cell-inner,
.x-grid-cell-inner.status-disabled {
    background: #9e9e9e !important;
    color: #fff !important;
    border: none !important;
    border-radius: 12px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    padding: 2px 10px !important;
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    line-height: 1 !important;
}





/* ========== 其他特殊文字颜色 ========== */
.bluetext {
    color: #1677ff !important;
}
.redtext {
    color: red !important;
}
.greentext {
    color: green !important;
}


/* ============================================================
   五、工具栏样式 (来自A.html toolbar样式)
   ============================================================ */

/* 现代化工具栏基础样式 */
.toolbar {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
    padding: 12px 16px;
    background: #fafafa;
    border-radius: 4px;
    border: 1px solid #e8e8e8;
    flex-wrap: wrap;
    align-items: center;
}
.toolbar-group { display: flex; gap: 8px; align-items: center; }
.toolbar-divider { width: 1px; height: 24px; background: #d9d9d9; margin: 0 8px; }

/* UniGUI 工具栏样式 */
.x-toolbar {
    background: #fafafa !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 4px !important;
    padding: 4px 16px !important;
}
.x-toolbar .x-btn {
    background: #1677ff;
    border: 1px solid #1677ff;
    border-radius: 4px;
    color: #ffffff;
    font-size: 14px;
    padding: 6px 16px;
    transition: all 0.3s ease;
    outline: none !important;
}
.x-toolbar .x-btn:focus,
.x-toolbar .x-btn:active {
    outline: none !important;
    box-shadow: none !important;
}
.x-toolbar .x-btn-over {
    background: #0958d9;
    border-color: #0958d9;
    color: #ffffff;
}
.x-toolbar .x-btn-pressed {
    background: #003eb3;
    border-color: #003eb3;
    color: #ffffff;
}
.x-toolbar .x-toolbar-text {
    color: #666666;
    font-size: 14px;
}
.x-toolbar-body-el {
    padding: 0 !important;
    min-height: auto !important;
}


/* ========== TUniPanel / TUniContainerPanel 面板样式 ========== */
/* 面板整体 - 无边框,白色背景 */
.x-panel,
.x-panel-default,
.x-container,
.x-container-default {
    border: none !important;
    border-width: 0 !important;
	/*
    background: #fff !important;
    background-color: #fff !important;
	*/
}

/* 面板头部 - 无边框,白色背景 */
.x-panel-header,
.x-panel-header-default {
    background: #fff !important;
    background-color: #fff !important;
    border: none !important;
    border-bottom: 1px solid #e8e8e8 !important;
    padding: 10px 16px !important;
    min-height: 28px !important;
}

.x-panel-header-title,
.x-panel-header-title-default {
    color: #333 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
}


/* 通过cls属性设置的类名选择器 - 白色背景 */
.PnlToolbar,
.PnlActions,
.PnlSearch,
.PnlFooter,
.panel-toolbar,
.panel-card,
.panel-content {
	position: relative !important; /* 必须相对定位 */
    background: #fff !important;
    background-color: #fff !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    padding: 0 !important;
}

/* PnlToolbar 和 PnlSearch 面板 - 无外边距（由 DFM 控制） */
.PnlToolbar,
.PnlSearch {
    /* margin 由 DFM 中的 Margins 属性控制 */
}

/* 其他面板 - 无外边距 */
.PnlActions,
.PnlFooter,
.panel-toolbar,
.panel-card,
.panel-content {
    margin: 0 !important;
}

/* 面板主体背景色 - 白色 */
.PnlToolbar > .x-panel-body,
.PnlActions > .x-panel-body,
.PnlSearch > .x-panel-body,
.PnlFooter > .x-panel-body,
.panel-toolbar > .x-panel-body,
.panel-card > .x-panel-body,
.panel-content > .x-panel-body {
    background: #fff !important;
    background-color: #fff !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
}

/* PnlToolbar面板 - 确保无边框占用空间 */
.PnlToolbar,
.PnlActions,
.panel-toolbar {
    border: none !important;
    padding: 0 !important;
    background: #fff !important;
    background-color: #fff !important;
}

/* PnlToolbar内部元素 - 确保从顶部开始,只影响直接子元素 */
.PnlToolbar > .x-panel-bwrap,
.PnlToolbar > .x-panel-mc,
.PnlToolbar > .x-panel-tbar,
.PnlToolbar > .x-panel-bbar {
    padding: 0 !important;
    margin: 0 !important;
    background: #fff !important;
    background-color: #fff !important;
}

/* TUniHTMLFrame组件排除面板样式 - 通过cls属性设置HTMLFrame */
.HTMLFrame,
.x-htmlframe {
    background: transparent !important;
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.HTMLFrame .x-panel-body,
.x-htmlframe .x-panel-body {
    background: transparent !important;
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ============================================================
 强制覆盖:TUniPanel & TUniContainerPanel - 纯白无边框
 ============================================================ */

/* --- 1. TUniPanel 全局覆盖 --- */
/* 匹配所有 Panel 及其变体 */
.x-panel,
.x-panel-default,
.x-container,
.x-container-default,
.x-panel-body,
.x-panel-body-default {
    /*
	background: #ffffff !important;
    background-color: #ffffff !important;
	*/
    border: none !important;
    border-width: 0 !important;
    box-shadow: none !important; /* 移除可能的阴影 */
    overflow: hidden !important;
}

/* --- 2. TUniContainerPanel 专用覆盖 --- */
/* 通过 Class 属性设置的 ContainerPanel */
.x-containerpanel {
    background: #ffffff !important;
    background-color: #ffffff !important;
    /* 【关键修改】这里将 border: 1px solid ... 改为了 border: none */
    border: none !important;
    border-radius: 0 !important; /* 如果上面保留了 radius,这里强制为 0 */
    padding: 0 !important;
    margin: 0 !important;
}

/* --- 3. 内部 Body 块 --- */
.x-panel-body,
.x-containerpanel .x-panel-body {
	/*
    background: #ffffff !important;
	*/
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}



/* ========== TUniScrollBox 滚动框 ========== */
.x-scrollbox {
    background: #fff !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 8px !important;
    margin: 4px 0 !important;
}

/* ========== TUniGroupBox 分组框 ========== */
.x-fieldset,
.x-fieldset-default {
    background: #fff !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 8px !important;
    padding: 16px !important;
    margin: 4px 0 !important;
}

.x-fieldset-header,
.x-fieldset-header-default {
    background: transparent !important;
    border-bottom: 1px solid #f0f0f0 !important;
    padding: 8px 0 !important;
    margin-bottom: 12px !important;
}

.x-fieldset-header-text {
    color: #333 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    padding-left: 8px !important;
    border-left: 3px solid #1677ff !important;
}

/* ========== 工具栏面板样式类 ========== */
/* 使用方式: 给Panel设置 LayoutAttribs.cls = 'panel-toolbar' */
.panel-toolbar,
.x-panel.panel-toolbar {
    background: #fff !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 8px !important;
    padding: 0 16px !important;
}

/* 卡片面板样式 */
.panel-card,
.x-panel.panel-card {
    background: #fff !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
}

.panel-card .x-panel-header,
.x-panel.panel-card .x-panel-header {
    background: #fff !important;
    border-bottom: 1px solid #e8e8e8 !important;
    padding: 16px 20px !important;
}

.panel-card .x-panel-body,
.x-panel.panel-card .x-panel-body {
    padding: 20px !important;
}

/* 内容面板样式 */
.panel-content,
.x-panel.panel-content {
    background: #fff !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 8px !important;
    padding: 20px !important;
}

/* ========== TUniHTMLFrame 组件样式 ========== */
.x-htmlframe,
.x-html {
    padding: 0 !important;
    margin: 0 !important;
}

.x-htmlframe .x-panel-body,
.x-html .x-panel-body {
    padding: 0 !important;
    margin: 0 !important;
}

/* 搜索栏面板样式 */
.panel-search,
.PnlSearch {
    background: #fff !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 8px !important;
    padding: 0px !important;
    margin-bottom: 0px !important;
}

/* 操作栏面板样式 - 白色背景 */
.panel-actions,
.PnlActions,
.PnlToolbar {
    background: #fff !important;
    background-color: #fff !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 8px !important;
}

/* PnlToolbar 面板结构元素 - 只影响面板自身的结构,不影响子组件 */
.PnlToolbar > .x-panel-bwrap,
.PnlToolbar > .x-panel-mc,
.PnlToolbar > .x-panel-body {
    background: #fff !important;
    background-color: #fff !important;
}

/* 底部栏面板样式 - 白色背景 */
.panel-footer,
.PnlFooter,
.PnlBottom {
    background: #fff !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 8px !important;
    padding: 4px 16px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

/* 状态栏面板样式 - 白色背景,无Margin,有边框 */
.PnlStatusBar {
    background: #fff !important;
    background-color: #fff !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 8px !important;
    padding: 4px 16px !important;
    margin: 0 !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

/* PnlStatusBar 面板结构元素 - 只影响面板自身的结构,不影响子组件 */
.PnlStatusBar > .x-panel-bwrap,
.PnlStatusBar > .x-panel-mc,
.PnlStatusBar > .x-panel-body {
    background: #fff !important;
    background-color: #fff !important;
}

/* 菜单面板样式 - 经典深色侧边栏风格,不受父级干扰 */
.PnlMenu,
.x-panel.PnlMenu {
    background: #2c3e50 !important;
    background-color: #2c3e50 !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    isolation: isolate !important;
}

/* PnlMenu 面板结构元素 - 强制深色背景,提高优先级 */
.PnlMenu > .x-panel-bwrap,
.PnlMenu > .x-panel-mc,
.PnlMenu > .x-panel-body,
.x-panel.PnlMenu > .x-panel-bwrap,
.x-panel.PnlMenu > .x-panel-mc,
.x-panel.PnlMenu > .x-panel-body {
    background: #2c3e50 !important;
    background-color: #2c3e50 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
}

/* PnlMenu 面板头部 - 深色背景 */
.PnlMenu > .x-panel-header,
.x-panel.PnlMenu > .x-panel-header {
    background: #34495e !important;
    background-color: #34495e !important;
    border-bottom: 1px solid #3d566e !important;
    border-radius: 0 !important;
    padding: 12px 16px !important;
}

/* PnlMenu 面板头部标题 - 白色文字 */
.PnlMenu > .x-panel-header .x-panel-header-title {
    color: #ecf0f1 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}


/* 主面板样式 - 白色背景,直角,不影响子组件 */
.PnlMain {
    background: #fff !important;
    background-color: #fff !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
}

.lblSlogan {
    letter-spacing: 1px;
    border-top: 1px solid #e0e0e0;
    padding-top: 8px;
    margin-top: 4px;
    margin-right: 2px;
}



/* PnlMain 面板结构元素 - 只影响面板自身的直接子元素,不影响子组件 */
.PnlMain > .x-panel-bwrap,
.PnlMain > .x-panel-mc,
.PnlMain > .x-panel-body {
    background: #fff !important;
    background-color: #fff !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
}

/* 公司Logo图片 - 64x64,水平居中,上下边距适当 */
.ImgLogo {
    width: 16px !important;
    height: 16px !important;
    max-width: 16px !important;
    max-height: 16px !important;
    min-width: 16px !important;
    min-height: 16px !important;
    display: block !important;
    margin: auto auto auto auto !important;  /* 上20px 下10px 水平居中 */
    padding: 0 !important;
    border: none !important;
    background: transparent !important;
    background-color: transparent !important;
    object-fit: contain !important;
}

/* Logo图片 - 带阴影效果 */
.ImgLogo-shadow {
    max-width: 100% !important;
    height: auto !important;
    max-height: 60px !important;
    width: auto !important;
    display: inline-block !important;
    vertical-align: middle !important;
    margin: 0 !important;
    padding: 8px !important;
    border: none !important;
    object-fit: contain !important;
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.1)) !important;
    transition: filter 0.3s ease !important;
}

.ImgLogo-shadow:hover {
    filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.15)) !important;
}

/* Logo图片 - 圆角边框效果 */
.ImgLogo-rounded {
    max-width: 100% !important;
    height: auto !important;
    max-height: 60px !important;
    width: auto !important;
    display: inline-block !important;
    vertical-align: middle !important;
    margin: 0 !important;
    padding: 4px !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 8px !important;
    object-fit: contain !important;
    background: #fff !important;
}

/* Logo图片 - 大尺寸版本 */
.ImgLogo-large {
    max-width: 100% !important;
    height: auto !important;
    max-height: 80px !important;
    width: auto !important;
    display: inline-block !important;
    vertical-align: middle !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    object-fit: contain !important;
}

/* Logo图片 - 小尺寸版本 */
.ImgLogo-small {
    max-width: 100% !important;
    height: auto !important;
    max-height: 40px !important;
    width: auto !important;
    display: inline-block !important;
    vertical-align: middle !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    object-fit: contain !important;
}

/* 分隔线面板 */
.panel-divider,
.x-panel.panel-divider {
    width: 1px !important;
    height: 24px !important;
    background: #d9d9d9 !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 8px !important;
}

/* 公司名称标签样式 - 美观大气,水平居中 */
.LblCompany {
    font-family: 'Microsoft YaHei', 'PingFang SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    color: #1a1a1a !important;
    letter-spacing: 2px !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important;
    padding: 8px 20px !important;
    margin: 0 auto !important;
    display: block !important;
    text-align: center !important;
    vertical-align: middle !important;
    background: transparent !important;
    position: relative !important;
}

/* 公司名称标签 - 带装饰线版本 */
.LblCompany-decorated {
    font-family: 'Microsoft YaHei', 'PingFang SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    font-size: 26px !important;
    font-weight: 700 !important;
    color: #2c3e50 !important;
    letter-spacing: 3px !important;
    padding: 12px 24px !important;
    margin: 0 !important;
    display: inline-block !important;
    vertical-align: middle !important;
    position: relative !important;
    border-left: 4px solid #1677ff !important;
    background: linear-gradient(to right, rgba(22, 119, 255, 0.05), transparent) !important;
}

/* 公司名称标签 - 简洁版本 */
.LblCompany-simple {
    font-family: 'Microsoft YaHei', 'PingFang SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    font-size: 22px !important;
    font-weight: 500 !important;
    color: #333 !important;
    letter-spacing: 1px !important;
    padding: 6px 16px !important;
    margin: 0 !important;
    display: inline-block !important;
    vertical-align: middle !important;
}

/* 公司名称标签 - 品牌色版本(蓝色主题) */
.LblCompany-brand {
    font-family: 'Microsoft YaHei', 'PingFang SC', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    color: #b0120a !important;
    letter-spacing: 2px !important;
    text-shadow: 0 1px 3px rgba(176, 18, 10, 0.2) !important;
    padding: 10px 20px !important;
    margin: 0 !important;
    display: inline-block !important;
    vertical-align: middle !important;
    border-bottom: 3px solid #b0120a !important;
}


/* ============================================================
   六、通用布局与辅助
   ============================================================ */
.x-abs-layout-item {
    font-size: 14px !important;
    font-family: 'Roboto', 'Segoe UI', Arial, sans-serif !important;
}

/* 圆角标签 */
.circular {
    width: 100%;
    height: auto;
    position: relative;
    overflow: hidden;
}
.circular .flag {
    position: absolute;
    text-align: center;
    font-weight: bold;
    height: 35px;
    width: 35px;
    background-color: rgb(218,18,38);
    color: #fff;
    line-height: 35px;
    overflow: hidden;
}
.circular .flag-left { border-radius: 60%!important; left: 0px; top: 0px; }
.circular .flag-right { border-radius: 60%!important; right: 0px; top: 0px; }

/* 角标 */
.corner {
    width: 100%;
    height: auto;
    position: relative;
    overflow: hidden;
}
.corner .flag {
    position: absolute;
    height: 20px;
    line-height: 20px;
    text-align: center;
    font-weight: bold;
    width: 74px;
    background-color: rgb(218,18,38);
    color: #fff;
    overflow: hidden;
}
.corner .flag-left {
    transform: rotate(-45deg);
    left: -18px;
    top: 9px;
}
.corner .flag-right {
    transform: rotate(45deg);
    right: -18px;
    top: 9px;
}

/* 表格列中的单据号,客户端显示 */
.billno {
    font-size: 12px;
    color: blue;
    display: inline;
    font-weight: bold;
}

.pnlcard {
    background: white !important;
    border: 1px solid silver !important;
}

.divvertical {
    width: 100%;
    vertical-align: middle;
}

/* 记录面板 */
.reordpanel {
    color: #404040;
    border-width: 1px 0;
    border-style: solid;
    height: 200px;
    margin: 5px 20px;
    width: 500px;
}


/* 取消阴影 */
.x-css-shadow {
    position: absolute;
    box-shadow: rgb(136, 136, 136) 0px 0px 0px;
    border-radius: 6px;
}

.lblblack {
    font-size: 13px!important;
    color: black!important;
    top: 0px!important;
}

/* 登录页面上的下载CAD标签 */
.lbldownCAD {
    font-size: 10px !important;
    bottom: 20px!important;
    left: 34%!Important;
    transform: translate(-50%, -50%)!Important;
    z-index: 1!Important;
}

/* 登录页面上的预约提示 */
.lblAppoinment {
    font-size: 18px !important;
    transform: translate(-50%, -50%)!Important;
    z-index: 1!Important;
}

.lblbeian {
    font-size: 16px!important;
    text-align: center!important;
    left: 40%!Important;
    z-index: 1!Important;
    text-align: center;
    width: fit-content!important;
}

/* 垂直分割线 */
.vertline {
    float: left;
    width: 1px;
    height: 25px;
    background: #000;
}


/* ============================================================
   七、登录相关样式
   ============================================================ */
.pnlLoginbox {
    border-radius: 5px;
    border-width: 0px;
    border-style: solid;
    border: 0px solid #E2E2E2 !important;
    top: 50%!important;
    left: 50%!Important;
    transform: translate(-50%, -50%)!Important;
}
.pnlLoginbox .x-panel-body-default {
    border-radius: 8px;
    border-width: 0px;
    border-style: solid;
    background-color: white;
    border: 0px solid #E2E2E2 !important;
    box-shadow: initial;
}

/* 登录按钮 */
.btnLogin {
    border: none;
    white-space: nowrap;
    text-align: center;
    outline: none;
    border-radius: 6px!important;
    background: orangered !important;
}
.btnLogin .x-btn-inner {
    color: white!important;
    font-size: 16px !important;
    text-align: center !important;
}
.btnLogin .x-btn-button {
    background: orangered!important;
}
.btnLogin:hover, .btnLogin:focus, .btnLogin:active {
    border: none;
    white-space: nowrap;
    text-align: center;
    outline: none;
    border-radius: 6px!important;
    background: orangered !important;
}

.loginform {
    background-color: white!important;
    border-radius: 0px;
    padding: 0px;
    border-width: 0px;
    border-style: none;
    border: none;
    width: 100%;
    height: 100%;
}

.loginframe {
    border-width: 0px!important;
    border-style: none!important;
    border-color: none!important;
    border-image: none!important;
    border: none!important;
    Outline: none!important;
    display: block !important;
}

.loginpanel {
    font-size: 20px!important;
    border-radius: 5px;
    border-width: 0px;
    border-style: solid;
    border: 0px solid #E2E2E2!important;
}
.loginpanel .x-panel-body-default {
    border-radius: 8px;
    border-width: 0px;
    border-style: solid;
    background-color: white;
    border: 0px solid #E2E2E2!important;
    box-shadow: initial;
}

.x-circle-pnael {
    border-radius: 5px;
    border-width: 0px;
    border-style: solid;
    border: 0px solid #E2E2E2 !important;
}
.x-circle-pnael .x-panel-body-default {
    border-radius: 8px;
    border-width: 0px;
    border-style: solid;
    background-color: white;
    border: 0px solid #E2E2E2 !important;
    box-shadow: initial;
}


/* ============================================================
   八、主菜单样式
   ============================================================ */
.mainmenu .x-treelist-nav .x-treelist-row {
    padding-left: 5px;
    padding-right: 0;
}
.mainmenu .x-treelist-nav .x-treelist-item-tool {
    padding-left: 10px;
    padding-right: 10px;
    height: 36px;
}
.mainmenu .x-btn-icon-left > .x-btn-icon-el-default-medium,
.mainmenu .x-btn-icon-right > .x-btn-icon-el-default-medium {
    color: white;
}
.mainmenu .x-treelist-nav .x-treelist-item-icon,
.mainmenu .x-treelist-nav .x-treelist-item-tool {
    color: #383838;
    width: 30px;
    font-size: 18px;
    top: -3px;
}
.mainmenu .x-treelist-nav {
    background-color: transparent !important;
    background: transparent !important;
    scrollbar-color: #adb3b8 #516579;
}
.mainmenu .x-treelist-nav .x-treelist-item-text {
    color: #383838;
    margin-left: 40px;
    margin-right: 0px;
    font-size: 14px;
    line-height: 36px;
}

/* 选中的菜单背景色 */
.mainmenu .x-treelist-nav .x-treelist-item-selected > .x-treelist-row {
    background: rgb(192, 0, 0)!important;
}
/* 选中的菜单文字颜色 */
.mainmenu .x-treelist-nav .x-treelist-item-selected > .x-treelist-row .x-treelist-item-text {
    color: white;
    font-weight: bold!important;
}
/* 选中的菜单图标颜色 */
.mainmenu .x-treelist-nav .x-treelist-item-selected > .x-treelist-row .x-treelist-item-icon {
    color: white;
    font-weight: bold!important;
}
/* micro模式下的选中 */
.mainmenu .x-treelist-nav .x-treelist-item-selected.x-treelist-item-tool {
    color: white;
    background: rgb(192, 0, 0)!important;
}

.mainmenu .x-treelist-nav .x-treelist-row-over {
    background: rgb(192, 0, 0)!important;
}
.mainmenu .x-treelist-nav .x-treelist-row-over > * > .x-treelist-item-text {
    color: white !important;
    font-weight: bold!important;
}
.mainmenu .x-treelist-nav .x-treelist-row-over > * > .x-treelist-item-icon {
    color: white !important;
    font-weight: bold!important;
}

/* 选中菜单前后指示条颜色 */
.mainmenu .x-treelist-nav .x-treelist-row-over:before,
.mainmenu .x-treelist-nav .x-treelist-item-selected > .x-treelist-row:before {
    background: rgb(192, 0, 0)!important;
}

.edtsearch .x-form-text {
    -moz-border-radius: 1px;
    -webkit-border-radius: 1px;
    border-color: #E0E0E0;
    box-shadow: 1px 1px 1px #E0E0E0;
    font-size: 12px!important;
}

/* 主菜单折叠/展开 */
.lblmenuarrow {
    font-size: 13px !important;
    left: 45%!important;
    top: 98%!important;
    text-align: center;
    color: rgb(0,0,0)!important;
    width: 100%;
    transform: translate(-50%, -50%)!Important;
    z-index: 1!Important;
    cursor: pointer!important;
}

/* 待办计数 */
.lblwaitworkcount {
    font-weight: bold!important;
    font-size: 20px!important;
    color: white!important;
    vertical-align: super !important;
    top: 0px!important;
    background-color: rgba(0,0,0,0)!important;
}

/* 顶部菜单 */
.lbltopmenu {
    color: white!important;
    font-size: 12px!important;
}

/* 菜单页面标题 */
.lblMenuTitle {
    font-size: 16px!important;
    font-weight: bold;
    color: rgb(188,18,38)!important;
    padding-left: 10px;
    line-height: 20px;
    border-left: 6px solid rgb(188,18,38);
}

/* 菜单模块标题 */
.lblModuleCaption {
    font-size: 14px!important;
    color: rgb(188,18,38)!important;
    padding-bottom: 5px;
    border-bottom: 2px solid rgb(188,18,38);
}

/* 分页菜单的模块标题 */
.lblMenuCaption {
    font-size: 14px!important;
    color: dodgerblue;
    background-color: #f8f8fa !important;
    line-height: 30px;
    cursor: pointer;
    padding: 5px;
}

/* 未收藏的菜单图标 */
.lblMenuCaption-lg-n { font-style: normal; color: dodgerblue; cursor: pointer; }
/* 已收藏的菜单图标 */
.lblMenuCaption-lg-y { font-style: normal; color: rgb(192,0,0); cursor: pointer; }

.lblMenuCaption::before {
    content: "";
    width: 20px;
    height: 20px;
    float: left;
}

.lblMenuCaption:hover, .lblMenuCaption:focus, .lblMenuCaption:active {
    font-weight: bold!important;
    font-size: 14px;
    color: white;
    background: rgb(192, 0, 0)!important;
    cursor: pointer;
}

/* 分割线 */
.menuline { border-bottom: 1px solid black; }

/* 菜单模块 */
.menumodule { font-size: 12px; }

/* 折叠/展开面板 */
.lblpanelarrow {
    font-size: 16px !important;
    left: 95%!important;
    top: 5%!important;
    text-align: center;
    color: darkmagenta!important;
    width: 3%;
    transform: translate(-50%, -50%)!Important;
    z-index: 2!Important;
    cursor: pointer!important;
}




/* ============================================================
   九、审批节点按钮样式
   ============================================================ */
.btnApproveNode,
.btnApproveNode.x-btn,
.btnApproveNode.x-btn.x-btn-default-small,
.btnApproveNode.x-btn.x-btn-default-toolbar-small,
.btnApproveNode.x-btn.x-btn-default-medium,
.btnApproveNode.x-btn.x-btn-default-toolbar-medium {
    border: 1px solid #1677ff !important;
    background-color: #f8f9fa !important;
    border-radius: 4px !important;
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    padding: 0 !important;
    margin: 0 !important;
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    float: none !important;
    display: inline-flex !important;
    vertical-align: middle !important;
    outline: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    border-width: 1px !important;
    border-style: solid !important;
    background-image: none !important;
    width: auto !important;
    min-width: 100px !important;
    max-width: none !important;
    transform: none !important;
    box-sizing: border-box !important;
}

.btnApproveNode .x-btn-button,
.btnApproveNode .x-btn-wrap,
.btnApproveNode .x-btn-outer,
.btnApproveNode .x-btn-table,
.btnApproveNode .x-btn-cell,
.btnApproveNode.x-btn .x-btn-button,
.btnApproveNode.x-btn .x-btn-wrap,
.btnApproveNode.x-btn .x-btn-outer,
.btnApproveNode.x-btn .x-btn-table,
.btnApproveNode.x-btn .x-btn-cell,
.btnApproveNode.x-btn.x-btn-default-small .x-btn-button,
.btnApproveNode.x-btn.x-btn-default-toolbar-small .x-btn-button {
    background-color: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    padding: 0 !important;
    margin: 0 !important;
    position: static !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    box-sizing: border-box !important;
}

.btnApproveNode .x-btn-inner,
.btnApproveNode.x-btn .x-btn-inner,
.btnApproveNode.x-btn.x-btn-default-small .x-btn-inner,
.btnApproveNode.x-btn.x-btn-default-toolbar-small .x-btn-inner,
.btnApproveNode.x-btn.x-btn-default-medium .x-btn-inner,
.btnApproveNode.x-btn.x-btn-default-toolbar-medium .x-btn-inner {
    color: #1677ff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-align: center !important;
    white-space: nowrap !important;
    padding: 0 10px !important;
    background-color: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
    height: 30px !important;
    position: static !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    margin: 0 !important;
    vertical-align: middle !important;
}

.btnApproveNode:hover,
.btnApproveNode.x-btn-over,
.btnApproveNode.x-btn:hover,
.btnApproveNode.x-btn.x-btn-over {
    background-color: #e9ecef !important;
    border-color: #0958d9 !important;
    border-width: 1px !important;
    border-style: solid !important;
    height: 30px !important;
    transform: none !important;
    top: auto !important;
    left: auto !important;
}
.btnApproveNode:hover .x-btn-inner,
.btnApproveNode.x-btn-over .x-btn-inner {
    color: #0958d9 !important;
    transform: none !important;
    top: auto !important;
    left: auto !important;
}

.btnApproveNode:focus,
.btnApproveNode.x-btn-focus {
    background-color: #f8f9fa !important;
    border-color: #1677ff !important;
    box-shadow: 0 0 0 3px rgba(69, 126, 255, 0.2) !important;
    outline: none !important;
    height: 30px !important;
}

.btnApproveNode:active,
.btnApproveNode.x-btn-pressed {
    background-color: #dee2e6 !important;
    border-color: #003eb3 !important;
    box-shadow: none !important;
    height: 30px !important;
}
.btnApproveNode:active .x-btn-inner,
.btnApproveNode.x-btn-pressed .x-btn-inner {
    color: #003eb3 !important;
}

.btnApproveNode.x-item-disabled,
.btnApproveNode[disabled] {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
    background-color: #f8f9fa !important;
    border-color: #adb5bd !important;
}
.btnApproveNode.x-item-disabled .x-btn-inner {
    color: #6c757d !important;
}

.btnApproveNode:before,
.btnApproveNode:after,
.btnApproveNode .x-btn-button:before,
.btnApproveNode .x-btn-button:after,
.btnApproveNode .x-btn-inner:before,
.btnApproveNode .x-btn-inner:after {
    content: none !important;
    display: none !important;
}

.btnApproveNode,
.btnApproveNode * {
    transform: none !important;
    translate: none !important;
    top: auto !important;
    left: auto !important;
    margin: 0 !important;
}

/* 审批按钮 (浅红渐变) */
.btnApproval {
    border: 1px solid #b42323 !important;
    box-shadow: 0 1px 2px #e99494 inset, 0 -1px 0 #954b4b inset, 0 -2px 3px #e99494 inset !important;
    background: -webkit-linear-gradient(top, #d53939, #b92929) !important;
}
.x-btn.btnApproval .x-btn-inner { color: #ffffff !important; font-size: 12px !important; text-align: center !important; }
.btnApproval.x-btn .x-btn-button { background: -webkit-linear-gradient(top, #d53939, #b92929) !important; }
.btnApproval.x-btn:hover, .btnApproval.x-btn:focus, .btnApproval.x-btn:active {
    border: 1px solid #b42323 !important;
    box-shadow: 0 1px 2px #e99494 inset, 0 -1px 0 #954b4b inset, 0 -2px 3px #e99494 inset !important;
    background: -webkit-linear-gradient(top, #c93030, #a91f1f) !important;
    background-image: -webkit-linear-gradient(top, #c93030, #a91f1f) !important;
}


/* ============================================================
   十、功能按钮样式
   ============================================================ */

/* ============================================================
   返回按钮 - 淡红图标按钮 (默认态 = 全局 mouse-over 态,垂直居中)
   - 淡红底 #fff1f0 + 淡红边 #ffa39e + 红箭头 #cf1322
   - 图标使用 fa-arrow-circle-left (\f0a8),浏览器风格"返回"
   - 不强制 display,保留 UniGUI 通过 .x-hidden 控制显隐的能力
   - hover/active/focus 所有状态强制同色,无任何响应动作
   - 垂直居中:top:50% + translateY(-50%),相对最近定位祖先精确居中
   ============================================================ */

/* 1. 按钮主体 - 淡红底 + 工具栏等高
      所有交互状态共用同一组样式,确保鼠标移过无任何变化 */
.btn-return,
.btn-return.x-btn,
.btn-return.x-btn.x-btn-default-small,
.btn-return.x-btn.x-btn-default-medium,
.btn-return.x-btn.x-btn-default-toolbar-small,
.btn-return.x-btn.x-btn-default-toolbar-medium,
.btn-return:hover,
.btn-return.x-btn-over,
.btn-return.x-btn:hover,
.btn-return:active,
.btn-return.x-btn-pressed,
.btn-return.x-btn:active,
.btn-return:focus,
.btn-return.x-btn-focus {
    background: #fff1f0 !important;
    background-color: #fff1f0 !important;
    background-image: none !important;
    border: 1px solid #ffa39e !important;
    border-radius: 4px !important;
    padding: 4px 12px !important;
    width: auto !important;
    min-width: 44px !important;
    max-width: none !important;
    height: auto !important;
    min-height: 28px !important;
    max-height: none !important;
    /* 垂直居中:top:50% + translateY(-50%) 经典组合。
       相对最近定位祖先(uniGUI 父容器均为定位元素)精确居中,
       纯绘制层变换,与父 Panel 布局(Align/pack/dock)无关。 */
    position: relative !important;
    top: 50% !important;
    align-self: center !important;
    vertical-align: middle !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    cursor: pointer !important;
    outline: none !important;
    box-shadow: 0 1px 2px rgba(207, 19, 34, 0.08) !important;
    transition: none !important;
    transform: translateY(-50%) !important;
    box-sizing: border-box !important;
    /* 注意:不设置 display !important,让 UniGUI 的 .x-hidden (display:none)
       能正常生效,从而 Visible 属性的代码控制显隐不受影响 */
}

/* 2. 内部容器 - flex 居中图标 */
.btn-return .x-btn-button,
.btn-return .x-btn-wrap,
.btn-return.x-btn .x-btn-button,
.btn-return.x-btn .x-btn-wrap {
    background: transparent !important;
    background-image: none !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    transition: none !important;
    transform: none !important;
}

/* 3. 文字隐藏 + 注入 FontAwesome 圆圈左箭头图标
      原文字 font-size:0 / color:transparent 彻底隐藏
      ::before 注入 \f0a8 (fa-arrow-circle-left) — 浏览器风格"返回" */
.btn-return .x-btn-inner,
.btn-return.x-btn .x-btn-inner,
.btn-return .x-btn-button .x-btn-inner,
.btn-return.x-btn .x-btn-button .x-btn-inner {
    color: transparent !important;
    font-size: 0 !important;
    line-height: 1 !important;
    text-align: center !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 20px !important;
    min-height: 20px !important;
    transition: none !important;
    transform: none !important;
}

.btn-return .x-btn-inner::before,
.btn-return.x-btn .x-btn-inner::before,
.btn-return .x-btn-button .x-btn-inner::before,
.btn-return.x-btn .x-btn-button .x-btn-inner::before {
    content: "\f0a8" !important;
    font-family: "FontAwesome", "Font Awesome 5 Free", "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
    font-size: 16px !important;
    color: #cf1322 !important;
    line-height: 1 !important;
    display: inline-block !important;
    -webkit-font-smoothing: antialiased !important;
}

/* 4. 所有交互状态强制同色 — 鼠标移过/按下/聚焦 无任何响应
      注意:transform 只作用于外层 .btn-return 自身,不能作用于 .x-btn-button /
      .x-btn-wrap / .x-btn-inner — 否则图标(在 inner::before)会跟着上移跳动 */
.btn-return:hover,
.btn-return.x-btn-over,
.btn-return.x-btn:hover,
.btn-return:active,
.btn-return.x-btn-pressed,
.btn-return.x-btn:active,
.btn-return:focus,
.btn-return.x-btn-focus {
    background: #fff1f0 !important;
    background-color: #fff1f0 !important;
    background-image: none !important;
    border-color: #ffa39e !important;
    box-shadow: 0 1px 2px rgba(207, 19, 34, 0.08) !important;
    position: relative !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    transition: none !important;
    cursor: pointer !important;
}

/* 4b. 内层容器在 hover/active/focus 时强制透明 + 无 transform
       防止图标随容器一起上移 */
.btn-return:hover .x-btn-button,
.btn-return:active .x-btn-button,
.btn-return:focus .x-btn-button,
.btn-return:hover .x-btn-wrap,
.btn-return:active .x-btn-wrap,
.btn-return:focus .x-btn-wrap,
.btn-return:hover .x-btn-inner,
.btn-return:active .x-btn-inner,
.btn-return:focus .x-btn-inner {
    background: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    transform: none !important;
    transition: none !important;
}

.btn-return:hover .x-btn-inner::before,
.btn-return.x-btn-over .x-btn-inner::before,
.btn-return:active .x-btn-inner::before,
.btn-return.x-btn-pressed .x-btn-inner::before,
.btn-return:focus .x-btn-inner::before,
.btn-return.x-btn-focus .x-btn-inner::before {
    color: #cf1322 !important;
}

/* 5. 清除可能的全局 ::before/::after 干扰 */
.btn-return::before,
.btn-return::after,
.btn-return .x-btn-button::before,
.btn-return .x-btn-button::after {
    content: none !important;
    display: none !important;
}

/* 6. 禁用状态 - 半透明 */
.btn-return.x-item-disabled,
.btn-return[disabled],
.btn-return.x-btn.x-item-disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

.btn-return.x-item-disabled .x-btn-inner::before,
.btn-return[disabled] .x-btn-inner::before {
    color: #cf1322 !important;
}

/* 选择按钮 */
.btnselect {
    border: 1px solid transparent!important;
    border-radius: 3px!important;
    border-color: #1677ff!important;
    background: white!important;
}
.btnselect .x-btn-inner { color: #1677ff!important; }
.btnselect .x-btn-button { background: white!important; }
.btnselect, .btnselect:hover, .btnselect:focus, .btnselect:active {
    border-radius: 3px !important;
    border: 1px solid transparent!important;
    border-color: #1677ff!important;
    background: white!important;
}

/* 新增列表按钮 */
.btnaddlist {
    border: 1px solid transparent!important;
    border-radius: 3px!important;
    border-color: #4096ff!important;
    background: #4096ff!important;
}
.btnaddlist .x-btn-inner { color: white!important; }
.btnaddlist .x-btn-button { background: #4096ff!important; }
.btnaddlist, .btnaddlist:hover, .btnaddlist:focus {
    border-radius: 3px !important;
    border: 1px solid transparent!important;
    border-color: #4096ff!important;
    background: #4096ff!important;
}

/* 编辑明细按钮 */
.btnEditList {
    border: none;
    white-space: nowrap;
    text-align: center;
    outline: none;
    border-radius: 4px!important;
    background: #1677ff !important;
}
.btnEditList .x-btn-inner { color: white!important; font-size: 12px !important; text-align: center !important; }
.btnEditList .x-btn-button { background: #1677ff !important; }
.btnEditList, .btnEditList:hover, .btnEditList:focus, .btnEditList:active {
    border-radius: 4px !important;
    border: none;
    white-space: nowrap;
    text-align: center;
    outline: none;
    background: #1677ff !important;
}



/* 编辑区底部按钮 */
.editbuttonpanel {
    border: 0px solid #000;
    padding: 25px;
    background: #7ea089;
    margin: 0 auto;
}
.editbutton {
    border-color: #c0d0c5 #9aaa9f #9aaa9f #bfd0c5;
}
.editbutton .x-btn-inner {
    color: rgb(218,18,38)!important;
    font-size: 12px !important;
    font-weight: bold!important;
    text-align: center !important;
}

/* 按钮禁用状态下图标颜色 */
.x-item-disabled .x-btn-icon-el { color: lavender!important; }



/* ============================================================
   十一、UniDBGrid 表格样式
   ============================================================ */

/* ========== 操作列按钮样式 ========== */
/* 操作列容器 */
.operation-buttons {
    display: flex !important;
    gap: 12px !important;
    align-items: center !important;
    justify-content: flex-start !important;
    padding: 0 4px !important;
    /* 禁用文本选择 */
    -webkit-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    user-select: none !important;
}

/* 操作列按钮基础样式 - 依据 login.html 蓝色系
   静态=浅红填充+红描边+深红字(降低视觉噪音); hover=主红实心+白字+阴影 */
.btn-col-edit,
.btn-col-del,
.btn-col-confirm,
.btn-col-audit,
.btn-col-info {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 4px 10px !important;
    margin: 0 !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    border: 1px solid transparent !important;
    border-radius: 4px !important;
    background: #e6f4ff !important;
    color: #0958d9 !important;
    white-space: nowrap !important;
    outline: none !important;
    transition: all .15s ease-in-out !important;
    vertical-align: middle !important;
    -webkit-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    user-select: none !important;
}

/* 编辑 - 主红 */
.btn-col-edit {
    background: #e6f4ff !important;
    border-color: #e6f4ff !important;
    color: #0958d9 !important;
}
.btn-col-edit:hover {
    background: #1677ff !important;
    border-color: #1677ff !important;
    color: #ffffff !important;
    text-decoration: none !important;
    box-shadow: 0 1px 2px rgba(22, 119, 255, 0.25) !important;
}
.btn-col-edit:active {
    background: #003eb3 !important;
    border-color: #003eb3 !important;
    color: #ffffff !important;
}

/* 确认 - 蓝色系(浅蓝→主蓝) */
.btn-col-confirm {
    background: #e6f4ff !important;
    border-color: #e6f4ff !important;
    color: #0958d9 !important;
}
.btn-col-confirm:hover {
    background: #1677ff !important;
    border-color: #1677ff !important;
    color: #ffffff !important;
    text-decoration: none !important;
    box-shadow: 0 1px 2px rgba(22, 119, 255, 0.25) !important;
}
.btn-col-confirm:active {
    background: #003eb3 !important;
    border-color: #003eb3 !important;
    color: #ffffff !important;
}

/* 审核 - 蓝色系(浅蓝→主蓝) */
.btn-col-audit {
    background: #e6f4ff !important;
    border-color: #e6f4ff !important;
    color: #0958d9 !important;
}
.btn-col-audit:hover {
    background: #1677ff !important;
    border-color: #1677ff !important;
    color: #ffffff !important;
    text-decoration: none !important;
    box-shadow: 0 1px 2px rgba(22, 119, 255, 0.25) !important;
}
.btn-col-audit:active {
    background: #003eb3 !important;
    border-color: #003eb3 !important;
    color: #ffffff !important;
}

/* 详情 - 蓝色系(浅蓝→主蓝) */
.btn-col-info {
    background: #e6f4ff !important;
    border-color: #e6f4ff !important;
    color: #0958d9 !important;
}
.btn-col-info:hover {
    background: #1677ff !important;
    border-color: #1677ff !important;
    color: #ffffff !important;
    text-decoration: none !important;
    box-shadow: 0 1px 2px rgba(22, 119, 255, 0.25) !important;
}
.btn-col-info:active {
    background: #003eb3 !important;
    border-color: #003eb3 !important;
    color: #ffffff !important;
}

/* 删除 - 蓝色系(浅蓝→主蓝,与编辑同色) */
.btn-col-del {
    background: #e6f4ff !important;
    border-color: #e6f4ff !important;
    color: #0958d9 !important;
}
.btn-col-del:hover {
    background: #1677ff !important;
    border-color: #1677ff !important;
    color: #ffffff !important;
    text-decoration: none !important;
    box-shadow: 0 1px 2px rgba(22, 119, 255, 0.25) !important;
}
.btn-col-del:active {
    background: #003eb3 !important;
    border-color: #003eb3 !important;
    color: #ffffff !important;
}

/* 表格单元格内的操作按钮 - 垂直对齐与行高 */
.x-grid-cell .btn-col-edit,
.x-grid-cell .btn-col-del,
.x-grid-cell .btn-col-confirm,
.x-grid-cell .btn-col-audit,
.x-grid-cell .btn-col-info {
    line-height: 1.4 !important;
    vertical-align: middle !important;
}

/* 操作列按钮禁用状态 - 与启用形成强对比
   可用态=浅彩底+彩色描边+深彩字; 禁用态=纯白底+虚线灰边+极浅灰字+斜线纹理
   三种视觉差异: ①饱和度骤降(彩色→灰白) ②边框变虚线 ③对角线纹理明确标记不可用
   覆盖三种禁用来源: 元素自身 .x-item-disabled / 父级 .x-item-disabled 容器 / [disabled] 属性 */
.btn-col-edit.x-item-disabled,
.btn-col-del.x-item-disabled,
.btn-col-confirm.x-item-disabled,
.btn-col-audit.x-item-disabled,
.btn-col-info.x-item-disabled,
.x-item-disabled .btn-col-edit,
.x-item-disabled .btn-col-del,
.x-item-disabled .btn-col-confirm,
.x-item-disabled .btn-col-audit,
.x-item-disabled .btn-col-info,
.btn-col-edit[disabled],
.btn-col-del[disabled],
.btn-col-confirm[disabled],
.btn-col-audit[disabled],
.btn-col-info[disabled] {
    background: #ffffff !important;
    border: 1px dashed #d9d9d9 !important;
    color: #bfbfbf !important;
    box-shadow: none !important;
    cursor: not-allowed !important;
    background-image: repeating-linear-gradient(
        -45deg,
        transparent,
        transparent 3px,
        rgba(0, 0, 0, 0.04) 3px,
        rgba(0, 0, 0, 0.04) 4px
    ) !important;
}

/* 禁用态屏蔽 hover/active 彩色填充反馈,保持灰白底+虚线边 */
.btn-col-edit.x-item-disabled:hover,
.btn-col-edit.x-item-disabled:active,
.btn-col-del.x-item-disabled:hover,
.btn-col-del.x-item-disabled:active,
.btn-col-confirm.x-item-disabled:hover,
.btn-col-confirm.x-item-disabled:active,
.btn-col-audit.x-item-disabled:hover,
.btn-col-audit.x-item-disabled:active,
.btn-col-info.x-item-disabled:hover,
.btn-col-info.x-item-disabled:active,
.x-item-disabled .btn-col-edit:hover,
.x-item-disabled .btn-col-edit:active,
.x-item-disabled .btn-col-del:hover,
.x-item-disabled .btn-col-del:active,
.x-item-disabled .btn-col-confirm:hover,
.x-item-disabled .btn-col-confirm:active,
.x-item-disabled .btn-col-audit:hover,
.x-item-disabled .btn-col-audit:active,
.x-item-disabled .btn-col-info:hover,
.x-item-disabled .btn-col-info:active {
    background: #ffffff !important;
    border: 1px dashed #d9d9d9 !important;
    color: #bfbfbf !important;
    box-shadow: none !important;
    background-image: repeating-linear-gradient(
        -45deg,
        transparent,
        transparent 3px,
        rgba(0, 0, 0, 0.04) 3px,
        rgba(0, 0, 0, 0.04) 4px
    ) !important;
}

/* ========== Action列锁定在右侧 ========== */

/* 表格容器 - 确保sticky生效 */
.x-grid-view,
.x-grid-view-default {
    overflow-x: auto !important;
    overflow-y: auto !important;
}

/* Action列单元格锁定在右端 - 使用ExtJS正确的类名 */
.x-action-col-cell,
.x-grid-cell.x-action-col-cell,
td[class*="action-col"] {
    position: sticky !important;
    right: 0 !important;
    left: auto !important;
    z-index: 20 !important;
    background: #fff !important;
    box-shadow: inset 1px 0 0 #e8e8e8 !important;
}

/* Action列标题锁定在右端 */
.x-grid-header-ct .x-column-header-action-col,
.x-grid-header-ct th[class*="action-col"],
.x-grid-header-ct td[class*="action-col"] {
    position: sticky !important;
    right: 0 !important;
    left: auto !important;
    z-index: 30 !important;
    background: #fafafa !important;
    box-shadow: inset 1px 0 0 #e8e8e8 !important;
}

/* ========== 多行表头（嵌套表头）Action列锁定 ========== */
/* 多行表头结构: .x-grid-header-ct > .x-column-header(父表头) > .x-column-header(子表头) */
/* Action列在多行表头中需要同时锁定父表头和子表头 */

/* 多行表头 - Action列的父表头锁定 */
.x-grid-header-ct .x-column-header:has(.x-column-header.x-action-col-cell),
.x-grid-header-ct .x-column-header:has(.x-column-header[class*="action-col"]),
.x-grid-header-ct .x-column-header:has([data-columnid*="action"]),
.x-grid-header-ct .x-column-header:has([data-qtip*="操作"]),
.x-grid-header-ct .x-column-header:has([data-qtip*="Action"]) {
    position: sticky !important;
    right: 0 !important;
    left: auto !important;
    z-index: 35 !important;
    background: #fafafa !important;
    box-shadow: inset 1px 0 0 #e8e8e8 !important;
}

/* 多行表头 - Action列的子表头锁定 */
.x-column-header .x-column-header.x-action-col-cell,
.x-column-header .x-column-header[class*="action-col"],
.x-column-header .x-column-header[data-columnid*="action"],
.x-column-header .x-column-header[data-qtip*="操作"],
.x-column-header .x-column-header[data-qtip*="Action"] {
    position: sticky !important;
    right: 0 !important;
    left: auto !important;
    z-index: 32 !important;
    background: #fafafa !important;
}

/* 多行表头 - Action列单元格锁定（增强优先级） */
.x-grid-header-ct .x-column-header .x-column-header.x-action-col-cell,
.x-grid-header-ct .x-column-header .x-column-header[class*="action-col"] {
    position: sticky !important;
    right: 0 !important;
    left: auto !important;
    z-index: 32 !important;
    background: #fafafa !important;
}

/* 多行表头容器 - 确保Action列在最上层 */
.x-grid-header-ct:has(.x-action-col-cell),
.x-grid-header-ct:has([class*="action-col"]) {
    overflow: visible !important;
}

/* 多行表头 - 确保Action列父表头的inner内容正确显示 */
.x-column-header:has(.x-column-header.x-action-col-cell) > .x-column-header-inner,
.x-column-header:has(.x-column-header[class*="action-col"]) > .x-column-header-inner {
    background: #fafafa !important;
    text-align: center !important;
}

/* Action列内容区域 */
.x-grid-cell-inner-action-col {
    background: #fff !important;
    white-space: nowrap !important;
    padding: 2px 4px !important;
}

/* 确保Action列在滚动时保持白色背景 */
.x-grid-row .x-action-col-cell,
.x-grid-row-over .x-action-col-cell,
.x-grid-row-selected .x-action-col-cell {
    background: #fff !important;
}

/* Action列悬停和选中状态 */
.x-grid-row-over .x-action-col-cell {
    background: #f5f7fa !important;
}

.x-grid-row-selected .x-action-col-cell {
    background: #e6f4ff !important;
}

/* Action列图标样式 */
.x-action-col-icon {
    color: #ff4d4f !important;
    font-size: 16px !important;
    cursor: pointer !important;
    margin: 0 4px !important;
}

.x-action-col-icon:hover {
    color: #ff7875 !important;
}

/* Action列按钮文字样式 - 已废弃: 改用 .btn-col-* 彩色可视化按钮,避免红色强制覆盖
   保留对标准 .x-btn(非.btn-col-*)的轻微强调,以兼容遗留图标按钮 */
.x-action-col-cell .x-btn-inner:not([class*="btn-col-"]),
.x-grid-cell-inner-action-col .x-btn-inner:not([class*="btn-col-"]),
.x-grid-cell-actioncolumn .x-btn-inner:not([class*="btn-col-"]) {
    font-weight: 500 !important;
}

/* 兼容旧版UniGUI的actioncolumn类名 */
.x-grid-cell-actioncolumn,
.x-grid-cell.x-grid-cell-actioncolumn {
    position: sticky !important;
    right: 0 !important;
    left: auto !important;
    z-index: 20 !important;
    background: #fff !important;
    box-shadow: inset 1px 0 0 #e8e8e8 !important;
}

.x-grid-header-ct .x-column-header-actioncolumn,
.x-grid-header-ct .x-column-header.x-actioncolumn {
    position: sticky !important;
    right: 0 !important;
    left: auto !important;
    z-index: 30 !important;
    background: #fafafa !important;
    box-shadow: inset 1px 0 0 #e8e8e8 !important;
}

/* 操作按钮容器 */
.x-grid-cell-inner .operation-buttons {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    white-space: nowrap !important;
}

/* ========== 整体容器 ========== */
.x-grid-container {
    border: none;
    border-radius: 0;
    box-shadow: none;
}

.x-grid-body {
    border: none;
    background: #ffffff;
}

.x-grid-view {
    background: #ffffff;
}

/* UniDBGrid 边框圆角和边距 */
.x-grid-panel,
.x-grid {
    border: 1px solid #d9d9d9 !important;
    border-radius: 4px !important;
    margin: 5px !important;
    overflow: hidden !important;
}

/* 表格body区域 - 允许横向滚动条,纵向显示边框 */
.x-grid-body,
.x-grid-body-default,
.x-grid-view,
.x-grid-view-default {
    overflow-x: auto !important;
    overflow-y: auto !important;
}

/* ========== 表头样式 ========== */
.x-grid-header-ct {
    background: #fafafa;
    border-bottom: 1px solid #e8e8e8;
    border-top: none;
    border-left: none;
    border-right: none;
}

.x-column-header {
    background: #fafafa;
    border-right: none;  /* 单行表头默认不显示列分隔线 */
    border-bottom: 1px solid #e8e8e8;
    color: #1f2937;
    font-weight: 600;
    font-size: 13px !important;
    font-family: 'Microsoft YaHei', sans-serif;
    padding: 0;
    min-height: 36px;
    height: 36px !important;
    overflow: visible !important;
    cursor: pointer;
}

/* 多行表头（嵌套表头）- 父表头显示列分隔线 */
.x-column-header:has(.x-column-header) {
    border-right: 1px solid #e8e8e8;  /* 多行表头的父表头保留列分隔线 */
}

/* 多行表头最后一列父表头不显示右边框 */
.x-column-header:has(.x-column-header):last-child {
    border-right: none;
}

/* 多行表头（嵌套表头）- 子表头显示列分隔线 */
.x-column-header .x-column-header {
    height: 34px !important;
    border-right: 1px solid #e8e8e8;  /* 多行表头的子表头保留列分隔线 */
}

/* 多行表头最后一列子表头不显示右边框 */
.x-column-header .x-column-header:last-child {
    border-right: none;
}

.x-column-header-inner {
    padding: 0 8px !important;
    color: #1f2937;
    font-weight: 600;
    font-size: 13px !important;
    text-align: left;  /* 单行表头默认左对齐 */
    line-height: 36px !important;
    width: 100%;
}

/* 多行表头的第一行（父表头）标题居中对齐 */
.x-column-header:has(.x-column-header) > .x-column-header-inner {
    text-align: center;
}

/* 多行表头的子表头标题保持左对齐 */
.x-column-header .x-column-header .x-column-header-inner {
    text-align: left;
}

.x-column-header-over {
    background: #f0f0f0;
}

/* ========== 隐藏列头部的下拉菜单和排序按钮 ========== */
.x-column-header-trigger {
    display: none !important;
    width: 0 !important;
}

.x-column-header-over .x-column-header-trigger,
.x-column-header-open .x-column-header-trigger {
    display: none !important;
}

/* 隐藏列菜单按钮 */
.x-column-header-btn {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}

/* 隐藏列头部的齿轮图标 */
.x-column-header .x-column-header-trigger {
    display: none !important;
}

/* 隐藏排序指示器图标 */
.x-column-header-sort-ASC .x-column-header-text-inner:before,
.x-column-header-sort-DESC .x-column-header-text-inner:before {
    display: none !important;
}

/* ========== 自定义排序指示器 ========== */
/* 升序样式 */
.x-column-header-sort-ASC {
    background: #e6f4ff !important;
}

.x-column-header-sort-ASC .x-column-header-inner:after {
    content: ' ▲' !important;
    color: #1677ff !important;
    font-size: 12px !important;
    margin-left: 2px !important;
}

/* 降序样式 */
.x-column-header-sort-DESC {
    background: #e6f4ff !important;
}

.x-column-header-sort-DESC .x-column-header-inner:after {
    content: ' ▼' !important;
    color: #1677ff !important;
    font-size: 12px !important;
    margin-left: 2px !important;
}

/* ========== 表格滚动条样式 ========== */

/* Webkit浏览器滚动条样式 */
.x-grid-body::-webkit-scrollbar,
.x-grid-view::-webkit-scrollbar,
.x-grid-table::-webkit-scrollbar {
    width: 8px !important;
    height: 8px !important;
}

/* 滚动条轨道 */
.x-grid-body::-webkit-scrollbar-track,
.x-grid-view::-webkit-scrollbar-track,
.x-grid-table::-webkit-scrollbar-track {
    background: #f0f0f0 !important;
    border-radius: 4px !important;
}

/* 滚动条滑块 - 深灰色 */
.x-grid-body::-webkit-scrollbar-thumb,
.x-grid-view::-webkit-scrollbar-thumb,
.x-grid-table::-webkit-scrollbar-thumb {
    background: #8c8c8c !important;
    border-radius: 4px !important;
    border: 1px solid #f0f0f0 !important;
}

/* 滚动条滑块悬停 - 更深的灰色 */
.x-grid-body::-webkit-scrollbar-thumb:hover,
.x-grid-view::-webkit-scrollbar-thumb:hover,
.x-grid-table::-webkit-scrollbar-thumb:hover {
    background: #595959 !important;
}

/* 滚动条滑块激活 */
.x-grid-body::-webkit-scrollbar-thumb:active,
.x-grid-view::-webkit-scrollbar-thumb:active,
.x-grid-table::-webkit-scrollbar-thumb:active {
    background: #434343 !important;
}

/* 滚动条角落 */
.x-grid-body::-webkit-scrollbar-corner,
.x-grid-view::-webkit-scrollbar-corner,
.x-grid-table::-webkit-scrollbar-corner {
    background: #f0f0f0 !important;
}

/* Firefox滚动条样式 */
.x-grid-body,
.x-grid-view,
.x-grid-table {
    scrollbar-width: thin !important;
    scrollbar-color: #8c8c8c #f0f0f0 !important;
}

/* ========== 表格行样式 ========== */
.x-grid-row {
    position: relative !important;
	border-bottom: 1px solid #f0f0f0;
   /* border-left: none; 
    border-right: none;
    height: 34px !important; */
}


/* 强制设置数据行高度 - 仅适用于DBGrid，不影响TreeView */
.x-grid-panel:not(.x-tree-panel) .x-grid-item,
.x-grid-view:not(.x-tree-view) .x-grid-item,
.x-grid:not(.x-tree-panel) .x-grid-item {
    height: 34px !important;
}

/* TreeView节点高度单独设置 - 与连线图片高度一致 */
.x-tree-panel .x-grid-item,
.x-tree-view .x-grid-item {
    height: 20px !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ========== 序号列样式 ========== */
/* 序号列单元格 */
.x-grid-cell-row-numberer,
.x-grid-cell-special {
    background: #fff !important;
    border-right: none !important;
}

/* 序号列内容 - 蓝色字体 */
.x-grid-cell-inner-row-numberer {
    color: #1677ff !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-align: center !important;
    padding: 0 8px !important;
    background: #fff !important;
}

/* 序号列表头 */
.x-column-header-row-numberer,
.x-grid-header-ct .x-column-header-special {
    background: #fafafa !important;
    border-right: none !important;
}

/* 序号列表头内容 */
.x-column-header-row-numberer .x-column-header-inner,
.x-grid-header-ct .x-column-header-special .x-column-header-inner {
    color: #333 !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-align: center !important;
}

/* 行悬停时序号列样式 */
.x-grid-row-over .x-grid-cell-row-numberer,
.x-grid-row-over .x-grid-cell-special {
    background: #e6f4ff !important;
}

.x-grid-row-over .x-grid-cell-inner-row-numberer {
    background: transparent !important;
    color: #1677ff !important;
}

/* 选中行时序号列样式 */
.x-grid-row-selected .x-grid-cell-row-numberer,
.x-grid-row-selected .x-grid-cell-special {
    background: #cce5ff !important;
}

.x-grid-row-selected .x-grid-cell-inner-row-numberer {
    background: transparent !important;
    color: #1677ff !important;
}

/* 隔行变色时序号列样式 */
.x-grid-row-alt .x-grid-cell-row-numberer,
.x-grid-row-alt .x-grid-cell-special {
    background: #fafafa !important;
}

.x-grid-row-alt .x-grid-cell-inner-row-numberer {
    background: transparent !important;
}

.x-grid-row-alt {
    /* background: #ffffff !important; */  /* 移除固定背景色 */
}

/* 行悬停效果 - 浅灰蓝色背景 */
.x-grid-row-over {
    background-color: #e6f4ff !important;
    background: #e6f4ff !important;
}

.x-grid-row-over .x-grid-cell {
    background-color: #e6f4ff !important;
    background: #e6f4ff !important;
}

.x-grid-row-over .x-grid-cell-inner {
    color: #1f2937 !important;
    background-color: transparent !important;
}

/* 选中行样式 */
.x-grid-row-selected {
    background-color: #cce5ff !important;
    background: #cce5ff !important;
    border-color: #1677ff !important;
}

.x-grid-row-selected .x-grid-cell {
    background-color: #cce5ff !important;
    background: #cce5ff !important;
}

.x-grid-row-selected .x-grid-cell-inner {
    color: #1f2937 !important;
    font-weight: 500 !important;
    background-color: transparent !important;
}

/* 聚焦行样式 */
.x-grid-row-focused {
    background-color: #ffffff !important;
}

/* ========== 单元格样式 ========== */
.x-grid-cell {
    padding: 0;
    margin: 0;
    border: none !important;
    border-right: none !important;  /* 去掉列分隔线 */
    height: 34px !important;
    vertical-align: middle !important;
    color: #1f2937; /* 默认文字颜色设置在单元格级别(深黑灰,与表头同色) */
}

/* 所有单元格列都不显示右边框 */
.x-grid-cell,
.x-grid-cell:last-child {
    border-right: none !important;
}

/* 单元格内容 - 不设置颜色，让特殊样式生效 */
.x-grid-cell-inner {
    padding: 0 8px;
    font-size: 14px;
    font-family: 'Microsoft YaHei', sans-serif;
    line-height: 34px;
    /* background: #ffffff; */  /* 移除固定背景色，让 hover/选中样式生效 */
    height: 34px !important;
    /* display: flex !important; */ /*会引起列设置的对齐方式不正确*/
    align-items: center !important;
    width: 100%;
    /* 不设置 color，继承父元素或由子元素自定义 */
}

/* 文本对齐 - 使用多种选择器确保生效 */
/* 注意: 必须覆盖 .x-grid-cell-inner 的 flex 属性 */
/* ========== 强制修复: UniDBGrid 列对齐 (终极版) ========== */
/* 优先级: 使用属性选择器 > 普通类选择器 */

/* --- 1. 左对齐 --- */
/* 通用属性匹配 + 强制内联样式覆盖 */
[class*="x-grid-cell-inner-left"], 
.x-grid-cell-inner-left[style] {
    justify-content: flex-start !important;
    text-align: left !important;
}

/* --- 2. 居中对齐 --- */
/* 深度覆盖: 匹配包含 inner-center 的所有元素 */
[class*="x-grid-cell-inner-center"], 
.x-grid-cell-inner-center[style],
/* 针对 UniGUI 可能生成的特定结构 */
.x-grid-cell-center .x-grid-cell-inner {
    justify-content: center !important;
    text-align: center !important;
}

/* --- 3. 右对齐 --- */
/* 使用最高优先级的选择器组合 */
.x-grid-cell-inner-right,
[class*="x-grid-cell-inner-right"], 
.x-grid-cell-inner-right[style],
/* 数值列专用 */
.x-grid-cell-number .x-grid-cell-inner {
    justify-content: flex-end !important;
    text-align: right !important;
}

/* --- 4. 针对操作列 (Operation Column) 的特殊修复 --- */
/* 如果你使用了 actioncolumn 或者自定义的 operation 列 */
.x-grid-cell-actioncolumn .x-grid-cell-inner,
.x-grid-cell-actioncolumn .x-grid-cell-inner-left {
    justify-content: flex-start !important;
}
/* ============================================================ */

/* ========== 表格底部边框 ========== */
.x-grid-with-row-lines .x-grid-row:last-child .x-grid-cell {
    border-bottom: 1px solid #f0f0f0;
}

/* ========== 空数据提示 ========== */
.x-grid-empty {
    padding: 0 !important;
    color: #bfbfbf !important;
    font-size: 14px !important;
    font-style: normal !important;
    text-align: center !important;
    background: #ffffff !important;
    position: relative !important;
    min-height: 200px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
}

/* 空数据图标 - SVG内嵌,显示在表格中央 */
.x-grid-empty::before {
    content: '' !important;
    display: block !important;
    width: 120px !important;
    height: 90px !important;
    margin-bottom: 16px !important;
    flex-shrink: 0 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 90'%3E%3Crect x='8' y='4' width='104' height='70' rx='4' ry='4' fill='%23f0f0f0' stroke='%23d9d9d9' stroke-width='1.5'/%3E%3Cline x1='8' y1='24' x2='112' y2='24' stroke='%23d9d9d9' stroke-width='1.5'/%3E%3Crect x='16' y='30' width='20' height='12' rx='2' fill='%23e8e8e8'/%3E%3Crect x='42' y='30' width='20' height='12' rx='2' fill='%23e8e8e8'/%3E%3Crect x='68' y='30' width='20' height='12' rx='2' fill='%23e8e8e8'/%3E%3Crect x='94' y='30' width='10' height='12' rx='2' fill='%23e8e8e8'/%3E%3Crect x='16' y='48' width='20' height='12' rx='2' fill='%23e8e8e8'/%3E%3Crect x='42' y='48' width='20' height='12' rx='2' fill='%23e8e8e8'/%3E%3Crect x='68' y='48' width='20' height='12' rx='2' fill='%23e8e8e8'/%3E%3Crect x='94' y='48' width='10' height='12' rx='2' fill='%23e8e8e8'/%3E%3Crect x='8' y='4' width='4' height='20' rx='2' fill='%231677ff'/%3E%3Crect x='8' y='4' width='104' height='4' rx='2' fill='%231677ff'/%3E%3Ccircle cx='60' cy='60' r='18' fill='%23ffffff' stroke='%23bfbfbf' stroke-width='2'/%3E%3Cline x1='48' y1='60' x2='72' y2='60' stroke='%23bfbfbf' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
    background-position: center !important;
    opacity: 0.85 !important;
}

/* ========== 滚动条样式 ========== */
.x-grid-view::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.x-grid-view::-webkit-scrollbar-track {
    background: #f0f0f0;
    border-radius: 4px;
}

.x-grid-view::-webkit-scrollbar-thumb {
    background: #d9d9d9;
    border-radius: 4px;
    transition: background 0.3s;
}

.x-grid-view::-webkit-scrollbar-thumb:hover {
    background: #bfbfbf;
}

.x-grid-view::-webkit-scrollbar-corner {
    background: #f0f0f0;
}

/* ========== 固定列分隔线 ========== */
.x-grid-cell-fixed {
    border-right: 1px solid #e8e8e8;
    background: #fafafa;
}

/* ========== 锁定列(Locked Column)样式 ========== */
/* UniGUI锁定列使用ExtJS的locked grid布局,会生成左右两个独立区域 */
/* 目标:消除间隔,使其视觉上呈现为一个完整表格 */

/* 【关键】移除锁定列与滚动列之间的分隔条 - 这是造成大间隔的直接原因 */
.x-grid .x-splitter,
.x-grid-locked ~ .x-splitter,
.x-splitter.x-splitter-default,
.x-grid .x-resizer,
.x-grid-locked ~ .x-resizer {
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
    display: none !important;
}

/* 【关键】锁定列容器外层 - 移除所有边框/间距/圆角 */
.x-grid-locked,
.x-panel.x-grid-locked,
.x-grid-locked.x-panel,
.x-grid-locked.x-panel-default {
    border: none !important;
    border-right: none !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
}

/* 【关键】锁定列的panel-body - 移除边框/间距 */
.x-grid-locked > .x-panel-body,
.x-grid-locked .x-panel-body {
    border: none !important;
    border-right: none !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
}

/* 【关键】正常滚动区域外层 - 移除所有边框/间距/圆角 */
.x-grid-normal,
.x-panel.x-grid-normal,
.x-grid-normal.x-panel,
.x-grid-normal.x-panel-default {
    border: none !important;
    border-left: none !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
}

/* 【关键】正常滚动区域的panel-body - 移除边框/间距 */
.x-grid-normal > .x-panel-body,
.x-grid-normal .x-panel-body {
    border: none !important;
    border-left: none !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-shadow: none !important;
    overflow: visible !important;
}

/* 锁定列与滚动区域的分隔线 - 仅1px细线表示边界 */
.x-grid-locked .x-grid-body {
    border-right: 1px solid #e8e8e8 !important;
}

/* 锁定列区域的表头 - 与主表头样式一致 */
.x-grid-locked .x-grid-header-ct {
    background: #fafafa !important;
    border-bottom: 1px solid #e8e8e8 !important;
    border-right: none !important;
}

/* 正常滚动区域的表头 - 无左边框 */
.x-grid-normal .x-grid-header-ct {
    border-left: none !important;
}

/* 锁定列区域的单元格背景 - 白色,与主区域一致 */
.x-grid-locked .x-grid-row .x-grid-cell {
    background: #fff !important;
}

/* 锁定列区域交替行背景 - 与主区域一致 */
.x-grid-locked .x-grid-row-alt .x-grid-cell {
    background: #fafafa !important;
}

/* 锁定列区域行悬停 - 与主区域一致 */
.x-grid-locked .x-grid-row-over .x-grid-cell {
    background: #e6f4ff !important;
}

/* 锁定列区域行选中 - 与主区域一致 */
.x-grid-locked .x-grid-row-selected .x-grid-cell {
    background: #cce5ff !important;
}

/* 移除锁定列与正常区域body的多余边框和阴影 */
.x-grid-locked .x-grid-body,
.x-grid-normal .x-grid-body {
    border: none !important;
    box-shadow: none !important;
}

/* 锁定列header内单元格 - 无右边框 */
.x-grid-locked .x-column-header {
    border-right: none !important;
}

/* 确保锁定列和正常区域的行高一致 */
.x-grid-locked .x-grid-row,
.x-grid-normal .x-grid-row {
    border-bottom: 1px solid #f0f0f0 !important;
}

/* 【关键】覆盖全局.x-panel-body对锁定/正常区域的border:none干扰 */
/* 全局规则在656行设置了.x-panel-body { border: none; overflow: hidden } */
/* 这里显式让锁定/正常区域的body可以溢出显示 */
.x-grid-locked .x-grid-view,
.x-grid-normal .x-grid-view {
    overflow-x: auto !important;
    overflow-y: auto !important;
}

/* ========== 编辑模式单元格 - 输入框适配单元格 ========== */
.x-grid-cell-editing {
    background: #ffffff !important;
    padding: 0 !important;
}

/* 编辑器容器 - 保持相对定位，高度与行高相同 */
.x-grid-editor {
    padding: 0 !important;
    margin: 0 !important;
    height: 34px !important;
}

/* 输入框样式 - 高度与行高相同，隐藏外边框 */
.x-grid-editor .x-form-text,
.x-grid-editor .x-form-field,
.x-grid-editor input[type="text"],
.x-grid-editor input[type="number"],
.x-grid-editor input[type="password"],
.x-grid-editor textarea {
    border: none !important;
    border-radius: 0 !important;
    padding: 0 8px !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    background: #ffffff !important;
    font-size: 14px !important;
    font-family: 'Microsoft YaHei', sans-serif !important;
    color: #333333 !important;
    outline: none !important;
    height: 34px !important;
    line-height: 34px !important;
}

/* 输入框获得焦点样式 - 显示内边框 */
.x-grid-editor .x-form-text:focus,
.x-grid-editor .x-form-field:focus,
.x-grid-editor input:focus {
    border: 0.5px solid #1677ff !important;
    box-shadow: inset 0 0 2px rgba(22, 119, 255, 0.2) !important;
    background: #ffffff !important;
}

/* 下拉框编辑器 */
.x-grid-editor .x-form-combo,
.x-grid-editor .x-combo-list {
    border: none !important;
    border-radius: 0 !important;
    padding: 0 8px !important;
    background: #ffffff !important;
    height: 34px !important;
    line-height: 34px !important;
}

/* 日期选择器编辑器 */
.x-grid-editor .x-form-date {
    border: none !important;
    border-radius: 0 !important;
    padding: 0 8px !important;
    background: #ffffff !important;
    height: 34px !important;
    line-height: 34px !important;
}

/* 数字输入框 */
.x-grid-editor .x-form-numberfield {
    border: none !important;
    border-radius: 0 !important;
    padding: 0 8px !important;
    background: #ffffff !important;
    text-align: right !important;
    height: 34px !important;
    line-height: 34px !important;
}

/* ========== 高亮搜索结果 ========== */
.x-grid-cell-highlight {
    background: #fff7e6 !important;
}

/* ========== 汇总行 ========== */
.x-grid-row-summary {
    background: #fafafa !important;
    font-weight: 600;
    border-top: 1px solid #e8e8e8;
}

.x-grid-row-summary .x-grid-cell {
    background: #fafafa !important;
}

.x-grid-row-summary .x-grid-cell-inner {
    color: #333333;
    font-weight: 600;
}

/* ========== 分组行 ========== */
.x-grid-group-hd {
    background: #f5f7fa;
    border-bottom: 1px solid #e8e8e8;
    padding: 8px 16px;
    font-weight: 600;
    color: #333333;
}

/* ========== 列调整分隔线 ========== */
.x-grid-resize-marker {
    background: #1677ff;
    width: 2px;
}

/* ========== 拖拽指示器 ========== */
.x-column-header-drag {
    background: #e6f4ff;
    border: 1px solid #e6f4ff;
}

/* ========== 单元格选中高亮 ========== */
.x-grid-cell-selected {
    background: #e6f4ff !important;
}

/* ========== 只读单元格样式 ========== */
.x-grid-cell-readonly .x-grid-cell-inner {
    color: #999999;
    background: #fafafa;
}

/* ---- 金额列 (参考A.html amount) ---- */
.amount { color: #ff4d4f !important; font-weight: bold !important; text-align: right !important; }

/* ---- 操作列 (参考A.html action-cell) ---- */
.action-cell { width: 150px; }
.actions { display: flex; gap: 8px; }
.action-btn, .x-btn-link {
    background: transparent !important;
    border: none !important;
    color: #1677ff !important;
    padding: 4px 8px !important;
    font-size: 14px !important;
    cursor: pointer !important;
    margin-right: 8px !important;
}
.action-btn:hover, .x-btn-link:hover {
    color: #4096ff !important;
    text-decoration: underline !important;
}

/* ---- 操作列按钮样式 column-action ---- */
/* 选中 ActionColumn 中的按钮链接 */
.column-action .x-grid-cell-actioncolumn a.x-btn,
.x-grid-cell-actioncolumn.column-action a.x-btn {
    background: none !important;
    border: none !important;
    color: #148a14 !important;
    font-weight: bold !important;
    cursor: pointer !important;
}
/* 利用伪元素显示 Hint 内容 (关键步骤) */
.column-action .x-grid-cell-actioncolumn a.x-btn::before,
.x-grid-cell-actioncolumn.column-action a.x-btn::before {
    content: attr(title) !important;
}

/* ---- 表格特殊单元格样式 ---- */
.gridcelldel {
    width: 100%;
    height: 100%;
    text-align: left;
    line-height: normal;
    font-size: 14px;
    font-weight: bold;
    text-decoration: line-through;
}

.gridcellflag {
    -webkit-font-smoothing: antialiased;
    -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-user-drag: none;
    cursor: default;
    -webkit-box-sizing: border-box;
    overflow: hidden;
    border-width: 0 1px 0 0;
    background-color: #fff !important;
    border-top: 1px solid #ededed;
    font: normal 14px/1.5 'Microsoft YaHei', tahoma, arial, verdana, sans-serif;
    vertical-align: middle;
    border-color: #e8e8e8;
    border-style: solid;
    color: #ff4d4f !important;
    font-style: italic;
    font-weight: bold;
}

.delegationrow {
    width: 100%;
    height: 100%;
    text-align: left;
    line-height: normal;
    font-size: 14px;
    font-weight: bold;
    color: #faad14;
}

.gridcellfile {
    width: 100%;
    height: 100%;
    text-align: left;
    line-height: normal;
    font-size: 14px;
    font-weight: bold;
    color: #1677ff;
    text-decoration: underline;
    cursor: pointer;
}

/* ========== 通用选中行样式 ========== */
.grid-item-over .x-grid-cell { 
    background-color: #e6f4ff !important; 
    background: #e6f4ff !important;
}
.grid-selected-row .x-grid-cell { 
    background-color: #cce5ff !important; 
    background: #cce5ff !important;
}
.grid-selected-row .x-grid-cell-selected { 
    background-color: #cce5ff !important; 
    background: #cce5ff !important;
}


/* ============================================================
   十二、Tab选项卡样式优化
   ============================================================ */
.x-tab-button {
    color: #1677ff;
    text-align: left;
    font-size: 14px !important;
    padding-right: 20px !important;
    width: fit-content;
    border-right: none !important;
}

.x-tab-default-top {
    border: none !important;
    background: white;
    background-image: none !important;
    padding: 0 !important;
    height: auto !important;
}

.x-tab-bar-default-top {
    border: none !important;
    background: white;
    background-image: none !important;
    height: auto !important;
    min-height: 32px !important;
	border-radius:8px !important;
}

.x-tab-bar-strip-default {
    background-color: #e8e8e8 !important;
    border: none !important;
    height: 1px !important;
}

.x-tab.x-tab-default {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
.x-tab.x-tab-default .x-tab-inner-default {
    color: #595959 !important;
    font-size: 14px !important;
    font-weight: normal !important;
    padding: 6px 12px 6px 12px !important;
    line-height: 1.5 !important;
}
.x-tab.x-tab-default:hover { background: #fafafa !important; }
.x-tab.x-tab-default:hover .x-tab-inner-default { color: #1677ff !important; }

.x-tab.x-tab-active.x-tab-default {
    background-color: #ffffff !important;
    background-image: -webkit-linear-gradient(bottom, #1677ff, #cac6c44d 5%, #ffffff 45%) !important;
    border: none !important;
}
.x-tab.x-tab-active.x-tab-default .x-tab-inner-default {
    color: #1677ff !important;
    font-size: 14px !important;
    font-weight: bold !important;
    border-bottom: none !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

/* 关闭按钮 - 始终显示淡蓝色 × */
/* ============================================================
   Tab关闭按钮强力覆盖版 - 无边框,右上角
   ============================================================ */

/* 完全重置 */
.x-tab-close-btn,
.x-tab-default .x-tab-close-btn,
.x-tab .x-tab-close-btn,
.x-tab-bar .x-tab-close-btn,
li.x-tab .x-tab-close-btn {
    background: transparent !important;
    background-image: none !important;
    background-color: transparent !important;
    width: 24px !important;
    height: 24px !important;
    position: absolute !important;
    top: 0px !important;
    right: 0px !important;
    left: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 0 !important;
    opacity: 0.5 !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 0 !important;
    -ms-filter: none !important;
    filter: none !important;
    transition: opacity 0.2s ease, transform 0.1s ease !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

/* × 符号 */
.x-tab-close-btn::before,
.x-tab-default .x-tab-close-btn::before {
    content: '×' !important;
    font-size: 16px !important;
    font-weight: 300 !important;
    font-family: 'Segoe UI', 'Microsoft YaHei', 'Arial', sans-serif !important;
    color: #1677ff !important;
    display: block !important;
    text-align: center !important;
    line-height: 24px !important;
    background: transparent !important;
    position: static !important;
    transition: transform 0.2s ease !important;
}

/* 悬停 */
.x-tab-close-btn:hover,
.x-tab-default .x-tab-close-btn:hover {
    opacity: 1 !important;
}

.x-tab-close-btn:hover::before,
.x-tab-default .x-tab-close-btn:hover::before {
    transform: scale(1.2) !important;
    color: #ff4d4f !important;
}

/* 激活Tab */
.x-tab-active .x-tab-close-btn,
li.x-tab-active .x-tab-close-btn {
    opacity: 0.6 !important;
}

.x-tab-active .x-tab-close-btn:hover,
li.x-tab-active .x-tab-close-btn:hover {
    opacity: 1 !important;
}

/* Tab文字区域留出空间 */
.x-tab-inner-default,
.x-tab .x-tab-inner {
    padding-right: 28px !important;
}


/* 禁用Tab样式 */
.x-tab.x-tab-disabled .x-tab-inner-default { color: #c0c4cc !important; cursor: not-allowed !important; }
.x-tab.x-tab-disabled .x-tab-close-btn { display: none !important; }

.x-tab-button:before { border: none!important; outline: none!important; }
.x-tab-button:active { background-color: white!important; background: white!important; background-image: none!important; border: none!important; }
.x-tab-default-top:active { background-color: white!important; background: white!important; background-image: none!important; border: none!important; }

/* TUniPageControl 边距和外边框 */
.x-tab-panel,
.x-tabpanel,
.pagecontrol {
    margin: 5px 3px 3px 3px !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 4px !important;
    background: transparent !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
}

/* Tab 面板内容区域背景 - 浅灰色 */
.x-tab-panel-body,
.x-tabpanel-body {
    background: #F0F2F5 !important;
    background-color: #F0F2F5 !important;
}

/* Tab 面板内的 Frame 背景 - 增强选择器 */
.x-tab-panel-body > .x-panel,
.x-tab-panel-body > .x-container,
.x-tabpanel-body > .x-panel,
.x-tabpanel-body > .x-container {
    background: #F0F2F5 !important;
    background-color: #F0F2F5 !important;
}

.x-tab-panel-body > .x-panel > .x-panel-body,
.x-tab-panel-body > .x-container > .x-container-body,
.x-tabpanel-body > .x-panel > .x-panel-body,
.x-tabpanel-body > .x-container > .x-container-body {
    background: #F0F2F5 !important;
    background-color: #F0F2F5 !important;
}


.listtitle .x-form-text-default { border-width: 0px!important; background-color: transparent!important; }


/* ============================================================
   十三、手风琴/列表面板
   ============================================================ */
.accordionpanel .x-accordion-hd .x-panel-header-title {
    color: #003eb3!important;
    text-align: left;
    font-weight: normal!important;
    font-family: tahoma, arial, verdana, sans-serif;
    font-size: 16px!important;
    text-transform: none!important;
}

.listpanel .x-panel-header-default { background: antiquewhite; border-color: antiquewhite; }
.listpanel .x-panel-header-title-default { color: blue; font-weight: bold; font-size: 11px; line-height: 12px; }
.listpanel .x-panel-body-default { border-color: snow; border-style: inset; }

.tvmenu .x-tree-view .x-grid-item-over { background-color: lime; }
.tvmenu .x-grid-item-selected { font-weight: bold!important; color: rgb(218,18,38)!important; }
.tvmenu .x-grid-cell .x-grid-cell-inner { font-size: 16px !important; white-space: initial; }

.menupanel .x-panel-header-title-default {
    text-align: center;
    font-size: 20px!important;
    font-weight: bold!important;
    font-family: tahoma, arial, verdana, sans-serif;
    line-height: 20px;
}


/* ============================================================
   十四、通用面板样式
   ============================================================ */
/* 对话框底部Panel */
.x-panel-dialog {
    border-radius: 0px;
    border-left: 0px !important;
    border-top: 1px solid #99bce8 !important;
    border-right: 0px !important;
    border-bottom: 0px !important;
    border-style: solid;
    background: #fff !important;
}

/* 标题Panel样式(默认无边框) */
.x-caption-panel {
    border-radius: 0px;
    border-left: 0px !important;
    border-top: 0px!important;
    border-right: 0px!important;
    border-bottom: 1px solid #99bce8 !important;
    border-style: solid;
    background: #fff !important;
}

/* 自定义最大化编辑按钮 */
.x-tool-maxButton { background-image: url("../images/zoom-icon.png"); }
.x-tool-over .x-tool-maxButton { background-image: url("../images/zoom-icon-over.png"); }

/* 主窗体标题面板 */
.x-mainform-titlepanel {
    padding-left: 0px;
    background-color: #dc3545 !important;
    text-shadow: 2px 2px 3px #222222;
    font-family: "微软雅黑", "宋体", "黑体", Arial;
    margin-bottom: 5px;
    font-size: 12px;
}

/* 单据头部Panel */
.panel-bill-header { border-width: 0px!important; }
.panel-bill-header .x-panel-body-default {
    border-top-style: rgb(192, 0, 0);
    border-top-color: rgb(192, 0, 0);
    border-right-style: hidden;
    border-bottom-style: hidden;
    border-left-style: hidden;
}

/* 弹出选择窗体 */
.x-popup-form {
    border-radius: 6px !important;
    border-width: 0px !important;
    border-style: solid !important;
    background-color: white !important;
    box-shadow: initial !important;
}

/* 项目面板 */
.projectpanel { display: flex!important; justify-content: center!important; align-items: center!important; }
.projectnumber { font-size: 36px!important; font-weight: bold!important; top: 40%!important; left: 28%!important; }


/* ============================================================
   十五、标签样式
   ============================================================ */
.lblBoldCaption { font-family: "微软雅黑", "宋体", "黑体", Arial!important; font-size: 18px!important; }

/* 单据头标题标签 */
.label-bill-header {
    font-size: 14px !important;
    font-weight: bold !important;
    color: rgb(192, 0, 0) !important;
    margin-left: 0px;
    padding-left: 10px;
    padding-bottom: 5px;
    position: relative;
    display: inline-block;
}
.label-bill-header::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 66.67%;
    width: 3px;
    background-color: red;
}
.label-bill-header::after {
    content: '';
    position: absolute;
    left: 10px;
    right: 0;
    bottom: 0;
    height: 1px;
    background-color: rgb(192, 0, 0);
}

/* 必填标签样式 - 带红色星号 */
.required-star {
    display: inline-block;
    margin-left: 3px;
	margin-right: 2px;
    font-size: 18px !important;
    font-weight: bold !important;
    color: red !important;
    vertical-align: middle;
    line-height: 1;
}


/* 按钮标签 */
.label-button { background: white!important; color: blue!important; font-size: 20px!important; font-weight: bold!important; }
.label-button .x-abs-layout-item { font-size: 20px !important; }

/* 图片标签 */
.label-image {
    width: 16px;
    height: 16px;
    background-image: url('../image/arrow-left.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

/* OSS上传按钮 */
.ossbtn {
    color: white;
    background-color: orangered;
    border-color: orangered;
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
    height: 35px;
    width: 190px;
}
a.ossbtn:hover { background-color: orangered; }

/* OSS上传进度条 */
.ossprogress {
    margin-top: 2px;
    width: 200px;
    height: 12px;
    margin-bottom: 10px;
    overflow: hidden;
    background-color: #f5f5f5;
    border-radius: 4px;
    box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
}
.progress-bar {
    background-color: rgb(92, 184, 92);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.14902) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.14902) 50%, rgba(255, 255, 255, 0.14902) 75%, transparent 75%, transparent);
    background-size: 40px 40px;
    color: rgb(255, 255, 255);
    display: block;
    float: left;
    font-size: 12px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    transition: width 0.6s ease;
}


/* ============================================================
   十六、表单控件标签默认样式
   ============================================================ */
.x-form-item-label-default {
    font-size: 12px;
    font-family: normal 12px/14px tahoma, arial, verdana, sans-serif;
    border-color: #D8D7D7 !important;
    text-align: right;
    padding-top: 6px;
}
.x-form-item-label-top {
    font-size: 12px;
    font-family: normal 12px/14px tahoma, arial, verdana, sans-serif;
    border-color: #D8D7D7 !important;
    text-align: left;
    padding-top: 10px;
}
.x-fieldset { border: none!important; }
.x-fieldset-header-default .x-fieldset-header-text {
    font-size: 12px;
    font-family: normal 12px/14px tahoma, arial, verdana, sans-serif;
    border-color: #D8D7D7 !important;
}
.unifieldset .x-fieldset-header-default .x-fieldset-header-text { display: none; }
.unifieldset .x-form-item-body { padding-top: 5px; padding-bottom: 5px; }
.unifieldset .x-form-item-label-default {
    font-size: 12px;
    font-family: normal 12px/14px tahoma, arial, verdana, sans-serif;
    border-color: #D8D7D7 !important;
    text-align: right;
    padding-top: 10px;
}



.x-title-text { font-size: 14px; }

.memo .x-panel-header { border: none; }




/* ============================================================
   十八、TUniComboBox 下拉列表弹窗现代化
   ============================================================ */
.x-boundlist {
    border: 1px solid #e8e8e8 !important;
    border-radius: 4px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12) !important;
    background: #fff !important;
    max-height: 300px !important;
    overflow-y: auto !important;
    margin-top: 4px !important;
}
.x-boundlist-item {
    padding: 8px 12px !important;
    font-size: 14px !important;
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
    color: #666 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    border-bottom: 1px solid #f0f0f0 !important;
    background: #f0f8ff !important;  /* 浅蓝色背景 */
}
.x-boundlist-item:last-child { border-bottom: none !important; }
.x-boundlist-item:hover,
.x-boundlist-item.x-boundlist-item-over {
    background: #d6e8ff !important;  /* 悬停时稍深的蓝色 */
    color: #333 !important;
}
.x-boundlist-item.x-boundlist-selected {
    background: #1677ff !important;  /* 选中时深蓝色背景 */
    color: #fff !important;          /* 白色文字 */
    font-weight: 500 !important;
}

/* 下拉列表滚动条 */
.x-boundlist::-webkit-scrollbar { width: 6px !important; }
.x-boundlist::-webkit-scrollbar-track { background: #f5f5f5 !important; border-radius: 3px !important; }
.x-boundlist::-webkit-scrollbar-thumb { background: #d9d9d9 !important; border-radius: 3px !important; }
.x-boundlist::-webkit-scrollbar-thumb:hover { background: #bfbfbf !important; }


/* 日历假日标记 */
.calendar-holiday { font-size: 0.8em; color: red; vertical-align: super; }


/* ============================================================
   十九-B、TUniCalendarPanel 日历面板样式
   ============================================================ */

/* ---- 整体容器 ---- */
.x-calendar-panel,
.x-calendarpanel {
    border: 1px solid #d9d9d9 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    background: #fff !important;
}

/* ---- 顶部工具栏（导航栏） ---- */
.x-calendar-panel .x-calendar-header,
.x-calendarpanel .x-calendar-header,
.x-calendar-panel .x-docked-top,
.x-calendarpanel .x-docked-top,
.x-calendar-panel .x-panel-header,
.x-calendarpanel .x-panel-header,
.x-calendar-panel .x-panel-header-default,
.x-calendarpanel .x-panel-header-default {
    background: linear-gradient(135deg, #1677ff 0%, #0958d9 100%) !important;
    border: none !important;
    padding: 6px 12px !important;
}

/* ---- Title标题文字 ---- */
.x-calendar-panel .x-panel-header-title,
.x-calendarpanel .x-panel-header-title,
.x-calendar-panel .x-panel-header .x-panel-header-title,
.x-calendarpanel .x-panel-header .x-panel-header-title {
    color: #fff !important;
    font-size: 15px !important;
    font-weight: 700 !important;
}

.x-calendar-panel .x-panel-header-title-default,
.x-calendarpanel .x-panel-header-title-default {
    color: #fff !important;
}

/* ---- 导航按钮（上/下月、今天） ---- */
.x-calendar-panel .x-calendar-header .x-btn,
.x-calendarpanel .x-calendar-header .x-btn,
.x-calendar-panel .x-docked-top .x-btn,
.x-calendarpanel .x-docked-top .x-btn {
    background: rgba(255, 255, 255, 0.15) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 6px !important;
    padding: 4px 14px !important;
    transition: all 0.2s ease !important;
    min-height: 30px !important;
}

.x-calendar-panel .x-calendar-header .x-btn .x-btn-inner,
.x-calendarpanel .x-calendar-header .x-btn .x-btn-inner,
.x-calendar-panel .x-docked-top .x-btn .x-btn-inner,
.x-calendarpanel .x-docked-top .x-btn .x-btn-inner {
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
}

/* 导航按钮 hover */
.x-calendar-panel .x-calendar-header .x-btn-over,
.x-calendarpanel .x-calendar-header .x-btn-over,
.x-calendar-panel .x-docked-top .x-btn-over,
.x-calendarpanel .x-docked-top .x-btn-over {
    background: rgba(255, 255, 255, 0.3) !important;
    border-color: rgba(255, 255, 255, 0.5) !important;
}

/* 导航按钮 pressed */
.x-calendar-panel .x-calendar-header .x-btn-pressed,
.x-calendarpanel .x-calendar-header .x-btn-pressed,
.x-calendar-panel .x-docked-top .x-btn-pressed,
.x-calendarpanel .x-docked-top .x-btn-pressed {
    background: rgba(255, 255, 255, 0.4) !important;
    transform: scale(0.96) !important;
}

/* ---- 左右箭头按钮（< >） ---- */
.x-calendar-panel .x-calendar-header .x-btn-arrow,
.x-calendarpanel .x-calendar-header .x-btn-arrow,
.x-calendar-panel .x-docked-top .x-btn-arrow,
.x-calendarpanel .x-docked-top .x-btn-arrow {
    background: rgba(255, 255, 255, 0.15) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 50% !important;
    width: 32px !important;
    height: 32px !important;
    padding: 0 !important;
}

.x-calendar-panel .x-calendar-header .x-btn-arrow .x-btn-inner,
.x-calendarpanel .x-calendar-header .x-btn-arrow .x-btn-inner,
.x-calendar-panel .x-docked-top .x-btn-arrow .x-btn-inner,
.x-calendarpanel .x-docked-top .x-btn-arrow .x-btn-inner {
    color: #fff !important;
    font-size: 16px !important;
    font-weight: bold !important;
}

.x-calendar-panel .x-calendar-header .x-btn-arrow-over,
.x-calendarpanel .x-calendar-header .x-btn-arrow-over,
.x-calendar-panel .x-docked-top .x-btn-arrow-over,
.x-calendarpanel .x-docked-top .x-btn-arrow-over {
    background: rgba(255, 255, 255, 0.35) !important;
    border-color: rgba(255, 255, 255, 0.6) !important;
}

/* ---- 标题文字（月份年份） ---- */
.x-calendar-panel .x-calendar-header .x-component,
.x-calendarpanel .x-calendar-header .x-component,
.x-calendar-panel .x-docked-top .x-component,
.x-calendarpanel .x-docked-top .x-component {
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
}

/* ---- 视图切换按钮（日/周/月） ---- */
.x-calendar-panel .x-calendar-picker,
.x-calendarpanel .x-calendar-picker {
    background: rgba(255, 255, 255, 0.1) !important;
    border-radius: 6px !important;
    padding: 2px !important;
}

.x-calendar-panel .x-calendar-picker .x-btn,
.x-calendarpanel .x-calendar-picker .x-btn {
    background: transparent !important;
    border: none !important;
    border-radius: 4px !important;
    padding: 3px 12px !important;
    transition: all 0.2s ease !important;
}

.x-calendar-panel .x-calendar-picker .x-btn .x-btn-inner,
.x-calendarpanel .x-calendar-picker .x-btn .x-btn-inner {
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 12px !important;
    font-weight: 500 !important;
}

/* 视图切换按钮 hover */
.x-calendar-panel .x-calendar-picker .x-btn-over,
.x-calendarpanel .x-calendar-picker .x-btn-over {
    background: rgba(255, 255, 255, 0.15) !important;
}

.x-calendar-panel .x-calendar-picker .x-btn-over .x-btn-inner,
.x-calendarpanel .x-calendar-picker .x-btn-over .x-btn-inner {
    color: #fff !important;
}

/* 视图切换按钮 active/pressed */
.x-calendar-panel .x-calendar-picker .x-btn-pressed,
.x-calendarpanel .x-calendar-picker .x-btn-pressed,
.x-calendar-panel .x-calendar-picker .x-btn.x-btn-pressed,
.x-calendarpanel .x-calendar-picker .x-btn.x-btn-pressed {
    background: rgba(255, 255, 255, 0.9) !important;
    border-radius: 4px !important;
}

.x-calendar-panel .x-calendar-picker .x-btn-pressed .x-btn-inner,
.x-calendarpanel .x-calendar-picker .x-btn-pressed .x-btn-inner {
    color: #1677ff !important;
    font-weight: 700 !important;
}

/* ---- 日历表头（星期行） ---- */
.x-calendar-panel .x-calendar-days-header,
.x-calendarpanel .x-calendar-days-header,
.x-calendar-panel th,
.x-calendarpanel th {
    background: linear-gradient(135deg, #1677ff 0%, #0958d9 100%) !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    padding: 8px 0 !important;
    border-bottom: 2px solid #0958d9 !important;
}

/* ---- 日期单元格 ---- */
.x-calendar-panel .x-calendar-day,
.x-calendarpanel .x-calendar-day {
    border: 1px solid #f0f0f0 !important;
    transition: background 0.15s ease !important;
}

/* ---- 今天日期 ---- */
.x-calendar-panel .x-calendar-today,
.x-calendarpanel .x-calendar-today,
.x-calendar-panel .x-cal-today,
.x-calendarpanel .x-cal-today {
    background: #e6f4ff !important;
    border: 2px solid #1677ff !important;
    border-radius: 6px !important;
}

.x-calendar-panel .x-calendar-today .x-calendar-date,
.x-calendarpanel .x-calendar-today .x-calendar-date,
.x-calendar-panel .x-cal-today .x-calendar-date,
.x-calendarpanel .x-cal-today .x-calendar-date {
    background: #1677ff !important;
    color: #fff !important;
    font-weight: 700 !important;
    border-radius: 50% !important;
    width: 28px !important;
    height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ---- 日期数字 ---- */
.x-calendar-panel .x-calendar-date,
.x-calendarpanel .x-calendar-date {
    font-size: 13px !important;
    color: #333 !important;
    padding: 4px !important;
    border-radius: 50% !important;
    width: 28px !important;
    height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ---- 非当月日期 ---- */
.x-calendar-panel .x-calendar-day-outside,
.x-calendarpanel .x-calendar-day-outside,
.x-calendar-panel .x-calendar-other-month,
.x-calendarpanel .x-calendar-other-month {
    opacity: 0.35 !important;
}

/* ---- 选中日期 ---- */
.x-calendar-panel .x-calendar-selected,
.x-calendarpanel .x-calendar-selected,
.x-calendar-panel .x-cal-selected,
.x-calendarpanel .x-cal-selected {
    background: #e6f4ff !important;
}

.x-calendar-panel .x-calendar-selected .x-calendar-date,
.x-calendarpanel .x-calendar-selected .x-calendar-date {
    background: #4096ff !important;
    color: #fff !important;
    font-weight: 700 !important;
}

/* ---- 日期 hover ---- */
.x-calendar-panel .x-calendar-day:hover,
.x-calendarpanel .x-calendar-day:hover {
    background: #f5f5f5 !important;
}

.x-calendar-panel .x-calendar-day:hover .x-calendar-date,
.x-calendarpanel .x-calendar-day:hover .x-calendar-date {
    background: #e6f4ff !important;
    color: #1677ff !important;
}

/* ---- 周末日期 ---- */
.x-calendar-panel .x-calendar-weekend .x-calendar-date,
.x-calendarpanel .x-calendar-weekend .x-calendar-date {
    color: #ff4d4f !important;
}

/* ---- 事件/日程标记 ---- */
.x-calendar-panel .x-calendar-event,
.x-calendarpanel .x-calendar-event {
    background: rgba(22, 119, 255, 0.08) !important;
    border-left: 3px solid #1677ff !important;
}

.x-calendar-panel .x-calendar-event-indicator,
.x-calendarpanel .x-calendar-event-indicator {
    background: #1677ff !important;
    width: 6px !important;
    height: 6px !important;
    border-radius: 50% !important;
}

/* ---- 日历工具按钮统一圆角 ---- */
.x-calendar-panel .x-tool,
.x-calendarpanel .x-tool {
    border-radius: 4px !important;
    color: #fff !important;
}

.x-calendar-panel .x-tool:hover,
.x-calendarpanel .x-tool:hover {
    background: rgba(255, 255, 255, 0.25) !important;
}


/* ============================================================
   二十、分页样式 (来自A.html)
   ============================================================ */
.pagination {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 20px;
    padding: 12px 16px;
    background: #fafafa;
    border-radius: 4px;
    border: 1px solid #e8e8e8;
}
.pagination-info { font-size: 14px; color: #666; }
.pagination-buttons { display: flex; gap: 8px; align-items: center; }
.page-btn {
    padding: 4px 12px;
    border: 1px solid #d9d9d9;
    background: #fff;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
}
.page-btn:hover { border-color: #1677ff; color: #1677ff; }
.page-btn.active { background: #1677ff; color: #fff; border-color: #1677ff; }
.page-btn:disabled { opacity: 0.5; cursor: not-allowed; }



/* ============================================================
   二十一、底部统计栏样式 (来自A.html)
   ============================================================ */
.bottom-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 20px;
    padding: 12px 16px;
    background: #fafafa;
    border-radius: 4px;
    border: 1px solid #e8e8e8;
}
.stats-bar { display: flex; gap: 20px; font-size: 14px; color: #666; }
.stat-item { display: flex; align-items: center; gap: 6px; }
.stat-value { font-weight: bold; color: #1677ff; }




/* ============================================================
   二十二、工具栏分组与分隔符 (来自A.html)
   ============================================================ */
.toolbar {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
    padding: 12px 16px;
    background: #fafafa;
    border-radius: 4px;
    border: 1px solid #e8e8e8;
    flex-wrap: wrap;
    align-items: center;
}
.toolbar-group { display: flex; gap: 8px; align-items: center; }
.toolbar-divider { width: 1px; height: 24px; background: #d9d9d9; margin: 0 8px; }


/* ========== 表单分区样式 (来自A.html form-section) ========== */
.form-section {
    margin-bottom: 24px;
    padding: 16px 20px;
    background: #fff;
    border: 1px solid #e8e8e8;
    border-radius: 4px;
}

.form-section-title {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin-bottom: 16px;
    padding-bottom: 8px;
    border-bottom: 1px solid #f0f0f0;
    display: flex;
    align-items: center;
    gap: 8px;
}
.form-section-title::before {
    content: '';
    display: inline-block;
    width: 3px;
    height: 16px;
    background: #1677ff;
    border-radius: 2px;
}

/* UniGUI 表单分区面板 */
.x-panel.form-section {
    margin-bottom: 24px !important;
    background: #fff !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 4px !important;
    padding: 16px 20px !important;
}


/* ========== 信息网格样式 (来自A.html info-grid) ========== */
.info-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}
.info-item {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.info-label {
    font-size: 13px;
    color: #999;
}
.info-value {
    font-size: 14px;
    color: #333;
    font-weight: 500;
}

/* UniGUI 信息网格面板 */
.x-panel.info-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px !important;
}


.x-panel.info-item {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}


.x-label.info-label {
    font-size: 13px !important;
    color: #999 !important;
}


.x-label.info-value {
    font-size: 14px !important;
    color: #333 !important;
    font-weight: 500 !important;
}


/* ============================================================
   二十三、模态框/弹窗样式
   ============================================================ */
/* ========== UniGUI Window 弹窗现代化样式 ========== */
.x-window,
.x-window-default {
    border: none !important;
    border-radius: 4px !important;
    box-shadow: none !important;
    background: #F0F2F5 !important;
    background-color: #F0F2F5 !important;
    overflow: hidden !important;
    max-height: none !important;
    padding: 0 !important;
}

/* 窗口内部结构 - 仅清除标题栏和底部区域的间距 */
.x-window .x-docked-top {
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    width: 100% !important;
}

.x-window .x-docked-top .x-window-header-ct {
    padding: 0 !important;
    margin: 0 !important;
}

.x-window .x-docked-top .x-window-header {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 8px !important;
}

/* ============================================================
 TUniForm 窗体样式 - 蓝色标题栏
 ============================================================ */
/* 窗体 Header - 蓝色背景,水平铺满 */
.x-window-header,
.x-window-header-default,
.x-window-default .x-window-header {
    /* 1. 布局基础 */
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    position: relative !important;

    /* 2. 尺寸与边距 - 铺满窗口宽度 */
    padding: 0 8px !important;
    margin: 0 !important;
    width: 100% !important;
    min-height: 28px !important;
    height: auto !important;

    /* 3. 视觉样式 - 品牌蓝渐变(与 login.html 头部一致) */
    background: linear-gradient(to right, #0958d9 0%, #1677ff 100%) !important;
    background-color: #1677ff !important;
    border: none !important;
    border-bottom: none !important;
    border-radius: 4px 4px 0 0 !important;
    box-shadow: none !important;
}

/* 针对 ExtJS 内部嵌套容器 - 铺满标题栏 */
.x-window-header .x-window-header-body,
.x-window-header .x-window-header-inner {
    min-height: 28px !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    background: transparent !important;
}

/* 窗体 Header 标题 - 白色文字 */
.x-window-header-title,
.x-window-header-title-default,
.x-window-header-text {
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
    line-height: 28px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline !important;
}

/* 窗体 Body - 浅灰背景(与页面统一),完全无边框 */
.x-window-body,
.x-window-body-default,
.x-window-body.x-closable,
.x-window-body-closable,
.x-window-body-default-closable,
.x-window-body.x-resizable,
.x-window-body-resizable,
.x-window-body-default-resizable {
    background: #F0F2F5 !important;
    background-color: #F0F2F5 !important;
    border: none !important;
    border-width: 0 !important;
    border-color: transparent !important;
    box-shadow: none !important;
    outline: none !important;
    top: 0 !important;
    margin-top: 0 !important;
}

/* 窗体 Footer - 浅灰背景 */
.x-window-footer,
.x-window-footer-default {
    background: #F0F2F5 !important;
    background-color: #F0F2F5 !important;
    border: none !important;
    border-top: 1px solid #e8e8e8 !important;
}

/* ============================================================
   dialog-footer 样式 (TUniContainerPanel 通过 cls 设置)
   用于窗体底部面板,灰色顶部边框线
   ============================================================ */

.dialog-footer,
.x-panel.dialog-footer,
.x-container.dialog-footer {
    border-top: 1px solid #d9d9d9 !important;
    background: #fff !important;
    background-color: #fff !important;
}

.dialog-footer .x-panel-body,
.dialog-footer .x-panel-body-default,
.x-panel.dialog-footer .x-panel-body {
    background: #fff !important;
    background-color: #fff !important;
    border: none !important;
}

/* 窗体关闭按钮 - 白色文字图标 */
.x-window-header .x-tool-close,
.x-window-header .x-tool  {
    background: transparent !important;
    color: #fff !important;
    opacity: 1 !important;
    transition: none !important;
    width: 28px !important;
    height: 28px !important;
    margin: 0 !important;
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    right: 4px !important;
    transform: none !important;
    border-radius: 4px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.x-window-header .x-tool-close:hover,
.x-window-header .x-tool:hover {
    background: transparent !important;
    color: #fff !important;
}

/* 关闭按钮文字图标 - 白色 */
.x-window-header .x-tool-close::before {
    content: '×' !important;
    font-size: 24px !important;
    font-weight: 300 !important;
    font-family: 'Segoe UI', 'Microsoft YaHei', 'Arial', sans-serif !important;
    color: #fff !important;
    display: block !important;
    text-align: center !important;
    line-height: 28px !important;
    background: transparent !important;
    position: static !important;
    transition: none !important;
}

.x-window-header .x-tool-close:hover::before {
    color: #fff !important;
}

/* 隐藏原来的图标 */
.x-window-header .x-tool-close img {
    display: none !important;
}


.x-htmlframe .x-panel-body {
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
}

/* 弹窗遮罩层 */
.x-mask {
    background-color: rgba(0, 0, 0, 0.45) !important;
}

/* 普通JS弹窗样式 - 弹窗(轻量化+透明+扁平) */
.menuForm {
    border: 1px solid #e0e0e0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background-color: rgba(255, 255, 255, 0.8) !important;
    overflow: visible !important;
}

/* MenuClose图标 - 固定在容器右上角 */
.menuClose,
img.MenuClose,
.x-tool.MenuClose {
    position: absolute !important;
    top: 8px !important;
    right: 12px !important;
    width: 16px !important;
    height: 16px !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 1000 !important;
    cursor: pointer !important;
    display: block !important;
    visibility: visible !important;
}

/* 菜单展示区域标题栏 */
.menuHeader {
    border-top-style: none;
    border-right-style: none;
    border-bottom-style: outset;
    border-left-style: none;
    border-radius: 0 !important;
    background-color: transparent !important;
}

/* 菜单展示区域内容面板 */
.menuBody {
    border: none !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
}


/* ============================================================
   二十四、消息提示样式
   ============================================================ */
.message {
    position: fixed;
    top: 20px;
    right: 20px;
    padding: 12px 20px;
    border-radius: 4px;
    font-size: 14px;
    z-index: 2000;
    display: none;
}
.message.success { background: #f6ffed; color: #ffffff; border: 1px solid #b7eb8f; }
.message.error { background: #fff2f0; color: #ffffff; border: 1px solid #ffccc7; }
.message.warning { background: #fff7e6; color: #ffffff; border: 1px solid #ffd591; }
.message.info { background: #e6f4ff; color: #ffffff; border: 1px solid #e6f4ff; }
.message.active { display: block; animation: slideIn 0.3s ease; }
@keyframes slideIn { from { transform: translateX(100%); opacity: 0; } to { transform: translateX(0); opacity: 1; } }

.swal2-icon.swal2-question { color: mediumvioletred!important; border-color: mediumvioletred!important; }


/* ============================================================
   二十五、页面头部样式 (来自A.html)
   ============================================================ */
.page-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid #f0f0f0;
}
.page-title { font-size: 20px; font-weight: bold; color: #333; }


/* ============================================================
   二十六、文件上传按钮
   ============================================================ */
.fileUploadButton {
    width: 80px;
    border: 0;
    height: 18px;
    color: #FFF;
    padding-top: 2px;
    background-color: green;
}

.uni-custom-upload .fa4-cloud-upload,
.uni-custom-upload .fa4-cloud-download {
    background-image: none !important;
    vertical-align: middle !important;
    line-height: normal !important;
    margin-top: 0 !important;
    border: 1px solid #d0d0d0 !important;
    padding: 2px 4px !important;
    transition: all 0.3s ease !important;
}
.uni-custom-upload .fa4-cloud-upload:hover,
.uni-custom-upload .fa4-cloud-download:hover {
    border-color: #a0a0a0 !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.1) !important;
}
.uni-custom-upload .fa4-cloud-upload:active,
.uni-custom-upload .fa4-cloud-download:active {
    border-color: #808080 !important;
    background-color: #f5f5f5 !important;
}

/* 按钮式numberedit */
.buttonnumberedit .x-form-trigger-spinner { display: none; }
.buttonnumberedit .x-form-trigger-default {
    width: 17px;
    position: inherit;
    vertical-align: middle;
    background: 0 0 transparent no-repeat;
    color: coral;
}


/* ============================================================
   二十七、圆形图片
   ============================================================ */
.circleImg img { border-radius: 50%; cursor: pointer; }
.circleHandImg img {
    border-radius: 50%;
    cursor: pointer;
    height: 32px!important;
    width: 32px!important;
    margin-top: 5px;
    margin-right: 50px;
    margin-left: 80px;
}

.logo-img {
    width: 144rpx;
    height: 144rpx;
    background: white;
    padding: 0rpx;
    margin-bottom: 20px;
    transition: all 0.3s ease;
}
.logo-img:active { transform: scale(0.95); box-shadow: 0 5rpx 15rpx rgba(0, 0, 0, 0.1); }




/* ============================================================
   二十八、全局按钮样式(禁用hover变色 + 文字居中)
   ============================================================ */

/* ---- 所有按钮基础样式 - 禁用悬停/按下变色 ---- */
.x-btn,
.x-btn *,
.x-btn-default-small,
.x-btn-default-medium,
.x-btn-default-large,
.x-btn-default-toolbar-small,
.x-btn-default-toolbar-medium,
.x-btn-default-toolbar-large,
.x-btn.x-pressed,
.x-btn.x-btn-pressed,
.x-btn.x-btn-pressed *,
button[class*="btn"] {
    border-radius: 6px !important;
    -webkit-border-radius: 6px !important;
    -moz-border-radius: 6px !important;
    border-top-left-radius: 6px !important;
    border-top-right-radius: 6px !important;
    border-bottom-left-radius: 6px !important;
    border-bottom-right-radius: 6px !important;
    transform: none !important;
    -webkit-mask: none !important;
    mask: none !important;
}

/* 强制所有按钮hover时保持原背景色和文字颜色 */
.x-btn:hover,
.x-btn:focus,
.x-btn:active,
.x-btn.x-btn-over,
.x-btn.x-btn-pressed,
.x-btn.x-btn-focus,
.x-btn .x-btn-button:hover,
.x-btn .x-btn-button:focus,
.x-btn .x-btn-button:active,
.x-btn .x-btn-inner:hover,
.x-btn .x-btn-inner:focus,
.x-btn .x-btn-inner:active,
.x-btn:hover .x-btn-inner,
.x-btn:focus .x-btn-inner,
.x-btn:active .x-btn-inner,
.x-btn.x-btn-over .x-btn-inner,
.x-btn.x-btn-pressed .x-btn-inner {
    border-color: inherit !important;
    opacity: 1 !important;
    transform: none !important;
    box-shadow: none !important;
}

/* 保留按钮原有背景色和文字颜色不变 */
.x-btn {
    color: white !important;
}


/* TUniButton 文字水平垂直居中 */
.x-btn .x-btn-button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: inherit !important;
}
.x-btn .x-btn-inner {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    padding: 8px 16px !important;
    margin: 0 !important;
    border: none !important;
    width: auto !important;
    min-width: 70px !important;
    max-width: 200px !important;
    color: inherit !important;
    white-space: nowrap !important;
    line-height: 1 !important;
    background: transparent !important;
}

/* 禁用状态的按钮样式 */
.x-btn.x-item-disabled {
    opacity: 0.65 !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
}
.x-btn.x-item-disabled .x-btn-inner {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    padding: 8px 16px !important;
    background-color: inherit !important;
    color: inherit !important;
}

/* ============================================================
   二十九、ERP操作按钮专用样式
   每个按钮hover时保持原色(继承父级规则)
   ============================================================ */

/* ---- 新增按钮 btn-add ---- 蓝色主色 ---- */
.btn-add {
    background: #1677ff !important;
    border: 1px solid #1677ff !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    font-weight: bold !important;
    cursor: pointer !important;
    transition: transform 0.1s ease !important;
}
.btn-add .x-btn-inner { color: #fff !important; font-weight: bold !important; }
.btn-add:active { transform: scale(0.96) !important; }
/* ---- 发送验证码按钮 btn-sendsms ---- 蓝色小按钮 ---- */
.btn-sendsms {
    background: #fff !important;
    border: 1px solid #1677ff !important;
    color: #1677ff !important;
    border-radius: 4px !important;
    padding: 4px 12px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    min-width: 80px !important;
    height: 28px !important;
    line-height: 20px !important;
}
.btn-sendsms .x-btn-inner { 
    color: #1677ff !important; 
    font-size: 12px !important;
    font-weight: 500 !important;
}
.btn-sendsms:active { 
    transform: scale(0.96) !important; 
}
.btn-sendsms:disabled,
.btn-sendsms.disabled {
    background: #f5f5f5 !important;
    border-color: #d9d9d9 !important;
    color: #bfbfbf !important;
    cursor: not-allowed !important;
}
.btn-sendsms:disabled .x-btn-inner,
.btn-sendsms.disabled .x-btn-inner {
    color: #bfbfbf !important;
}
/* ---- 冲红按钮 btn-red ---- 红色背景 ---- 用于出入库单冲红操作 ---- */
.btn-red {
    background: #ff4d4f !important;
    border: 1px solid #ff4d4f !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    font-weight: bold !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}
.btn-red .x-btn-inner { 
    color: #fff !important; 
    font-weight: bold !important;
}
.btn-red:active { 
    transform: scale(0.96) !important; 
}
.btn-red:disabled {
    background: #ffa39e !important;
    border-color: #ffa39e !important;
    color: #fff !important;
    cursor: not-allowed !important;
    opacity: 0.6 !important;
}

/* ---- 拆分按钮 btn-split ---- 紫色背景 ---- 用于拆分大板操作 ---- */
.btn-split {
    background: #17a2b8 !important;
    border: 1px solid #17a2b8 !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    font-weight: bold !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}
.btn-split .x-btn-inner { 
    color: #fff !important; 
    font-weight: bold !important;
}
.btn-split:active { 
    transform: scale(0.96) !important; 
}
.btn-split:disabled {
    background: #b37feb !important;
    border-color: #b37feb !important;
    color: #fff !important;
    cursor: not-allowed !important;
    opacity: 0.6 !important;
}

/* ---- 调整顺序按钮 btn-adjust ---- 靛青色 ---- */
.btn-adjust {
    background: #1677ff !important;
    border: 1px solid #1677ff !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    font-weight: bold !important;
    cursor: pointer !important;
    transition: transform 0.1s ease !important;
}
.btn-adjust .x-btn-inner { color: #fff !important; font-weight: bold !important; }
.btn-adjust:active { transform: scale(0.96) !important; }

/* ---- 关闭按钮 btn-close ---- 深灰色 ---- */
.btn-close {
    background: #595959 !important;
    border: 1px solid #595959 !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    font-weight: bold !important;
    cursor: pointer !important;
    transition: transform 0.1s ease !important;
}
.btn-close .x-btn-inner { color: #fff !important; font-weight: bold !important; }
.btn-close:active { transform: scale(0.96) !important; }

/* ---- 查询按钮 btn-query (TUniBitBtn) ---- 采用 btn-reset 的 hover 样式(白底蓝边蓝字) ---- */
.x-btn.btn-query {
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    background-image: none !important;
    border: 1px solid #1677ff !important;
    border-radius: 4px !important;
    color: #1677ff !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    font-weight: bold !important;
    cursor: pointer !important;
    transition: all 0.1s ease !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

.x-btn.btn-query .x-btn-wrap,
.x-btn.btn-query .x-btn-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    flex: 0 0 auto !important;
    max-width: none !important;
}

/* 隐藏查询按钮图标 */
.x-btn.btn-query::before {
    content: none !important;
    display: none !important;
}

.x-btn.btn-query .x-btn-inner {
    color: #1677ff !important;
    font-weight: bold !important;
    padding: 0 !important;
}

/* 查询按钮 hover/focus/pressed 已由文件末尾全局 A/B 段统一覆盖(淡红底+红字) */

/* ---- 修改按钮 btn-edit ---- 橙色 ---- */
.btn-edit {
    background: #e67e23 !important;
    border: 1px solid #e67e23 !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    font-weight: bold !important;
    cursor: pointer !important;
    transition: transform 0.1s ease !important;
}
.btn-edit .x-btn-inner { color: #fff !important; font-weight: bold !important; }
.btn-edit:active { transform: scale(0.96) !important; }

/* ---- 删除按钮 btn-del ---- 红色 ---- */
.btn-del {
    background: #ff4d4f !important;
    border: 1px solid #ff4d4f !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    font-weight: bold !important;
    cursor: pointer !important;
    transition: transform 0.1s ease !important;
}
.btn-del .x-btn-inner { color: #fff !important; font-weight: bold !important; }
.btn-del:active { transform: scale(0.96) !important; }

/* ---- 保存按钮 btn-save ---- 浅蓝灰色 ---- */
.btn-save {
    background: #5b7c99 !important;
    border: 1px solid #5b7c99 !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 6px 20px !important;
    font-size: 14px !important;
    font-weight: bold !important;
    cursor: pointer !important;
    box-shadow: 0 2px 4px rgba(91, 124, 153, 0.2) !important;
    transition: transform 0.1s ease !important;
}
.btn-save .x-btn-inner{ color: #fff !important; font-weight: bold !important; }
.btn-save:active { transform: scale(0.96) !important; }

/* ---- 取消按钮 btn-cancel ---- 灰色 ---- */
.btn-cancel {
    background: #f0f0f0 !important;
    border: 1px solid #d9d9d9 !important;
    color: #666 !important;
    border-radius: 4px !important;
    padding: 6px 20px !important;
    font-size: 14px !important;
    font-weight: bold !important;
    cursor: pointer !important;
    transition: transform 0.1s ease !important;
}
.btn-cancel .x-btn-inner { color: inherit !important; font-weight: bold !important; }
.btn-cancel:active { transform: scale(0.96) !important; }

/* ---- 重置按钮 btn-reset (TUniBitBtn) ---- 白底灰边灰字(依据样例.png 重置按钮) ---- */
.x-btn.btn-reset {
    background: #FFFFFF !important;
    background-color: #FFFFFF !important;
    background-image: none !important;
    border: 1px solid #DDDDDD !important;
    border-radius: 4px !important;
    color: #666666 !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    font-weight: bold !important;
    cursor: pointer !important;
    transition: all 0.1s ease !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

/* 重置按钮内部容器 - 收紧宽度 */
.x-btn.btn-reset .x-btn-wrap,
.x-btn.btn-reset .x-btn-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    flex: 0 0 auto !important;
    max-width: none !important;
}

/* 隐藏重置按钮图标 */
.x-btn.btn-reset::before {
    content: none !important;
    display: none !important;
}

.x-btn.btn-reset .x-btn-inner {
    color: #666666 !important;
    font-weight: bold !important;
    padding: 0 !important;
}

/* 重置按钮 hover/focus/pressed 已由文件末尾全局 A/B 段统一覆盖(淡红底+红字) */

/* ---- 主要按钮 btn-primary ---- 蓝底白字 无图标 ---- */
.x-btn.btn-primary {
    background: #1677ff !important;
    border: 1px solid #1677ff !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 6px 20px !important;
    font-size: 14px !important;
    font-weight: bold !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 2px 4px rgba(22, 119, 255, 0.2) !important;
}
.x-btn.btn-primary .x-btn-inner {
    color: #fff !important;
    font-weight: bold !important;
}

/* btn-primary hover/focus/pressed 已由文件末尾全局 A/B 段统一覆盖(淡红底+红字) */

/* ============================================================
   统一实心按钮 hover 效果 —— 已作废(2026-07-25)
   原"brightness 加深 + 白字"方案已被文件末尾"全局统一按钮
   hover/pressed/focus 样式(淡红底+红字)"取代,此处规则删除,
   避免其高特异性白字规则在淡红底上把文字刷白而不可见。
   ============================================================ */

/* ---- 提交按钮 btn-confirm ---- 蓝底白字 ---- */
.btn-confirm {
    background: linear-gradient(135deg, #1677ff 0%, #0958d9 100%) !important;
    border: 1px solid #1677ff !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 6px 20px !important;
    font-size: 14px !important;
    font-weight: bold !important;
    cursor: pointer !important;
    transition: transform 0.1s ease !important;
}
.btn-confirm .x-btn-inner { color: #fff !important; font-weight: bold !important; }
.btn-confirm:active { transform: scale(0.96) !important; }

/* ---- 审核按钮 btn-audit ---- 橙色 ---- */
.btn-audit {
    background: #faad14 !important;
    border: 1px solid #faad14 !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    cursor: pointer !important;
    transition: transform 0.1s ease !important;
}
.btn-audit .x-btn-inner { color: #fff !important; }
.btn-audit:active { transform: scale(0.96) !important; }

/* ---- 审批信息按钮 btn-info ---- 天蓝色 ---- */
.btn-info {
    background: #17a2b8 !important;
    border: 1px solid #17a2b8 !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    cursor: pointer !important;
    transition: transform 0.1s ease !important;
}
.btn-info .x-btn-inner { color: #fff !important; }
.btn-info:active { transform: scale(0.96) !important; }

/* ---- 报表按钮 btn-report ---- 青色 ---- */
.btn-report {
    background: #17a2b8 !important;
    border: 1px solid #17a2b8 !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    cursor: pointer !important;
    transition: transform 0.1s ease !important;
}
.btn-report .x-btn-inner { color: #fff !important; }
.btn-report:active { transform: scale(0.96) !important; }

/* ---- 导入按钮 btn-import ---- 青绿色 ---- */
.btn-import {
    background: #13c2c2 !important;
    border: 1px solid #13c2c2 !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    cursor: pointer !important;
    transition: transform 0.1s ease !important;
}
.btn-import .x-btn-inner { color: #fff !important; }
.btn-import:active { transform: scale(0.96) !important; }

/* ---- 导出按钮 btn-export ---- 灰色 ---- */
.btn-export {
    background: #6c757d !important;
    border: 1px solid #6c757d !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    cursor: pointer !important;
    transition: transform 0.1s ease !important;
}
.btn-export .x-btn-inner { color: #fff !important; }
.btn-export:active { transform: scale(0.96) !important; }

/* ---- 批量提交按钮 btn-batch-confirm ---- 深绿色 ---- */
.btn-batch-confirm {
    background: #389e0d !important;
    border: 1px solid #389e0d !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    cursor: pointer !important;
    transition: transform 0.1s ease !important;
}
.btn-batch-confirm .x-btn-inner { color: #fff !important; }
.btn-batch-confirm:active { transform: scale(0.96) !important; }

/* ---- 批量审核按钮 btn-batch-audit ---- 深紫色 ---- */
.btn-batch-audit {
    background: #117a8b !important;
    border: 1px solid #117a8b !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    cursor: pointer !important;
    transition: transform 0.1s ease !important;
}
.btn-batch-audit .x-btn-inner { color: #fff !important; }
.btn-batch-audit:active { transform: scale(0.96) !important; }

/* ============================================================
   三十、TUniNumberEdit 数字输入框样式
   隐藏加减按钮(Trigger按钮),仅显示输入框
   ============================================================ */

/* 隐藏数字输入框的所有触发按钮 */
.x-form-trigger-spinner,
.x-form-spinner-wrap,
.x-spinner-buttons,
.x-form-spinner-up,
.x-form-spinner-down,
.x-spinner-up,
.x-spinner-down,
.x-spinner-button-up,
.x-spinner-button-down,
.x-form-numberfield-wrap .x-form-trigger {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    visibility: hidden !important;
    opacity: 0 !important;
    overflow: hidden !important;
}

/* 数字输入框容器 - 不显示触发按钮区域 */
.x-form-trigger-wrap,
.x-form-numberfield-wrap {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
}

/* 隐藏触发按钮后的输入框样式调整 */
.x-form-number-field,
.x-spinner-field,
input[type="number"] {
    border-radius: 4px !important;
    width: 100% !important;
}

/* 移除数字输入框右侧的触发按钮边框 */
.x-form-number-field .x-form-trigger-cell {
    display: none !important;
    width: 0 !important;
}

/* ============================================================
   三十一、TUniComboBox 和 TUniDateTimePicker 触发按钮样式
   整合所有 trigger 样式,避免相互覆盖

   图标说明:
   - 搜索按钮:../images/search.png
   - 日期按钮:../images/date.png
   - 下拉箭头:使用图片 combobox.png
   ============================================================ */

/* 触发按钮容器 */
.x-form-trigger-wrap {
    display: flex !important;
    align-items: stretch !important;
}

/* 触发按钮基础样式 - 排除 spinner 和 clear 类型 */
.x-form-trigger:not(.x-form-trigger-spinner):not(.x-form-clear-trigger):not(.x-form-trigger-clear),
.x-form-trigger-default:not(.x-form-trigger-spinner):not(.x-form-clear-trigger):not(.x-form-trigger-clear),
.x-form-trigger-combo,
.x-form-trigger-date,
.x-form-date-trigger,
.x-form-arrow-trigger {
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    min-width: 24px !important;
    height: 100% !important;
    min-height: 22px !important;
    cursor: pointer !important;
    position: relative !important;
    border: none !important;
    border-radius: 0 !important;  /* 由 :last-child 统一控制右侧圆角 */
    background-color: transparent !important;
    transition: all 0.2s ease !important;
    overflow: visible !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* 悬停状态 - 背景变色,图标保持不变 */
.x-form-trigger:not(.x-form-trigger-spinner):not(.x-form-clear-trigger):not(.x-form-trigger-clear):hover,
.x-form-trigger-default:not(.x-form-trigger-spinner):not(.x-form-clear-trigger):not(.x-form-trigger-clear):hover,
.x-form-trigger-combo:hover,
.x-form-trigger-date:hover,
.x-form-date-trigger:hover,
.x-form-arrow-trigger:hover {
    background-color: #f5f5f5 !important;
}

/* 按下状态 - 背景变色,图标保持不变 */
.x-form-trigger:not(.x-form-trigger-spinner):not(.x-form-clear-trigger):not(.x-form-trigger-clear):active,
.x-form-trigger-default:not(.x-form-trigger-spinner):not(.x-form-clear-trigger):not(.x-form-trigger-clear):active,
.x-form-trigger-combo:active,
.x-form-trigger-date:active,
.x-form-date-trigger:active,
.x-form-arrow-trigger:active {
    background-color: #e8e8e8 !important;
}

/* 聚焦状态 */
.x-form-focus .x-form-trigger:not(.x-form-trigger-spinner):not(.x-form-clear-trigger):not(.x-form-trigger-clear),
.x-form-trigger-wrap-focus .x-form-trigger:not(.x-form-trigger-spinner):not(.x-form-clear-trigger):not(.x-form-trigger-clear) {
    border-left-color: #1677ff !important;
}

/* 隐藏默认trigger的原始 img 元素(不影响自定义trigger的图标) */
.x-form-trigger-combo img,
.x-form-arrow-trigger img,
.x-form-trigger-date img,
.x-form-date-trigger img,
.x-form-clear-trigger img,
.x-form-trigger-clear img,
.x-form-trigger-combo .x-icon-el,
.x-form-arrow-trigger .x-icon-el,
.x-form-trigger-date .x-icon-el,
.x-form-date-trigger .x-icon-el,
.x-form-clear-trigger .x-icon-el,
.x-form-trigger-clear .x-icon-el {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
}

/* 确保自定义trigger的图标正常显示 */
.x-form-trigger:not(.x-form-trigger-combo):not(.x-form-arrow-trigger):not(.x-form-trigger-date):not(.x-form-date-trigger):not(.x-form-clear-trigger):not(.x-form-trigger-clear):not(.x-form-trigger-spinner) {
    display: flex !important;
}

.x-form-trigger:not(.x-form-trigger-combo):not(.x-form-arrow-trigger):not(.x-form-trigger-date):not(.x-form-date-trigger):not(.x-form-clear-trigger):not(.x-form-trigger-clear):not(.x-form-trigger-spinner) img,
.x-form-trigger:not(.x-form-trigger-combo):not(.x-form-arrow-trigger):not(.x-form-trigger-date):not(.x-form-date-trigger):not(.x-form-clear-trigger):not(.x-form-trigger-clear):not(.x-form-trigger-spinner) .x-icon-el,
.x-form-trigger:not(.x-form-trigger-combo):not(.x-form-arrow-trigger):not(.x-form-trigger-date):not(.x-form-date-trigger):not(.x-form-clear-trigger):not(.x-form-trigger-clear):not(.x-form-trigger-spinner) .x-btn-icon-el {
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: auto !important;
    height: auto !important;
    max-width: 16px !important;
    max-height: 16px !important;
}

/* ============================================================
   清除按钮 - 使用图片 clear.png
   由UniGUI框架控制显示逻辑:有值时显示,无值时隐藏
   注意:不强制设置display,让框架控制显示/隐藏
   ============================================================ */

/* 清除按钮基础样式 - 不强制display,让框架控制 */
.x-form-clear-trigger,
.x-form-trigger-clear {
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    min-width: 24px !important;
    height: 100% !important;
    min-height: 22px !important;
    cursor: pointer !important;
    position: relative !important;
    border: none !important;
    border-radius: 0 !important;  /* 由 :last-child 统一控制右侧圆角 */
    background-color: transparent !important;
    background-image: url('../images/clear.png') !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 16px 16px !important;
    transition: all 0.2s ease !important;
}

/* 悬停状态 - 改变背景色 */
.x-form-clear-trigger:hover,
.x-form-trigger-clear:hover {
    background-color: #f5f5f5 !important;
}

/* 按下状态 */
.x-form-clear-trigger:active,
.x-form-trigger-clear:active {
    background-color: #e8e8e8 !important;
}

/* 隐藏 ::before 伪元素,避免覆盖图片 */
.x-form-clear-trigger::before,
.x-form-trigger-clear::before,
.x-form-clear-trigger::after,
.x-form-trigger-clear::after {
    content: none !important;
    display: none !important;
}

/* ============================================================
   ComboBox 下拉箭头 - 使用图片
   所有状态(默认/悬停/按下/聚焦)都使用相同图标
   ============================================================ */

.x-form-arrow-trigger,
.x-form-trigger-combo {
    background-image: url('../images/combobox.png') !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 16px 16px !important;
}

/* 悬停和按下状态 - 保持相同图标,仅改变背景色 */
.x-form-arrow-trigger:hover,
.x-form-trigger-combo:hover,
.x-form-arrow-trigger:active,
.x-form-trigger-combo:active,
.x-form-arrow-trigger:focus,
.x-form-trigger-combo:focus {
    background-image: url('../images/combobox.png') !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 16px 16px !important;
}

/* 隐藏 ::before 伪元素,避免覆盖图片 */
.x-form-arrow-trigger::before,
.x-form-trigger-combo::before,
.x-form-arrow-trigger::after,
.x-form-trigger-combo::after {
    content: none !important;
    display: none !important;
}

/* 多trigger按钮时:只有最后一个trigger有右侧圆角,中间的trigger圆角为0 */
.x-form-trigger-wrap .x-form-trigger:last-child {
    border-radius: 0 4px 4px 0 !important;
}

/* ============================================================
   DateTimePicker 日历图标 - 使用图片
   所有状态(默认/悬停/按下/聚焦)都使用相同图标
   ============================================================ */

.x-form-date-trigger,
.x-form-trigger-date {
    background-image: url('../images/date.png') !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 16px 16px !important;
}

/* 悬停和按下状态 - 保持相同图标,仅改变背景色 */
.x-form-date-trigger:hover,
.x-form-trigger-date:hover,
.x-form-date-trigger:active,
.x-form-trigger-date:active,
.x-form-date-trigger:focus,
.x-form-trigger-date:focus {
    background-image: url('../images/date.png') !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 16px 16px !important;
}

/* 隐藏 ::before 伪元素 */
.x-form-date-trigger::before,
.x-form-trigger-date::before,
.x-form-date-trigger::after,
.x-form-trigger-date::after {
    content: none !important;
    display: none !important;
}

/* ============================================================
   搜索按钮图标 - 使用图片
   ============================================================ */

.x-form-search-trigger {
    background-image: url('../images/search.png') !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 16px 16px !important;
}

.x-form-search-trigger:hover,
.x-form-search-trigger:active,
.x-form-search-trigger:focus {
    background-image: url('../images/search.png') !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: 16px 16px !important;
}

.x-form-search-trigger::before,
.x-form-search-trigger::after {
    content: none !important;
    display: none !important;
}

/* ============================================================
   三十三、TUniCheckBox / TUniDBCheckBox 复选框样式(整合版)
   ============================================================ */

/* ---- 0. 强制覆盖ExtJS表格布局间距 ---- */
.x-form-cb-wrap table,
.x-form-cb-wrap table,
.x-form-item-checkbox table,
.x-form-cb-wrap .x-form-item-body table,
.x-form-item-body .x-form-cb-wrap table {
    border-collapse: collapse !important;
    border-spacing: 0 !important;
}
.x-form-cb-wrap td,
.x-form-cb-wrap td,
.x-form-item-checkbox td,
.x-form-cb-wrap .x-form-item-body td,
.x-form-item-body .x-form-cb-wrap td {
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    vertical-align: middle !important;
}

/* ---- 1. 复选框容器(wrap层) ---- */
/* .x-form-checkbox 在UniGUI中是wrap容器,不是方框 */
.x-form-checkbox,
.x-form-cb-wrap,
.x-form-cb-wrap,
.x-form-item-checkbox,
.x-form-cb-wrap .x-form-item-body,
.x-form-item-body .x-form-cb-wrap {
    padding: 0 !important;
    padding-left: 0 !important;
    margin: 0 !important;
    margin-top: 0 !important;
    vertical-align: middle !important;
    cursor: pointer !important;
}

/* ---- 2. 复选框视觉元素(方框) ---- */
/* 注意: .x-form-checkbox 不在此处,它是wrap容器 */
.x-form-cb,
.x-form-cb-default,
input[type="checkbox"].x-form-checkbox,
input[type="checkbox"].x-form-cb,
.x-form-cb-wrap .x-form-cb,
.x-form-cb-wrap .x-form-field,
.x-form-cb-wrap .x-form-field,
.x-form-cb-wrap input.x-form-field,
.x-form-cb-wrap input.x-form-field,
input[type="checkbox"].x-form-field {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    display: inline-block !important;
    visibility: visible !important;
    width: 13px !important;
    height: 13px !important;
    min-width: 13px !important;
    min-height: 16px !important;
    max-width: 13px !important;
    max-height: 16px !important;
    line-height: 13px !important;
    font-size: 0 !important;
    border: 1px solid #1677ff !important;
    border-radius: 2px !important;
    background: #fff !important;
    background-color: #ffffff !important;
    background-image: none !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    position: relative !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
    opacity: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    margin-top: 0 !important;
    float: none !important;
    overflow: hidden !important;
}

/* ---- 3. 隐藏原始input ---- */
.x-form-checkbox input[type="checkbox"],
input[type="checkbox"].x-form-checkbox,
.x-form-cb input,
.x-form-cb-wrap input,
.x-form-cb-wrap input.x-form-field,
.x-form-cb-wrap input.x-form-field,
input[type="checkbox"].x-form-field {
    opacity: 0 !important;
    width: 13px !important;
    height: 13px !important;
    min-height: 16px !important;
    max-height: 16px !important;
    position: absolute !important;
    margin: 0 !important;
    z-index: 1 !important;
    cursor: pointer !important;
    left: 0 !important;
    top: 0 !important;
}

/* ---- 4. 悬停 ---- */
.x-form-cb:hover,
.x-form-cb-default:hover,
input[type="checkbox"].x-form-checkbox:hover,
input[type="checkbox"].x-form-cb:hover {
    border-color: #1677ff !important;
}

/* ---- 5. 选中状态 - 蓝色背景 ---- */
input[type="checkbox"].x-form-checkbox:checked,
input[type="checkbox"].x-form-cb:checked,
.x-form-cb-checked .x-form-cb,
.x-form-cb-checked .x-form-cb-default,
.x-form-checkbox.x-form-cb-checked .x-form-cb,
.x-form-cb-wrap.x-form-cb-checked .x-form-cb {
    background-color: #1677ff !important;
    border-color: #1677ff !important;
    background-image: none !important;
}

/* ---- 6. 选中勾号 ---- */
input[type="checkbox"].x-form-checkbox:checked::after,
input[type="checkbox"].x-form-cb:checked::after,
.x-form-cb-checked .x-form-cb::after,
.x-form-cb-checked .x-form-cb-default::after,
.x-form-checkbox.x-form-cb-checked .x-form-cb::after,
.x-form-cb-wrap.x-form-cb-checked .x-form-cb::after,
.x-form-cb-wrap.x-form-cb-checked .x-form-cb::after {
    content: '✓' !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 100% !important;
    font-size: 11px !important;
    font-weight: bold !important;
    color: #fff !important;
    line-height: 11px !important;
    text-align: center !important;
    display: block !important;
    visibility: visible !important;
    pointer-events: none !important;
}

/* ---- 7. 选中状态before伪元素(兼容) ---- */
.x-form-cb-wrap.x-form-cb-checked .x-form-cb::before,
.x-form-cb-wrap.x-form-cb-checked .x-form-cb::before {
    background: #1677ff !important;
    border-color: #1677ff !important;
}

/* ---- 8. 标签文字(Caption) ---- */
.x-form-cb-label,
.x-form-cb-label-default,
.x-checkbox-label,
.x-form-cb-wrap label {
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
    font-size: 13px !important;
    color: #1f2937 !important;
    cursor: pointer !important;
    user-select: none !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
    margin-top: 0 !important;
    line-height: 15px !important;
    vertical-align: middle !important;
    display: inline !important;
}

/* ---- 9. 聚焦 ---- */
input[type="checkbox"].x-form-checkbox:focus,
input[type="checkbox"].x-form-cb:focus {
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(22, 119, 255, 0.2) !important;
}

/* ---- 10. 禁用状态 ---- */
input[type="checkbox"].x-form-checkbox:disabled,
input[type="checkbox"].x-form-cb:disabled,
.x-item-disabled .x-form-cb {
    background: #f5f5f5 !important;
    border-color: #d9d9d9 !important;
    cursor: not-allowed !important;
    opacity: 0.6 !important;
}

.x-item-disabled.x-form-cb-checked .x-form-cb {
    background: #d9d9d9 !important;
    border-color: #d9d9d9 !important;
}

.x-item-disabled.x-form-cb-checked .x-form-cb::after {
    color: #999 !important;
}

.x-item-disabled .x-form-cb::before {
    background: #f5f5f5 !important;
    border-color: #d9d9d9 !important;
    cursor: not-allowed !important;
}

.x-item-disabled.x-form-cb-checked .x-form-cb::before {
    background: #d9d9d9 !important;
    border-color: #d9d9d9 !important;
}

/* ---- 11. 只读状态 ---- */
.x-form-cb-wrap[readonly] .x-form-cb::before {
    background: #fafafa !important;
    cursor: default !important;
}

/* ---- 帮助按钮 btn-help ---- 灰蓝色 ---- */
.btn-help {
    background: #6c757d !important;
    border: 1px solid #6c757d !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    cursor: pointer !important;
    transition: transform 0.1s ease !important;
}
.btn-help .x-btn-inner { color: #fff !important; }
.btn-help:active { transform: scale(0.96) !important; }

/* ---- 选择文件按钮 btn-selectfile ---- 深青蓝底白字 ---- */
.btn-selectfile {
    background: #3a7ca5 !important;
    border: 1px solid #3a7ca5 !important;
    color: #fff !important;
    border-radius: 4px !important;
    padding: 6px 20px !important;
    font-size: 14px !important;
    font-weight: bold !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 2px 4px rgba(58, 124, 165, 0.2) !important;
}
.btn-selectfile .x-btn-inner {
    color: #fff !important;
    font-weight: bold !important;
}
.btn-selectfile:active {
    transform: scale(0.96) !important;
}



/* ============================================================
   三十一、标签字段与信息展示样式 (来自A.html)
   ============================================================ */
.account-title {
    color: #2c3e50;
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px dashed #ced4da;
}

.info-label {
    color: #6c757d;
    font-weight: 500;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.info-value {
    font-family: 'Courier New', monospace;
    font-size: 1.1rem;
    color: #2c3e50;
    background: rgba(255,255,255,0.9);
    padding: 0.5rem 1rem;
    border-radius: 6px;
    border: 1px solid #dee2e6;
    position: relative;
    transition: all 0.2s ease;
}
.info-value:hover {
    background: white;
    box-shadow: 0 2px 8px rgba(22, 119, 255,0.15);
    transform: translateY(-1px);
    cursor: copy;
}

.tag-style {
    background-color: #1677ff!important;
    color: white;
    border-radius: 15px;
    font-size: 0.8em!important;
    animation: pulse 0.5s;
}
@keyframes pulse { 0% { opacity: 0.8; } 100% { opacity: 1; } }
.tag-style.x-grid-cell-inner {
    background-color: #1677ff!important;
    color: white;
    border-radius: 15px;
    font-size: 0.8em!important;
}


/* ============================================================
   三十二、输入框聚焦样式(与hover同色)
   ============================================================ */
/* 通用输入框聚焦样式 */
.x-form-field:focus,
.x-form-text:focus,
.x-form-text-focus,
.x-form-focus,
input.x-form-field:focus,
textarea.x-form-field:focus,
.x-form-field.x-form-focus {
    border-color: #4096ff !important;           /* 与hover同色 */
    outline: none !important;
    box-shadow: 0 0 0 1px rgba(64, 150, 255, 0.15) !important;  /* 与hover同光晕 */
    background-color: #fff !important;
}

/* 数字输入框聚焦 */
.x-form-number-field:focus,
.x-spinner-field:focus {
    border-color: #4096ff !important;
    box-shadow: 0 0 0 1px rgba(64, 150, 255, 0.15) !important;
}

/* 日期选择器聚焦 */
.x-datefield .x-form-field:focus {
    border-color: #4096ff !important;
    box-shadow: 0 0 0 1px rgba(64, 150, 255, 0.15) !important;
}

/* 下拉框聚焦 */
.x-form-combo.x-form-focus,
.x-combo-field.x-form-focus {
    border-color: #4096ff !important;
    border-right: none !important;               /* 聚焦时保持右侧无边框 */
    box-shadow: 0 0 0 1px rgba(64, 150, 255, 0.15) !important;
}

/* 日期选择器聚焦 - 保持右侧无边框 */
.x-datefield.x-form-focus .x-form-field,
.x-datefield .x-form-field.x-form-focus {
    border-right: none !important;
}

/* 触发按钮跟随输入框聚焦变色 */
.x-form-focus .x-form-trigger,
.x-form-combo.x-form-focus ~ .x-form-trigger,
.x-datefield.x-form-focus .x-form-trigger {
    border-top-color: #4096ff !important;
    border-right-color: #4096ff !important;
    border-bottom-color: #4096ff !important;
    border-left: none !important;
}

/* 文本域聚焦 */
.x-form-textarea:focus {
    border-color: #4096ff !important;
    box-shadow: 0 0 0 1px rgba(64, 150, 255, 0.15) !important;
}


/* ============================================================
   三十三、响应式补充
   ============================================================ */
@media (max-width: 768px) {
    .account-info-row { grid-template-columns: 1fr; gap: 0.5rem; }
    .info-label { font-size: 0.8rem; }
    .info-value { font-size: 1rem; }
    .toolbar { flex-direction: column; gap: 8px; }
    .search-bar { flex-direction: column; gap: 10px; }
    .form-row { flex-direction: column; gap: 10px; }
    .pagination { flex-direction: column; gap: 10px; }
    .bottom-toolbar { flex-direction: column; gap: 10px; }
}


/* ============================================================
   三十四、Toast消息样式
   ============================================================ */
.toast-message {
    width: auto !important;
    max-width: none !important;
    white-space: nowrap !important;
}

/* ---- UniGUI ShowToast 消息样式 ---- */
/* 深灰色背景,白色字体 - 优化版 */

/* Toast 最外层容器 - 减小padding和margin */
.x-toast,
.x-toast-default,
.x-toast-wrap,
.x-toast-container,
.uni-toast,
.toast-container,
.toast-box,
[data-role="toast"] {
    background: #333333 !important;
    background-color: #333333 !important;
    border-radius: 6px !important;
    border: none !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2) !important;
    padding: 0 !important;
    margin: 0 !important;
    font-size: 14px !important;
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
    z-index: 9999 !important;
    color: #ffffff !important;
    min-width: auto !important;
    width: auto !important;
}

/* Toast 内部所有元素 - 强制深灰背景 */
.x-toast *,
.x-toast-default *,
.x-toast-wrap *,
.x-toast-body,
.x-toast-body-default,
.x-toast-inner,
.x-toast-content,
.x-toast-message,
.x-toast-text,
.toast-body,
.toast-inner,
.toast-content,
.toast-message {
    background: #333333 !important;
    background-color: #333333 !important;
    color: #ffffff !important;
    border: none !important;
}

/* Toast 消息文字 - 白色 - 减小padding */
.x-toast .x-toast-text,
.x-toast-body .x-toast-text,
.x-toast-message .x-toast-text,
.toast-text,
.toast-content,
.toast-message-text {
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: normal !important;
    background: #333333 !important;
    background-color: #333333 !important;
    padding: 10px 16px !important;
    margin: 0 !important;
    line-height: 1.5 !important;
}

/* Toast 标题 - 白色加粗 */
.x-toast .x-toast-title,
.toast-title {
    color: #ffffff !important;
    font-size: 14px !important;
    font-weight: bold !important;
    background: #333333 !important;
    background-color: #333333 !important;
    padding: 8px 16px 4px 16px !important;
    margin: 0 !important;
}

/* Toast 关闭按钮 - 白色 */
.x-toast .x-tool-close,
.toast-close-btn {
    color: #ffffff !important;
    opacity: 0.8 !important;
    background: transparent !important;
}

.x-toast .x-tool-close:hover,
.toast-close-btn:hover {
    opacity: 1 !important;
    color: #ffffff !important;
}

/* 确保Toast内部所有div/span/p元素背景透明或深灰 */
.x-toast div,
.x-toast span,
.x-toast p,
.x-toast-body div,
.x-toast-body span,
.x-toast-body p {
    background: transparent !important;
    background-color: transparent !important;
    color: #ffffff !important;
}

/* Toast 图标样式 - 如果有 */
.x-toast .x-toast-icon,
.toast-icon {
    margin-right: 8px !important;
    padding: 0 !important;
}

/* Toast 进度条 - 如果有 */
.x-toast .x-toast-progress,
.toast-progress {
    background: rgba(255, 255, 255, 0.3) !important;
    height: 2px !important;
    margin: 0 !important;
}


/* ============================================================
   三十五、TUniPopupMenu 右键菜单现代化样式
   ============================================================ */

/* 容器 */
.x-menu,
.x-menu-default,
.x-menu-floating,
.x-menu-list,
.x-menu-body {
    background-color: #ffffff !important;
    background: #ffffff !important;
    border-color: #e8e8e8 !important;
}

/* 所有菜单项 - 左边距0px */
.x-menu-item,
.x-menu-item-default,
.x-menu-item .x-menu-item-link,
.x-menu-item-default .x-menu-item-link {
    background-color: #ffffff !important;
    background: #ffffff !important;
    padding: 0 !important;
}

.x-menu-item-link {
    padding: 8px 16px 8px 0px !important;  /* 左边距0px */
    background-color: #ffffff !important;
    background: #ffffff !important;
    color: #1677ff !important;
}

/* 隐藏图标 */
.x-menu-item-icon,
.x-menu-item .x-menu-item-icon,
.x-menu-item-default .x-menu-item-icon,
.x-menu-item-icon-default {
    display: none !important;
}

/* 文本默认蓝色,无缩进 */
.x-menu-item-text,
.x-menu-item .x-menu-item-text {
    color: #1677ff !important;
    font-size: 13px !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
}

/* 悬停/聚焦 - 蓝底白字 */
.x-menu-item:hover,
.x-menu-item.x-menu-item-active,
.x-menu-item.x-menu-focus {
    background-color: #1677ff !important;
    background: #1677ff !important;
}

.x-menu-item:hover .x-menu-item-link,
.x-menu-item.x-menu-item-active .x-menu-item-link,
.x-menu-item.x-menu-focus .x-menu-item-link {
    background-color: #1677ff !important;
    background: #1677ff !important;
    color: #ffffff !important;
}

.x-menu-item:hover .x-menu-item-text,
.x-menu-item.x-menu-item-active .x-menu-item-text,
.x-menu-item.x-menu-focus .x-menu-item-text {
    color: #ffffff !important;
}

/* 移除默认背景渐变 */
.x-menu-item-active .x-menu-item-link,
.x-menu-item.x-menu-item-active .x-menu-item-link {
    background-image: none !important;
}

/* 箭头样式 */
.x-menu-item-arrow::after {
    color: #1677ff !important;
}

.x-menu-item:hover .x-menu-item-arrow::after {
    color: #ffffff !important;
}


/* ============================================================
   三十七、UniGUI输入框组件现代化样式(极致紧凑版 + 精细边框)
   ============================================================ */

/* ---- 所有输入框容器基础样式 ---- */
.x-form-item,
.x-form-item-default {
    margin-bottom: 8px !important;
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
}

/* 表单项内部表格行 - 垂直居中 */
.x-form-item > table > tbody > tr > td,
.x-form-item-default > table > tbody > tr > td,
.x-form-item .x-form-item-label,
.x-form-item-default .x-form-item-label,
.x-form-item .x-form-item-body,
.x-form-item-default .x-form-item-body {
    vertical-align: middle !important;
}

/* ---- Label标签样式 ---- */
.x-form-item-label,
.x-form-item-label-default,
.x-form-item-label-left,
.x-form-item-label-top {
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
    font-size: 14px !important;
    color: #1f2937 !important;
    font-weight: normal !important;
    line-height: 26px !important;           /* 与输入框高度一致,实现垂直居中 */
    margin-bottom: 0 !important;
    padding-top: 0 !important;              /* 去掉顶部内边距,垂直居中 */
    padding-right: 20px !important;        /* Label右侧留出间距,与输入框分隔 */
    white-space: nowrap !important;         /* 防止Label文字换行被截断 */
    background-color: transparent !important; /* Label默认无背景色 */
}

/* FieldLabel文字与冒号之间的间距 */
.x-form-item-label::after,
.x-form-item-label-default::after {
    content: none !important;               /* 移除可能的双冒号 */
}

/* FieldLabel容器 - 为冒号留出空间 */
.x-form-item-label-ct,
.x-form-item-label-cell {
    padding-right: 5px !important;          /* 文字与冒号的间隔 */
}

/* 顶部对齐的Label */
.x-form-item-label-top {
    display: block !important;
    text-align: left !important;
    padding: 0 0 2px 0 !important;
}

/* 左侧对齐的Label */
.x-form-item-label-left {
    text-align: right !important;
    padding-right: 8px !important;
}

/* ---- 输入框主体容器 ---- */
.x-form-item-body,
.x-form-item-body-default {
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
    width: 100% !important;                 /* 输入框填满剩余宽度,保持一致 */
}

/* ============================================================
   TUniEdit/Number/Combo 输入框美化修复版
   参考 .search-bar input 样式
   ============================================================ */

/* 1. 外层容器：隐藏边框，只保留布局 */
.x-form-trigger-wrap,
.x-form-text-wrap,
.x-form-spinner-wrap,
.x-form-combo-wrap {
    /* 宽度与布局 */
    width: 100% !important;
    display: flex !important;
    box-sizing: border-box !important;
    
    /* 隐藏外边框 */
    border: none !important;
    background-color: transparent !important;
    
    /* 移除阴影和内边距 */
    box-shadow: none !important;
    padding: 0 !important;
}

/* 2. 内层输入框：显示精细边框 */
.x-form-field,
.x-form-text,
input.x-form-field,
.x-form-number-field,
.x-combo-field {
    /* 宽度修复 */
    width: 100% !important;
    flex: 1 !important;

    /* 内框精细边框 */
    border: 1px solid #d9d9d9 !important;
    border-radius: 4px !important;
    outline: none !important;
    box-shadow: none !important;

    /* 修复圆角锯齿感 - 核心优化 */
    -webkit-background-clip: padding-box !important;
    -moz-background-clip: padding-box !important;
    background-clip: padding-box !important;

    /* GPU 硬件加速渲染 - 抗锯齿优化 */
    -webkit-transform: translate3d(0, 0, 0) !important;
    -moz-transform: translate3d(0, 0, 0) !important;
    transform: translate3d(0, 0, 0) !important;

    /* 防止图层干扰 */
    -webkit-backface-visibility: hidden !important;
    -moz-backface-visibility: hidden !important;
    backface-visibility: hidden !important;

    /* 背景 - 排除只读状态 */
    background: #fff !important;
    background-color: #fff !important;

    /* 文字与内边距 */
    padding: 4px 8px !important;
    height: auto !important;
    min-height: 26px !important;
    line-height: 1.4 !important;
    font-size: 14px !important;
    color: #333 !important;
    margin: 0 !important;
}

/* 3. 只读状态 - 显示指定背景色
   Win11主题架构: 白色背景来自 .x-form-trigger-wrap-default 的 background-color: white !important,
   input 本身是 transparent !important。必须同时改 wrapper 和 input 才能让灰色生效。
   用 background 简写覆盖框架的 background-color !important (简写优先级高于子属性)。 */
.x-item-readonly .x-form-trigger-wrap,
.x-form-trigger-wrap.x-item-readonly,
.x-form-readonly .x-form-trigger-wrap,
.x-form-trigger-wrap.x-form-readonly,
.x-form-item-readonly .x-form-trigger-wrap,
.x-form-item-readonly .x-form-text-wrap,
/* 覆盖 Win11 主题的 .x-form-trigger-wrap-default */
.x-item-readonly .x-form-trigger-wrap-default,
.x-form-readonly .x-form-trigger-wrap-default,
.x-form-trigger-wrap-default.x-form-readonly,
.x-form-trigger-wrap-default.x-item-readonly {
    background: #f5f5f5 !important;
    border-color: #d9d9d9 !important;
    cursor: default !important;
}

/* 只读输入框内部背景色 - 覆盖 Win11 主题的 transparent !important */
.x-item-readonly .x-form-field,
.x-form-readonly .x-form-field,
.x-form-field-readonly,
input.x-form-readonly,
textarea.x-form-readonly,
/* 覆盖 Win11 主题的 .x-form-text-default 和 .x-form-trigger-wrap-default input */
.x-item-readonly .x-form-text-default,
.x-form-readonly .x-form-text-default,
.x-item-readonly .x-form-trigger-wrap-default input,
.x-form-readonly .x-form-trigger-wrap-default input {
    background: #f5f5f5 !important;
}

/* 只读ComboBox背景色 - 覆盖.x-combo-field的白色背景 */
.x-item-readonly .x-combo-field,
.x-form-readonly .x-combo-field,
.x-combo-field.x-form-readonly,
.x-combo-field.x-item-readonly,
.x-item-readonly .x-form-combo,
.x-form-readonly .x-form-combo,
.x-form-combo.x-form-readonly,
.x-form-combo.x-item-readonly {
    background: #f5f5f5 !important;
    border-color: #d9d9d9 !important;
}

/* 只读状态下拉框触发按钮背景色 */
.x-item-readonly .x-form-trigger,
.x-form-readonly .x-form-trigger,
.x-form-trigger.x-item-readonly,
.x-form-trigger.x-form-readonly {
    background: #f5f5f5 !important;
    border-color: #d9d9d9 !important;
}

/* 只读状态按下鼠标时保持背景色不变 */
.x-item-readonly .x-form-trigger-wrap:active,
.x-form-trigger-wrap.x-item-readonly:active,
.x-form-readonly .x-form-trigger-wrap:active,
.x-form-item-readonly .x-form-trigger-wrap:active,
.x-item-readonly .x-form-field:active,
.x-form-readonly .x-form-field:active,
input.x-form-readonly:active,
textarea.x-form-readonly:active {
    background: #f5f5f5 !important;
    border-color: #d9d9d9 !important;
}

/* 4. 聚焦状态 */
.x-form-trigger-wrap-focus,
.x-form-trigger-wrap.x-form-focus {
    border-color: #4096ff !important;
    box-shadow: 0 0 0 1px rgba(64, 150, 255, 0.15) !important;
}

/* 5. 悬停状态 */
.x-form-trigger-wrap:hover:not(.x-form-trigger-wrap-focus) {
    border-color: #4096ff !important;
}

/* 文本域高度自适应 */
textarea.x-form-field,
.x-form-textarea {
    height: auto !important;
    min-height: 60px !important;
    resize: vertical !important;
    padding: 6px 8px !important;            /* 文本域内边距稍大,更精致 */
    line-height: 1.4 !important;
}

/* 输入框占位符样式 */
.x-form-field::placeholder,
.x-form-text::placeholder,
input.x-form-field::placeholder,
textarea.x-form-field::placeholder {
    color: #888 !important;              /* 更深的灰色，接近黑色 */
    font-size: 14px !important;          /* 与输入文字同大小 */
    font-weight: normal !important;      /* 正常字重，更清晰 */
    opacity: 1 !important;               /* 确保不透明 */
    filter: none !important;             /* 移除可能的模糊效果 */
}

/* 输入框悬停效果 - 边框微微发光 */
.x-form-field:hover,
.x-form-text:hover,
input.x-form-field:hover,
textarea.x-form-field:hover {
    border-color: #4096ff !important;       /* 更柔和的蓝色 */
    box-shadow: 0 0 0 1px rgba(64, 150, 255, 0.15) !important;  /* 细腻光晕 */
}

/* 输入框聚焦效果 - 与hover同色 */
.x-form-field:focus,
.x-form-text:focus,
.x-form-text-focus,
.x-form-focus,
input.x-form-field:focus,
textarea.x-form-field:focus,
.x-datefield .x-form-field:focus {
    border-color: #4096ff !important;       /* 与hover同色 */
    outline: none !important;
    box-shadow: 0 0 0 1px rgba(64, 150, 255, 0.15) !important;  /* 与hover同光晕 */
    background-color: #fff !important;
}

/* ---- 只读输入框 ---- */
.x-form-readonly,
.x-form-field-readonly,
input.x-form-readonly,
textarea.x-form-readonly {
    background-color: #f5f5f5 !important;   /* 浅灰色背景,只读标识 */
    border-color: #e8e8e8 !important;       /* 更柔和边框 */
    color: #666666 !important;              /* 文字颜色稍淡 */
    cursor: default !important;             /* 默认光标 */
}

/* 只读状态下的FieldLabel - 无背景色 */
.x-form-item.x-form-readonly .x-form-item-label,
.x-form-item-default.x-form-readonly .x-form-item-label,
.x-form-readonly .x-form-item-label,
.x-form-field-readonly .x-form-item-label,
.x-item-readonly .x-form-item-label,
.x-form-item-readonly .x-form-item-label,
.x-form-item-readonly .x-form-item-label-default,
.x-form-item-readonly .x-form-item-label-left,
.x-form-item-readonly .x-form-item-label-top,
.x-form-item .x-form-item-label.x-form-readonly,
.x-form-item-default .x-form-item-label.x-form-readonly,
.x-form-item-readonly .x-form-item-label-ct,
.x-form-item-readonly .x-form-item-label-cell,
.x-item-readonly .x-form-item-label-ct,
.x-item-readonly .x-form-item-label-cell,
.x-form-readonly .x-form-item-label-ct,
.x-form-readonly .x-form-item-label-cell {
    background-color: transparent !important;
    background: transparent !important;
    background-image: none !important;
}


/* ============================================================
   十九、库存明细图片指示器样式
   来源: invdbquery.vue 大板明细列表图片图标
   转换说明: SCSS嵌套展开为平级CSS, $primary-color替换为#1677ff
   ============================================================ */

/* 图片指示器容器 - 在表格单元格内居中显示 */
.image-indicator {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
}

/* 图片图标基础样式 - 蓝色,18px,内边距和圆角 */
.image-indicator .x-btn,
.image-indicator .x-btn-icon-el,
.image-indicator img,
.image-indicator .img-icon {
    padding: 4px !important;
    border-radius: 4px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}

/* 图片图标按下效果 - 蓝色半透明背景,缩小 */
.image-indicator .x-btn:active,
.image-indicator .x-btn-icon-el:active,
.image-indicator img:active,
.image-indicator .img-icon:active {
    background: rgba(22, 119, 255, 0.1) !important;
    transform: scale(0.95) !important;
}

/* 表格单元格内的图片指示器适配 */
.x-grid-cell .image-indicator,
.x-grid-cell-inner .image-indicator {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 34px !important;
    line-height: 34px !important;
}

/* 表格单元格内图片图标尺寸 */
.x-grid-cell .image-indicator .x-btn-icon-el,
.x-grid-cell-inner .image-indicator .x-btn-icon-el,
.x-grid-cell .image-indicator img,
.x-grid-cell-inner .image-indicator img {
    width: 18px !important;
    height: 18px !important;
    font-size: 18px !important;
    color: #1677ff !important;
}

/* 表格行悬停时图片指示器保持正常 */
.x-grid-row-over .image-indicator {
    background: transparent !important;
}

/* 表格行选中时图片指示器保持正常 */
.x-grid-row-selected .image-indicator {
    background: transparent !important;
}

/* 图片列专用样式 - 固定宽度,居中对齐 */
.x-grid-cell.image-col,
.x-grid-cell-inner.image-col {
    width: 50px !important;
    min-width: 50px !important;
    max-width: 50px !important;
    text-align: center !important;
    justify-content: center !important;
}

/* 只读状态下的整个表单项容器 - 无背景色 */
.x-form-item.x-form-readonly,
.x-form-item-default.x-form-readonly,
.x-form-item-readonly,
.x-item-readonly,
.x-form-item.x-form-readonly > table,
.x-form-item-default.x-form-readonly > table,
.x-form-item-readonly > table,
.x-item-readonly > table,
.x-form-item.x-form-readonly > table > tbody > tr,
.x-form-item-default.x-form-readonly > table > tbody > tr,
.x-form-item-readonly > table > tbody > tr,
.x-item-readonly > table > tbody > tr,
.x-form-item.x-form-readonly > table > tbody > tr > td,
.x-form-item-default.x-form-readonly > table > tbody > tr > td,
.x-form-item-readonly > table > tbody > tr > td,
.x-item-readonly > table > tbody > tr > td {
    background-color: transparent !important;
    background: transparent !important;
    background-image: none !important;
}

.x-form-readonly:focus,
.x-form-field-readonly:focus {
    box-shadow: none !important;
    border-color: #e8e8e8 !important;       /* 保持只读边框颜色 */
    background-color: #f5f5f5 !important;   /* 保持只读背景色 */
}

/* ---- 禁用输入框 ---- */
.x-item-disabled .x-form-field,
.x-form-field-disabled,
input:disabled,
textarea:disabled,
.x-item-disabled .x-form-text-default,
.x-item-disabled .x-form-trigger-wrap-default input {
    background: #f8f8f8 !important;
    border-color: #e0e0e0 !important;
    color: #bfbfbf !important;
    cursor: not-allowed !important;
    opacity: 0.8 !important;
}

/* ---- 数字输入框 (TUniNumberEdit) - 精细边框 ---- */
.x-form-number-field,
.x-spinner-field,
.x-form-number-field-default {
    font-family: 'Microsoft YaHei', 'PingFang SC', monospace !important;
    font-size: 13px !important;
    color: #333333 !important;
    background-color: #ffffff !important;
    border: 0.5px solid #d9d9d9 !important;
    border-radius: 4px !important;
    font-size: 14px !important;
    padding: 4px 26px 4px 8px !important;
    height: 30px !important;
    transition: all 0.2s ease-in-out !important;
}

/* 数字输入框聚焦 */
.x-form-number-field:focus,
.x-spinner-field:focus {
    border-color: #4096ff !important;       /* 与hover同色 */
    box-shadow: 0 0 0 1px rgba(64, 150, 255, 0.15) !important;
}

/* 数字输入框增减按钮样式 - 已隐藏 */
.x-form-spinner,
.x-form-spinner-default,
.x-form-spinner-wrap,
.x-spinner-buttons,
.x-form-spinner-up,
.x-form-spinner-down,
.x-spinner-up,
.x-spinner-down {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

/* ---- 下拉框 (TUniComboBox) - 精细边框 ---- */
.x-form-combo,
.x-combo-field,
.x-form-combo-default {
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
    font-size: 13px !important;
    color: #333333 !important;
    background-color: #ffffff !important;
    border: 0.5px solid #d9d9d9 !important;
    border-right: none !important;
    border-radius: 4px 0 0 4px !important;
    font-size: 14px !important;
    padding: 4px 26px 4px 8px !important;
    height: 30px !important;
    transition: all 0.2s ease-in-out !important;
}

/* ComboBox hover/focus - 保持右侧无边框 */
.x-form-combo:hover,
.x-combo-field:hover {
    border-right: none !important;
}
.x-form-combo:focus,
.x-combo-field:focus,
.x-form-combo.x-form-focus,
.x-combo-field.x-form-focus {
    border-right: none !important;
}

/* 下拉箭头 / 日期图标按钮 - 已在第三十二节统一定义,此处删除重复定义 */

/* ---- 日期选择器 (TUniDateTimePicker) ---- */
.x-datefield,
.x-datefield-default {
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
}

.x-datefield .x-form-field {
    padding-right: 28px !important;
    border-right: none !important;
    border-radius: 4px 0 0 4px !important;
}

/* 隐藏日期选择器的第二个下拉箭头按钮(只保留日历图标按钮) */
.x-datefield .x-form-arrow-trigger,
.x-datefield .x-form-trigger-combo,
.x-datefield-default .x-form-arrow-trigger,
.x-datefield-default .x-form-trigger-combo {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    overflow: hidden !important;
}

/* DateField hover/focus - 保持右侧无边框 */
.x-datefield .x-form-field:hover {
    border-right: none !important;
}
.x-datefield .x-form-field:focus,
.x-datefield .x-form-field.x-form-focus {
    border-right: none !important;
}


/* ---- 单选按钮 (TUniRadioButton) - 精细边框 ---- */
.x-form-radio {
    width: 15px !important;
    height: 15px !important;
    border: 1.5px solid #d0d0d0 !important;  /* 更细的边框 */
    border-radius: 50% !important;
    background: #ffffff !important;
    transition: all 0.2s ease !important;
}

.x-form-radio:checked,
.x-form-radio-checked {
    border-color: #1677ff !important;
    background-color: #1677ff !important;
    box-shadow: inset 0 0 0 2.5px #ffffff !important;
}

.x-form-radio:hover {
    border-color: #4096ff !important;
}

/* 单选按钮标签 */
.x-form-radio-label {
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
    font-size: 13px !important;
    color: #666666 !important;
    margin-left: 5px !important;
}

/* ---- 分组框内表单样式 ---- */
.x-fieldset .x-form-item {
    margin-bottom: 6px !important;
}

/* ---- 错误提示样式 - 更精致 ---- */
.x-form-error-wrap,
.x-form-error-msg {
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
    font-size: 11px !important;
    color: #ff6b6b !important;                /* 柔和红色 */
    margin-top: 3px !important;
    padding: 2px 6px !important;
    background: #fff5f5 !important;          /* 更淡的背景 */
    border-radius: 3px !important;
    display: inline-block !important;
    border: 1px solid #ffe0e0 !important;    /* 增加淡红边框 */
}

/* 错误状态的输入框 - 边框更细腻 */
.x-form-invalid,
.x-form-invalid-field {
    border-color: #ff6b6b !important;
}

.x-form-invalid:focus,
.x-form-invalid-field:focus {
    box-shadow: 0 0 0 2px rgba(255, 107, 107, 0.12) !important;
}

/* ---- 输入框组合(如搜索框+按钮)---- */
.x-form-field-container {
    display: flex !important;
    gap: 6px !important;
    align-items: center !important;
}

/* ---- 内联表单样式 ---- */
.form-inline .x-form-item {
    display: inline-flex !important;
    margin-right: 12px !important;
    margin-bottom: 0 !important;
}

.form-inline .x-form-item-label {
    margin-right: 6px !important;
}

/* ---- 响应式调整 ---- */
@media (max-width: 768px) {
    .x-form-item-label,
    .x-form-item-label-default {
        font-size: 12px !important;
        min-width: 55px !important;
    }

    .x-form-field,
    .x-form-text,
    input.x-form-field,
    .x-form-number-field,
    .x-form-combo {
        font-size: 12px !important;
        padding: 2px 6px !important;
        height: 26px !important;
    }
}

/* ---- 搜索框特殊样式 - 更精致 ---- */
.x-form-search {
    padding-left: 28px !important;
    /*background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23999999' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E") !important; */
    background-repeat: no-repeat !important;
    background-position: 9px center !important;
    background-size: 12px !important;
}

/* ---- 验证码输入框 ---- */
.x-form-captcha {
    width: 120px !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    font-family: 'Courier New', monospace !important;
    font-weight: 500 !important;
}

/* ---- search-bar 样式扩展 ---- */
.search-bar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 10px 14px;
    background: #fafafa;
    border-radius: 6px;
    margin-bottom: 14px;
}

.search-bar .x-form-item {
    margin-bottom: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
}

.search-bar .x-form-item-label {
    min-width: 70px !important;
    font-size: 13px !important;
    color: #666666 !important;
    margin-bottom: 0 !important;
    padding-right: 8px !important;
}


/* 下拉框触发器容器 */
.x-form-trigger-wrap {
    display: flex !important;
    align-items: center !important;
    border: 1px solid #d9d9d9 !important;
    border-radius: 4px !important;
    background: #fff !important;
    overflow: hidden !important;
}

/* 只读状态下拉框触发器容器背景色 */
.x-item-readonly .x-form-trigger-wrap,
.x-form-readonly .x-form-trigger-wrap,
.x-form-trigger-wrap.x-item-readonly,
.x-form-trigger-wrap.x-form-readonly {
    background: #f5f5f5 !important;
    border-color: #d9d9d9 !important;
}

.x-form-trigger-wrap-focus {
    border-color: #4096ff !important;
}

/* 下拉框输入区域 */
.x-form-trigger-wrap .x-form-text {
    border: none !important;
    border-radius: 0 !important;
    flex: 1 !important;
}



/* 隐藏默认trigger的原始图片图标(不影响自定义trigger) */
.x-form-trigger-combo img,
.x-form-arrow-trigger img,
.x-form-clear-trigger img,
.x-form-trigger-clear img,
.x-form-trigger-combo .x-icon-el,
.x-form-arrow-trigger .x-icon-el,
.x-form-clear-trigger .x-icon-el,
.x-form-trigger-clear .x-icon-el {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}

/* ========== TUniNumberField 数字输入框样式 ========== */
/* 注意:spinner 按钮已在第三十节隐藏,此处不再显示 */

/* 数字框触发器容器 - 隐藏 */
.x-form-spinner-wrap,
.x-form-spinner-up,
.x-form-spinner-down {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

/* ========== TUniNumberField 数字输入框样式 ========== */
/* 数字框不需要额外样式,使用默认即可 */
/* ============================================================
   TUniComboBox 自定义trigger时隐藏默认下拉按钮

   原理:当trigger-wrap中存在自定义trigger(.x-form-trigger-font-btn)时,
   隐藏默认的下拉箭头按钮(.x-form-trigger-combo / .x-form-arrow-trigger)

   UniGUI中自定义trigger使用Font Awesome图标,类名为 .x-form-trigger-font-btn
   ============================================================ */

/* 当存在自定义trigger按钮时,隐藏默认下拉按钮
   覆盖两种自定义trigger: .x-form-trigger-font-btn(字体图标) 和 .x-form-search-trigger(搜索按钮) */
.x-form-trigger-wrap:has(.x-form-trigger-font-btn) .x-form-trigger-combo,
.x-form-trigger-wrap:has(.x-form-trigger-font-btn) .x-form-arrow-trigger,
.x-form-trigger-wrap:has(.x-form-search-trigger) .x-form-trigger-combo,
.x-form-trigger-wrap:has(.x-form-search-trigger) .x-form-arrow-trigger {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    visibility: hidden !important;
    opacity: 0 !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* 确保自定义trigger按钮正常显示 */
.x-form-trigger-wrap .x-form-trigger-font-btn {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
}


/* ============================================================
   三十八、TEJUniDBNavigator 数据导航组件样式
   组件: uEJUniDBNavigator.pas
   使用: 在Delphi中设置组件 Cls="DBNavigator"

   设计要点:
   1. 图标颜色通过 color:inherit 机制 — 在按钮上设 color,
      图标(.x-btn-icon-el / .fa)用 color:inherit !important 继承。
      这样可顺带利用第四十章已有的 .x-btn .x-btn-icon-el { color:inherit }
      全局规则,避免与 .x-item-disabled .x-btn-icon-el { lavender } 直接冲突。
   2. 紧密排列: 无外边距、小内边距、无边框,让按钮按图标尺寸自然排列。
   3. 禁用态: 不用 opacity 衰减(会让图标变淡看不见),改用灰色 color。
   ============================================================ */

/* ---- 1. 容器 ---- */
.DBNavigator {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    padding: 1px !important;
    margin: 0 !important;
    overflow: visible !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

.DBNavigator .x-toolbar,
.DBNavigator .x-box-inner {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ---- 2. 按钮(关键: color 直接设到按钮上,图标 inherit 继承) ---- 淡红色 */
.DBNavigator .x-btn {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    border-radius: 4px !important;
    color: #e06060 !important;
    padding: 4px !important;
    margin: 0 !important;
    min-width: 24px !important;
    height: 28px !important;
    box-shadow: none !important;
    cursor: pointer !important;
    transition: background-color 0.15s ease !important;
    vertical-align: middle !important;
}

/* 隐藏按钮文字(只显示图标) */
.DBNavigator .x-btn-inner {
    display: none !important;
}

/* ---- 3. 图标:inherit 按钮色 ---- */
.DBNavigator .x-btn .x-btn-icon-el,
.DBNavigator .x-btn .x-icon-el,
.DBNavigator .x-btn .fa,
.DBNavigator .x-btn .fas,
.DBNavigator .x-btn .far {
    color: inherit !important;
    line-height: 1 !important;
    vertical-align: middle !important;
    background: transparent !important;
}

/* ---- 4. 悬停 / 按下 ---- 淡红底 */
.DBNavigator .x-btn:hover,
.DBNavigator .x-btn.x-btn-over {
    background: #fdecec !important;
    background-color: #fdecec !important;
}

.DBNavigator .x-btn.x-btn-pressed,
.DBNavigator .x-btn:active {
    background: #f9c2c2 !important;
    background-color: #f9c2c2 !important;
}

/* ---- 5. 禁用(白色 = 不可见,背景透白时禁用按钮图标自然消失) ---- */
.DBNavigator .x-btn.x-item-disabled,
.DBNavigator .x-btn.x-disabled,
.DBNavigator .x-btn.x-btn-disabled,
.DBNavigator .x-btn[disabled] {
    color: #ffffff !important;
    background: transparent !important;
    background-color: transparent !important;
    border-color: transparent !important;
    opacity: 1 !important;
    filter: none !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
}

/* ---- 6. 焦点 ---- */
.DBNavigator .x-btn:focus {
    outline: none !important;
    box-shadow: none !important;
}

/* ---- 7. 工具提示 ---- */
.DBNavigator .x-tip {
    background: rgba(0, 0, 0, 0.85) !important;
    border-radius: 4px !important;
    padding: 4px 8px !important;
}

.DBNavigator .x-tip .x-tip-body {
    color: #fff !important;
    font-size: 12px !important;
}


/* ============================================================
   三十五、TUniTreeView 树形视图优化
   ============================================================ */

/* ---- 1. 树形视图容器 ---- */
.x-tree-panel,
.x-tree-panel-default {
    border: 1px solid #d9d9d9 !important;
    border-radius: 4px !important;
    background: #fff !important;
}

/* ---- 2. 树形视图主体 ---- */
.x-tree-panel .x-panel-body,
.x-tree-view,
.x-tree-view-default {
    border: none !important;
    background: #fff !important;
}

/* ---- 3. 树形节点行 ---- */
.x-tree-view .x-grid-row,
.x-tree-panel .x-grid-row {
    border: none !important;
    background: transparent !important;
    height: 20px !important;
    line-height: 20px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ---- 4. 树形节点单元格 ---- */
.x-tree-view .x-grid-cell,
.x-tree-panel .x-grid-cell {
    border: none !important;
    background: transparent !important;
    vertical-align: top !important;
    height: 20px !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ---- 5. 树形节点内容 - 关键：图标和文字在同一行 ---- */
.x-tree-view .x-grid-cell-inner,
.x-tree-panel .x-grid-cell-inner {
    display: flex !important;
    align-items: center !important;
    padding: 0 6px !important;
    height: 20px !important;
    line-height: 20px !important;
    margin: 0 !important;
}

/* ---- 6. 树形节点图标 - 垂直居中 ---- */
.x-tree-icon,
.x-tree-node-icon,
.x-tree-view .x-tree-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 16px !important;
    height: 16px !important;
    margin-right: 4px !important;
    vertical-align: middle !important;
    color: #1677ff !important;
    font-size: 14px !important;
}

/* ---- 7. 树形节点文字 - 垂直居中 ---- */
.x-tree-node-text {
    display: inline-block !important;
    vertical-align: middle !important;
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
    font-size: 13px !important;
    color: #333 !important;
    line-height: 20px !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* ---- 8. 展开/折叠图标 ---- */
.x-tree-expander,
.x-tree-expander-collapsed,
.x-tree-expander-expanded {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 16px !important;
    height: 16px !important;
    margin-right: 2px !important;
    vertical-align: middle !important;
    color: #666 !important;
    font-size: 12px !important;
    cursor: pointer !important;
}

/* ---- 9. 复选框 ---- */
.x-tree-checkbox {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 16px !important;
    height: 16px !important;
    margin-right: 4px !important;
    vertical-align: middle !important;
}

/* ---- 10. 连线图片 - 关键：高度与节点行一致，无间隔 ---- */
.x-tree-elbow-img {
    display: inline-block !important;
    width: 16px !important;
    height: 20px !important;
    vertical-align: top !important;
    background-repeat: no-repeat !important;
    background-position: 0 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
}

/* 确保连线图片在单元格内无间隔 */
.x-tree-view .x-grid-cell-inner .x-tree-elbow-img,
.x-tree-panel .x-grid-cell-inner .x-tree-elbow-img {
    padding: 0 !important;
    margin: 0 !important;
}

/* ---- 11. 节点选中状态 ---- */
.x-tree-view .x-grid-row-selected,
.x-tree-panel .x-grid-row-selected,
.x-tree-view .x-grid-row-selected .x-grid-cell,
.x-tree-panel .x-grid-row-selected .x-grid-cell {
    background: #e6f4ff !important;
}

.x-tree-view .x-grid-row-selected .x-tree-node-text,
.x-tree-panel .x-grid-row-selected .x-tree-node-text {
    color: #1677ff !important;
    font-weight: 500 !important;
}

/* ---- 12. 节点悬停状态 ---- */
.x-tree-view .x-grid-row-over,
.x-tree-panel .x-grid-row-over,
.x-tree-view .x-grid-row-over .x-grid-cell,
.x-tree-panel .x-grid-row-over .x-grid-cell {
    background: #f5f5f5 !important;
}

/* ---- 13. 隔行变色 ---- */
.x-tree-view .x-grid-row-alt,
.x-tree-panel .x-grid-row-alt {
    background: #fafafa !important;
}

/* ---- 14. 树形节点文字样式类 ---- */
.tree-node-red {
    color: #ff4d4f !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    padding: 1px 6px !important;
    border-radius: 3px !important;
    background: rgba(255, 77, 79, 0.06) !important;
    text-shadow: 0 1px 2px rgba(255, 77, 79, 0.1) !important;
}

/* ============================================================
   三十九、仿手机APP开关样式 — 全局应用于所有 TUniCheckBox / TUniDBCheckBox
   ============================================================
   通过 ExtJS 原生的 .x-form-cb-wrap 类(所有复选框字段外层都有)
   作为选择器,**无需在 DFM 或代码里做任何配置**,所有 TUniCheckBox /
   TUniDBCheckBox 都会自动变成开关样式。

   ExtJS 7.8 实际 DOM 结构(div-based):
     <div class="x-field x-field-checkbox [x-form-cb-checked]">
       <div class="x-form-item-body x-form-cb-wrap">         <!-- fieldBodyCls -->
         <div class="x-form-cb-wrap-inner">                  <!-- wrapInnerCls -->
           <span class="x-form-cb x-form-cb-default">         <!-- displayEl -->
             <input type="checkbox" class="x-form-checkbox" />
           </span>
           <label class="x-form-cb-label x-form-cb-label-after">Caption</label>
         </div>
       </div>
     </div>

   DOM 顺序是 [span][label],用 flex 的 row-reverse 在视觉上反转为
   [label][span],所以 caption 在左、滑块在右,无需改 ExtJS 配置。

   如需对个别复选框恢复成传统方框样式,在控件的 ClientEvents.UniEvents
   beforeInit 里加:config.cls='no-cb-toggle'; 并在下方加 .no-cb-toggle
   的覆盖规则(本文件未默认提供,按需添加)。

   布局: [Caption:] [开关滑块]  标题(带冒号)在左,开关在右
   ============================================================ */

/* 1. bodyEl 容器(.x-form-cb-wrap): inline-block + 垂直居中
      .x-form-cb-wrap 由 ExtJS 加到 bodyEl(fieldBodyCls),DOM 中必定存在 */
.x-form-cb-wrap {
    display: inline-block !important;
    vertical-align: middle !important;
    line-height: 22px !important;
    height: 22px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    width: auto !important;
    float: none !important;
}

/* 2. 内层 wrap-inner: flex + row-reverse,把 label 视觉上反转到 span 的左边
      DOM 实际顺序: <span class="x-form-cb">...</span><label>...</label>
      row-reverse 后视觉: [label] [span]
      并通过 gap 拉开间距 */
.x-form-cb-wrap .x-form-cb-wrap-inner {
    display: flex !important;
    flex-direction: row-reverse !important;
    justify-content: flex-end !important;
    align-items: center !important;
    column-gap: 10px !important;
    line-height: 22px !important;
    padding: 0 !important;
    margin: 0 !important;
    width: auto !important;
}

/* 3. Caption 标签(左侧) */
.x-form-cb-wrap label.x-form-cb-label,
.x-form-cb-wrap .x-form-cb-label {
    color: #444 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    padding: 0 !important;
    line-height: 22px !important;
    height: 22px !important;
    white-space: nowrap !important;
    cursor: pointer !important;
    background: transparent !important;
    margin: 0 !important;
    border: none !important;
    width: auto !important;
    flex: 0 0 auto !important;
}

/* 3.1 标题后自动加冒号,与 TUniDBEdit 的 FieldLabel 风格一致 */
.x-form-cb-wrap label.x-form-cb-label::after,
.x-form-cb-wrap .x-form-cb-label::after {
    content: ':' !important;
    color: #444 !important;
    font-weight: 500 !important;
    margin-left: 2px !important;
}

/* 4. 滑块容器(<span class="x-form-cb>): 作为轨道 */
.x-form-cb-wrap span.x-form-cb,
.x-form-cb-wrap span.x-form-cb-default,
.x-form-cb-wrap .x-form-cb-wrap-inner > span {
    display: inline-block !important;
    vertical-align: middle !important;
    position: relative !important;
    width: 48px !important;
    height: 26px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    min-height: 26px !important;
    max-height: 26px !important;
    background-color: #e4e4e4 !important;
    background: #e4e4e4 !important;
    background-image: none !important;
    border-radius: 26px !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    cursor: pointer !important;
    transition: background-color .2s ease-in-out !important;
    overflow: visible !important;
    line-height: 26px !important;
    flex: 0 0 48px !important;
    box-sizing: border-box !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
}

/* 5. 滑块旋钮(<span>::after),20px 白色圆形 */
.x-form-cb-wrap span.x-form-cb::after,
.x-form-cb-wrap span.x-form-cb-default::after,
.x-form-cb-wrap .x-form-cb-wrap-inner > span::after,
.x-form-cb-wrap .x-form-cb-wrap span.x-form-cb::after {
    content: '' !important;
    position: absolute !important;
    top: 3px !important;
    left: 3px !important;
    width: 20px !important;
    height: 20px !important;
    background-color: #ffffff !important;
    background: #ffffff !important;
    background-image: none !important;
    border-radius: 50% !important;
    border: none !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
    transition: transform .2s ease-in-out !important;
    pointer-events: none !important;
    box-sizing: border-box !important;
}

/* 6. 隐藏原生 input 但保留点击 — 必须覆盖三十三章的 13px 尺寸约束,
      让 input 完整覆盖 48x26 的 span,点击滑块任意位置都能切换 */
.x-form-cb-wrap input[type="checkbox"].x-form-checkbox,
.x-form-cb-wrap input.x-form-checkbox,
.x-form-cb-wrap input[type="checkbox"].x-form-field,
.x-form-cb-wrap .x-form-cb-wrap-inner input[type="checkbox"] {
    opacity: 0 !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 48px !important;
    height: 26px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    min-height: 26px !important;
    max-height: 26px !important;
    margin: 0 !important;
    padding: 0 !important;
    cursor: pointer !important;
    z-index: 10 !important;
    pointer-events: auto !important;
}

/* 7. 勾选状态: 轨道变主题蓝、旋钮右移 22px(48-20-3-3)
      说明:x-form-cb-checked 由 ExtJS 加到外层 div(不是 bodyEl),
      所以要用 ".x-form-cb-checked .x-form-cb-wrap ..." 作为后代选择器 */
.x-form-cb-checked .x-form-cb-wrap span.x-form-cb,
.x-form-cb-checked .x-form-cb-wrap span.x-form-cb-default,
.x-form-cb-checked .x-form-cb-wrap .x-form-cb-wrap-inner > span,
.x-form-cb-checked span.x-form-cb,
.x-form-cb-checked span.x-form-cb-default {
    background-color: #1677ff !important;
    background: #1677ff !important;
}
.x-form-cb-checked .x-form-cb-wrap span.x-form-cb::after,
.x-form-cb-checked .x-form-cb-wrap span.x-form-cb-default::after,
.x-form-cb-checked .x-form-cb-wrap .x-form-cb-wrap-inner > span::after,
.x-form-cb-checked span.x-form-cb::after,
.x-form-cb-checked span.x-form-cb-default::after {
    transform: translateX(22px) !important;
}

/* 8. 悬停反馈
      未勾选悬停 → 深灰;勾选悬停 → 深蓝
      选择器 specificity:
        默认态(规则4):(0,2,1)
        未勾选悬停:(0,3,1) ← :hover 加一层
        勾选悬停:  (0,4,1) ← 再加 .x-form-cb-checked
      高 specificity 优先,确保勾选态优先于悬停态 */
.x-form-cb-wrap span.x-form-cb:hover,
.x-form-cb-wrap .x-form-cb-wrap-inner > span:hover {
    background-color: #bdbdbd !important;
}
.x-form-cb-checked .x-form-cb-wrap span.x-form-cb:hover,
.x-form-cb-checked .x-form-cb-wrap .x-form-cb-wrap-inner > span:hover {
    background-color: #0958d9 !important;
}

/* 9. 只读/禁用状态(x-item-disabled 由 ExtJS 加到外层) */
.x-item-disabled .x-form-cb-wrap span.x-form-cb,
.x-item-disabled span.x-form-cb,
.x-item-disabled .x-form-cb-wrap-inner > span {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}
.x-item-disabled {
    cursor: not-allowed !important;
}
.x-form-cb-wrap.x-item-disabled {
    cursor: not-allowed !important;
}

/* ============================================================
   四十、统一按钮设计系统(蓝色主题,依据 login.html 色调)
   ============================================================
   设计原则:
     - 主色调 #1677ff(样例.png 主红)应用于所有按钮
     - 按钮配色采用"蓝色系"策略,保证视觉一体感
     - 默认按钮:主红实心 #1677ff,文字白,清晰可点
     - 主操作按钮:系统主红 #1677ff 实心,与 ActivePage 同色
     - 语义按钮:用红色系列饱和度档位
       Success/Danger/Warning 都用 -7 档(深一档),不抢眼

   配色板(红色系,依据样例.png):
     Default   主红   #1677ff / hover #0958d9 / active #003eb3 / 字白
     Primary   主红   #1677ff / hover #0958d9 / active #003eb3 / 字白
     Success   森林绿 #389e0d / hover #237804 / 字白
     Danger    深红   #cf1322 / hover #a8071a / 字白
     Warning   琥珀   #d48806 / hover #ad6800 / 字白
     Info      主红描边 bg #fff / border #1677ff / text #0958d9
     Text      透明   bg transparent / text #0958d9

   布局规范:
     border-radius: 4px
     padding: 7px 16px(工具栏 5px 12px)
     font: 13px "Microsoft YaHei",sans-serif + weight 500
     min-width: 72px
   ============================================================ */

/* ---- 0. 基础重置 ---- */
.x-btn {
    color: #ffffff !important;
}

/* ---- 1. 默认按钮(白底灰边,Ant 风格质感,参考 D:\gy myself.css) ---- */
/* 排除所有"实心填充"按钮类(其自带彩色背景+白字),避免被本规则改成白底白字而标题不可见 */
.x-btn:not(.btnApproval):not(.btn-reset):not(.btn-query):not(.btn-primary):not(.btn-return):not(:hover):not(.x-btn-over):not(.x-btn-pressed):not(.x-btn-focus):not(:active):not(.x-datepicker *):not(.x-monthpicker *),
.x-btn-default-small:not(.btnApproval):not(.btn-reset):not(.btn-query):not(.btn-primary):not(.btn-return):not(:hover):not(.x-btn-over):not(.x-btn-pressed):not(.x-btn-focus):not(:active):not(.x-datepicker *):not(.x-monthpicker *),
.x-btn-default-medium:not(.btnApproval):not(.btn-reset):not(.btn-query):not(.btn-primary):not(.btn-return):not(:hover):not(.x-btn-over):not(.x-btn-pressed):not(.x-btn-focus):not(:active):not(.x-datepicker *):not(.x-monthpicker *),
.x-btn-default-large:not(.btnApproval):not(.btn-reset):not(.btn-query):not(.btn-primary):not(.btn-return):not(:hover):not(.x-btn-over):not(.x-btn-pressed):not(.x-btn-focus):not(:active):not(.x-datepicker *):not(.x-monthpicker *),
.x-btn-default-toolbar-small:not(.btnApproval):not(.btn-reset):not(.btn-query):not(.btn-primary):not(.btn-return):not(:hover):not(.x-btn-over):not(.x-btn-pressed):not(.x-btn-focus):not(:active):not(.x-datepicker *):not(.x-monthpicker *),
.x-btn-default-toolbar-medium:not(.btnApproval):not(.btn-reset):not(.btn-query):not(.btn-primary):not(.btn-return):not(:hover):not(.x-btn-over):not(.x-btn-pressed):not(.x-btn-focus):not(:active):not(.x-datepicker *):not(.x-monthpicker *),
.x-btn-default-toolbar-large:not(.btnApproval):not(.btn-reset):not(.btn-query):not(.btn-primary):not(.btn-return):not(:hover):not(.x-btn-over):not(.x-btn-pressed):not(.x-btn-focus):not(:active):not(.x-datepicker *):not(.x-monthpicker *),
.x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return):not(.btn-query):not(.btn-add):not(.btn-adjust):not(.btn-close):not(.btn-edit):not(.btn-del):not(.btn-save):not(.btn-confirm):not(.btn-audit):not(.btn-red):not(.btn-sendsms):not(.btn-split):not(:hover):not(.x-btn-over):not(.x-btn-pressed):not(.x-btn-focus):not(:active):not(.x-datepicker *):not(.x-monthpicker *) {
    background: #ffffff !important;
    background-color: #ffffff !important;
    background-image: none !important;
    border: 1px solid #d9d9d9 !important;
    border-radius: 4px !important;
    color: #1f2733 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    padding: 7px 16px !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03) !important;
    transition: all .15s ease-in-out !important;
}

/* 默认按钮文字颜色 */
.x-btn .x-btn-inner,
.x-btn-default-small .x-btn-inner,
.x-btn-default-medium .x-btn-inner,
.x-btn-default-toolbar-small .x-btn-inner,
.x-btn-default-toolbar-medium .x-btn-inner {
    color: #1f2733 !important;
    font-weight: 500 !important;
}

/* 默认按钮 hover(淡红底+红字,全局统一交互态) */
.x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return):not(.btn-query):not(.btn-add):not(.btn-adjust):not(.btn-close):not(.btn-edit):not(.btn-del):not(.btn-save):not(.btn-confirm):not(.btn-audit):not(.btn-red):not(.btn-sendsms):not(.btn-split):not(.x-datepicker *):not(.x-monthpicker *):hover,
.x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return):not(.btn-query):not(.btn-add):not(.btn-adjust):not(.btn-close):not(.btn-edit):not(.btn-del):not(.btn-save):not(.btn-confirm):not(.btn-audit):not(.btn-red):not(.btn-sendsms):not(.btn-split):not(.x-datepicker *):not(.x-monthpicker *).x-btn-over {
    background: #fff1f0 !important;
    background-color: #fff1f0 !important;
    background-image: none !important;
    border-color: #ffa39e !important;
    color: #cf1322 !important;
}
.x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return):not(.btn-query):not(.x-datepicker *):not(.x-monthpicker *):hover .x-btn-inner {
    color: #cf1322 !important;
}

/* 默认按钮 pressed(淡红底+红字,全局统一交互态) */
.x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnApproval):not(.btn-query):not(.btn-add):not(.btn-adjust):not(.btn-close):not(.btn-edit):not(.btn-del):not(.btn-save):not(.btn-confirm):not(.btn-audit):not(.btn-red):not(.btn-sendsms):not(.btn-split):not(.x-datepicker *):not(.x-monthpicker *).x-btn-pressed,
.x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnApproval):not(.btn-query):not(.btn-add):not(.btn-adjust):not(.btn-close):not(.btn-edit):not(.btn-del):not(.btn-save):not(.btn-confirm):not(.btn-audit):not(.btn-red):not(.btn-sendsms):not(.btn-split):not(.x-datepicker *):not(.x-monthpicker *):active {
    background: #fff1f0 !important;
    background-color: #fff1f0 !important;
    background-image: none !important;
    border-color: #ffa39e !important;
    color: #cf1322 !important;
}

/* ---- 2. 主操作按钮 .btn-primary(系统主蓝,与 ActivePage 同色) ---- */
.btn-primary,
.btn-primary.x-btn,
.btn-primary.x-btn-default-small,
.btn-primary.x-btn-default-medium,
.btn-primary.x-btn-default-toolbar-small,
.btn-primary.x-btn-default-toolbar-medium {
    background: #1677ff !important;
    background-color: #1677ff !important;
    background-image: none !important;
    border: 1px solid #1677ff !important;
    color: #ffffff !important;
    box-shadow: 0 1px 2px rgba(22, 119, 255, 0.25) !important;
}
.btn-primary .x-btn-inner,
.btn-primary:active .x-btn-inner {
    color: #ffffff !important;
}

/* btn-primary hover/active 已由文件末尾全局 A/B 段统一覆盖(淡红底+红字) */

/* ---- 3. 成功按钮 .btn-success(Ant Design green-7) ---- */
.btn-success,
.btn-success.x-btn,
.btn-success.x-btn-default-small,
.btn-success.x-btn-default-medium,
.btn-success.x-btn-default-toolbar-small,
.btn-success.x-btn-default-toolbar-medium {
    background: #389e0d !important;
    background-color: #389e0d !important;
    background-image: none !important;
    border: 1px solid #389e0d !important;
    color: #ffffff !important;
    box-shadow: 0 1px 2px rgba(56, 158, 13, 0.18) !important;
}
.btn-success .x-btn-inner,
.btn-success:active .x-btn-inner {
    color: #ffffff !important;
}

/* btn-success hover/active 已由文件末尾全局 A/B 段统一覆盖(淡红底+红字) */

/* ---- 4. 危险按钮 .btn-danger(Ant Design red-7) ---- */
.btn-danger,
.btn-danger.x-btn,
.btn-danger.x-btn-default-small,
.btn-danger.x-btn-default-medium,
.btn-danger.x-btn-default-toolbar-small,
.btn-danger.x-btn-default-toolbar-medium {
    background: #cf1322 !important;
    background-color: #cf1322 !important;
    background-image: none !important;
    border: 1px solid #cf1322 !important;
    color: #ffffff !important;
    box-shadow: 0 1px 2px rgba(207, 19, 34, 0.18) !important;
}
.btn-danger .x-btn-inner,
.btn-danger:active .x-btn-inner {
    color: #ffffff !important;
}

/* btn-danger hover/active 已由文件末尾全局 A/B 段统一覆盖(淡红底+红字) */

/* ---- 5. 警告按钮 .btn-warning(Ant Design gold-7) ---- */
.btn-warning,
.btn-warning.x-btn,
.btn-warning.x-btn-default-small,
.btn-warning.x-btn-default-medium,
.btn-warning.x-btn-default-toolbar-small,
.btn-warning.x-btn-default-toolbar-medium {
    background: #d48806 !important;
    background-color: #d48806 !important;
    background-image: none !important;
    border: 1px solid #d48806 !important;
    color: #ffffff !important;
    box-shadow: 0 1px 2px rgba(212, 136, 6, 0.18) !important;
}
.btn-warning .x-btn-inner,
.btn-warning:active .x-btn-inner {
    color: #ffffff !important;
}

/* btn-warning hover/active 已由文件末尾全局 A/B 段统一覆盖(淡红底+红字) */

/* ---- 6. 信息按钮 .btn-info(主蓝描边,与主色调呼应) ---- */
.btn-info,
.btn-info.x-btn,
.btn-info.x-btn-default-small,
.btn-info.x-btn-default-medium,
.btn-info.x-btn-default-toolbar-small,
.btn-info.x-btn-default-toolbar-medium {
    background: #ffffff !important;
    background-color: #ffffff !important;
    background-image: none !important;
    border: 1px solid #1677ff !important;
    color: #0958d9 !important;
    box-shadow: none !important;
}
.btn-info .x-btn-inner,
.btn-info:active .x-btn-inner {
    color: #0958d9 !important;
}

/* btn-info hover/active 已由文件末尾全局 A/B 段统一覆盖(淡红底+红字) */

/* ---- 7. 文字按钮 .btn-text(无边框) ---- */
.btn-text,
.btn-text.x-btn,
.btn-text.x-btn-default-small,
.btn-text.x-btn-default-medium,
.btn-text.x-btn-default-toolbar-small,
.btn-text.x-btn-default-toolbar-medium {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 1px solid transparent !important;
    color: #0958d9 !important;
    box-shadow: none !important;
}
.btn-text .x-btn-inner,
.btn-text:active .x-btn-inner {
    color: #0958d9 !important;
}

/* btn-text hover/active 已由文件末尾全局 A/B 段统一覆盖(淡红底+红字) */

/* ---- 8. 禁用状态 ---- */
.x-btn.x-item-disabled,
.x-btn .x-item-disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
    filter: grayscale(0.3) !important;
}

/* ---- 9. 工具栏中的按钮(保持紧凑) ---- */
.x-toolbar .x-btn {
    padding: 5px 12px !important;
    font-size: 13px !important;
    min-width: 60px !important;
}

/* ---- 10. 图标颜色随按钮 ---- */
.x-btn .x-btn-icon-el {
    color: inherit !important;
    line-height: 1 !important;
}
.x-btn.btn-primary .x-btn-icon-el,
.x-btn.btn-success .x-btn-icon-el,
.x-btn.btn-danger .x-btn-icon-el,
.x-btn.btn-warning .x-btn-icon-el {
    color: #ffffff !important;
}
.x-btn.btn-info .x-btn-icon-el {
    color: #0958d9 !important;
}
.x-btn.btn-text .x-btn-icon-el {
    color: #0958d9 !important;
}

/* ============================================================
   四十一、只读状态下隐藏下拉/搜索触发按钮
   ============================================================
   场景:
     A) TUniDBComboBox 可编辑: 无 readonly, 无 .x-form-readonly
        → 白色背景 + 显示下拉按钮 (基础样式已覆盖,无需额外处理)
     B) TUniDBComboBox 只读: .x-form-readonly / .x-item-readonly
        → 灰色背景 + 隐藏下拉按钮
     C) TUniDBComboBox + 自定义Trigger(搜索按钮) + ReadOnly=True:
        input 有 readonly, 外层无 .x-form-readonly,
        trigger-wrap 内有 .x-form-search-trigger
        → 灰色背景 + 隐藏搜索按钮
     D) TUniDBLookupComboBox 可编辑: input 有 readonly(setEditable(false)),
        外层无 .x-form-readonly, 无 .x-form-search-trigger
        → 白色背景 + 显示下拉按钮
     E) TUniDBLookupComboBox 只读: .x-form-readonly / .x-item-readonly
        → 灰色背景 + 隐藏下拉按钮

   检测策略:
     - 场景 B/E: .x-form-readonly / .x-item-readonly (类检测)
     - 场景 C: :has(.x-form-search-trigger):has(input[readonly])
       (搜索trigger + readonly属性,精准命中ComboBox+搜索只读)
     - 场景 D: 不命中上述任何只读规则,基础样式自然生效
   ============================================================ */

/* 1. 只读时隐藏触发按钮 */
.x-form-readonly .x-form-trigger,
.x-item-readonly .x-form-trigger,
.x-form-trigger.x-form-readonly,
.x-form-trigger.x-item-readonly,
.x-form-readonly .x-form-search-trigger,
.x-item-readonly .x-form-search-trigger,
.x-form-readonly .x-form-trigger-default,
.x-item-readonly .x-form-trigger-default,
.x-form-readonly .x-form-arrow-trigger,
.x-item-readonly .x-form-arrow-trigger,
.x-form-readonly .x-form-clear-trigger,
.x-item-readonly .x-form-clear-trigger,
.x-form-readonly .x-form-trigger-combo,
.x-item-readonly .x-form-trigger-combo,
/* ComboBox+搜索Trigger 只读: 有搜索trigger + input readonly, 无 .x-form-readonly */
.x-form-trigger-wrap:has(.x-form-search-trigger):has(input[readonly]) .x-form-trigger,
.x-form-trigger-wrap:has(.x-form-search-trigger):has(input[readonly]) .x-form-search-trigger,
.x-form-trigger-wrap:has(.x-form-search-trigger):has(input[readonly]) .x-form-arrow-trigger,
.x-form-trigger-wrap:has(.x-form-search-trigger):has(input[readonly]) .x-form-trigger-default,
.x-form-trigger-wrap:has(.x-form-search-trigger):has(input[readonly]) .x-form-trigger-combo,
.x-form-trigger-wrap:has(.x-form-search-trigger):has(input[readonly]) .x-form-clear-trigger {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    visibility: hidden !important;
    border: none !important;
    background: none !important;
}

/* 2. 只读时输入框占满整个 trigger-wrap 宽度 */
.x-form-readonly.x-form-trigger-wrap .x-form-text-default,
.x-item-readonly.x-form-trigger-wrap .x-form-text-default,
.x-form-readonly .x-form-text-default,
.x-item-readonly .x-form-text-default,
.x-form-readonly .x-form-field,
.x-item-readonly .x-form-field,
.x-form-trigger-wrap:has(.x-form-search-trigger):has(input[readonly]) .x-form-field,
.x-form-trigger-wrap:has(.x-form-search-trigger):has(input[readonly]) .x-form-text-default {
    padding-right: 8px !important;
}

/* 3. 只读时 trigger-wrap / input 整体浅灰底 + 边框
   用 background 简写覆盖 Win11 主题的 background-color: white !important */
.x-form-readonly.x-form-trigger-wrap,
.x-item-readonly.x-form-trigger-wrap,
.x-form-readonly .x-form-trigger-wrap,
.x-item-readonly .x-form-trigger-wrap,
.x-form-readonly .x-form-trigger-wrap-default,
.x-item-readonly .x-form-trigger-wrap-default,
.x-form-readonly .x-form-field,
.x-item-readonly .x-form-field,
.x-form-readonly .x-form-text-default,
.x-item-readonly .x-form-text-default,
.x-form-readonly .x-form-trigger-wrap-default input,
.x-item-readonly .x-form-trigger-wrap-default input,
/* ComboBox+搜索Trigger 只读 — 灰色背景 */
.x-form-trigger-wrap:has(.x-form-search-trigger):has(input[readonly]),
.x-form-trigger-wrap:has(.x-form-search-trigger):has(input[readonly]) .x-form-field,
.x-form-trigger-wrap:has(.x-form-search-trigger):has(input[readonly]) .x-combo-field {
    background: #f5f5f5 !important;
    border-color: #d9d9d9 !important;
}

/* 4. TUniDBLookupComboBox 可编辑状态:白色背景
   Lookup 组件内部用 setEditable(false),input 带 readonly 属性,
   但无 .x-form-readonly 且无 .x-form-search-trigger → 属于"可编辑"状态
   下拉按钮由基础 trigger 样式自然显示,无需额外强制
   注意:必须用 .x-combo-field / .x-form-combo 等 ComboBox 专有类,
   不能用 .x-form-field(该类 TUniDBEdit 也有,会误伤只读的 TUniDBEdit
   导致其灰色背景被白色覆盖) */
.x-form-trigger-wrap:not(.x-form-readonly):not(.x-item-readonly):not(:has(.x-form-search-trigger)) input[readonly].x-combo-field,
.x-form-trigger-wrap:not(.x-form-readonly):not(.x-item-readonly):not(:has(.x-form-search-trigger)) input[readonly].x-form-combo {
    background: #ffffff !important;
    background-color: #ffffff !important;
}

/* ============================================================
   四十二、TEJUniDBNavigator 高特异性覆盖(压过第四十章全局按钮)
   ============================================================
   背景:第四十章全局按钮系统用 10 个 :not() 链 + !important,
   特异性高达 (0,11,0),会盖过三十八章的 .DBNavigator .x-btn (0,2,0),
   把导航按钮刷成蓝灰实心,且 .x-btn { color:#fff } 会让图标变白看不见。

   策略:本节用相同 :not() 链 + .DBNavigator 父级达到 (0,12,0),
   关键是直接在按钮上设 color,图标通过 inherit 继承(利用第四十章
   自带的 .x-btn .x-btn-icon-el { color:inherit } 规则),不再与
   .x-item-disabled .x-btn-icon-el { lavender } 在图标层直接冲突。
   ============================================================ */

/* 1. 按钮基样式:透明底 + 蓝色 color(图标 inherit 此色) */
.DBNavigator .x-btn,
.DBNavigator .x-btn.x-btn-default-small,
.DBNavigator .x-btn.x-btn-default-medium,
.DBNavigator .x-btn.x-btn-default-toolbar-small,
.DBNavigator .x-btn.x-btn-default-toolbar-medium,
.DBNavigator .x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return) {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    border-radius: 4px !important;
    color: #1677ff !important;
    padding: 4px !important;
    margin: 0 !important;
    min-width: 24px !important;
    height: 28px !important;
    box-shadow: none !important;
    cursor: pointer !important;
    vertical-align: middle !important;
    transition: background-color 0.15s ease !important;
}

/* 2. hover */
.DBNavigator .x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return):hover,
.DBNavigator .x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return).x-btn-over {
    background: rgba(22, 119, 255, 0.10) !important;
    background-color: rgba(22, 119, 255, 0.10) !important;
}

/* 3. pressed */
.DBNavigator .x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return).x-btn-pressed,
.DBNavigator .x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return):active {
    background: rgba(22, 119, 255, 0.18) !important;
    background-color: rgba(22, 119, 255, 0.18) !important;
}

/* 4. 禁用按钮直接隐藏,不保留占位(避免导航栏出现空白间隙) */
.DBNavigator .x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return).x-item-disabled,
.DBNavigator .x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return).x-disabled,
.DBNavigator .x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return).x-btn-disabled,
.DBNavigator .x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return)[disabled] {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

/* 5. 父级容器被禁用时,内部按钮也按禁用处理 */
.DBNavigator .x-item-disabled .x-btn,
.DBNavigator .x-disabled .x-btn {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

/* 6. 隐藏按钮文字 */
.DBNavigator .x-btn-inner {
    display: none !important;
}

/* 7. 图标 inherit 按钮色 */
.DBNavigator .x-btn .x-btn-icon-el,
.DBNavigator .x-btn .x-icon-el,
.DBNavigator .x-btn .fa,
.DBNavigator .x-btn .fas,
.DBNavigator .x-btn .far {
    color: inherit !important;
    line-height: 1 !important;
    vertical-align: middle !important;
    background: transparent !important;
}

/* 8. 焦点(去掉蓝色阴影框,避免与图标冲突) */
.DBNavigator .x-btn:focus,
.DBNavigator .x-btn.x-btn-focus {
    outline: none !important;
    box-shadow: none !important;
}

/* 9. 图标垂直居中修复 v2(2026-07-25)
   实测结构(uEJUniDBNavigator.pas):组件是 TUniCustomContainerPanel,
   默认 Height=25;按钮是 30x30 的 TUniHCustomBitBtn,
   横向时 Align=alLeft、纵向时 alTop/alBottom,由 uniGUI 绝对定位。
   按钮(30px)高于组件(25px),纵向定位偏移导致顶部溢出。
   方案:根容器 + body 层全部 flex 垂直居中(flex-wrap 兼容纵向窄容器,
   自动换行为单列);按钮脱离绝对定位,固定 24px 见方,恒小于组件高度;
   禁用按钮 display:none 后,剩余按钮由 flex 自动收拢,不留空位。 */
.DBNavigator {
    display: flex !important;
    align-items: center !important;
    align-content: center !important;
    flex-wrap: wrap !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}
.DBNavigator > div,
.DBNavigator .x-panel-body,
.DBNavigator .x-container-body,
.DBNavigator .x-autocontainer-inner,
.DBNavigator .x-body-el,
.DBNavigator .x-toolbar,
.DBNavigator .x-toolbar-body-el,
.DBNavigator .x-box-inner,
.DBNavigator .x-box-target {
    display: flex !important;
    align-items: center !important;
    align-content: center !important;
    flex-wrap: wrap !important;
    height: 100% !important;
    padding: 0 !important;
    box-sizing: border-box !important;
}
.DBNavigator .x-btn,
.DBNavigator .x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return) {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    box-sizing: border-box !important;
    width: 24px !important;
    min-width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    max-height: 28px !important;
    padding: 0 !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    vertical-align: middle !important;
    line-height: 1 !important;
    flex: 0 0 auto !important;
}
.DBNavigator .x-btn .x-btn-wrap,
.DBNavigator .x-btn .x-btn-button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 100% !important;
    line-height: 1 !important;
}
.DBNavigator .x-btn .x-btn-icon-el,
.DBNavigator .x-btn .x-icon-el,
.DBNavigator .x-btn .fa,
.DBNavigator .x-btn .fas,
.DBNavigator .x-btn .far {
    position: static !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
    vertical-align: middle !important;
}

/* ============================================================
   MessageDlg 弹窗专用样式 (文件末尾,确保覆盖全局样式)
   ============================================================ */
/* ============================================================
   MessageDlg 弹窗专用样式 (msg.css)
   来源: zhengqi.css 提取 + 备份验证
   创建日期: 2026-07-01
   说明: UniGUI MessageDlg 弹窗完整样式
         - 独立使用,不依赖 zhengqi.css
         - 弹窗基础样式(窗口/标题栏/body/关闭按钮)
         - 按钮适中大小,蓝色边框+蓝色字
         - 禁用动画/过渡,消除显示时的晃动
         - 图标和文字在弹窗中上部
         - 底部按钮面板加高,按钮间距加大
   ============================================================ */


/* ============================================================
   一、弹窗容器基础样式
   ============================================================ */

/* 弹窗窗口 - 圆角+白色背景+无阴影+禁用动画 */
.x-message-box,
.x-window.x-message-box {
    border: none !important;
    border-radius: 4px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
    background: #fff !important;
    overflow: hidden !important;
    padding: 0 !important;
    animation: none !important;
    transition: none !important;
}

/* 标题栏铺满 - 清除 docked 层间距 */
.x-message-box .x-docked-top {
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    width: 100% !important;
}

.x-message-box .x-docked-top .x-window-header-ct {
    padding: 0 !important;
    margin: 0 !important;
}


/* ============================================================
   二、标题栏样式 - 蓝色背景
   ============================================================ */

.x-message-box .x-window-header,
.x-message-box .x-window-header-default,
.x-message-box .x-docked-top .x-window-header {
    display: block !important;
    position: static !important;
    padding: 0 8px !important;
    margin: 0 !important;
    width: 100% !important;
    min-height: 28px !important;
    height: auto !important;
    background: #4096ff !important;
    background-color: #4096ff !important;
    background-image: none !important;
    border: none !important;
    border-bottom: none !important;
    border-radius: 4px 4px 0 0 !important;
    box-shadow: none !important;
}

/* 标题栏内部嵌套容器 - 铺满 */
.x-message-box .x-window-header .x-window-header-body,
.x-message-box .x-window-header .x-window-header-inner {
    min-height: 28px !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    background: transparent !important;
}

/* 标题文字 - 白色 */
.x-message-box .x-window-header-title,
.x-message-box .x-window-header-title-default,
.x-message-box .x-window-header-text {
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
    line-height: 28px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline !important;
}


/* ============================================================
   三、关闭按钮 - 白色图标
   DOM结构: .x-tool(外层,有top/left定位) > .x-tool-close(内层图标)
   样式设在外层 .x-tool 上控制定位,内层 .x-tool-close 控制图标
   ============================================================ */

/* 外层 - 定位到标题栏顶部右侧,垂直居中 */
.x-message-box .x-window-header .x-tool {
    top: 0px !important;
    margin: 0 !important;
    width: 28px !important;
    height: 28px !important;
    background: transparent !important;
    cursor: pointer !important;
}

/* 内层图标 - 白色 × */
.x-message-box .x-window-header .x-tool-close {
    background: transparent !important;
    color: #fff !important;
    opacity: 1 !important;
    transition: none !important;
    width: 28px !important;
    height: 28px !important;
    border-radius: 4px !important;
    text-align: center !important;
    line-height: 28px !important;
    cursor: pointer !important;
}

.x-message-box .x-window-header .x-tool:hover {
    background: rgba(255, 255, 255, 0.15) !important;
}

.x-message-box .x-window-header .x-tool-close:hover {
    color: #fff !important;
}

/* 关闭按钮 × 图标 - 白色加大 */
.x-message-box .x-window-header .x-tool-close::before {
    content: '×' !important;
    font-size: 22px !important;
    font-weight: 300 !important;
    font-family: 'Segoe UI', 'Microsoft YaHei', 'Arial', sans-serif !important;
    color: #fff !important;
    text-align: center !important;
    line-height: 28px !important;
    background: transparent !important;
    transition: none !important;
}

.x-message-box .x-window-header .x-tool-close:hover::before {
    color: #fff !important;
}

/* 隐藏原图标图片 */
.x-message-box .x-window-header .x-tool-close img {
    display: none !important;
}

/* 移除关闭按钮 focus 虚框 */
.x-message-box .x-window-header .x-tool:focus {
    outline: none !important;
    box-shadow: none !important;
}




/* ============================================================
   四、Body 内容区域
   ============================================================ */

.x-message-box .x-window-body,
.x-message-box .x-window-body-default {
    background: #fff !important;
    background-color: #fff !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
    padding: 12px 24px 20px 24px !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    vertical-align: top !important;
    top: auto !important;
    position: relative !important;
}

/* 内容容器顶部对齐 - 仅作用于 content 容器,不破坏 ExtJS hbox 布局的 x-box-inner */
.x-message-box .x-window-body .x-message-box-content,
.x-message-box .x-window-body .x-msg-box-content {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    vertical-align: top !important;
    text-align: left !important;
    padding: 0 !important;
    margin: 0 !important;
    width: auto !important;
    min-height: 0 !important;
}

/* 兼容 table 布局 */
.x-message-box .x-window-body table,
.x-message-box .x-window-body tbody,
.x-message-box .x-window-body tr,
.x-message-box .x-window-body td {
    vertical-align: top !important;
    text-align: left !important;
}

/* 图标 - 顶部对齐,不拉伸 */
.x-message-box .x-message-box-icon,
.x-message-box .x-msg-box-icon,
.x-message-box .x-window-body img {
    width: 40px !important;
    height: 40px !important;
    max-width: 40px !important;
    max-height: 40px !important;
    margin-right: 16px !important;
    flex-shrink: 0 !important;
    flex-grow: 0 !important;
    flex-basis: 40px !important;
    vertical-align: top !important;
    align-self: flex-start !important;
}

/* 文字 - 顶部对齐 */
.x-message-box .x-window-body .x-message-box-content div,
.x-message-box .x-window-body .x-msg-box-content div,
.x-message-box .x-window-body .x-message-box-content span,
.x-message-box .x-window-body .x-msg-box-content span {
    font-size: 14px !important;
    line-height: 1.6 !important;
    vertical-align: top !important;
    align-self: flex-start !important;
}


/* ============================================================
   五、底部按钮面板 + toolbar
   ============================================================ */

/* 底部面板 - 加高,白色背景 */
.x-message-box .x-window-footer,
.x-message-box .x-window-footer-default,
.x-message-box .x-docked-bottom {
    background: #fff !important;
    background-color: #fff !important;
    border: none !important;
    border-top: 1px solid #e8e8e8 !important;
    padding: 14px 20px !important;
    min-height: 56px !important;
}

/* toolbar 透明背景 */
.x-message-box .x-toolbar,
.x-message-box .x-toolbar-default {
    background: transparent !important;
    border: none !important;
    padding: 4px 8px !important;
    margin: 0 !important;
}

/* 底部按钮面板(docked footer toolbar) - 由 ExtJS 布局自然停靠在底部,
   不再写死 top:110px, 避免长内容时按钮漂浮在内容中部 */
.x-message-box .x-docked-bottom.x-toolbar-footer,
.x-message-box .x-toolbar.x-toolbar-footer,
.x-message-box .x-toolbar.x-docked {
    position: relative !important;
    top: auto !important;
    bottom: 0 !important;
    margin-top: auto !important;
}

/* toolbar item 间距 */
.x-message-box .x-toolbar .x-toolbar-item {
    margin: 0 12px !important;
}


/* ============================================================
   六、按钮样式 - 蓝色边框+蓝色字+白底
   不用 display:flex,避免 toolbar spacer 变成假按钮
   ============================================================ */

/* 按钮基础 - 加大尺寸
   用 :not() 链提升特异性到 (0,12,0),压过全局 .x-btn:not(...)(0,11,0) */
.x-message-box .x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return) {
    border: 1px solid #4096ff !important;
    background: #fff !important;
    background-color: #fff !important;
    background-image: none !important;
    border-radius: 4px !important;
    padding: 0 !important;
    margin: 0 6px !important;
    box-shadow: none !important;
    outline: none !important;
    color: #4096ff !important;
    height: auto !important;
    min-height: 26px !important;
    max-height: none !important;
    min-width: 72px !important;
    max-width: none !important;
    font-size: 14px !important;
    transition: none !important;
    animation: none !important;
    transform: none !important;
    text-align: center !important;
}

/* 按钮变体覆盖 */
.x-message-box .x-btn.x-btn-default-small:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return),
.x-message-box .x-btn.x-btn-default-medium:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return) {
    border: 1px solid #4096ff !important;
    background: #fff !important;
    background-color: #fff !important;
    background-image: none !important;
    border-radius: 4px !important;
    padding: 0 !important;
    margin: 0 6px !important;
    box-shadow: none !important;
    outline: none !important;
    color: #4096ff !important;
    height: auto !important;
    min-height: 26px !important;
    min-width: 72px !important;
    font-size: 14px !important;
    transition: none !important;
    animation: none !important;
    transform: none !important;
}

/* 确认按钮(确定) - 浅蓝底 */
/* 确认按钮(确定) - 浅蓝底 */
.x-message-box .x-btn-default-small:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return) {
    background: #e6f4ff !important;
    background-color: #e6f4ff !important;
    border-color: #4096ff !important;
}

/* 按钮内部容器 */
.x-message-box .x-btn .x-btn-button {
    border: none !important;
    background: none !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
    outline: none !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 26px !important;
    transition: none !important;
    animation: none !important;
    transform: none !important;
}

/* 按钮文字 - 蓝色字,居中 */
.x-message-box .x-btn .x-btn-inner {
    color: #4096ff !important;
    font-size: 13px !important;
    padding: 2px 14px !important;
    margin: 0 !important;
    min-width: auto !important;
    max-width: none !important;
    min-height: 26px !important;
    line-height: 22px !important;
    border: none !important;
    background: transparent !important;
    white-space: nowrap !important;
    text-align: center !important;
    vertical-align: middle !important;
    transition: none !important;
    animation: none !important;
    transform: none !important;
}

/* 确认按钮文字 - 加粗 */
.x-message-box .x-btn-default-small .x-btn-inner {
    color: #4096ff !important;
    font-weight: 600 !important;
}

/* 按钮外层 wrap 清理 */
.x-message-box .x-btn-wrap-default-small,
.x-message-box .x-btn-button-default-small {
    background: none !important;
    background-image: none !important;
    box-shadow: none !important;
    border: none !important;
}

/* hover */
.x-message-box .x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return):hover,
.x-message-box .x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return).x-btn-over {
    border-color: #F0B5B5 !important;
    transition: none !important;
    animation: none !important;
    transform: none !important;
}

.x-message-box .x-btn-default-small:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return):hover {
    background: #cce5ff !important;
    background-color: #cce5ff !important;
    border-color: #F0B5B5 !important;
}

/* 用 :not() 链提升特异性到 (0,14,0),压过全局 .x-btn:not(...):hover .x-btn-inner (0,10,0) 的白色覆盖 */
.x-message-box .x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return):hover .x-btn-inner,
.x-message-box .x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return).x-btn-over .x-btn-inner,
.x-message-box .x-btn-default-small:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return):hover .x-btn-inner {
    color: #1677ff !important;
    font-weight: 600 !important;
}

/* active/pressed */
.x-message-box .x-btn:active,
.x-message-box .x-btn.x-btn-pressed {
    transition: none !important;
    animation: none !important;
}

/* focus - 无虚框 */
.x-message-box .x-btn:focus,
.x-message-box .x-btn.x-btn-focus {
    outline: none !important;
    box-shadow: none !important;
    transition: none !important;
    animation: none !important;
    transform: none !important;
}

/* 禁用状态 */
.x-message-box .x-btn.x-item-disabled,
.x-message-box .x-btn[disabled] {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
}

/* 去掉按钮箭头/分隔线 */
.x-message-box .x-btn-arrow-right,
.x-message-box .x-btn-split-right {
    display: none !important;
}


/* ============================================================
   七、遮罩层
   ============================================================ */

.x-mask {
    background-color: rgba(0, 0, 0, 0.45) !important;
}

/* ============================================================
   四十三、富文本工具栏(.x-html-editor-tb)恢复可读样式
   问题:全局规则 zhengqi.css:8084-8104 把所有 .x-btn(除主按钮外)
        染成 #5a6b7c 深蓝灰实心,富文本工具栏按钮也命中,
        导致图标看不清(白图标在深底上对比不足)。
   方案:只对 .x-html-editor-tb 内的按钮做覆盖,撤销深色实心背景,
        改为透明底 + 深灰图标(ExtJS 原生风格),hover/pressed 浅蓝高亮。
   不动其他任何按钮,不动全局 .x-btn 规则。
   ============================================================ */

/* 1. 撤销深蓝灰实心背景 — 改为透明 */
.x-html-editor-tb .x-btn,
.x-html-editor-tb .x-btn.x-btn-default-toolbar-small,
.x-html-editor-tb .x-btn.x-btn-default-small,
.x-html-editor-tb .x-btn.x-btn-default-medium,
.x-html-editor-tb .x-btn:not(.btn-primary):not(.btn-success):not(.btn-danger):not(.btn-warning):not(.btn-info):not(.btn-text):not(.btnLogin):not(.btnApproval):not(.btnApproveNode):not(.btn-reset):not(.btn-return) {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 1px solid transparent !important;
    border-radius: 3px !important;
    color: #5a6b7c !important;
    font-size: 13px !important;
    font-weight: normal !important;
    padding: 3px 5px !important;
    margin: 0 1px !important;
    box-shadow: none !important;
    height: 28px !important;
    min-height: 28px !important;
    vertical-align: middle !important;
}

/* 2. 按钮文字 — 深灰色(对齐图标颜色) */
.x-html-editor-tb .x-btn .x-btn-inner {
    color: #5a6b7c !important;
    font-weight: normal !important;
    padding: 0 4px !important;
    margin: 0 !important;
    min-width: 0 !important;
    max-width: none !important;
    line-height: 1 !important;
}

/* 3. 图标 — 深灰色清晰可见
      注意:不要强制 background-position / background-size !
      ExtJS 工具栏用 sprite 图 + 每个按钮不同的 background-position 来切图标,
      一旦覆盖成 center,所有按钮会显示同一块图标。
      这里只设颜色、尺寸、字号,定位完全交给原生 CSS。 */
.x-html-editor-tb .x-btn .x-btn-icon-el,
.x-html-editor-tb .x-btn .x-icon-el {
    color: #5a6b7c !important;
    width: 18px !important;
    min-width: 18px !important;
    height: 18px !important;
    min-height: 18px !important;
    font-size: 18px !important;
    line-height: 18px !important;
    margin: 0 !important;
    background-repeat: no-repeat !important;
    display: inline-block !important;
    vertical-align: middle !important;
}

/* 4. hover — 浅蓝高亮,文字图标同步变深 */
.x-html-editor-tb .x-btn:hover,
.x-html-editor-tb .x-btn.x-btn-over {
    background: #e6f4ff !important;
    background-color: #e6f4ff !important;
    border-color: #e6f4ff !important;
    color: #1677ff !important;
}

.x-html-editor-tb .x-btn:hover .x-btn-inner,
.x-html-editor-tb .x-btn.x-btn-over .x-btn-inner {
    color: #1677ff !important;
}

.x-html-editor-tb .x-btn:hover .x-btn-icon-el,
.x-html-editor-tb .x-btn:hover .x-icon-el,
.x-html-editor-tb .x-btn.x-btn-over .x-btn-icon-el,
.x-html-editor-tb .x-btn.x-btn-over .x-icon-el {
    color: #1677ff !important;
}

/* 5. pressed / active — 稍深的蓝 */
.x-html-editor-tb .x-btn.x-btn-pressed,
.x-html-editor-tb .x-btn:active,
.x-html-editor-tb .x-btn.x-html-editor-tb-pressed {
    background: #cce5ff !important;
    background-color: #cce5ff !important;
    border-color: #1677ff !important;
    color: #003eb3 !important;
}

.x-html-editor-tb .x-btn.x-btn-pressed .x-btn-icon-el,
.x-html-editor-tb .x-btn:active .x-btn-icon-el,
.x-html-editor-tb .x-btn.x-html-editor-tb-pressed .x-btn-icon-el {
    color: #003eb3 !important;
}

/* 6. 按钮内层容器 */
.x-html-editor-tb .x-btn .x-btn-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    background: transparent !important;
}

/* 7. 禁用按钮 - 灰化但不影响其他按钮 */
.x-html-editor-tb .x-btn.x-item-disabled,
.x-html-editor-tb .x-btn.x-disabled {
    opacity: 0.4 !important;
    background: transparent !important;
    border-color: transparent !important;
}

/* 8. 工具栏容器 — 浅灰底,让按钮区域可识别 */
.x-html-editor-tb,
.x-html-editor-tb .x-toolbar-body,
.x-html-editor-tb .x-toolbar-inner {
    background: #fafafa !important;
    background-color: #fafafa !important;
    padding: 2px 4px !important;
    border-bottom: 1px solid #e8e8e8 !important;
}

/* 9. 分隔符收紧 */
.x-html-editor-tb .x-tb-sep,
.x-html-editor-tb .x-toolbar-separator {
    height: 16px !important;
    margin: 0 2px !important;
    border-left: 1px solid #d9d9d9 !important;
}

/* ============================================================
   四十四、TUniDBEdit / TUniEdit 多 Trigger 按钮防重叠 + 去重影
   真实 DOM(实测):
     <div class="x-form-trigger x-form-trigger-default x-fa4 fa4-eye fa4-eye-default"
          role="presentation" data-qtip="..."></div>
   注意:IconCls 直接挂在 trigger div 上,没有 .x-form-trigger-font-btn,
        也没有内嵌 <i>。图标靠 .fa4-eye::before 字体字形显示。

   两个问题:
     A. 重叠:trigger 字体图标字号未约束,溢出 24px 宽度,盖到左侧按钮
     B. 重影:ExtJS 给 .x-form-trigger 默认 background-image(箭头位图),
        与 ::before 字体图标叠加,显示两个图标

   方案:针对带 [class*="fa4-"] 的 trigger,
        1. 固定 24px 宽 + overflow:hidden 防溢出
        2. background-image:none 去除 ExtJS 默认位图(去重影)
        3. 约束 ::before 字号 14px、居中
   ============================================================ */

/* 1. trigger-wrap:固定 flex 布局,子项不收缩 */
.x-form-trigger-wrap {
    flex-wrap: nowrap !important;
    gap: 0 !important;
}

.x-form-trigger-wrap > .x-form-trigger {
    flex: 0 0 auto !important;
    flex-shrink: 0 !important;
    flex-grow: 0 !important;
    position: relative !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    z-index: 1 !important;
}

/* 2. 带 FA4 图标类的 trigger(IconCls 直接挂在 trigger 上) */
.x-form-trigger.x-fa4,
.x-form-trigger[class*=" fa4-"],
.x-form-trigger[class^="fa4-"],
.x-form-trigger-default.x-fa4,
.x-form-trigger-default[class*=" fa4-"],
.x-form-trigger-default[class^="fa4-"] {
    width: 24px !important;
    min-width: 24px !important;
    max-width: 24px !important;
    height: 100% !important;
    min-height: 22px !important;
    padding: 0 !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    position: relative !important;
    border: none !important;
    border-radius: 0 4px 4px 0 !important;
    background-color: transparent !important;
    background-image: none !important;     /* 去 ExtJS 默认箭头位图(去重影) */
    cursor: pointer !important;
}

.x-form-trigger.x-fa4:hover,
.x-form-trigger[class*=" fa4-"]:hover,
.x-form-trigger[class^="fa4-"]:hover {
    background-color: #f5f5f5 !important;
    background-image: none !important;
}

.x-form-trigger.x-fa4:active,
.x-form-trigger[class*=" fa4-"]:active,
.x-form-trigger[class^="fa4-"]:active {
    background-color: #e8e8e8 !important;
    background-image: none !important;
}

/* 3. trigger 自身的 ::before(FA4 字体图标) — 限制字号、居中
      注意:trigger 没有 <i> 子元素,图标就是 ::before 本身 */
.x-form-trigger.x-fa4::before,
.x-form-trigger[class*=" fa4-"]::before,
.x-form-trigger[class^="fa4-"]::before,
.x-form-trigger-default.x-fa4::before,
.x-form-trigger-default[class*=" fa4-"]::before,
.x-form-trigger-default[class^="fa4-"]::before {
    display: inline-block !important;
    width: 16px !important;
    min-width: 16px !important;
    max-width: 16px !important;
    height: 16px !important;
    min-height: 16px !important;
    max-height: 16px !important;
    font-size: 14px !important;
    line-height: 16px !important;
    text-align: center !important;
    vertical-align: middle !important;
    margin: 0 auto !important;
    padding: 0 !important;
    color: #5a6b7c !important;
    background: transparent !important;
    background-image: none !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    position: static !important;
}

/* 4. trigger 自身的 ::after 隐藏(防 FA4 部分类用 ::after 渲染造成重影) */
.x-form-trigger.x-fa4::after,
.x-form-trigger[class*=" fa4-"]::after,
.x-form-trigger[class^="fa4-"]::after,
.x-form-trigger-default.x-fa4::after,
.x-form-trigger-default[class*=" fa4-"]::after,
.x-form-trigger-default[class^="fa4-"]::after {
    content: none !important;
    display: none !important;
}

/* ============================================================
   四十五、统一禁用 trigger 按钮 hover 动画
   原因:zhengqi.css:5693/5786 给 trigger 设了 transition: all 0.2s ease,
        hover 时背景色渐变,与按钮(.x-btn 已被全局禁用动画)不一致。
   方案:禁用所有 trigger 及其内部图标的 transition/animation,
        hover/active 视觉变化改为瞬时,与按钮保持一致。
   ============================================================ */

.x-form-trigger,
.x-form-trigger-default,
.x-form-trigger-combo,
.x-form-trigger-date,
.x-form-date-trigger,
.x-form-arrow-trigger,
.x-form-clear-trigger,
.x-form-trigger-clear,
.x-form-trigger-font-btn,
.x-form-trigger-spinner,
.x-form-trigger-wrap,
.x-form-trigger-wrap .x-form-trigger,
.x-form-trigger-wrap .x-form-trigger-font-btn {
    transition: none !important;
    animation: none !important;
}

.x-form-trigger *,
.x-form-trigger-font-btn *,
.x-form-trigger-wrap .x-form-trigger *,
.x-form-trigger-wrap .x-form-trigger-font-btn * {
    transition: none !important;
    animation: none !important;
}

/* ============================================================
   四十六、(已废弃,合并到四十四)
   原 .x-form-trigger-font-btn 选择器在实际 DOM 中不存在,
   IconCls 直接挂在 trigger 上,统一由四十四章处理。
   ============================================================ */

/* ============================================================
   四十七、DBNavigator 横排按钮图标垂直居中(安全版)
   真实 DOM 结构:
     <a class="x-btn" height:28px>
       <span class="x-btn-wrap" style="table-layout:fixed">    ← display:table
         <span class="x-btn-button" style="height:auto">       ← display:table-cell
           <span class="x-btn-icon-el fas fa-...">             ← 图标
         </span>
       </span>
     </a>

   问题:ExtJS 默认 .x-btn-wrap 不设高度,等于内容(图标)高度,
        table-cell 自己就只有图标那么高,vertical-align:middle 无意义。
        28px 按钮里 18px 的 cell 被顶部 padding 顶上去 → 图标贴顶。

   关键约束:绝对不动 .x-btn 的 display 属性!
        UniGUI 用内联 style="display:none" 隐藏 VisibleButtons 未启用的按钮,
        任何 display:!important 规则都会压过它,导致隐藏按钮被显示。

   方案:只对 .x-btn-wrap 和 .x-btn-button 操作,
        1. .x-btn-wrap 高度 100% 撑满按钮
        2. .x-btn-button 用 vertical-align:middle 居中内容
        3. 图标元素的 line-height 收紧,确保字形在 cell 中心
   ============================================================ */

/* 1. table 容器撑满按钮 — 给 table-cell 提供垂直居中的空间 */
.DBNavigator .x-btn .x-btn-wrap {
    height: 100% !important;
    width: 100% !important;
    display: table !important;
    table-layout: fixed !important;
    vertical-align: middle !important;
}

/* 2. table-cell — 启用垂直居中 */
.DBNavigator .x-btn .x-btn-button {
    display: table-cell !important;
    vertical-align: middle !important;
    text-align: center !important;
    height: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* 3. 图标元素 — line-height 收紧到 1,字形紧贴 cell 中心 */
.DBNavigator .x-btn .x-btn-icon-el,
.DBNavigator .x-btn .x-icon-el,
.DBNavigator .x-btn .fa,
.DBNavigator .x-btn .fas,
.DBNavigator .x-btn .far {
    vertical-align: middle !important;
    line-height: 1 !important;
    display: inline-block !important;
}

/* 4. 禁用按钮的图标垂直居中(绝对定位兜底版)
      上一版用 table-cell 重布局对启用按钮有效,但禁用按钮被某条
      ExtJS 内部规则干扰没生效(看不到全 HTML 没法精准定位)。
      改用绝对定位直接把图标钉在按钮几何中心,
      完全绕开 table / table-cell / flex 布局,稳定可靠。

      禁用有两种 DOM 形态:
      A. 单个按钮被禁用: .x-btn 上加 .x-item-disabled
      B. 整个 DBNavigator 被禁用: 父级容器加 .x-item-disabled
      两种情况都覆盖。

      安全性:只设 position:relative / absolute,不动 display,
      不影响 VisibleButtons 的 display:none 隐藏逻辑。 */

/* 4.1 禁用按钮作为定位上下文 */
.DBNavigator .x-btn.x-item-disabled,
.DBNavigator .x-btn.x-disabled,
.DBNavigator .x-btn.x-btn-disabled,
.DBNavigator .x-btn[disabled],
.DBNavigator .x-item-disabled .x-btn,
.DBNavigator .x-disabled .x-btn {
    position: relative !important;
}

/* 4.2 禁用按钮的图标 — 绝对定位居中 */
.DBNavigator .x-btn.x-item-disabled .x-btn-icon-el,
.DBNavigator .x-btn.x-disabled .x-btn-icon-el,
.DBNavigator .x-btn.x-btn-disabled .x-btn-icon-el,
.DBNavigator .x-btn[disabled] .x-btn-icon-el,
.DBNavigator .x-item-disabled .x-btn .x-btn-icon-el,
.DBNavigator .x-disabled .x-btn .x-btn-icon-el,
.DBNavigator .x-btn.x-item-disabled .x-icon-el,
.DBNavigator .x-btn.x-disabled .x-icon-el,
.DBNavigator .x-btn.x-btn-disabled .x-icon-el,
.DBNavigator .x-btn[disabled] .x-icon-el,
.DBNavigator .x-item-disabled .x-btn .x-icon-el,
.DBNavigator .x-disabled .x-btn .x-icon-el,
.DBNavigator .x-btn.x-item-disabled .fa,
.DBNavigator .x-btn.x-disabled .fa,
.DBNavigator .x-btn.x-btn-disabled .fa,
.DBNavigator .x-btn[disabled] .fa,
.DBNavigator .x-item-disabled .x-btn .fa,
.DBNavigator .x-disabled .x-btn .fa,
.DBNavigator .x-btn.x-item-disabled .fas,
.DBNavigator .x-btn.x-disabled .fas,
.DBNavigator .x-btn.x-btn-disabled .fas,
.DBNavigator .x-btn[disabled] .fas,
.DBNavigator .x-item-disabled .x-btn .fas,
.DBNavigator .x-disabled .x-btn .fas {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    line-height: 1 !important;
    display: inline-block !important;
    text-align: center !important;
}

/* 5. 禁用按钮之间的间距 — 收紧到和启用按钮一致
      问题:禁用按钮之间间距比启用按钮宽,原因是禁用时
      UniGUI/ExtJS 给按钮或它的包裹元素(.x-box-item / .x-toolbar-item)
      加了额外 margin / padding,或者按钮本身 min-width 被改大。
      方案:对禁用按钮本身和它的常见包裹元素强制 margin:0、
      和启用按钮相同的 padding / min-width。 */

/* 5.1 禁用按钮自身 — 强制和启用按钮同样的紧凑尺寸
      关键:绝对不要设 width:auto / min-width,
      因为按钮用 position:absolute + 内联 style="width:30px" 定位,
      一旦用 !important 覆盖宽度,按钮会变窄,但 left:Xpx 是固定的,
      两个按钮之间就会出现视觉空隙。
      这里只清 margin/padding,宽度完全交给内联 style 控制。 */
.DBNavigator .x-btn.x-item-disabled,
.DBNavigator .x-btn.x-disabled,
.DBNavigator .x-btn.x-btn-disabled,
.DBNavigator .x-btn[disabled],
.DBNavigator .x-item-disabled .x-btn,
.DBNavigator .x-disabled .x-btn {
    margin: 0 !important;
    padding: 4px !important;
}

/* 注:5.2 / 5.3 已删除
   - 5.2 目标 .x-box-item 包裹元素,但实测 DOM 里没有这种包裹
     (按钮是 .x-autocontainer-innerCt 的直接子元素,绝对定位),死代码
   - 5.3 兜底设 padding:0 会压过 5.1 的 padding:4px,反而把禁用按钮
     内边距清空,影响图标居中。5.1 已经够用,不需要兜底 */

/* ============================================================
   四十八、TUniDBGrid 数据列 CheckBox 改为开关样式
   ============================================================
   目标:
     - 把 TUniDBGrid 中"数据列"(CheckColumn / Boolean 字段)里的复选框
       改成与独立 TUniCheckBox 一致的开关滑块(48x26,见第三十九章)
     - **行前选择框不动**: .x-grid-row-checker / .x-column-header-checkbox
       / .x-grid-cell-selmodel / .x-selmodel-column 等 SelectionModel
       元素保持 ExtJS 默认外观,本章节不书写任何覆盖规则

   两种数据列 CheckBox 的 DOM:
     1) CheckColumn 组件(列属性 CheckBoxes.Enabled = True,非编辑态):
          <td class="x-grid-cell x-grid-cell-checkcolumn">
            <div class="x-grid-cell-inner">
              <div class="x-grid-checkcolumn" />                            ← 未勾选
              <div class="x-grid-checkcolumn x-grid-checkcolumn-checked" /> ← 勾选
            </div>
          </td>
     2) Boolean 字段编辑态(ClicksToEdit 触发后渲染 form 控件):
          <td class="x-grid-cell ...">
            <div class="x-grid-cell-inner">
              <div class="x-form-cb-wrap">
                <div class="x-form-cb-wrap-inner">
                  <span class="x-form-cb"><input class="x-form-checkbox"/></span>
                </div>
              </div>
            </div>
          </td>

   行前选择框 DOM(本章节不动):
     <td class="x-grid-cell x-grid-cell-selmodel x-selmodel-column">
       <div class="x-grid-cell-inner">
         <div class="x-grid-row-checker">...</div>
       </div>
     </td>
     <th class="x-column-header x-column-header-checkbox">...</th>
   ============================================================ */

/* ---- 1. 数据列(CheckColumn)单元格: 居中、紧凑 ---- */
.x-grid-cell-checkcolumn {
    text-align: center !important;
    vertical-align: middle !important;
}
.x-grid-cell-checkcolumn .x-grid-cell-inner {
    text-align: center !important;
    padding: 0 4px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ---- 2. CheckColumn 显示态: 关闭默认背景图,把 .x-grid-checkcolumn
         变成 36x20 的轨道(比独立 CheckBox 更紧凑,适配 34px 行高)
         注意: 用 td:not(.x-selmodel-column):not(.x-selmodel-checkbox) 排除
         行选择列(SelectionModel 的 CheckColumn),让行前选择框保持 ExtJS
         默认外观与默认点击行为,由第四十九章单独样式化为方框。 ---- */
td:not(.x-selmodel-column):not(.x-selmodel-checkbox) .x-grid-cell-inner .x-grid-checkcolumn,
td:not(.x-selmodel-column):not(.x-selmodel-checkbox) .x-grid-cell-inner .x-grid-checkcolumn-checked {
    display: inline-block !important;
    position: relative !important;
    width: 36px !important;
    height: 20px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    background-color: #e4e4e4 !important;
    background-image: none !important;
    background-repeat: no-repeat !important;
    background-position: 0 0 !important;
    border-radius: 20px !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    cursor: pointer !important;
    overflow: visible !important;
    vertical-align: middle !important;
    transition: background-color .2s ease-in-out !important;
    box-sizing: border-box !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
}

/* ---- 3. 旋钮(::after,16px 白色圆形) ---- */
td:not(.x-selmodel-column):not(.x-selmodel-checkbox) .x-grid-cell-inner .x-grid-checkcolumn::after,
td:not(.x-selmodel-column):not(.x-selmodel-checkbox) .x-grid-cell-inner .x-grid-checkcolumn-checked::after {
    content: '' !important;
    position: absolute !important;
    top: 2px !important;
    left: 2px !important;
    width: 16px !important;
    height: 16px !important;
    background-color: #ffffff !important;
    background-image: none !important;
    border-radius: 50% !important;
    border: none !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
    transition: transform .2s ease-in-out !important;
    pointer-events: none !important;
    box-sizing: border-box !important;
}

/* ---- 4. 勾选态: 轨道变主题蓝 #1677ff + 旋钮右移 16px(36-16-2-2) ---- */
td:not(.x-selmodel-column):not(.x-selmodel-checkbox) .x-grid-cell-inner .x-grid-checkcolumn-checked {
    background-color: #1677ff !important;
    background: #1677ff !important;
}
td:not(.x-selmodel-column):not(.x-selmodel-checkbox) .x-grid-cell-inner .x-grid-checkcolumn-checked::after {
    transform: translateX(16px) !important;
}

/* ---- 5. 悬停反馈(未勾选 → 深灰; 勾选 → 深蓝) ---- */
td:not(.x-selmodel-column):not(.x-selmodel-checkbox) .x-grid-cell-inner .x-grid-checkcolumn:not(.x-grid-checkcolumn-checked):hover {
    background-color: #bdbdbd !important;
}
td:not(.x-selmodel-column):not(.x-selmodel-checkbox) .x-grid-cell-inner .x-grid-checkcolumn-checked:hover {
    background-color: #0958d9 !important;
}

/* ---- 6. Boolean 字段编辑态: 单元格内的 .x-form-cb-wrap
         第三十九章已全局把它改成开关(48x26),在单元格里显大,
         这里收缩到 36x20 与第 2 节对齐;同时隐藏 caption/冒号 ---- */
.x-grid-cell .x-form-cb-wrap,
.x-grid-cell-inner .x-form-cb-wrap {
    display: inline-block !important;
    vertical-align: middle !important;
    line-height: 20px !important;
    height: 20px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    width: auto !important;
    float: none !important;
}

/* 6.1 轨道(.x-form-cb)与 input 缩到 36x20 */
.x-grid-cell .x-form-cb-wrap span.x-form-cb,
.x-grid-cell .x-form-cb-wrap span.x-form-cb-default,
.x-grid-cell .x-form-cb-wrap .x-form-cb-wrap-inner > span,
.x-grid-cell-inner .x-form-cb-wrap span.x-form-cb,
.x-grid-cell-inner .x-form-cb-wrap span.x-form-cb-default,
.x-grid-cell-inner .x-form-cb-wrap .x-form-cb-wrap-inner > span {
    width: 36px !important;
    height: 20px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    border-radius: 20px !important;
    line-height: 20px !important;
    flex: 0 0 36px !important;
}
.x-grid-cell .x-form-cb-wrap input[type="checkbox"].x-form-checkbox,
.x-grid-cell .x-form-cb-wrap input.x-form-checkbox,
.x-grid-cell .x-form-cb-wrap input[type="checkbox"].x-form-field,
.x-grid-cell .x-form-cb-wrap .x-form-cb-wrap-inner input[type="checkbox"],
.x-grid-cell-inner .x-form-cb-wrap input[type="checkbox"].x-form-checkbox,
.x-grid-cell-inner .x-form-cb-wrap input.x-form-checkbox,
.x-grid-cell-inner .x-form-cb-wrap input[type="checkbox"].x-form-field,
.x-grid-cell-inner .x-form-cb-wrap .x-form-cb-wrap-inner input[type="checkbox"] {
    width: 36px !important;
    height: 20px !important;
    min-width: 36px !important;
    max-width: 36px !important;
    min-height: 20px !important;
    max-height: 20px !important;
}

/* 6.2 旋钮缩到 16px,top/left=2px */
.x-grid-cell .x-form-cb-wrap span.x-form-cb::after,
.x-grid-cell .x-form-cb-wrap span.x-form-cb-default::after,
.x-grid-cell .x-form-cb-wrap .x-form-cb-wrap-inner > span::after,
.x-grid-cell-inner .x-form-cb-wrap span.x-form-cb::after,
.x-grid-cell-inner .x-form-cb-wrap span.x-form-cb-default::after,
.x-grid-cell-inner .x-form-cb-wrap .x-form-cb-wrap-inner > span::after {
    top: 2px !important;
    left: 2px !important;
    width: 16px !important;
    height: 16px !important;
}

/* 6.3 勾选态旋钮右移: 36-16-2-2 = 16px(覆盖第三十九章的 22px) */
.x-form-cb-checked .x-grid-cell .x-form-cb-wrap span.x-form-cb::after,
.x-form-cb-checked .x-grid-cell .x-form-cb-wrap span.x-form-cb-default::after,
.x-form-cb-checked .x-grid-cell .x-form-cb-wrap .x-form-cb-wrap-inner > span::after,
.x-grid-cell .x-form-cb-checked .x-form-cb-wrap span.x-form-cb::after,
.x-grid-cell .x-form-cb-checked .x-form-cb-wrap span.x-form-cb-default::after,
.x-grid-cell .x-form-cb-checked .x-form-cb-wrap .x-form-cb-wrap-inner > span::after,
.x-grid-cell-inner .x-form-cb-checked .x-form-cb-wrap span.x-form-cb::after,
.x-grid-cell-inner .x-form-cb-checked .x-form-cb-wrap span.x-form-cb-default::after,
.x-grid-cell-inner .x-form-cb-checked .x-form-cb-wrap .x-form-cb-wrap-inner > span::after,
.x-grid-cell .x-form-cb-wrap.x-form-cb-checked span.x-form-cb::after,
.x-grid-cell .x-form-cb-wrap.x-form-cb-checked span.x-form-cb-default::after,
.x-grid-cell-inner .x-form-cb-wrap.x-form-cb-checked span.x-form-cb::after,
.x-grid-cell-inner .x-form-cb-wrap.x-form-cb-checked span.x-form-cb-default::after {
    transform: translateX(16px) !important;
}
.x-grid-cell .x-form-cb-wrap .x-form-cb-wrap-inner,
.x-grid-cell-inner .x-form-cb-wrap .x-form-cb-wrap-inner {
    display: inline-flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    column-gap: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    width: auto !important;
}
/* 单元格里隐藏 caption 文字与冒号 */
.x-grid-cell .x-form-cb-wrap label.x-form-cb-label,
.x-grid-cell-inner .x-form-cb-wrap label.x-form-cb-label,
.x-grid-cell .x-form-cb-wrap .x-form-cb-label,
.x-grid-cell-inner .x-form-cb-wrap .x-form-cb-label {
    display: none !important;
}
.x-grid-cell .x-form-cb-wrap label.x-form-cb-label::after,
.x-grid-cell-inner .x-form-cb-wrap label.x-form-cb-label::after,
.x-grid-cell .x-form-cb-wrap .x-form-cb-label::after,
.x-grid-cell-inner .x-form-cb-wrap .x-form-cb-label::after {
    content: none !important;
}

/* ============================================================
   四十九、只读状态下拦截数据列开关的点击
   ============================================================
   背景:
     TUniDBGrid 中数据列(Boolean 字段/CheckColumn)改成开关后,
     数据集处于只读状态时点击仍能"打开",但打开后无法"关闭"
     (ExtJS CheckColumn 的 cellclick 触发了 toggle,但 dataset.Post
      失败,UI 状态与数据状态错位)。
     正确逻辑: 只读时根本不能点。

   方案: 在所有可能的"只读"标识下,把 .x-grid-checkcolumn 的
     pointer-events 设为 none,点击直接穿透,JS 收不到 cellclick。

   覆盖的只读来源:
     - .x-grid-cell-readonly        单元格只读(项目已用,见第 3208 行)
     - .x-grid-row-readonly         行只读
     - .x-grid-readonly             整个 grid 只读
     - .x-item-readonly             ExtJS 组件只读
     - .x-form-readonly             表单只读
     - [data-readonly="true"]       通用属性标识
   ============================================================ */

/* 1. 只读上下文里的开关: 不可点 + 视觉变灰 */
.x-grid-cell-readonly .x-grid-checkcolumn,
.x-grid-cell-readonly .x-grid-checkcolumn-checked,
.x-grid-row-readonly .x-grid-checkcolumn,
.x-grid-row-readonly .x-grid-checkcolumn-checked,
.x-grid-readonly .x-grid-checkcolumn,
.x-grid-readonly .x-grid-checkcolumn-checked,
.x-item-readonly .x-grid-checkcolumn,
.x-item-readonly .x-grid-checkcolumn-checked,
.x-form-readonly .x-grid-checkcolumn,
.x-form-readonly .x-grid-checkcolumn-checked,
.x-grid-cell[data-readonly="true"] .x-grid-checkcolumn,
.x-grid-cell[data-readonly="true"] .x-grid-checkcolumn-checked,
td.x-grid-cell-readonly .x-grid-checkcolumn,
td.x-grid-cell-readonly .x-grid-checkcolumn-checked,
tr.x-grid-row-readonly .x-grid-checkcolumn,
tr.x-grid-row-readonly .x-grid-checkcolumn-checked {
    pointer-events: none !important;
    cursor: not-allowed !important;
    opacity: 0.5 !important;
    filter: grayscale(0.4) !important;
}

/* 2. 只读上下文里的 form 版开关(Boolean 字段编辑态)同样拦截 */
.x-grid-cell-readonly .x-form-cb-wrap,
.x-grid-row-readonly .x-form-cb-wrap,
.x-grid-readonly .x-form-cb-wrap,
.x-item-readonly .x-form-cb-wrap,
.x-grid-cell[data-readonly="true"] .x-form-cb-wrap,
td.x-grid-cell-readonly .x-form-cb-wrap,
tr.x-grid-row-readonly .x-form-cb-wrap {
    pointer-events: none !important;
    cursor: not-allowed !important;
    opacity: 0.5 !important;
    filter: grayscale(0.4) !important;
}

/* ============================================================
   ★ 全局统一按钮 hover/pressed/focus 样式(最高优先级)
   - hover / over / focus / pressed / active:淡红底 + 红字
   - 去除按钮按下/聚焦后的文字周边虚框(outline:none)
   - 关键:ExtJS 按钮背景渲染在 .x-btn-button / em 内部层,
     必须同时覆盖这些内部元素,否则外层背景被内部渐变盖住
   ============================================================ */

/* ---- A. 外层 .x-btn 的 hover/over/focus/pressed/active 背景 ---- */
.x-btn:not(.x-datepicker *):not(.x-monthpicker *):hover, .x-btn:not(.x-datepicker *):not(.x-monthpicker *).x-btn-over, .x-btn:not(.x-datepicker *):not(.x-monthpicker *).x-btn-focus, .x-btn:not(.x-datepicker *):not(.x-monthpicker *).x-btn-pressed, .x-btn:not(.x-datepicker *):not(.x-monthpicker *):active,
.x-btn.btn-add:hover, .x-btn.btn-add.x-btn-over, .x-btn.btn-add.x-btn-focus, .x-btn.btn-add.x-btn-pressed, .x-btn.btn-add:active,
.x-btn.btn-edit:hover, .x-btn.btn-edit.x-btn-over, .x-btn.btn-edit.x-btn-focus, .x-btn.btn-edit.x-btn-pressed, .x-btn.btn-edit:active,
.x-btn.btn-del:hover, .x-btn.btn-del.x-btn-over, .x-btn.btn-del.x-btn-focus, .x-btn.btn-del.x-btn-pressed, .x-btn.btn-del:active,
.x-btn.btn-primary:hover, .x-btn.btn-primary.x-btn-over, .x-btn.btn-primary.x-btn-focus, .x-btn.btn-primary.x-btn-pressed, .x-btn.btn-primary:active,
.x-btn.btn-save:hover, .x-btn.btn-save.x-btn-over, .x-btn.btn-save.x-btn-focus, .x-btn.btn-save.x-btn-pressed, .x-btn.btn-save:active,
.x-btn.btn-confirm:hover, .x-btn.btn-confirm.x-btn-over, .x-btn.btn-confirm.x-btn-focus, .x-btn.btn-confirm.x-btn-pressed, .x-btn.btn-confirm:active,
.x-btn.btn-audit:hover, .x-btn.btn-audit.x-btn-over, .x-btn.btn-audit.x-btn-focus, .x-btn.btn-audit.x-btn-pressed, .x-btn.btn-audit:active,
.x-btn.btn-close:hover, .x-btn.btn-close.x-btn-over, .x-btn.btn-close.x-btn-focus, .x-btn.btn-close.x-btn-pressed, .x-btn.btn-close:active,
.x-btn.btn-adjust:hover, .x-btn.btn-adjust.x-btn-over, .x-btn.btn-adjust.x-btn-focus, .x-btn.btn-adjust.x-btn-pressed, .x-btn.btn-adjust:active,
.x-btn.btn-red:hover, .x-btn.btn-red.x-btn-over, .x-btn.btn-red.x-btn-focus, .x-btn.btn-red.x-btn-pressed, .x-btn.btn-red:active,
.x-btn.btn-sendsms:hover, .x-btn.btn-sendsms.x-btn-over, .x-btn.btn-sendsms.x-btn-focus, .x-btn.btn-sendsms.x-btn-pressed, .x-btn.btn-sendsms:active,
.x-btn.btn-split:hover, .x-btn.btn-split.x-btn-over, .x-btn.btn-split.x-btn-focus, .x-btn.btn-split.x-btn-pressed, .x-btn.btn-split:active,
.x-btn.btn-query:hover, .x-btn.btn-query.x-btn-over, .x-btn.btn-query.x-btn-focus, .x-btn.btn-query.x-btn-pressed, .x-btn.btn-query:active,
.x-btn.btn-reset:hover, .x-btn.btn-reset.x-btn-over, .x-btn.btn-reset.x-btn-focus, .x-btn.btn-reset.x-btn-pressed, .x-btn.btn-reset:active,
.x-btn.btn-return:hover, .x-btn.btn-return.x-btn-over, .x-btn.btn-return.x-btn-focus, .x-btn.btn-return.x-btn-pressed, .x-btn.btn-return:active,
.x-btn.btnApproval:hover, .x-btn.btnApproval.x-btn-over, .x-btn.btnApproval.x-btn-focus, .x-btn.btnApproval.x-btn-pressed, .x-btn.btnApproval:active,
.x-btn.btnApproveNode:hover, .x-btn.btnApproveNode.x-btn-over, .x-btn.btnApproveNode.x-btn-focus, .x-btn.btnApproveNode.x-btn-pressed, .x-btn.btnApproveNode:active,
.x-btn.btnLogin:hover, .x-btn.btnLogin.x-btn-over, .x-btn.btnLogin.x-btn-focus, .x-btn.btnLogin.x-btn-pressed, .x-btn.btnLogin:active,
.x-btn.btn-success:hover, .x-btn.btn-success.x-btn-over, .x-btn.btn-success.x-btn-focus, .x-btn.btn-success.x-btn-pressed, .x-btn.btn-success:active,
.x-btn.btn-danger:hover, .x-btn.btn-danger.x-btn-over, .x-btn.btn-danger.x-btn-focus, .x-btn.btn-danger.x-btn-pressed, .x-btn.btn-danger:active,
.x-btn.btn-warning:hover, .x-btn.btn-warning.x-btn-over, .x-btn.btn-warning.x-btn-focus, .x-btn.btn-warning.x-btn-pressed, .x-btn.btn-warning:active,
.x-btn.btn-info:hover, .x-btn.btn-info.x-btn-over, .x-btn.btn-info.x-btn-focus, .x-btn.btn-info.x-btn-pressed, .x-btn.btn-info:active,
.x-btn.btn-text:hover, .x-btn.btn-text.x-btn-over, .x-btn.btn-text.x-btn-focus, .x-btn.btn-text.x-btn-pressed, .x-btn.btn-text:active {
    background: #fff1f0 !important;
    background-color: #fff1f0 !important;
    background-image: none !important;
    border-color: #ffa39e !important;
    color: #cf1322 !important;
    filter: none !important;
    box-shadow: 0 1px 2px rgba(207, 19, 34, 0.08) !important;
}

/* ---- A2. 内层全部透明,让外层淡红底透出(确保内外一致) ---- */
/* ExtJS 按钮是多层结构(.x-btn > em/.x-btn-wrap > .x-btn-button > .x-btn-inner),
   内层元素各自带白色/彩色背景会盖住外层,导致"外白内红"。
   因此内层全部设为透明,外层的淡红底自然透出,内外永远一致。 */
.x-btn:hover em, .x-btn.x-btn-over em, .x-btn.x-btn-focus em, .x-btn.x-btn-pressed em, .x-btn:active em,
.x-btn:hover .x-btn-button, .x-btn.x-btn-over .x-btn-button, .x-btn.x-btn-focus .x-btn-button, .x-btn.x-btn-pressed .x-btn-button, .x-btn:active .x-btn-button,
.x-btn:hover .x-btn-wrap, .x-btn.x-btn-over .x-btn-wrap, .x-btn.x-btn-focus .x-btn-wrap, .x-btn.x-btn-pressed .x-btn-wrap, .x-btn:active .x-btn-wrap,
.x-btn:hover td, .x-btn.x-btn-over td, .x-btn.x-btn-focus td, .x-btn.x-btn-pressed td, .x-btn:active td,
.x-btn:hover .x-btn-mc, .x-btn.x-btn-over .x-btn-mc, .x-btn.x-btn-focus .x-btn-mc, .x-btn.x-btn-pressed .x-btn-mc, .x-btn:active .x-btn-mc,
.x-btn:hover .x-btn-tl, .x-btn.x-btn-over .x-btn-tl, .x-btn.x-btn-focus .x-btn-tl, .x-btn.x-btn-pressed .x-btn-tl, .x-btn:active .x-btn-tl,
.x-btn:hover .x-btn-tr, .x-btn.x-btn-over .x-btn-tr, .x-btn.x-btn-focus .x-btn-tr, .x-btn.x-btn-pressed .x-btn-tr, .x-btn:active .x-btn-tr,
.x-btn:hover .x-btn-bl, .x-btn.x-btn-over .x-btn-bl, .x-btn.x-btn-focus .x-btn-bl, .x-btn.x-btn-pressed .x-btn-bl, .x-btn:active .x-btn-bl,
.x-btn:hover .x-btn-br, .x-btn.x-btn-over .x-btn-br, .x-btn.x-btn-focus .x-btn-br, .x-btn.x-btn-pressed .x-btn-br, .x-btn:active .x-btn-br,
.x-btn:hover .x-btn-ml, .x-btn.x-btn-over .x-btn-ml, .x-btn.x-btn-focus .x-btn-ml, .x-btn.x-btn-pressed .x-btn-ml, .x-btn:active .x-btn-ml,
.x-btn:hover .x-btn-mr, .x-btn.x-btn-over .x-btn-mr, .x-btn.x-btn-focus .x-btn-mr, .x-btn.x-btn-pressed .x-btn-mr, .x-btn:active .x-btn-mr,
.x-btn:hover .x-btn-tc, .x-btn.x-btn-over .x-btn-tc, .x-btn.x-btn-focus .x-btn-tc, .x-btn.x-btn-pressed .x-btn-tc, .x-btn:active .x-btn-tc,
.x-btn:hover .x-btn-bc, .x-btn.x-btn-over .x-btn-bc, .x-btn.x-btn-focus .x-btn-bc, .x-btn.x-btn-pressed .x-btn-bc, .x-btn:active .x-btn-bc,
.x-btn:hover .x-frame-mc, .x-btn.x-btn-over .x-frame-mc, .x-btn.x-btn-focus .x-frame-mc, .x-btn.x-btn-pressed .x-frame-mc, .x-btn:active .x-frame-mc,
.x-btn:hover .x-frame-tl, .x-btn.x-btn-over .x-frame-tl, .x-btn.x-btn-focus .x-frame-tl, .x-btn.x-btn-pressed .x-frame-tl, .x-btn:active .x-frame-tl,
.x-btn:hover .x-frame-tr, .x-btn.x-btn-over .x-frame-tr, .x-btn.x-btn-focus .x-frame-tr, .x-btn.x-btn-pressed .x-frame-tr, .x-btn:active .x-frame-tr,
.x-btn:hover .x-frame-ml, .x-btn.x-btn-over .x-frame-ml, .x-btn.x-btn-focus .x-frame-ml, .x-btn.x-btn-pressed .x-frame-ml, .x-btn:active .x-frame-ml,
.x-btn:hover .x-frame-mr, .x-btn.x-btn-over .x-frame-mr, .x-btn.x-btn-focus .x-frame-mr, .x-btn.x-btn-pressed .x-frame-mr, .x-btn:active .x-frame-mr,
.x-btn:hover .x-frame-bl, .x-btn.x-btn-over .x-frame-bl, .x-btn.x-btn-focus .x-frame-bl, .x-btn.x-btn-pressed .x-frame-bl, .x-btn:active .x-frame-bl,
.x-btn:hover .x-frame-br, .x-btn.x-btn-over .x-frame-br, .x-btn.x-btn-focus .x-frame-br, .x-btn.x-btn-pressed .x-frame-br, .x-btn:active .x-frame-br {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    filter: none !important;
    box-shadow: none !important;
}

/* ---- B. 交互态文字颜色(覆盖 .x-btn-inner) ----
   排除日期/年月弹窗内的按钮(它们有自己的蓝色文字规则) */
.x-btn:not(.x-datepicker *):not(.x-monthpicker *):hover .x-btn-inner,
.x-btn:not(.x-datepicker *):not(.x-monthpicker *).x-btn-over .x-btn-inner,
.x-btn:not(.x-datepicker *):not(.x-monthpicker *).x-btn-focus .x-btn-inner,
.x-btn:not(.x-datepicker *):not(.x-monthpicker *).x-btn-pressed .x-btn-inner,
.x-btn:not(.x-datepicker *):not(.x-monthpicker *):active .x-btn-inner {
    color: #cf1322 !important;
}

/* ---- C. 去除按钮聚焦/按下后的虚框(含按钮内部任何可聚焦元素) ---- */
.x-btn:focus,
.x-btn:focus-visible,
.x-btn.x-btn-focus,
.x-btn *:focus,
.x-btn *:focus-visible,
.x-btn .x-btn-button:focus,
.x-btn .x-btn-button:focus-visible,
.x-btn .x-btn-wrap:focus,
.x-btn .x-btn-wrap:focus-visible,
.x-btn .x-btn-inner:focus,
.x-btn .x-btn-inner:focus-visible,
.x-btn button:focus,
.x-btn button:focus-visible,
.x-btn a:focus,
.x-btn a:focus-visible {
    outline: none !important;
    outline-offset: 0 !important;
    box-shadow: 0 1px 2px rgba(207, 19, 34, 0.08) !important;
}

/* ---- C2. 无条件禁用按钮及内部所有元素的 outline ----
   ExtJS 主题在 .x-btn-focus 时会给内层(.x-btn-inner 等)画 1px 虚线框,
   该样式来自 ext-all.css,不属于 :focus/:focus-visible 伪类,
   因此 C 段的焦点选择器盖不住。这里无条件清除,彻底杜绝虚框。 */
.x-btn,
.x-btn * {
    outline: none !important;
    outline-offset: 0 !important;
}

/* ---- D. btn-return 交互态图标变红 ----
   btn-return 正常态保持蓝底白箭头(自带设计);
   hover/over/focus/pressed 时外层由 A 段统一为淡红底,
   此处把白色箭头同步变红,保证图标在淡红底上可见。 */
.x-btn.btn-return:hover .x-btn-inner::before,
.x-btn.btn-return.x-btn-over .x-btn-inner::before,
.x-btn.btn-return.x-btn-focus .x-btn-inner::before,
.x-btn.btn-return.x-btn-pressed .x-btn-inner::before,
.x-btn.btn-return:active .x-btn-inner::before {
    color: #cf1322 !important;
}

/* ============================================================
   可访问性：尊重用户的减少动效偏好（stoneerp-theme-migration 规范）
   仅兜底关闭动画/过渡，不影响布局与既有设计意图（ExtJS 已刻意管理焦点态）
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}



/* ============================================================
   十九、TUniDateTimePicker 日期/年月/时间弹窗 (Ant Design 蓝)
   来源：从 timepicker-ant.css 合并，覆盖之前所有 datepicker/monthpicker 规则
   - 日期弹窗：扁平白底、上下箭头翻页、选中蓝底白字、非当月日期浅灰
   - 年月弹窗：年份左(100px)+月份右(110px)、240x311px、取消左确定右
   - 时间弹窗：时/分/秒三列等分、蓝底白字选中
   ============================================================ */

.x-datepicker,
.x-date-picker {
    width: 240px !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 4px !important;
    background: #fff !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15) !important;
    color: #262626 !important;
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
    overflow: hidden !important;
}
.x-datepicker-header {
    position: relative !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    padding: 10px 70px 10px 12px !important;
    border-bottom: 1px solid #f0f0f0 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    background: #fff !important;
    background-image: none !important;
    color: #262626 !important;
}
/* 强制盖掉 ExtJS 可能加在标题栏上的浅蓝/渐变底 */
.x-datepicker .x-datepicker-header,
.x-date-picker .x-datepicker-header {
    background: #fff !important;
    background-image: none !important;
}

/* 月份标题居左，保持下拉三角，白底下可见 */
.x-datepicker-month {
    color: #262626 !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    cursor: pointer !important;
}
.x-datepicker-month .x-btn-inner,
.x-datepicker-month .x-btn-button,
.x-datepicker-month .x-btn-icon-el {
    color: #262626 !important;
    font-weight: 700 !important;
    background: none !important;
    background-image: none !important;
}
/* 月份下拉三角改为深色，白底下可见 */
.x-datepicker-month .x-btn-icon-el.x-datepicker-month-icon::before {
    color: #8c8c8c !important;
}

/* 标题栏"年月"按钮(button-1009)：强制无边框、无背景、紧凑 padding，所有交互态保持一致（防闪烁）。
   真实 DOM: .x-datepicker-header > .x-datepicker-month > a.x-btn#button-1009 */
.x-datepicker-header .x-btn,
.x-datepicker-header .x-btn.x-btn-over,
.x-datepicker-header .x-btn:hover,
.x-datepicker-header .x-btn.x-btn-focus,
.x-datepicker-header .x-btn.x-btn-pressed,
.x-datepicker-header .x-btn:active,
.x-datepicker-month,
.x-datepicker-month.x-btn-over,
.x-datepicker-month:hover,
.x-datepicker-month.x-btn-focus,
.x-datepicker-month.x-btn-pressed,
.x-datepicker-month:active {
    background: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* 顶部翻页箭头改为上下箭头，竖排放在右上角（与 HTML 原生 datetime 弹窗右上角布局一致） */
.x-datepicker-prev,
.x-datepicker-next {
    position: absolute !important;
    top: 6px !important;
    left: auto !important;
    width: 24px !important;
    height: 24px !important;
    line-height: 24px !important;
    text-align: center !important;
    background: transparent !important;
    background-image: none !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    cursor: pointer !important;
    overflow: visible !important;
    z-index: 3 !important;
}
/* 两个按钮竖排靠右：prev(↑) 在上，next(↓) 在下 */
.x-datepicker-prev { right: 30px !important; }
.x-datepicker-next { right: 6px !important; }

/* 确保上/下月按钮整体可见（盖掉 ExtJS 可能的 disabled/opacity 态） */
.x-datepicker-prev,
.x-datepicker-next,
.x-datepicker-prev.x-btn-disabled,
.x-datepicker-next.x-btn-disabled,
.x-datepicker-prev.x-datepicker-prev-disabled,
.x-datepicker-next.x-datepicker-next-disabled {
    opacity: 1 !important;
    visibility: visible !important;
    filter: none !important;
    -webkit-filter: none !important;
}

/* 隐藏 ExtJS 默认图标（背景图或字体图标），并清掉可能挡住伪元素的尺寸 */
.x-datepicker-prev .x-btn-icon-el,
.x-datepicker-next .x-btn-icon-el,
.x-datepicker-prev .x-btn-inner,
.x-datepicker-next .x-btn-inner,
.x-datepicker-prev .x-btn-button,
.x-datepicker-next .x-btn-button {
    background: none !important;
    background-image: none !important;
    font-size: 0 !important;
    color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* 关键：在按钮容器自身用 ::after 注入 ↑ ↓ 字符。
   容器是空 div（手形指针可见说明它存在且可定位），
   直接用伪元素渲染文本，绕开内部 .x-btn-icon-el 可能不显示文本的问题。 */
.x-datepicker-prev::after,
.x-datepicker-next::after {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: 100% !important;
    line-height: 24px !important;
    text-align: center !important;
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #262626 !important;
    background: transparent !important;
    pointer-events: none !important;
    z-index: 2 !important;
}
.x-datepicker-prev::after { content: '\2191' !important; }
.x-datepicker-next::after { content: '\2193' !important; }

/* 即使按钮处于 disabled 态，也让 ↑ ↓ 可见（仅降低对比度，不隐藏） */
.x-datepicker-prev.x-btn-disabled::after,
.x-datepicker-next.x-btn-disabled::after,
.x-datepicker-prev.x-datepicker-prev-disabled::after,
.x-datepicker-next.x-datepicker-next-disabled::after {
    color: #bfbfbf !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* hover 时变蓝 */
.x-datepicker-prev:hover::after,
.x-datepicker-next:hover::after {
    color: #1890ff !important;
}
.x-datepicker th {
    color: #8c8c8c !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    padding: 6px 0 !important;
    border-bottom: 1px solid #f0f0f0 !important;
    background: #fff !important;
    background-image: none !important;
}
/* ---------- 日期单元格（uniGUI 实际 DOM: td > div.x-datepicker-date）---------- */
.x-datepicker td {
    width: 32px !important;
    height: 32px !important;
    text-align: center !important;
    cursor: pointer !important;
    padding: 0 !important;
    border: 0 !important;
}
.x-datepicker td .x-datepicker-date {
    display: inline-block !important;
    width: 28px !important;
    height: 28px !important;
    line-height: 28px !important;
    border-radius: 4px !important;
    color: #262626 !important;
    font-size: 14px !important;
    text-decoration: none !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
}
.x-datepicker td:hover .x-datepicker-date { background: #f5f5f5 !important; }

/* 非当月日期（上月末尾/下月开头）：浅灰色字体（类原生 datetime 弹窗） */
.x-datepicker td.x-datepicker-prevday .x-datepicker-date,
.x-datepicker td.x-datepicker-nextday .x-datepicker-date,
body .x-datepicker td.x-datepicker-prevday .x-datepicker-date,
body .x-datepicker td.x-datepicker-nextday .x-datepicker-date {
    color: #bfbfbf !important;
}
.x-datepicker td.x-datepicker-prevday:hover .x-datepicker-date,
.x-datepicker td.x-datepicker-nextday:hover .x-datepicker-date {
    background: #f5f5f5 !important;
}

/* “今天”日期：浅蓝底 + 蓝边框 */
.x-datepicker td.x-datepicker-today .x-datepicker-date,
.x-datepicker .x-datepicker-today .x-datepicker-date,
body .x-datepicker td.x-datepicker-today .x-datepicker-date {
    background: #e6f7ff !important;
    border: 1px solid #1890ff !important;
    color: #1890ff !important;
    font-weight: 500 !important;
}

/* ---------- 普通当月日期（可点击的当前月日期，非选中，非今天） ----------
   ExtJS 给这些 td 加 x-active/x-datepicker-active，只应恢复默认黑字透明底，
   绝不能把它们当成“选中”染成蓝色。 */
.x-datepicker td.x-active .x-datepicker-date,
.x-datepicker td.x-datepicker-active .x-datepicker-date,
.x-datepicker td.x-datepicker-date-active .x-datepicker-date,
body .x-datepicker td.x-active .x-datepicker-date,
body .x-datepicker td.x-datepicker-active .x-datepicker-date,
body .x-datepicker td.x-datepicker-date-active .x-datepicker-date {
    background: transparent !important;
    color: #262626 !important;
    border: 1px solid transparent !important;
    font-weight: 400 !important;
}
.x-datepicker td.x-active:hover .x-datepicker-date,
.x-datepicker td.x-datepicker-active:hover .x-datepicker-date,
.x-datepicker td.x-datepicker-date-active:hover .x-datepicker-date {
    background: #f5f5f5 !important;
    color: #262626 !important;
}

/* 选中日期：深蓝实心方块 + 白字（只认真正的选中类） */
.x-datepicker td.x-datepicker-selected .x-datepicker-date,
.x-datepicker .x-datepicker-selected .x-datepicker-date,
body .x-datepicker td.x-datepicker-selected .x-datepicker-date {
    background: #1890ff !important;
    color: #fff !important;
    font-weight: 700 !important;
    border-radius: 2px !important;
    border: 1px solid #1890ff !important;
    width: 30px !important;
    height: 30px !important;
    line-height: 30px !important;
    box-sizing: border-box !important;
}

/* 同时是“今天”又是“选中”时，以选中态为准 */
.x-datepicker td.x-datepicker-today.x-datepicker-selected .x-datepicker-date,
body .x-datepicker td.x-datepicker-today.x-datepicker-selected .x-datepicker-date {
    background: #1890ff !important;
    border: 1px solid #1890ff !important;
    color: #fff !important;
}

/* ============================================================
   年月弹窗（.x-monthpicker）对齐原生 datetime 选择器
   - 年份放左，月份放右
   - 月份完整显示 2 列（不被裁切）
   - 高度由内容决定（消除年份下方空白）
   - 确定/取消按钮：取消左、确定右（蓝色文字按钮）
   ============================================================ */

/* 面板：强制覆盖 ExtJS 内联 width/height。
   权重用 div.x-monthpicker.x-layer 高于属性样式。 */
.x-monthpicker.x-layer.x-border-box,
body .x-monthpicker.x-layer.x-border-box,
div.x-monthpicker.x-layer,
div.x-monthpicker {
    width: 240px !important;
    min-width: 240px !important;
    max-width: 240px !important;
    height: 311px !important;           /* 与日期弹窗同高 */
    min-height: 311px !important;
    max-height: 311px !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 4px !important;
    background: #fff !important;
    background-image: none !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15) !important;
    overflow: visible !important;        /* 关键：避免裁切 months 第二列 */
    box-sizing: border-box !important;
    /* 注意：此处不能设 display:flex !important，否则会覆盖 ExtJS 关闭弹窗时的
       display:none，导致点确定后弹窗关不掉、残留在界面上（按钮失效）。 */
}

/* 身体：flex-wrap 布局，years+months 同行；buttons 绝对定位贴底（不参与 flex）。
   注意：年月弹窗无独立 header（真实 DOM 确认），年份导航在 years 列内的 .x-monthpicker-yearnav。
   此处不能写 .x-monthpicker .x-btn-inner{color:#262626}，否则会把底部确定/取消按钮染黑、
   与下方蓝色按钮规则冲突。 */
.x-monthpicker .x-monthpicker-body {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    align-content: flex-start !important; /* years/months 顶部；buttons 用绝对定位贴底 */
    padding: 10px !important;
    padding-bottom: 52px !important;       /* 底部留出按钮区高度（40px按钮 + 上下间距） */
    background: #fff !important;
    background-image: none !important;
    overflow: visible !important;
    position: relative !important;         /* 成为绝对定位参照：buttons bottom:0 相对 body */
    height: 100% !important;               /* body 撑满整个 311px 面板 */
    min-height: 100% !important;
    max-height: 100% !important;
    box-sizing: border-box !important;
}

/* 年份列（flex 子项 100px，右侧带分隔线） */
.x-monthpicker .x-monthpicker-years {
    float: none !important;
    flex: 0 0 100px !important;
    order: 0 !important;               /* 年份 → 左 */
    width: 100px !important;
    min-width: 100px !important;
    max-width: 100px !important;
    height: auto !important;
    overflow: visible !important;
    box-sizing: border-box !important;
    border-right: 1px solid #f0f0f0 !important;  /* 分隔线在年份右缘（年月中间） */
    padding-right: 8px !important;
    background: #fff !important;
    background-image: none !important;
}
/* 月份列（flex 子项 90px，内部再 flex-wrap 成 2 列）
   100 + 1border + 8padding + 90 = 199 ≤ 200(220-2×10) */
.x-monthpicker .x-monthpicker-months {
    float: none !important;
    flex: 0 0 110px !important;
    order: 1 !important;               /* 月份 → 右 */
    width: 110px !important;
    min-width: 110px !important;
    max-width: 110px !important;
    margin-left: 8px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    border-left: none !important;      /* 分隔线已移到年份右缘 */
    border-right: none !important;     /* 去掉 ExtJS 默认右竖线，加大可用宽度 */
    box-sizing: border-box !important;
    background: #fff !important;
    background-image: none !important;
    height: auto !important;
    overflow: visible !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-content: flex-start !important;
}

/* 年份导航箭头容器（顶部两个箭头左右分布） */
.x-monthpicker .x-monthpicker-yearnav {
    height: 18px !important;
    overflow: hidden !important;
    margin-bottom: 4px !important;
}
.x-monthpicker .x-monthpicker-yearnav-button-ct {
    float: left !important;
    width: 50% !important;
    text-align: center !important;
}

/* 年月项：真实 DOM 为 div.x-monthpicker-item > a.x-monthpicker-item-inner（无 td） */
.x-monthpicker .x-monthpicker-item {
    float: left !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: normal !important;
    box-sizing: border-box !important;
}
.x-monthpicker .x-monthpicker-months .x-monthpicker-item {
    width: 50% !important;           /* 月份 2 列 */
    min-width: 50% !important;
    max-width: 50% !important;
    flex: 0 0 50% !important;
    float: left !important;
}
.x-monthpicker .x-monthpicker-years .x-monthpicker-item {
    width: 50% !important;           /* 年份 2 列 */
    min-width: 50% !important;
    max-width: 50% !important;
    float: left !important;
}
.x-monthpicker .x-monthpicker-item-inner {
    display: block !important;
    margin: 2px 4px !important;
    padding: 6px 0 !important;
    text-align: center !important;
    color: #262626 !important;
    font-size: 13px !important;
    border-radius: 2px !important;
    text-decoration: none !important;
    cursor: pointer !important;
    background: transparent !important;
    background-image: none !important;
}
.x-monthpicker .x-monthpicker-item-inner:hover {
    background: #e6f7ff !important;
    color: #1890ff !important;
}
/* 选中态：真实结构 a.x-monthpicker-item-inner.x-monthpicker-selected
   （同时保留 td 版本兼容其它 ExtJS 版本） */
.x-monthpicker .x-monthpicker-item-inner.x-monthpicker-selected,
.x-monthpicker .x-monthpicker-item-inner.x-yearpicker-selected,
.x-monthpicker td.x-monthpicker-selected a,
.x-monthpicker td.x-yearpicker-selected a {
    background: #1890ff !important;
    color: #fff !important;
    font-weight: 700 !important;
    border-radius: 2px !important;
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 6px 0 !important;
    margin: 2px 0 !important;
}
/* 清除浮动（DOM 内已含 .x-clear，这里再保险） */
.x-monthpicker .x-clear {
    clear: both !important;
    font-size: 0 !important;
    line-height: 0 !important;
    height: 0 !important;
}

/* ---------- 年月弹窗底部按钮：取消在左，确定在右（蓝色文字按钮） ----------
   真实 DOM：.x-monthpicker-buttons 内含 确定(button-1013) + 取消(button-1014)
   DOM 顺序 确定在前、取消在后，row-reverse 反转 → 视觉：取消左、确定右 */
.x-monthpicker .x-monthpicker-buttons,
.x-monthpicker-buttons,
body .x-monthpicker-buttons {
    /* 绝对定位贴到弹窗底部，不依赖弹窗本身 flex（避免覆盖 ExtJS 的 display:none 隐藏） */
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: auto !important;
    flex: none !important;
    order: 0 !important;
    display: flex !important;
    flex-direction: row-reverse !important; /* DOM[确定,取消] → 视觉[取消,确定] */
    justify-content: space-between !important;
    align-items: center !important;
    padding: 8px 12px !important;
    background: #fff !important;
    background-image: none !important;
    border-top: 1px solid #f0f0f0 !important;
    box-sizing: border-box !important;
    clear: none !important;
    min-height: 40px !important;
    margin-top: 0 !important;
}
.x-monthpicker .x-monthpicker-buttons .x-btn,
.x-monthpicker-buttons .x-btn,
.x-monthpicker .x-monthpicker-buttons .x-btn.x-btn-over,
.x-monthpicker-buttons .x-btn.x-btn-over,
.x-monthpicker .x-monthpicker-buttons .x-btn:hover,
.x-monthpicker-buttons .x-btn:hover,
.x-monthpicker .x-monthpicker-buttons .x-btn.x-btn-focus,
.x-monthpicker-buttons .x-btn.x-btn-focus,
.x-monthpicker .x-monthpicker-buttons .x-btn.x-btn-pressed,
.x-monthpicker-buttons .x-btn.x-btn-pressed,
.x-monthpicker .x-monthpicker-buttons .x-btn:active,
.x-monthpicker-buttons .x-btn:active {
    background: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 4px 0 !important;
    margin: 0 !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    position: static !important;
    color: #1890ff !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
}
.x-monthpicker .x-monthpicker-buttons .x-btn .x-btn-inner,
.x-monthpicker-buttons .x-btn .x-btn-inner {
    color: #1890ff !important;
    font-size: 14px !important;
    font-weight: 400 !important;
}
.x-monthpicker .x-monthpicker-buttons .x-btn:hover,
.x-monthpicker-buttons .x-btn:hover,
.x-monthpicker .x-monthpicker-buttons .x-btn:hover .x-btn-inner,
.x-monthpicker-buttons .x-btn:hover .x-btn-inner {
    color: #40a9ff !important;
}


/* ---------- 底部"今天"按钮面板：白底 + 右侧蓝色文字按钮 + 左侧"清除"按钮 ---------- */
.x-datepicker-footer,
.x-date-picker .x-datepicker-footer,
.x-datepicker .x-datepicker-footer,
.x-datepicker-buttons,
.x-date-picker .x-datepicker-buttons {
    background: #fff !important;
    background-image: none !important;
    border-top: 1px solid #f0f0f0 !important;
    padding: 8px 12px !important;
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    box-sizing: border-box !important;
    min-height: 40px !important;
}
/* 左侧伪元素“清除”文字按钮 */
.x-datepicker-footer::before,
.x-datepicker-buttons::before {
    content: '清除' !important;
    margin-right: auto !important;
    padding: 4px 0 !important;
    color: #1890ff !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
    cursor: pointer !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
.x-datepicker-footer:hover::before,
.x-datepicker-buttons:hover::before {
    color: #40a9ff !important;
}
/* "今天"按钮改为蓝色文字按钮 */
.x-datepicker-footer .x-btn,
.x-datepicker-buttons .x-btn,
.x-datepicker-footer .x-btn.x-btn-default-small,
.x-datepicker-buttons .x-btn.x-btn-default-small,
.x-datepicker-footer .x-btn.x-btn-default-medium,
.x-datepicker-buttons .x-btn.x-btn-default-medium,
.x-datepicker-footer .x-btn.x-btn-over,
.x-datepicker-buttons .x-btn.x-btn-over,
.x-datepicker-footer .x-btn:hover,
.x-datepicker-buttons .x-btn:hover,
.x-datepicker-footer .x-btn.x-btn-focus,
.x-datepicker-buttons .x-btn.x-btn-focus,
.x-datepicker-footer .x-btn.x-btn-pressed,
.x-datepicker-buttons .x-btn.x-btn-pressed,
.x-datepicker-footer .x-btn:active,
.x-datepicker-buttons .x-btn:active {
    background: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 4px 0 !important;
    margin: 0 !important;
}
.x-datepicker-footer .x-btn .x-btn-inner,
.x-datepicker-buttons .x-btn .x-btn-inner,
.x-datepicker-footer .x-btn .x-btn-button .x-btn-inner,
.x-datepicker-buttons .x-btn .x-btn-button .x-btn-inner {
    color: #1890ff !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
}
.x-datepicker-footer .x-btn:hover .x-btn-inner,
.x-datepicker-buttons .x-btn:hover .x-btn-inner {
    color: #40a9ff !important;
}

/* ============================================================
   D5、时间选择弹窗  Ant 蓝（本次改动核心，生产环境也用这段）
   ============================================================ */

/* 浮层外壳：强制盖掉 ExtJS 默认深蓝渐变 / 圆角 / 阴影 */
.x-layer.x-timepicker,
.x-layer .x-timepicker,
.x-timepicker,
.x-time-picker,
.x-datepicker-time,
.x-boundlist.x-timepicker,
.x-boundlist.x-time-picker {
    background: #fff !important;
    background-image: none !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 4px !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15) !important;
    color: #262626 !important;
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}
/* uniGUI 1.90 时间浮层多包一层 .x-css-shadow / .x-resizable，统一压掉 */
.x-css-shadow,
.x-resizable.x-timepicker {
    background: #fff !important;
    background-image: none !important;
    border-radius: 4px !important;
}

/* 时/分/秒 三列等分 */
.x-time-picker .x-time-picker-list,
.x-timepicker .x-timepicker-list,
.x-datepicker-time .x-time-list,
.x-boundlist .x-timepicker-list,
.x-boundlist .x-time-picker-list {
    display: inline-block !important;
    width: 33.333% !important;
    max-height: 200px !important;
    margin: 0 !important;
    padding: 4px 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    vertical-align: top !important;
    list-style: none !important;
    text-align: center !important;
    box-sizing: border-box !important;
    border-right: 1px solid #f0f0f0 !important;
}
.x-time-picker .x-time-picker-list:last-child,
.x-timepicker .x-timepicker-list:last-child,
.x-datepicker-time .x-time-list:last-child {
    border-right: 0 !important;
}

/* 滚动条：淡灰细条（类原生弹窗） */
.x-time-picker .x-time-picker-list::-webkit-scrollbar,
.x-timepicker .x-timepicker-list::-webkit-scrollbar,
.x-datepicker-time .x-time-list::-webkit-scrollbar {
    width: 6px !important;
}
.x-time-picker .x-time-picker-list::-webkit-scrollbar-thumb,
.x-timepicker .x-timepicker-list::-webkit-scrollbar-thumb,
.x-datepicker-time .x-time-list::-webkit-scrollbar-thumb {
    background: #d9d9d9 !important;
    border-radius: 3px !important;
}
.x-time-picker .x-time-picker-list::-webkit-scrollbar-track,
.x-timepicker .x-timepicker-list::-webkit-scrollbar-track,
.x-datepicker-time .x-time-list::-webkit-scrollbar-track {
    background: #f5f5f5 !important;
}

/* 时间单元 */
.x-time-picker li,
.x-timepicker li,
.x-datepicker-time li,
.x-boundlist li,
.x-time-picker .x-time-picker-item,
.x-timepicker .x-timepicker-item {
    height: 32px !important;
    padding: 0 !important;
    margin: 0 !important;
    color: #262626 !important;
    font-size: 14px !important;
    line-height: 32px !important;
    text-align: center !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
    border: 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
}

/* hover：浅蓝底 + 蓝字（类原生高亮态） */
.x-time-picker li:hover,
.x-timepicker li:hover,
.x-datepicker-time li:hover,
.x-boundlist li:hover,
.x-time-picker .x-time-picker-item:hover,
.x-timepicker .x-timepicker-item:hover {
    background: #e6f7ff !important;
    color: #1890ff !important;
}

/* 选中：蓝底白字（原生高亮选中态对应） */
.x-time-picker li.x-selected,
.x-timepicker li.x-selected,
.x-datepicker-time li.x-selected,
.x-boundlist li.x-selected,
.x-time-picker .x-time-picker-item-selected,
.x-timepicker .x-timepicker-item-selected,
.x-time-picker li.x-timepicker-item-selected,
.x-timepicker li.x-timepicker-item-selected {
    background: #1890ff !important;
    color: #fff !important;
    font-weight: 500 !important;
}

/* 禁用 */
.x-time-picker li.x-disabled,
.x-timepicker li.x-disabled,
.x-datepicker-time li.x-disabled,
.x-boundlist li.x-disabled,
.x-time-picker .x-time-picker-item-disabled,
.x-timepicker .x-timepicker-item-disabled {
    color: #bfbfbf !important;
    cursor: not-allowed !important;
    background: transparent !important;
}

/* 底部 确定/取消（若 uniGUI 渲染 footer） */
.x-time-picker-footer,
.x-timepicker-footer,
.x-datepicker-time-footer {
    min-height: 36px !important;
    padding: 8px 12px !important;
    border-top: 1px solid #f0f0f0 !important;
    text-align: right !important;
    background: #fff !important;
    background-image: none !important;
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 8px !important;
    box-sizing: border-box !important;
}