:root { 
    --color-primary: #1890FF; 
    --color-deep-blue: #003a71; 
    --color-card-text: #FFFFFF; 
    --color-link-hover: #40a9ff; 
    --color-border-default: #d9d9d9; 
    --color-text-dark: #333; 
    --color-success: #52c41a; 
    --color-error: #ff4d4f; 
    --color-glass-bg: rgba(255, 255, 255, 0.1); 
    --color-glass-border: rgba(255, 255, 255, 0.2); 
}

* { box-sizing: border-box; } /* 必须项：防止宽度撑破屏幕 */

body { 
    font-family: 'Microsoft YaHei', sans-serif; 
    margin: 0; padding: 0; min-height: 100vh; 
    color: var(--color-card-text); 
    background-image: url('background.png'); 
    background-size: cover; 
    background-position: center; 
    background-attachment: fixed; 
    overflow-x: hidden; /* 禁止全屏左右晃动 */
}

.header-band { width: 100%; background-color: var(--color-deep-blue); position: sticky; top: 0; z-index: 1000; }

.glass-card { 
    background: var(--color-glass-bg); 
    backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); 
    border: 1px solid var(--color-glass-border); 
    border-radius: 12px; padding: 20px; margin-bottom: 20px; 
}

.btn { 
    display: inline-flex; align-items: center; justify-content: center;
    padding: 10px 14px; border: 1px solid transparent; border-radius: 6px; 
    font-size: 14px; cursor: pointer; transition: all 0.2s; gap: 5px;
    white-space: nowrap; /* 按钮文字不换行 */
}
.btn-primary { background-color: var(--color-primary); color: white; }
.btn-success { background-color: var(--color-success); color: white; }
.btn-danger { background-color: var(--color-error); color: white; }
.btn-secondary { background: rgba(255,255,255,0.1); color: white; border: 1px solid var(--color-glass-border); }

/* 表格容器修复 */
.records-scroll-wrapper { 
    width: 100%; 
    overflow-x: auto; /* 允许内部左右滑动 */
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch; 
    margin-top: 10px;
    border-radius: 8px;
}

.records-table { 
    width: 100%; 
    border-collapse: collapse; 
    table-layout: auto; /* 自动宽度，适应内容 */
    min-width: 600px; /* 移动端最小宽度，触发滑动 */
}

.records-table th { background: rgba(0,0,0,0.4); padding: 12px 8px; text-align: left; color: #ddd; font-weight: 500; border-bottom: 2px solid var(--color-primary); }
.records-table td { padding: 12px 8px; border-bottom: 1px solid rgba(255,255,255,0.1); vertical-align: middle; }

/* 移动端专用优化 */
@media (max-width: 768px) {
    .main-container { padding: 10px; margin-top: 10px; }
    .glass-card { padding: 15px; }
    
    /* 让标题和按钮自动换行，不再跑出屏幕 */
    .feature-header { 
        display: block !important; 
    }
    .feature-header h3 { margin-bottom: 15px !important; text-align: center; }
    .feature-header div { 
        display: grid; 
        grid-template-columns: 1fr 1fr; 
        gap: 10px; 
        width: 100%; 
    }
    
    .bulk-actions-bar { 
        flex-direction: column; gap: 10px; text-align: center; 
    }
    
    .status-badge { font-size: 11px; padding: 1px 4px; }

    /* 滚动提示 */
    .records-scroll-wrapper::before {
        content: "← 左右滑动查看完整表格 →";
        display: block; font-size: 11px; color: #aaa; text-align: center; margin-bottom: 5px;
    }
}

.custom-checkbox { width: 20px; height: 20px; cursor: pointer; }
.status-badge { padding: 2px 6px; border-radius: 4px; display: inline-block; }
.status-success { background: rgba(82, 196, 26, 0.2); color: #52c41a; border: 1px solid #52c41a; }
.status-fail { background: rgba(255, 77, 79, 0.2); color: #ff4d4f; border: 1px solid #ff4d4f; }