/* 
 * PC端响应式布局方案
 * 支持 1366px - 4K 多分辨率自适应
 */

:root {
    --container-1366: 1200px;  /* 小笔记本 */
    --container-1920: 1400px;  /* 标准桌面 */
    --container-2560: 1800px;  /* 2K显示器 */
    --container-4k: 2400px;    /* 4K显示器 */
}

/* 主容器 - 响应式弹性布局（完全铺满） */
.main-layout-wrapper {
    width: 100% !important;
    max-width: none !important;  /* 移除最大宽度限制，完全铺满 */
    min-height: 100vh !important;
    position: relative !important;
    margin: 0 !important;
    padding: 0 20px !important;  /* 保留少量内边距，防止内容贴边 */
    box-sizing: border-box !important;
    transition: all 0.3s ease !important;
}

/* 确保 body 和 html 不出现横向滚动条 */
html {
    overflow-x: hidden !important;
}

body {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    margin: 0;
    padding: 0;
}

/* 主内容容器 */
.container {
    width: 100% !important;
    max-width: none !important;
    margin: 0 auto;
    padding: 20px;
    box-sizing: border-box;
}

/* 防止内容溢出 */
* {
    box-sizing: border-box;
}

/* 确保所有卡片和元素在缩放后仍然可点击 */
.layui-card,
.layui-btn,
button,
input,
textarea,
select {
    pointer-events: auto;
}

/* ========== PC端响应式断点（完全铺满） ========== */

/* 小笔记本 1366px - 1599px */
@media (min-width: 1366px) and (max-width: 1599px) {
    .main-layout-wrapper {
        padding: 0 15px !important;
    }
}

/* 标准桌面 1600px - 2199px (主流 1920px) */
@media (min-width: 1600px) and (max-width: 2199px) {
    .main-layout-wrapper {
        padding: 0 20px !important;
    }
}

/* 2K显示器 2200px - 3199px (2560px) */
@media (min-width: 2200px) and (max-width: 3199px) {
    .main-layout-wrapper {
        padding: 0 30px !important;
    }
    
    /* 2K屏幕字号略微增大 */
    body {
        font-size: 15px !important;
    }
}

/* 4K显示器 3200px+ */
@media (min-width: 3200px) {
    .main-layout-wrapper {
        padding: 0 40px !important;
    }
    
    /* 4K屏幕字号增大 */
    body {
        font-size: 16px !important;
    }
}

/* 确保弹窗和遮罩层不受影响 */
.layui-layer,
.layui-layer-shade {
    transform: none !important;
}

/* 打印时优化 */
@media print {
    .main-layout-wrapper {
        max-width: 100% !important;
        padding: 0 !important;
    }
}