/* ==========================================
   layui 组件深色主题适配（firefly）
   - 深色模式开关：html.dark（与主站 theme.js 一致）
   - iframe 页面由 /js/layui-theme.js 同步顶层窗口的主题类
   ========================================== */

/* ---------- 主题色变量（与主站 --primary 一致） ---------- */
:root {
    --layui-primary: oklch(0.70 0.14 var(--hue, 165));
}

/* ---------- 主题色同步：默认按钮 / 当前页码 / 下拉选中项 ---------- */
.layui-btn:not(.layui-btn-primary):not(.layui-btn-danger):not(.layui-btn-normal):not(.layui-btn-warm):not(.layui-btn-disabled):not(.layui-mini-btn-danger) {
    background-color: var(--layui-primary);
}

.layui-laypage .layui-laypage-curr .layui-laypage-em {
    background-color: var(--layui-primary);
}

.layui-form-select dl dd.layui-this {
    background-color: var(--layui-primary);
    color: #ffffff;
}

/* 输入框聚焦边框同步主题色 */
.layui-input:focus,
.layui-textarea:focus {
    border-color: var(--layui-primary) !important;
}

/* ---------- 表格右上角工具按钮（筛选列等）：背景色跟随主题色 ---------- */
/* 层级修复：表格固定列(.layui-table-fixed) z-index=101 会遮挡右上角工具按钮导致无法点击，
   此处提升到 200（仍低于筛选面板 .layui-table-tool-panel 的 399，保证面板展开在按钮之上） */
.layui-table-tool .layui-table-tool-self {
    z-index: 200;
}

.layui-table-tool .layui-table-tool-self .layui-inline[lay-event] {
    background-color: var(--layui-primary);
    border: 1px solid var(--layui-primary);
    border-radius: 4px;
    color: #ffffff;
}

.layui-table-tool .layui-table-tool-self .layui-inline[lay-event]:hover {
    border-color: var(--layui-primary);
    opacity: 0.85;
}

.layui-table-tool .layui-table-tool-self .layui-inline[lay-event] .layui-icon {
    color: #ffffff;
}

/* 筛选列弹出面板 */
.layui-table-tool-panel {
    background-color: #ffffff;
    border: 1px solid #e5e5e5;
    border-radius: 4px;
}

html.dark .layui-table-tool-panel {
    background-color: #262626;
    border-color: rgba(255, 255, 255, 0.2);
    color: #e8e8e8;
}

html.dark .layui-table-tool-panel li {
    color: #e8e8e8;
}

html.dark .layui-table-tool-panel li:hover {
    background-color: #2a2a2a;
}

/* 表格选中行底色同步主题色 */
.layui-table-click,
.layui-table tbody tr.layui-table-checked {
    background-color: oklch(0.95 0.02 var(--hue, 165));
}

html.dark body {
    background-color: #0f0f0f;
    color: #e8e8e8;
}

/* ---------- 表格整体 ---------- */
html.dark .layui-table-view,
html.dark .layui-table-box,
html.dark .layui-table-header,
html.dark .layui-table-body,
html.dark .layui-table-main,
html.dark .layui-table-fixed,
html.dark .layui-table-fixed-r {
    background-color: #1e1e1e;
    border-color: rgba(255, 255, 255, 0.08);
    color: #e8e8e8;
}

html.dark .layui-table {
    background-color: #1e1e1e;
    color: #e8e8e8;
}

html.dark .layui-table th,
html.dark .layui-table td {
    border-color: rgba(255, 255, 255, 0.08);
    color: #e8e8e8;
}

html.dark .layui-table th {
    background-color: #262626;
    color: #e8e8e8;
}

html.dark .layui-table tbody tr:hover,
html.dark .layui-table-hover {
    background-color: #2a2a2a !important;
}

html.dark .layui-table[lay-even] tr:nth-child(even) {
    background-color: #232323;
}

/* 深色模式下选中行底色（主题色相的低亮度版本） */
html.dark .layui-table-click,
html.dark .layui-table tbody tr.layui-table-checked {
    background-color: oklch(0.30 0.04 var(--hue, 165));
}

