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


/* ============================================================
   一、CSS变量定义
   ============================================================ */
:root {
    /* 主色调 */
    --primary-color: #2196F3;
    --primary-dark: #1976D2;
    --primary-light: #64B5F6;
    --accent-color: #FF4081;

    /* 语义色 */
    --success-color: #4CAF50;
    --warning-color: #FF9800;
    --danger-color: #F44336;
    --info-color: #2196F3;

    /* 灰度 */
    --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 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    --shadow-md: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
    --shadow-lg: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);

    /* 过渡 */
    --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(76, 175, 80, 0.95);
    --toast-bg-warning: rgba(255, 152, 0, 0.95);
    --toast-bg-error: rgba(244, 67, 54, 0.95);
    --toast-bg-info: rgba(33, 150, 243, 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: #69b9ff;
    --focus-shadow: 0 0 0 1px rgba(105, 185, 255, 0.15);

    /* ---- 新增: 现代化ERP配色 ---- */
    --zq-primary: #1890ff;
    --zq-primary-hover: #40a9ff;
    --zq-primary-active: #096dd9;
    --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: #722ed1;
    --zq-purple-hover: #9254de;
    --zq-purple-active: #531dab;
    --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: #e6f7ff;
    --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;
}


/* ============================================================
   二、全局样式重置
   ============================================================ */
	
/* 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 #40a9ff !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;
}




/* 移除所有按钮的focus虚框 */
button:focus,
button:active,
input:focus,
input:active,
select:focus,
select:active,
textarea:focus,
textarea:active,
a:focus,
a:active {
    outline: none !important;
    box-shadow: none !important;
}
/* 移除所有按钮的focus虚框 */
.x-btn:focus,
.x-btn:active,
.x-btn.x-btn-focus,
.x-btn-inner:focus,
.x-btn-button:focus,
.x-btn-wrap:focus,
.x-btn .x-btn-inner:focus,
.x-btn .x-btn-button:focus,
.x-btn .x-btn-wrap:focus,
.x-btn.x-btn-focus,
.x-btn .x-btn-inner:focus,
.x-btn .x-btn-button:focus,
.x-btn .x-btn-wrap:focus {
    outline: none !important;
    outline-offset: 0 !important;
    box-shadow: none !important;
    border: none !important;
}
/* 强制移除focus-ring */
.x-btn,
.x-btn *,
.x-btn * {
    outline: none !important;
    -webkit-tap-highlight-color: transparent !important;
}


/* ============================================================
   三、全局文字与辅助颜色类
   ============================================================ */
