/* 你原有的 CSS 规则（保持不变） */
#home_page h1 {
    color: #4caf7d;
}
.dark #home_page h1{
    color: white;
}

@media screen and (max-width: 900px) {
    #home_page h1 {
        color: #eb4848;
    }
}

/* 优化后的背景图片 CSS 规则 */

/* 确保整个页面都能被背景覆盖 */
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}

/* 给整个网页设置背景图片 */
body {
    /* 背景图片路径 */
    background-image: url('../static/css/bjt.png');
    
    /* 让背景图片覆盖整个屏幕，保持比例 */
    background-size: cover;
    
    /* 背景图片固定，不随滚动条滚动 */
    background-attachment: fixed;
    
    /* 背景图片居中显示 */
    background-position: center;
    
    /* 背景图片不重复平铺 */
    background-repeat: no-repeat;
        /* 半透明遮罩，增强文字可读性 */
    background-color: rgba(255, 255, 255, 0.3);
    background-blend-mode: overlay;

}
/* 全局字体颜色 */
body {
    color: #333333; /* 深色模式下可单独设置 */
}
.dark body {
    color: #e0e0e0; /* 暗黑模式下的字体颜色 */
}
/* 清除所有可能的底部容器样式 */
footer, .page-footer, .site-footer, #footer {
    background: inherit !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
}

/* 内容容器样式优化 */
.container {
    background-color: rgba(255, 255, 255, 0.9); /* 稍降低透明度，与背景更好融合 */
    border-radius: 8px;
    padding: 30px;
    margin: 20px auto; /* 上下留出一些空间，左右居中 */
    max-width: 1200px; /* 限制最大宽度，在宽屏上更美观 */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

/* 确保内容区域不会被底部遮挡 */
.content-wrapper {
    min-height: 100%;
    padding-bottom: 20px; /* 底部预留一点空间 */
    box-sizing: border-box;
}