/* 全局容器样式 - 统一占页面80%宽度 */
:root {
    --container-max-width: 70%;
}

.container {
    width: 100% !important;
    max-width: var(--container-max-width) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Tailwind 容器兼容 */
.container.mx-auto {
    max-width: var(--container-max-width) !important;
}

/* 确保 container-fluid 也受约束 */
.container-fluid {
    max-width: var(--container-max-width) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* 响应式调整 - 在较小屏幕上使用更大比例 */
@media (max-width: 768px) {
    :root {
        --container-max-width: 95%;
    }
}

@media (min-width: 769px) and (max-width: 1200px) {
    :root {
        --container-max-width: 85%;
    }
}