.text-blue { color: #2196F3; }
.text-green { color: #4CAF50; }
.text-purple { color: #9C27B0; }
.text-red { color: #F44336; }
.text-orange { color: #FF9800; }
.text-indigo { color: #3F51B5; }
.text-teal { color: #009688; }
.text-gray { color: #757575; }


/* ============================================================
   三、遮罩层
   ============================================================ */
.x-mask {
    background-color: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    display: none !important;
}


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


/* --- 1. 单据号样式 --- */
/* ========== 单据号样式（强制蓝色，带下划线） ========== */
.x-grid-cell .bill-no,
.x-grid-cell-inner .bill-no,
.bill-no {
    color: #1890ff !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: #40a9ff !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;
}

.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: linear-gradient(135deg, #d9d9d9 0%, #bfbfbf 100%) !important;
    color: #434343 !important;
    border: 1px solid #8c8c8c !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: linear-gradient(135deg, #95de64 0%, #52c41a 100%) !important;
    color: #fff !important;
    border: 1px solid #389e0d !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: linear-gradient(135deg, #ff7875 0%, #ff4d4f 100%) !important;
    color: #fff !important;
    border: 1px solid #cf1322 !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: linear-gradient(135deg, #69c0ff 0%, #1890ff 100%) !important;
    color: #fff !important;
    border: 1px solid #096dd9 !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: linear-gradient(135deg, #ffc067 0%, #fa8c16 100%) !important;
    color: #fff !important;
    border: 1px solid #d46b08 !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: linear-gradient(135deg, #36cfc9 0%, #13c2c2 100%) !important;
    color: #fff !important;
    border: 1px solid #08979c !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: linear-gradient(135deg, #8c8c8c 0%, #595959 100%) !important;
    color: #fff !important;
    border: 1px solid #262626 !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: linear-gradient(135deg, #95de64 0%, #52c41a 100%) !important;
    color: #fff !important;
    border: 1px solid #389e0d !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: linear-gradient(135deg, #ff7875 0%, #ff4d4f 100%) !important;
    color: #fff !important;
    border: 1px solid #cf1322 !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: #1890ff !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: #ffffff;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    color: #666666;
    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: #f5f5f5;
    border-color: #1890ff;
    color: #1890ff;
}
.x-toolbar .x-btn-pressed {
    background: #1890ff;
    border-color: #1890ff;
    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 #1890ff !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;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08) !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: 16px !important;
    margin-bottom: 20px !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 #1890ff !important;
    background: linear-gradient(to right, rgba(24, 144, 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 {
    box-shadow: 0 8px 6px -6px gray !important;
    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;
    box-shadow: rgb(100, 100, 100) 2px 1px 5px;
    margin: 5px 20px;
    width: 500px;
}


/* swal确认按钮 */
.swal2-confirm {
    border-right-color: rgb(188, 18, 38) !important;
    background-color: rgb(188, 18, 38) !important;
}

/* 取消阴影 */
.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(0,128,253)!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(0,128,253)!important;
}

.mainmenu .x-treelist-nav .x-treelist-row-over {
    background: rgb(0,128,253)!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(0,128,253)!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(0,128,253)!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 #457eff !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: #457eff !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: #3165c0 !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: #3165c0 !important;
    transform: none !important;
    top: auto !important;
    left: auto !important;
}

.btnApproveNode:focus,
.btnApproveNode.x-btn-focus {
    background-color: #f8f9fa !important;
    border-color: #457eff !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: #204090 !important;
    box-shadow: none !important;
    height: 30px !important;
}
.btnApproveNode:active .x-btn-inner,
.btnApproveNode.x-btn-pressed .x-btn-inner {
    color: #204090 !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;
}
.btnApproval .x-btn-inner { color: white!important; font-size: 12px !important; text-align: center !important; }
.btnApproval .x-btn-button { background: -webkit-linear-gradient(top,#d53939,#b92929)!important; }
.btnApproval:hover, .btnApproval:focus, .btnApproval: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,#d53939,#b92929)!important;
    background-image: -webkit-linear-gradient(top,#d53939,#b92929)!important;
}


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

/* 返回按钮 - 蓝色字体、白色背景、无边框 */
.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 {
    background: #fff !important;
    background-color: #fff !important;
    border: none !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    cursor: pointer !important;
    outline: none !important;
    box-shadow: none !important;
}

/* 基础字体颜色 - 使用多层选择器确保优先级 */
.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: #1890ff !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    text-align: center !important;
}

/* 悬停状态 - 字体颜色保持蓝色 (覆盖全局 .x-btn:hover .x-btn-inner { color: inherit }) */
.btn-return:hover,
.btn-return.x-btn-over,
.btn-return.x-btn:hover {
    background: #fff !important;
    background-color: #fff !important;
    border: none !important;
}

.btn-return:hover .x-btn-inner,
.btn-return.x-btn-over .x-btn-inner,
.btn-return:hover .x-btn-button .x-btn-inner,
.btn-return.x-btn-over .x-btn-button .x-btn-inner,
.x-btn.btn-return:hover .x-btn-inner,
.x-btn.btn-return.x-btn-over .x-btn-inner {
    color: #1890ff !important;
}

/* 按下状态 - 字体颜色保持蓝色 (覆盖全局 .x-btn:active .x-btn-inner { color: inherit }) */
.btn-return:active,
.btn-return.x-btn-pressed,
.btn-return.x-btn:active {
    background: #fff !important;
    background-color: #fff !important;
    border: none !important;
}

.btn-return:active .x-btn-inner,
.btn-return.x-btn-pressed .x-btn-inner,
.btn-return:active .x-btn-button .x-btn-inner,
.btn-return.x-btn-pressed .x-btn-button .x-btn-inner,
.x-btn.btn-return:active .x-btn-inner,
.x-btn.btn-return.x-btn-pressed .x-btn-inner {
    color: #1890ff !important;
}

/* focus 状态 - 字体颜色保持蓝色 */
.btn-return:focus,
.btn-return.x-btn-focus {
    background: #fff !important;
    background-color: #fff !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}

.btn-return:focus .x-btn-inner,
.btn-return.x-btn-focus .x-btn-inner,
.btn-return:focus .x-btn-button .x-btn-inner,
.btn-return.x-btn-focus .x-btn-button .x-btn-inner,
.x-btn.btn-return:focus .x-btn-inner,
.x-btn.btn-return.x-btn-focus .x-btn-inner {
    color: #1890ff !important;
}

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

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

/* 选择按钮 */
.btnselect {
    border: 1px solid transparent!important;
    border-radius: 3px!important;
    border-color: #457eff!important;
    background: white!important;
}
.btnselect .x-btn-inner { color: #457eff!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: #457eff!important;
    background: white!important;
}

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

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

/* 操作列按钮基础样式 - 文字按钮，无背景无边框 */
.btn-col-edit,
.btn-col-del,
.btn-col-confirm,
.btn-col-audit,
.btn-col-info {
    display: inline-block !important;
    padding: 2px 8px !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    border: none !important;
    background: transparent !important;
    background-color: transparent !important;
    transition: all 0.2s ease !important;
    white-space: nowrap !important;
    outline: none !important;
    border-radius: 2px !important;
    /* 禁用文本选择 */
    -webkit-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
    user-select: none !important;
}

/* ========== 操作列按钮样式 ========== */

/* 所有操作按钮 - 统一蓝色字体 */
.btn-col-edit,
.btn-col-del,
.btn-col-confirm,
.btn-col-audit,
.btn-col-info {
    color: #1890ff !important;
    padding: 0 4px !important;
    margin: 0 2px !important;
    font-size: 13px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    display: inline-block !important;
}

.btn-col-edit:hover,
.btn-col-del:hover,
.btn-col-confirm:hover,
.btn-col-audit:hover,
.btn-col-info:hover {
    color: #40a9ff !important;
    text-decoration: underline !important;
}

.btn-col-edit:active,
.btn-col-del:active,
.btn-col-confirm:active,
.btn-col-audit:active,
.btn-col-info:active {
    color: #096dd9 !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.5 !important;
    vertical-align: middle !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: -2px 0 8px rgba(0, 0, 0, 0.08) !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: -2px 0 8px rgba(0, 0, 0, 0.08) !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: -2px 0 8px rgba(0, 0, 0, 0.08) !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: #e6f7ff !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列按钮文字样式 - 红色粗体 */
.x-action-col-cell .x-btn-inner,
.x-action-col-cell .x-btn-button,
.x-action-col-cell button,
.x-action-col-cell a,
.x-action-col-cell .btn-link,
.x-grid-cell-inner-action-col .x-btn-inner,
.x-grid-cell-inner-action-col .x-btn-button,
.x-grid-cell-inner-action-col button,
.x-grid-cell-inner-action-col a,
.x-grid-cell-inner-action-col .btn-link,
.x-grid-cell-actioncolumn .x-btn-inner,
.x-grid-cell-actioncolumn .x-btn-button,
.x-grid-cell-actioncolumn button,
.x-grid-cell-actioncolumn a,
.x-grid-cell-actioncolumn .btn-link,
.x-grid-cell-inner .operation-buttons .x-btn-inner,
.x-grid-cell-inner .operation-buttons a,
.x-grid-cell-inner .operation-buttons button {
    color: #ff4d4f !important;
    font-weight: bold !important;
}

/* Action列按钮悬停效果 */
.x-action-col-cell .x-btn:hover .x-btn-inner,
.x-action-col-cell a:hover,
.x-action-col-cell button:hover,
.x-grid-cell-inner-action-col .x-btn:hover .x-btn-inner,
.x-grid-cell-inner-action-col a:hover,
.x-grid-cell-inner-action-col button:hover,
.x-grid-cell-actioncolumn .x-btn:hover .x-btn-inner,
.x-grid-cell-actioncolumn a:hover,
.x-grid-cell-actioncolumn button:hover {
    color: #ff7875 !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: -2px 0 8px rgba(0, 0, 0, 0.08) !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: -2px 0 8px rgba(0, 0, 0, 0.08) !important;
}

/* 操作按钮容器 */
.x-grid-cell-inner .operation-buttons {
    display: flex !important;
    align-items: center !important;
    gap: 4px !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: #333333;
    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: #333333;
    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: #e6f7ff !important;
}

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

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

.x-column-header-sort-DESC .x-column-header-inner:after {
    content: ' ▼' !important;
    color: #1890ff !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: #1890ff !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: #e6f7ff !important;
}

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

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

.x-grid-row-selected .x-grid-cell-inner-row-numberer {
    background: transparent !important;
    color: #1890ff !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: #e6f7ff !important;
    background: #e6f7ff !important;
}

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

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

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

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

.x-grid-row-selected .x-grid-cell-inner {
    color: #333 !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: #666666; /* 默认文字颜色设置在单元格级别 */
}

/* 所有单元格列都不显示右边框 */
.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: 40px 20px;
    color: #999999;
    font-size: 14px;
    font-style: normal;
    text-align: center;
    background: #ffffff;
}

/* ========== 滚动条样式 ========== */
.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;
}

/* ========== 编辑模式单元格 - 输入框适配单元格 ========== */
.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 #1890ff !important;
    box-shadow: inset 0 0 2px rgba(24, 144, 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: #1890ff;
    width: 2px;
}

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

/* ========== 单元格选中高亮 ========== */
.x-grid-cell-selected {
    background: #e6f7ff !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: #1890ff !important;
    padding: 4px 8px !important;
    font-size: 14px !important;
    cursor: pointer !important;
    margin-right: 8px !important;
}
.action-btn:hover, .x-btn-link:hover {
    color: #40a9ff !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: #1890ff;
    text-decoration: underline;
    cursor: pointer;
}

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


/* ============================================================
   十二、Tab选项卡样式优化
   ============================================================ */
.x-tab-button {
    color: #1890ff;
    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: #1890ff !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: transparent !important; }
.x-tab.x-tab-default:hover .x-tab-inner-default { color: #40a9ff !important; }

.x-tab.x-tab-active.x-tab-default {
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
}
.x-tab.x-tab-active.x-tab-default .x-tab-inner-default {
    color: #1890ff !important;
    font-size: 14px !important;
    font-weight: bold !important;
    border-bottom: 2px solid #1890ff !important;
    padding-bottom: 4px !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: #1890ff !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: #04408c!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(0,128,255);
    border-top-color: rgb(0,128,255);
    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(0, 128, 255) !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(0, 128, 255);
}

/* 必填标签样式 - 带红色星号 */
.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: #f0f7ff !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: #1890ff !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; }


/* ============================================================
   十九、TUniDateTimePicker 日期选择器现代化
   ============================================================ */
.x-datepicker,
.x-date-picker {
    border: 1px solid #e8e8e8 !important;
    border-radius: 4px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12) !important;
    background: #fff !important;
    padding: 0 !important;
    overflow: hidden !important;
    min-width: 260px !important;
    width: 260px !important;
}

.x-datepicker-header,
.x-date-picker-header {
    background: linear-gradient(135deg, #1890ff 0%, #096dd9 100%) !important;
    padding: 12px 16px !important;
    border-bottom: none !important;
}
.x-datepicker-header .x-datepicker-month,
.x-datepicker-header .x-datepicker-year,
.x-datepicker-header span,
.x-datepicker-header div,
.x-date-picker-header span,
.x-date-picker-header div {
    color: #fff !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
}
.x-datepicker-header button,
.x-datepicker-header a,
.x-date-picker-header button,
.x-date-picker-header a {
    background: rgba(255, 255, 255, 0.15) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    color: #fff !important;
    border-radius: 4px !important;
    transition: all 0.2s ease !important;
}
.x-datepicker-header button:hover,
.x-datepicker-header a:hover,
.x-date-picker-header button:hover,
.x-date-picker-header a:hover {
    background: rgba(255, 255, 255, 0.3) !important;
    border-color: rgba(255, 255, 255, 0.5) !important;
}

.x-datepicker .x-datepicker-prev a,
.x-datepicker .x-datepicker-next a,
.x-date-picker .x-prev a,
.x-date-picker .x-next a {
    background: transparent !important;
    border: none !important;
    border-radius: 4px !important;
    color: #666 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}
.x-datepicker .x-datepicker-prev a:hover,
.x-datepicker .x-datepicker-next a:hover,
.x-date-picker .x-prev a:hover,
.x-date-picker .x-next a:hover {
    background: #f5f5f5 !important;
    color: #333 !important;
}

.x-datepicker table,
.x-date-picker table { border-collapse: collapse !important; width: 100% !important; }

.x-datepicker th,
.x-datepicker thead td,
.x-date-picker th,
.x-date-picker thead td {
    background: linear-gradient(135deg, #1890ff 0%, #096dd9 100%) !important;
    color: #fff !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    padding: 8px 4px !important;
    border-bottom: none !important;
    text-align: center !important;
}

.x-datepicker td,
.x-date-picker td { padding: 4px !important; text-align: center !important; background: #fff !important; }

.x-datepicker td a,
.x-datepicker td .x-datepicker-date,
.x-date-picker td a,
.x-date-picker td .x-date {
    display: block !important;
    padding: 6px 8px !important;
    border-radius: 4px !important;
    color: #666 !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    font-size: 14px !important;
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
}
.x-datepicker td a:hover,
.x-datepicker td:hover .x-datepicker-date,
.x-date-picker td a:hover,
.x-date-picker td:hover .x-date {
    background: #f5f7fa !important;
    color: #1890ff !important;
}

/* 今天 */
.x-datepicker .x-datepicker-today a,
.x-date-picker .x-today a {
    border: 1px solid #1890ff !important;
    color: #1890ff !important;
    font-weight: 600 !important;
    background: #fff !important;
}

/* 选中日 - 蓝色 */
.x-datepicker .x-datepicker-selected a,
.x-datepicker td.x-datepicker-selected a,
.x-date-picker .x-selected a {
    background: #1890ff !important;
    color: #fff !important;
    font-weight: bold !important;
    border: none !important;
}

/* 非本月 / 禁用日 */
.x-datepicker td.x-datepicker-disabled a,
.x-datepicker td .x-datepicker-prevday,
.x-datepicker td .x-datepicker-nextday,
.x-datepicker td.x-datepicker-outside a,
.x-date-picker td.x-disabled a,
.x-date-picker td .x-prev-month,
.x-date-picker td .x-next-month {
    color: #bfbfbf !important;
    background: #fafafa !important;
}
.x-datepicker td.x-datepicker-disabled a:hover,
.x-datepicker td.x-datepicker-outside a:hover,
.x-date-picker td.x-disabled a:hover {
    color: #bfbfbf !important;
    background: #f0f0f0 !important;
}

/* 周末 */
.x-datepicker td.x-datepicker-weekend a,
.x-date-picker td.x-weekend a { color: #ff4d4f !important; }
.x-datepicker td.x-datepicker-weekend.x-datepicker-disabled a,
.x-date-picker td.x-weekend.x-disabled a { color: #d9d9d9 !important; }

/* 底部 */
.x-datepicker-footer,
.x-date-picker-footer {
    background: #f5f7fa !important;
    border-top: 1px solid #e8e8e8 !important;
    padding: 10px !important;
    display: flex !important;
    justify-content: center !important;
    gap: 10px !important;
}
.x-datepicker .x-datepicker-today-btn,
.x-date-picker .x-today-btn {
    background: #1890ff !important;
    color: #fff !important;
    border: none !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    cursor: pointer !important;
}
.x-datepicker .x-datepicker-clear-btn,
.x-date-picker .x-clear-btn {
    background: #f0f0f0 !important;
    color: #666 !important;
    border: none !important;
    border-radius: 4px !important;
    padding: 6px 16px !important;
    font-size: 14px !important;
    cursor: pointer !important;
}

/* 底部按钮统一优化（今天/确定/取消等） */
.x-datepicker-footer .x-btn,
.x-datepicker .x-datepicker-footer .x-btn,
.x-date-picker-footer .x-btn,
.x-date-picker .x-datepicker-footer .x-btn {
    border-radius: 4px !important;
    border: 1px solid #1890ff !important;
    color: #1890ff !important;
    background: #fff !important;
    font-weight: 600 !important;
    padding: 4px 16px !important;
    min-height: 28px !important;
}

.x-datepicker-footer .x-btn .x-btn-inner,
.x-datepicker .x-datepicker-footer .x-btn .x-btn-inner,
.x-date-picker-footer .x-btn .x-btn-inner,
.x-date-picker .x-datepicker-footer .x-btn .x-btn-inner {
    color: #1890ff !important;
    font-weight: 600 !important;
}

.x-datepicker-footer .x-btn-over,
.x-datepicker .x-datepicker-footer .x-btn-over,
.x-date-picker-footer .x-btn-over,
.x-date-picker .x-datepicker-footer .x-btn-over {
    background: #e6f7ff !important;
    border-color: #40a9ff !important;
}

.x-datepicker-footer .x-btn-over .x-btn-inner,
.x-datepicker .x-datepicker-footer .x-btn-over .x-btn-inner,
.x-date-picker-footer .x-btn-over .x-btn-inner,
.x-date-picker .x-datepicker-footer .x-btn-over .x-btn-inner {
    color: #40a9ff !important;
}

.x-datepicker-footer .x-btn-pressed,
.x-datepicker .x-datepicker-footer .x-btn-pressed,
.x-date-picker-footer .x-btn-pressed,
.x-date-picker .x-datepicker-footer .x-btn-pressed {
    background: #1890ff !important;
    border-color: #1890ff !important;
}

.x-datepicker-footer .x-btn-pressed .x-btn-inner,
.x-datepicker .x-datepicker-footer .x-btn-pressed .x-btn-inner,
.x-date-picker-footer .x-btn-pressed .x-btn-inner,
.x-date-picker .x-datepicker-footer .x-btn-pressed .x-btn-inner {
    color: #fff !important;
}

/* 年月选择弹出框 - 月份/年份项按钮 */
.x-monthpicker .x-btn,
.x-monthpicker-btn,
.x-datepicker .x-monthpicker .x-btn {
    border-radius: 4px !important;
    border: 1px solid #d9d9d9 !important;
    color: #333 !important;
    background: #fff !important;
    padding: 2px 8px !important;
    min-height: 26px !important;
}

.x-monthpicker .x-btn .x-btn-inner,
.x-monthpicker-btn .x-btn-inner,
.x-datepicker .x-monthpicker .x-btn .x-btn-inner {
    color: #333 !important;
    font-weight: 500 !important;
    font-size: 12px !important;
}

.x-monthpicker .x-btn-over,
.x-monthpicker-btn.x-btn-over,
.x-datepicker .x-monthpicker .x-btn-over {
    background: #e6f7ff !important;
    border-color: #1890ff !important;
    color: #1890ff !important;
}

.x-monthpicker .x-btn-over .x-btn-inner,
.x-monthpicker-btn.x-btn-over .x-btn-inner,
.x-datepicker .x-monthpicker .x-btn-over .x-btn-inner {
    color: #1890ff !important;
}

.x-monthpicker .x-btn-pressed,
.x-monthpicker .x-btn-selected,
.x-monthpicker-btn.x-btn-pressed,
.x-datepicker .x-monthpicker .x-btn-pressed {
    background: #1890ff !important;
    border-color: #1890ff !important;
    color: #fff !important;
}

.x-monthpicker .x-btn-pressed .x-btn-inner,
.x-monthpicker .x-btn-selected .x-btn-inner,
.x-monthpicker-btn.x-btn-pressed .x-btn-inner,
.x-datepicker .x-monthpicker .x-btn-pressed .x-btn-inner {
    color: #fff !important;
    font-weight: 600 !important;
}

/* 年月选择弹出框底部确定/取消按钮 */
.x-monthpicker-footer .x-btn,
.x-datepicker .x-monthpicker-footer .x-btn {
    border-radius: 4px !important;
    border: 1px solid #1890ff !important;
    color: #1890ff !important;
    background: #fff !important;
    font-weight: 600 !important;
    padding: 4px 14px !important;
    min-height: 28px !important;
}

.x-monthpicker-footer .x-btn .x-btn-inner,
.x-datepicker .x-monthpicker-footer .x-btn .x-btn-inner {
    color: #1890ff !important;
    font-weight: 600 !important;
}

.x-monthpicker-footer .x-btn-over,
.x-datepicker .x-monthpicker-footer .x-btn-over {
    background: #e6f7ff !important;
    border-color: #40a9ff !important;
}

.x-monthpicker-footer .x-btn-over .x-btn-inner,
.x-datepicker .x-monthpicker-footer .x-btn-over .x-btn-inner {
    color: #40a9ff !important;
}

.x-monthpicker-footer .x-btn-pressed,
.x-datepicker .x-monthpicker-footer .x-btn-pressed {
    background: #1890ff !important;
    border-color: #1890ff !important;
}

.x-monthpicker-footer .x-btn-pressed .x-btn-inner,
.x-datepicker .x-monthpicker-footer .x-btn-pressed .x-btn-inner {
    color: #fff !important;
}

/* 顶部月份/年份切换按钮 */
.x-datepicker-header .x-btn,
.x-datepicker .x-datepicker-header .x-btn,
.x-date-picker-header .x-btn {
    background: rgba(255, 255, 255, 0.15) !important;
    border: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 4px !important;
    padding: 2px 10px !important;
    min-height: 26px !important;
}

.x-datepicker-header .x-btn .x-btn-inner,
.x-datepicker .x-datepicker-header .x-btn .x-btn-inner,
.x-date-picker-header .x-btn .x-btn-inner {
    color: #fff !important;
    font-weight: 600 !important;
    font-size: 13px !important;
}

.x-datepicker-header .x-btn-over,
.x-datepicker .x-datepicker-header .x-btn-over,
.x-date-picker-header .x-btn-over {
    background: rgba(255, 255, 255, 0.3) !important;
    border-color: rgba(255, 255, 255, 0.5) !important;
}

.x-datepicker-header .x-btn-over .x-btn-inner,
.x-datepicker .x-datepicker-header .x-btn-over .x-btn-inner,
.x-date-picker-header .x-btn-over .x-btn-inner {
    color: #fff !important;
}

.x-datepicker-header .x-btn-pressed,
.x-datepicker .x-datepicker-header .x-btn-pressed,
.x-date-picker-header .x-btn-pressed {
    background: rgba(255, 255, 255, 0.4) !important;
}

.x-datepicker-header .x-btn-pressed .x-btn-inner,
.x-datepicker .x-datepicker-header .x-btn-pressed .x-btn-inner,
.x-date-picker-header .x-btn-pressed .x-btn-inner {
    color: #fff !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, #1890ff 0%, #096dd9 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: #1890ff !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, #1890ff 0%, #096dd9 100%) !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    padding: 8px 0 !important;
    border-bottom: 2px solid #096dd9 !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: #e6f7ff !important;
    border: 2px solid #1890ff !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: #1890ff !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: #e6f7ff !important;
}

.x-calendar-panel .x-calendar-selected .x-calendar-date,
.x-calendarpanel .x-calendar-selected .x-calendar-date {
    background: #40a9ff !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: #e6f7ff !important;
    color: #1890ff !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(24, 144, 255, 0.08) !important;
    border-left: 3px solid #1890ff !important;
}

.x-calendar-panel .x-calendar-event-indicator,
.x-calendarpanel .x-calendar-event-indicator {
    background: #1890ff !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: #1890ff; color: #1890ff; }
.page-btn.active { background: #1890ff; color: #fff; border-color: #1890ff; }
.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: #1890ff; }




/* ============================================================
   二十二、工具栏分组与分隔符 (来自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: #1890ff;
    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: 2px !important;
    box-shadow: none !important;
    background: #fff !important;
    overflow: hidden !important;
    max-height: none !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;

    /* 2. 尺寸与边距 */
    padding: 3px 12px !important;
    min-height: 28px !important;
    height: auto !important;

    /* 3. 视觉样式 - 浅蓝色背景 */
    background: #40a9ff !important;
    background-color: #40a9ff !important;
    background-image: none !important;
    border: none !important;
    border-bottom: none !important;
    border-radius: 2px 2px 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;
    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 {
    background: #fff !important;
    background-color: #fff !important;
    border: none !important;
    border-width: 0 !important;
    border-color: transparent !important;
    box-shadow: none !important;
    outline: none !important;
}

/* 窗体 Footer - 白色背景 */
.x-window-footer,
.x-window-footer-default {
    background: #fff !important;
    background-color: #fff !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;
    right: 10px !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: 20px !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: #52c41a; border: 1px solid #b7eb8f; }
.message.error { background: #fff2f0; color: #ff4d4f; border: 1px solid #ffccc7; }
.message.warning { background: #fff7e6; color: #fa8c16; border: 1px solid #ffd591; }
.message.info { background: #e6f7ff; color: #1890ff; border: 1px solid #91d5ff; }
.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); }


/* ============================================================
   二十七-B、确认弹窗(MessageDlg)按钮样式优化
   解决问题: 1.按钮文字白色→改为深色  2.按钮太大→缩小  3.去掉边框方框
   ============================================================ */

/* ---- 弹窗内按钮区域: 反序(否在前,是在后) ---- */
.x-message-box .x-toolbar,
.x-message-box .x-toolbar-default {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* ---- 弹窗按钮基础: 缩小尺寸,蓝色边框,蓝色字,居中 ---- */
.x-message-box .x-btn {
    border: 1px solid #40a9ff !important;
    background: #fff !important;
    border-radius: 4px !important;
    padding: 0 !important;
    margin: 0 4px !important;
    box-shadow: none !important;
    outline: none !important;
    color: #40a9ff !important;	
    height: auto !important;
    min-height: 28px !important;
    transition: all 0.15s ease !important;
    justify-content: center !important;
    text-align: center !important;	
}



/* ============================================================
   二十八、全局按钮样式(禁用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: #1890ff !important;
    border: 1px solid #1890ff !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:hover,
.btn-add:focus { background: #1890ff !important; color: #fff !important; }
.btn-add:active { transform: scale(0.96) !important; }
/* ---- 发送验证码按钮 btn-sendsms ---- 蓝色小按钮 ---- */
.btn-sendsms {
    background: #fff !important;
    border: 1px solid #1890ff !important;
    color: #1890ff !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: #1890ff !important; 
    font-size: 12px !important;
    font-weight: 500 !important;
}
.btn-sendsms:hover,
.btn-sendsms:focus { 
    background: #e6f7ff !important; 
    border-color: #40a9ff !important;
    color: #40a9ff !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:hover,
.btn-red:focus { 
    background: #ff7875 !important; 
    border-color: #ff7875 !important;
    color: #fff !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: #722ed1 !important;
    border: 1px solid #722ed1 !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:hover,
.btn-split:focus { 
    background: #9254de !important; 
    border-color: #9254de !important;
    color: #fff !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: #5b8ff9 !important;
    border: 1px solid #5b8ff9 !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:hover,
.btn-adjust:focus { background: #5b8ff9 !important; color: #fff !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:hover,
.btn-close:focus { background: #595959 !important; color: #fff !important; }
.btn-close:active { transform: scale(0.96) !important; }

/* ---- 查询按钮 btn-query (TUniBitBtn) ---- 蓝色主色 无图标 ---- */
.x-btn.btn-query {
    background: #1890ff !important;
    border: 1px solid #1890ff !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;
    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: #fff !important;
    font-weight: bold !important;
    padding: 0 !important;
}

.x-btn.btn-query.x-btn-over,
.x-btn.btn-query.x-btn-focus {
    background: #1890ff !important;
    color: #fff !important;
}

.x-btn.btn-query.x-btn-pressed {
    transform: scale(0.96) !important;
}

/* ---- 修改按钮 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:hover,
.btn-edit:focus { background: #e67e23 !important; color: #fff !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:hover,
.btn-del:focus { background: #ff4d4f !important; color: #fff !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:hover,
.btn-save:focus { background: #5b7c99 !important; color: #fff !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:hover,
.btn-cancel:focus { background: #f0f0f0 !important; color: #666 !important; }
.btn-cancel:active { transform: scale(0.96) !important; }

/* ---- 重置按钮 btn-reset (TUniBitBtn) ---- 灰色 无图标 ---- */
.x-btn.btn-reset {
    background: #6b7280 !important;
    border: 1px solid #6b7280 !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;
    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: #fff !important;
    font-weight: bold !important;
    padding: 0 !important;
}

/* 重置按钮交互状态 */
.x-btn.btn-reset.x-btn-over,
.x-btn.btn-reset.x-btn-focus {
    background: #6b7280 !important;
    color: #fff !important;
}

.x-btn.btn-reset.x-btn-pressed {
    transform: scale(0.96) !important;
}

/* ---- 主要按钮 btn-primary ---- 蓝底白字 无图标 ---- */
.x-btn.btn-primary {
    background: #1890ff !important;
    border: 1px solid #1890ff !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(24, 144, 255, 0.2) !important;
}
.x-btn.btn-primary .x-btn-inner {
    color: #fff !important;
    font-weight: bold !important;
}
.x-btn.btn-primary:hover {
    background: #40a9ff !important;
    border-color: #40a9ff !important;
    color: #fff !important;
    box-shadow: 0 4px 8px rgba(24, 144, 255, 0.3) !important;
    transform: translateY(-1px) !important;
}
.x-btn.btn-primary.x-btn-focus {
    background: #40a9ff !important;
    color: #fff !important;
}
.x-btn.btn-primary.x-btn-pressed {
    transform: scale(0.96) !important;
}

/* ---- 次要按钮 btn-secondary ---- 灰底白字 无图标 ---- */
.x-btn.btn-secondary {
    background: #909399 !important;
    border: 1px solid #909399 !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(144, 147, 153, 0.2) !important;
}
.x-btn.btn-secondary .x-btn-inner {
    color: #fff !important;
    font-weight: bold !important;
}
.x-btn.btn-secondary:hover {
    background: #7d8085 !important;
    border-color: #7d8085 !important;
    color: #fff !important;
    box-shadow: 0 4px 8px rgba(144, 147, 153, 0.3) !important;
    transform: translateY(-1px) !important;
}
.x-btn.btn-secondary.x-btn-focus {
    background: #7d8085 !important;
    color: #fff !important;
}
.x-btn.btn-secondary.x-btn-pressed {
    transform: scale(0.96) !important;
}

/* ---- 提交按钮 btn-confirm ---- 蓝底白字 ---- */
.btn-confirm {
    background: linear-gradient(135deg, #1890ff 0%, #096dd9 100%) !important;
    border: 1px solid #1890ff !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 8px rgba(24, 144, 255, 0.3) !important;
    transition: all 0.2s ease !important;
}
.btn-confirm .x-btn-inner { color: #fff !important; font-weight: bold !important; }
.btn-confirm:hover,
.btn-confirm:focus { 
    background: linear-gradient(135deg, #40a9ff 0%, #1890ff 100%) !important; 
    color: #fff !important;
    box-shadow: 0 4px 12px rgba(24, 144, 255, 0.4) !important;
    transform: translateY(-1px) !important;
}
.btn-confirm:active { 
    transform: scale(0.96) !important;
    box-shadow: 0 1px 4px rgba(24, 144, 255, 0.3) !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:hover,
.btn-audit:focus { background: #faad14 !important; 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:hover,
.btn-info:focus { background: #17a2b8 !important; 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:hover,
.btn-report:focus { background: #17a2b8 !important; 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:hover,
.btn-import:focus { background: #13c2c2 !important; 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:hover,
.btn-export:focus { background: #6c757d !important; 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:hover,
.btn-batch-confirm:focus { background: #389e0d !important; color: #fff !important; }
.btn-batch-confirm:active { transform: scale(0.96) !important; }

/* ---- 批量审核按钮 btn-batch-audit ---- 深紫色 ---- */
.btn-batch-audit {
    background: #531dab !important;
    border: 1px solid #531dab !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:hover,
.btn-batch-audit:focus { background: #531dab !important; 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 4px 4px 0 !important;
    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: #1890ff !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 4px 4px 0 !important;
    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;
}

/* ============================================================
   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-field-checkbox table,
.x-form-cb-wrap table,
.x-form-item-checkbox table,
.x-field-checkbox .x-form-item-body table,
.x-form-item-body .x-form-cb-wrap table {
    border-collapse: collapse !important;
    border-spacing: 0 !important;
}
.x-field-checkbox td,
.x-form-cb-wrap td,
.x-form-item-checkbox td,
.x-field-checkbox .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-field-checkbox,
.x-form-item-checkbox,
.x-field-checkbox .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-field-checkbox .x-form-cb,
.x-field-checkbox .x-form-field,
.x-form-cb-wrap .x-form-field,
.x-field-checkbox 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 #1890ff !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-field-checkbox input,
.x-field-checkbox 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: #1890ff !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-field-checkbox.x-form-cb-checked .x-form-cb {
    background-color: #1890ff !important;
    border-color: #1890ff !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-field-checkbox.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-field-checkbox.x-form-cb-checked .x-form-cb::before,
.x-form-cb-wrap.x-form-cb-checked .x-form-cb::before {
    background: #1890ff !important;
    border-color: #1890ff !important;
}

/* ---- 8. 标签文字(Caption) ---- */
.x-form-cb-label,
.x-form-cb-label-default,
.x-checkbox-label,
.x-field-checkbox label {
    font-family: 'Microsoft YaHei', 'PingFang SC', sans-serif !important;
    font-size: 13px !important;
    color: #333 !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(24, 144, 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:hover,
.btn-help:focus { background: #6c757d !important; 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:hover {
    background: #4a93b8 !important;
    border-color: #4a93b8 !important;
    color: #fff !important;
    box-shadow: 0 4px 8px rgba(58, 124, 165, 0.3) !important;
    transform: translateY(-1px) !important;
}
.btn-selectfile:focus {
    background: #4a93b8 !important;
    color: #fff !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(0,123,255,0.15);
    transform: translateY(-1px);
    cursor: copy;
}

.tag-style {
    background-color: #007bff!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: #007bff!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: #69b9ff !important;           /* 与hover同色 */
    outline: none !important;
    box-shadow: 0 0 0 1px rgba(105, 185, 255, 0.15) !important;  /* 与hover同光晕 */
    background-color: #fff !important;
}

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

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

/* 下拉框聚焦 */
.x-form-combo.x-form-focus,
.x-combo-field.x-form-focus {
    border-color: #69b9ff !important;
    border-right: none !important;               /* 聚焦时保持右侧无边框 */
    box-shadow: 0 0 0 1px rgba(105, 185, 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: #69b9ff !important;
    border-right-color: #69b9ff !important;
    border-bottom-color: #69b9ff !important;
    border-left: none !important;
}

/* 文本域聚焦 */
.x-form-textarea:focus {
    border-color: #69b9ff !important;
    box-shadow: 0 0 0 1px rgba(105, 185, 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: #1890ff !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: #1890ff !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: #1890ff !important;
    background: #1890ff !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: #1890ff !important;
    background: #1890ff !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: #1890ff !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: #666 !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. 只读状态 - 显示指定背景色 */
.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 {
    background-color: #f5f5f5 !important;
    border-color: #d9d9d9 !important;
    cursor: default !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 {
    background-color: #f5f5f5 !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-color: #f5f5f5 !important;
    border-color: #d9d9d9 !important;
}

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

/* 5. 悬停状态 */
.x-form-trigger-wrap:hover:not(.x-form-trigger-wrap-focus) {
    border-color: #69b9ff !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: #69b9ff !important;       /* 更柔和的蓝色 */
    box-shadow: 0 0 0 1px rgba(105, 185, 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: #69b9ff !important;       /* 与hover同色 */
    outline: none !important;
    box-shadow: 0 0 0 1px rgba(105, 185, 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替换为#007AFF
   ============================================================ */

/* 图片指示器容器 - 在表格单元格内居中显示 */
.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(0, 122, 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: #007AFF !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 {
    background-color: #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: #69b9ff !important;       /* 与hover同色 */
    box-shadow: 0 0 0 1px rgba(105, 185, 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: #1890ff !important;
    background-color: #1890ff !important;
    box-shadow: inset 0 0 0 2.5px #ffffff !important;
}

.x-form-radio:hover {
    border-color: #69b9ff !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-form-trigger-wrap-focus {
    border-color: #40a9ff !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;
}

/* 日期弹出面板 */
.x-datepicker,
.x-date-picker {
    border: 1px solid #d9d9d9 !important;
    border-radius: 4px !important;
    background: #fff !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1) !important;
}

.x-datepicker-header {
    background: linear-gradient(135deg, #1890ff 0%, #096dd9 100%) !important;
    padding: 8px !important;
    border-bottom: none !important;
}

.x-datepicker-month {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #fff !important;
}

.x-datepicker-header span,
.x-datepicker-header div {
    color: #fff !important;
}

.x-datepicker th {
    font-size: 13px !important;
    color: #fff !important;
    font-weight: 600 !important;
    padding: 8px 4px !important;
    background: linear-gradient(135deg, #1890ff 0%, #096dd9 100%) !important;
    border-bottom: none !important;
}

.x-datepicker td a {
    padding: 4px !important;
    font-size: 13px !important;
    color: #333 !important;
    border-radius: 50% !important;
    min-width: 28px !important;
    min-height: 28px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
    border: none !important;
}

.x-datepicker td a:hover {
    background: #e6f7ff !important;
    color: #1890ff !important;
}

.x-datepicker td.x-datepicker-selected a {
    background: #1890ff !important;
    color: #fff !important;
    font-weight: 700 !important;
    border: none !important;
    box-shadow: 0 2px 8px rgba(24, 144, 255, 0.35) !important;
}

.x-datepicker td.x-datepicker-today a {
    border: 2px solid #1890ff !important;
    background: #e6f7ff !important;
    color: #1890ff !important;
    font-weight: 700 !important;
}

.x-datepicker td.x-datepicker-disabled a {
    color: #bfbfbf !important;
}

.x-datepicker td.x-datepicker-weekend a {
    color: #ff4d4f !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按钮时,隐藏默认下拉按钮 */
.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 {
    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 数据导航组件样式 (v6.1)
   组件: uEJUniDBNavigator.pas
   使用: 在Delphi中设置组件 Cls="DBNavigator"
   注意: [id*=] 属性选择器在UniGUI中不生效，仅用class选择器
============================================================ */

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

/* 内部元素透明背景 */
.DBNavigator * {
    background-color: transparent !important;
}

/* ---- 2. 按钮 ---- */
.DBNavigator .x-btn {
    background: transparent !important;
    background-color: transparent !important;
    border: 1px solid transparent !important;
    border-radius: 4px !important;
    min-width: 28px !important;
    width: 28px !important;
    height: 28px !important;
    margin: 0 2px !important;
    padding: 0 !important;
    position: relative !important;
    overflow: visible !important;
    transition: all 0.2s ease !important;
    cursor: pointer !important;
}

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

/* ---- 3. 图标垂直居中 + 蓝色 ---- */

/* 包裹层flex居中 */
.DBNavigator .x-btn-wrap,
.DBNavigator .x-btn-button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
}

/* 图标元素 */
.DBNavigator .x-btn-icon-el,
.DBNavigator .x-icon-el {
    color: #1890ff !important;
    font-size: 14px !important;
    line-height: 28px !important;
    width: 28px !important;
    height: 28px !important;
    position: relative !important;
    left: auto !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    transition: all 0.2s ease !important;
}

/* FontAwesome图标 */
.DBNavigator .fa,
.DBNavigator .fas {
    color: #1890ff !important;
}

/* ---- 4. 悬停 ---- */
.DBNavigator .x-btn:hover {
    background: rgba(24, 144, 255, 0.1) !important;
    border-color: rgba(24, 144, 255, 0.3) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08) !important;
}

/* 按下 */
.DBNavigator .x-btn.x-btn-pressed,
.DBNavigator .x-btn:active {
    background: rgba(24, 144, 255, 0.15) !important;
    transform: translateY(0) !important;
    box-shadow: none !important;
}

/* ---- 5. 禁用 ---- */
.DBNavigator .x-btn.x-item-disabled,
.DBNavigator .x-btn.x-disabled {
    opacity: 0.4 !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
}

.DBNavigator .x-btn.x-item-disabled .x-btn-icon-el,
.DBNavigator .x-btn.x-item-disabled .x-icon-el,
.DBNavigator .x-btn.x-item-disabled .fa {
    color: #bfbfbf !important;
    filter: grayscale(100%) !important;
}

/* ---- 6. 焦点 ---- */
.DBNavigator .x-btn:focus {
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2) !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: #1890ff !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: #e6f7ff !important;
}

.x-tree-view .x-grid-row-selected .x-tree-node-text,
.x-tree-panel .x-grid-row-selected .x-tree-node-text {
    color: #1890ff !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;
}