@supports not selector(::-webkit-scrollbar) {
    .scroll {
        scrollbar-color: rgba(0,0,0,0.3) rgba(0,0,0,0);
        scrollbar-width: thin;
    }
}
/* 选中行高亮 */
.selected-row-highlight {
    animation: selectedRowFlash 2s ease-in-out;
    box-shadow: inset 0 0 0 9999px rgba(255, 255, 0, 0.12) !important;
    --bs-table-striped-bg: #409eff;
    --bs-table-bg: #409eff;
    --bs-table-hover-bg: #409eff;
    --bs-table-striped-color: #fff;
    --bs-table-color-state: #fff;
    --bs-table-hover-color: #fff;
}
@keyframes selectedRowFlash {
    0% { background-color: rgba(255,255,0,0.35); }
    100% { background-color: transparent; }
}
/* 鼠标悬停时，文字颜色变为绿色 */
.table-wrapper table tbody tr:hover > td {
    color: #DCDCDC !important;
    --bs-table-color-state: #DCDCDC !important;
}
/* 补充：如果您其实是想让鼠标悬停时的"背景色"变浅绿，请改为使用这行代码：  */
.table-wrapper table tbody tr:hover > td {
    box-shadow: inset 0 0 0 9999px #6666ff !important;
}
/* 以下为您原有的样式 */
.d-flex.flex-nowrap {
    white-space: nowrap;
}
.bootstrap-input:focus,
input:focus {
    outline: none !important;
    box-shadow: none !important;
}
.checkbox-row {
    margin-bottom: 0.2rem !important;
    padding-top: 0;
    padding-bottom: 0;
    margin-top: 0;
}
/* 修复表格底部最后两行被工具栏挤出屏幕的问题 */
.table-container {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
}
.table-toolbar {
    flex-shrink: 0 !important; /* 告诉浏览器：给工具栏保留它固有的高度（20或50），绝对不要压缩它 */
}
.table-wrapper {
    flex-grow: 1 !important;
    height: 0 !important;
    overflow: auto !important; /* 核心1：把 overflow-y 改为 overflow，允许因为列拉宽而出现横向滚动条 */
}
    /* 核心2：强制允许内部表格撑破 100% 宽度的软限制，否则几十列互相挤压会锁死拖拽行为 */
    .table-wrapper table {
        width: max-content !important; /* 让表格的宽度根据每一列的内容自然撑开 */
        min-width: 100% !important; /* 保证列较少时至少能铺满全屏 */
    }
    /* 在我们自定义的滚动容器中，强制表头吸顶 */
    .table-wrapper thead th {
        position: sticky !important;
        top: 0 !important; /* 紧贴顶部 */
        z-index: 10 !important; /* 确保表头在数据行之上 */
        background-color: #f8f9fa !important; /* 必须给表头加一个纯色背景色，否则滚动时数据文字会和表头重叠。可根据需要改为 #ffffff 等 */
        box-shadow: inset 0 -1px 0 #dee2e6; /* 用内阴影画一条表头底部的分割线，显得更分明 */
    }
/* 1. 最外层容器接管全局滚动（支持宽列表横向滚动） */
.table-wrapper {
    flex-grow: 1 !important;
    height: 0 !important;
    overflow: auto !important;
}
/* 2. 【核心修复】清除框架在单一表格模式下自带的隐藏截断，为我们自己的 sticky 吸顶扫清障碍 */
.fixed-table-container,
.fixed-table-body {
    height: auto !important;
    overflow: visible !important;
}
/* 3. 强制表格允许撑破 100% 宽度的软限制，彻底解锁列宽拖拽 */
.table-wrapper table {
    width: max-content !important;
    min-width: 100% !important;
}
/* 4. 原生吸顶：此时头和数据处于同一个物理 table 内网格强绑定，怎么拖拽绝对不会错位 */
.table-wrapper thead th {
    position: sticky !important;
    top: 0 !important;
    z-index: 10 !important;
    background-color: #f8f9fa !important;
    box-shadow: inset 0 -1px 0 #dee2e6;
    text-align: center !important; /* 让普通文本居中 */
}
    /* 针对组件框架渲染表头时可能带有 flex 的容器统一设置水平居中 */
    .table-wrapper thead th > div {
        justify-content: center !important;
    }
/* 鼠标悬停时，文字颜色变为绿色 */
.table-wrapper table tbody tr:hover > td {
    color: #DCDCDC !important;
    --bs-table-color-state: #DCDCDC !important;
}
/* 补充：如果您其实是想让鼠标悬停时的"背景色"变浅绿，请改为使用这行代码：  */
.table-wrapper table tbody tr:hover > td {
    box-shadow: inset 0 0 0 9999px #6666ff !important;
}
/* ---- 新增的响应式高度容器 ---- */
/* 默认情况（大屏幕 > 704px）：大屏时高度为 calc(100vh - 10px) */
.responsive-page-container {
    height: calc(100vh - 10px) !important;
}
/* 小屏幕情况（小于等于 704px）：小屏时高度改为 calc(100vh - 70px) 防止被底部菜单遮挡 */
@@media (max-width: 704px) {
    .responsive-page-container {
        height: calc(100vh - 65px) !important;
    }
}