/* ---------- 表格工具栏（左上角工具按钮） ---------- */
html.dark .layui-table-tool {
    background-color: #262626;
    border-color: rgba(255, 255, 255, 0.08);
    color: #e8e8e8;
}

html.dark .layui-table-tool .layui-btn {
    background-color: var(--layui-primary);
    color: #ffffff;
    border: 1px solid var(--layui-primary);
}

html.dark .layui-table-tool .layui-btn-primary {
    background-color: rgba(255, 255, 255, 0.08);
    color: #e8e8e8;
    border: 1px solid rgba(255, 255, 255, 0.3);
}

html.dark .layui-table-tool .layui-icon {
    color: inherit;
}

/* ---------- 分页 ---------- */
html.dark .layui-table-page {
    background-color: #1e1e1e;
    border-color: rgba(255, 255, 255, 0.08);
    color: #e8e8e8;
}

html.dark .layui-laypage {
    color: #e8e8e8;
}

html.dark .layui-laypage a,
html.dark .layui-laypage span {
    color: #e8e8e8;
}

html.dark .layui-laypage a {
    background-color: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.2);
}

html.dark .layui-laypage .layui-laypage-curr .layui-laypage-em {
    background-color: var(--layui-primary);
}

html.dark .layui-laypage input,
html.dark .layui-laypage button {
    background-color: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.2);
    color: #e8e8e8;
}

html.dark .layui-table-page select {
    background-color: #262626;
    border-color: rgba(255, 255, 255, 0.2);
    color: #e8e8e8;
}

/* ---------- 表单 ---------- */
html.dark .layui-form-label {
    color: #e8e8e8;
}

html.dark .layui-input,
html.dark .layui-textarea,
html.dark .layui-select {
    background-color: #262626;
    border-color: rgba(255, 255, 255, 0.2);
    color: #e8e8e8;
}

html.dark .layui-input::placeholder,
html.dark .layui-textarea::placeholder {
    color: #737373;
}

html.dark .layui-form-select .layui-edge {
    border-top-color: #a0a0a0;
}

html.dark .layui-form-select dl {
    background-color: #262626;
    border-color: rgba(255, 255, 255, 0.2);
}

html.dark .layui-form-select dl dd {
    color: #e8e8e8;
}

html.dark .layui-form-select dl dd.layui-this {
    background-color: var(--layui-primary);
    color: #ffffff;
}

html.dark .layui-form-select dl dd:hover {
    background-color: #2a2a2a;
}

html.dark .layui-form-radio > i {
    color: #a0a0a0;
}

html.dark .layui-form-radio div,
html.dark .layui-form-radio span {
    color: #e8e8e8;
}

/* ---------- 弹层（layer） ---------- */
html.dark .layui-layer {
    background-color: #1e1e1e;
    color: #e8e8e8;
    border: 1px solid rgba(255, 255, 255, 0.12);
}

