/* ============================================================
   BayesScalp MonteTrade - 全局自适应 & 防折行样式
   ============================================================ */

/* ---------- 1. 全局标题/标签 防折行 ---------- */
h1, h2, h3, h4, h5, h6 {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

/* ---------- 2. Tab 按钮栏 自适应 (只针对顶部Tab栏的btn-group) ---------- */
/* 顶部Tab栏: 允许换行 */
[style*="borderBottom"] > .btn-group {
    flex-wrap: wrap !important;
    gap: 4px !important;
}
/* 表格内的操作按钮组: 绝对不换行 */
td .btn-group {
    flex-wrap: nowrap !important;
    gap: 0 !important;
}
td .btn-group > .btn {
    white-space: nowrap !important;
    flex-shrink: 0;
    padding: 2px 6px !important;
    font-size: 11px !important;
}
.btn-group > .btn {
    white-space: nowrap !important;
    flex-shrink: 0;
}

/* ---------- 3. 顶部 Header 栏自适应 ---------- */
#header-bar {
    flex-wrap: wrap;
    gap: 8px;
}
#header-bar > div {
    flex-shrink: 0;
    min-width: 0;
}

/* ---------- 4. 所有 Badge / Span 标签 / 小文字 防折行 ---------- */
.badge,
label,
.form-label,
.input-group-text {
    white-space: nowrap !important;
}

/* ---------- 5. 卡片指标数字防折行 ---------- */
.card-body p,
.card p {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ---------- 6. 表格 ---------- */
table th {
    white-space: nowrap !important;
}
table td {
    white-space: nowrap;
}
/* DataTable cells: 已有 whiteSpace: nowrap 的保持, 其余也防折行 */
.dash-cell,
.dash-header {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}
/* 表格容器 横向可滚动 */
.dash-spreadsheet-container,
.dash-spreadsheet {
    overflow-x: auto !important;
}
/* 原生 html.Table 的父容器也要横向滚动 */
div[style*="overflowX"],
div[style*="overflow-x"] {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
}

/* 实时交易数据表格 - 强制横向可滚动 */
#trading-table-scroll-wrap {
    overflow-x: scroll !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    position: relative;
}
#trading-table-scroll-wrap > table {
    min-width: 2200px !important;
    width: max-content !important;
    table-layout: auto !important;
}

/* ---------- 7. 全局 Span 关键样式: 状态指示器、标签等不折行 ---------- */
span[style*="fontWeight: bold"],
span[style*="fontWeight:bold"],
span[style*="font-weight: bold"],
span[style*="font-weight:bold"] {
    white-space: nowrap;
}

/* ---------- 8. 响应式缩放 ---------- */

/* 大屏 >= 1400px: 正常 */

/* 中等屏 1024-1399px */
@media (max-width: 1399px) {
    /* 顶部标题栏字体缩小 */
    #header-bar h1 {
        font-size: 15px !important;
    }
    #header-bar span {
        font-size: 11px !important;
    }
    /* Tab 按钮缩小 (不影响表格操作按钮) */
    :not(td) > .btn-group > .btn {
        padding: 6px 12px !important;
        font-size: 12px !important;
    }
}

/* 小屏 768-1023px */
@media (max-width: 1023px) {
    #header-bar {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 6px !important;
    }
    #header-bar h1 {
        font-size: 14px !important;
    }
    :not(td) > .btn-group > .btn {
        padding: 5px 10px !important;
        font-size: 11px !important;
    }
    /* 四维卡片从4列变2列 */
    .row > [class*="col-"] {
        min-width: 0;
    }
    /* 卡片指标数字自适应 */
    p[style*="fontSize: 36px"],
    p[style*="font-size: 36px"] {
        font-size: 24px !important;
    }
    p[style*="fontSize: 32px"],
    p[style*="font-size: 32px"] {
        font-size: 22px !important;
    }
}

/* 手机 < 768px */
@media (max-width: 767px) {
    #header-bar h1 {
        font-size: 13px !important;
    }
    #header-bar span {
        font-size: 10px !important;
    }
    :not(td) > .btn-group > .btn {
        padding: 4px 8px !important;
        font-size: 10px !important;
    }
    /* 控制面板折叠区字体 */
    .input-group-text {
        font-size: 10px !important;
        padding: 2px 4px !important;
    }
    .form-control {
        font-size: 11px !important;
    }
    /* 大数字进一步缩小 */
    p[style*="fontSize: 36px"],
    p[style*="font-size: 36px"] {
        font-size: 20px !important;
    }
    p[style*="fontSize: 32px"],
    p[style*="font-size: 32px"] {
        font-size: 18px !important;
    }
}

/* ---------- 9. 滚动优化: 页面级别不限制横向滚动 ---------- */
/* 不设置 body overflow-x: hidden, 让表格容器自行控制滚动 */

/* ---------- 10. 输入组防折行 ---------- */
.input-group {
    flex-wrap: nowrap !important;
}

/* ---------- 11. 进度条标签 ---------- */
.progress-bar {
    white-space: nowrap;
    overflow: hidden;
}

/* ---------- 12. Checklist / Switch 标签防折行 ---------- */
.form-check-label {
    white-space: nowrap !important;
}

/* ---------- 13. 回测 DataTable 强制横向滚动 ---------- */
#bt-ranking-table,
#bt-alloc-table,
#bt-stats-table {
    overflow-x: scroll !important;
    -webkit-overflow-scrolling: touch;
}
/* Dash DataTable 内部容器也要可滚动 */
#bt-ranking-table .dash-spreadsheet-container,
#bt-alloc-table .dash-spreadsheet-container,
#bt-stats-table .dash-spreadsheet-container,
#bt-ranking-table .dash-spreadsheet,
#bt-alloc-table .dash-spreadsheet,
#bt-stats-table .dash-spreadsheet {
    overflow-x: scroll !important;
    -webkit-overflow-scrolling: touch;
}
/* 回测表格滚动条可见 (macOS 默认隐藏) */
#bt-ranking-table ::-webkit-scrollbar,
#bt-alloc-table ::-webkit-scrollbar,
#bt-stats-table ::-webkit-scrollbar {
    height: 10px !important;
    display: block !important;
}
#bt-ranking-table ::-webkit-scrollbar-track,
#bt-alloc-table ::-webkit-scrollbar-track,
#bt-stats-table ::-webkit-scrollbar-track {
    background: #1a1d23 !important;
}
#bt-ranking-table ::-webkit-scrollbar-thumb,
#bt-alloc-table ::-webkit-scrollbar-thumb,
#bt-stats-table ::-webkit-scrollbar-thumb {
    background: #555 !important;
    border-radius: 5px !important;
}
#bt-ranking-table ::-webkit-scrollbar-thumb:hover,
#bt-alloc-table ::-webkit-scrollbar-thumb:hover,
#bt-stats-table ::-webkit-scrollbar-thumb:hover {
    background: #888 !important;
}