html.dark .layui-layer-lan .layui-layer-title {
    background-color: #262626;
    color: #e8e8e8;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

/* 深色模式：alert/confirm 等所有弹层标题栏（含「提示」二字）加亮 */
html.dark .layui-layer .layui-layer-title {
    background-color: #262626;
    color: #e8e8e8;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

/* 深色模式：弹层底部按钮区域与按钮可读性 */
html.dark .layui-layer-btn {
    background-color: #1e1e1e;
}

html.dark .layui-layer-btn .layui-layer-btn0 {
    background-color: var(--layui-primary);
    border-color: var(--layui-primary);
    color: #ffffff;
}

html.dark .layui-layer-btn .layui-layer-btn1 {
    background-color: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.3);
    color: #e8e8e8;
}

/* 监控预警弹窗（monitor_alert.js）：关闭/确定按钮跟随主题色（深浅主题通用） */
.monitor-alert-layer .layui-layer-btn .layui-layer-btn0,
.monitor-alert-layer .layui-layer-btn .layui-layer-btn1 {
    background-color: var(--layui-primary);
    border-color: var(--layui-primary);
    color: #ffffff;
}

.monitor-alert-layer .layui-layer-btn .layui-layer-btn0:hover,
.monitor-alert-layer .layui-layer-btn .layui-layer-btn1:hover {
    opacity: 0.85;
}

/* 深色模式：覆盖全局 layui-layer-btn1 深色样式 保持按钮跟随主题色 */
html.dark .monitor-alert-layer .layui-layer-btn .layui-layer-btn1 {
    background-color: var(--layui-primary);
    border-color: var(--layui-primary);
    color: #ffffff;
}

html.dark .layui-layer-setwin a {
    color: rgba(255, 255, 255, 0.7);
}

/* 弹层窗口按钮（最小化/最大化/还原/关闭）深色模式加亮，避免黑底看不见 */
html.dark .layui-layer-setwin span {
    color: #f0f0f0;
}

html.dark .layui-layer-setwin .layui-layer-min:before {
    border-bottom-color: #f0f0f0;
}

html.dark .layui-layer-setwin .layui-layer-max:before,
html.dark .layui-layer-setwin .layui-layer-max:after,
html.dark .layui-layer-setwin .layui-layer-maxmin:before,
html.dark .layui-layer-setwin .layui-layer-maxmin:after {
    border-color: #f0f0f0;
}

/* 还原按钮前层方块底色跟随深色标题栏 */
html.dark .layui-layer-setwin .layui-layer-maxmin:before,
html.dark .layui-layer-setwin .layui-layer-maxmin:after {
    background-color: #262626;
}

html.dark .layui-layer-dialog {
    background-color: #1e1e1e;
    color: #e8e8e8;
}

html.dark .layui-layer-content {
    color: #e8e8e8;
}

/* ---------- 按钮 ---------- */
html.dark .layui-btn-primary {
    background-color: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.3);
    color: #e8e8e8;
}

/* ---------- 行情图表行 ---------- */
html.dark .monitor-chart-cell {
    background-color: #1e1e1e;
}

.layui-mini-btn-danger {
    background-color: #ff5722;
    border-color: #ff5722;
    color: #fff;
}

/* ---------- 小屏设备：表格分页组件自适应换行，避免被遮挡不可用 ---------- */
@media (max-width: 768px) {
    .layui-table-page {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        gap: 4px;
        height: auto;
        min-height: 41px;
        padding: 6px 4px;
        white-space: normal;
        text-align: center;
        /* 覆盖 layui 原生 overflow:hidden，避免换行后的分页内容被裁掉 */
        overflow: visible;
    }

    /* 覆盖 layui 原生 .layui-table-page>div 固定 height:26px，换行时需要自动高度 */
    .layui-table-page > div {
        height: auto !important;
        min-height: 26px;
    }

    .layui-table-page > * {
        margin: 2px 0 !important;
    }

    .layui-table-page .layui-laypage {
        white-space: normal;
        margin: 0;
    }

    .layui-table-page .layui-laypage a,
    .layui-table-page .layui-laypage span {
        margin-bottom: 2px;
    }

    .layui-table-page .layui-laypage-limits,
    .layui-table-page .layui-laypage-skip {
        display: inline-flex;
        align-items: center;
    }
    /*去掉 第二个按钮开始 的 左间距*/
    .layui-btn + .layui-btn {
        margin-left: 0;
    }
}
/*删除按钮颜色固定*/
.layui-btn.layui-mini-btn-danger,
html.dark .layui-btn.layui-mini-btn-danger,
html.dark .layui-table-tool .layui-btn.layui-mini-btn-danger {
    background-color: #ff5722;
    border-color: #ff5722;
    color: #ffffff;
}

/* 表格多选框（checkbox）选中状态跟随主题色 ---------- */
.layui-form-checkbox[lay-skin="primary"].layui-form-checked i,
.layui-form-checked[lay-skin="primary"] i {
    background-color: var(--layui-primary);
    border-color: var(--layui-primary);
    color: #ffffff;
}

/* 深色模式同步 */
html.dark .layui-form-checkbox[lay-skin="primary"].layui-form-checked i,
html.dark .layui-form-checked[lay-skin="primary"] i {
    background-color: var(--layui-primary);
    border-color: var(--layui-primary);
    color: #ffffff;
}

/* 覆盖 layui 默认给表格工具栏右侧图标区预留的 120px 前台表格工具栏按钮都不多 预留导致左侧留白过大 */
.layui-table-tool-temp {
    padding-right: 15px;
}