/* ========== 全局页面背景 ========== */
body {
    background: #f5f6f9 !important;  /* 阿里云常用浅灰蓝基底 */
}
.io-black-mode body {
    background: #141618 !important;
}

/* ========== 顶部装饰纹理（网格） ========== */
body:before {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 60" width="60" height="60"><path fill="none" stroke="rgba(0,0,0,0.05)" stroke-width="1.2" d="M0 0 L60 0 M0 30 L60 30 M0 60 L60 60 M0 0 L0 60 M30 0 L30 60 M60 0 L60 60"/></svg>');
    background-repeat: repeat;
    background-size: 60px 60px;
    opacity: 0.6;
}
.io-black-mode body:before {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 60" width="60" height="60"><path fill="none" stroke="rgba(255,255,255,0.06)" stroke-width="1.2" d="M0 0 L60 0 M0 30 L60 30 M0 60 L60 60 M0 0 L0 60 M30 0 L30 60 M60 0 L60 60"/></svg>');
    opacity: 0.4;
}

/* ========== 卡片、区块背景 ========== */
.card, .block, .modal-content, .near-navigation, .single-top-area,
.page-header, #search-text, .s-type-list, .dropdown-menu,
.navbar-collapse ul li ul, .io-bomb-content, .card-app.card,
.url-card .url-body .card, .down-content .card-header-img,
.panel-body .url-card.shortcode-url .card {
    background: rgba(255, 255, 255, 0.96) !important;
    backdrop-filter: blur(0px); /* 卡片不模糊，保持清晰 */
    border: 1px solid rgba(0, 0, 0, 0.05) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04) !important;
}
.io-black-mode .card, .io-black-mode .block,
.io-black-mode .modal-content, .io-black-mode .near-navigation,
.io-black-mode .single-top-area, .io-black-mode .page-header,
.io-black-mode #search-text, .io-black-mode .s-type-list,
.io-black-mode .dropdown-menu, .io-black-mode .navbar-collapse ul li ul,
.io-black-mode .io-bomb-content, .io-black-mode .card-app.card,
.io-black-mode .url-card .url-body .card,
.io-black-mode .down-content .card-header-img,
.io-black-mode .panel-body .url-card.shortcode-url .card {
    background: rgba(28, 30, 34, 0.96) !important;
    border-color: rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2) !important;
}

/* ========== 侧边栏（毛玻璃） ========== */
.sidebar-nav-inner {
    background: rgba(255, 255, 255, 0.92) !important;
    backdrop-filter: blur(12px);
    border-right: 1px solid rgba(0, 0, 0, 0.06);
    box-shadow: none;
}
.io-black-mode .sidebar-nav-inner {
    background: rgba(20, 22, 26, 0.92) !important;
    backdrop-filter: blur(12px);
    border-right: 1px solid rgba(255, 255, 255, 0.1);
}

/* ========== 弹窗背景（毛玻璃 + 半透明遮罩） ========== */
.io-bomb-overlay {
    background: rgba(0, 0, 0, 0.3) !important;
    backdrop-filter: blur(4px);
}
.modal-backdrop {
    background: rgba(0, 0, 0, 0.5) !important;
    backdrop-filter: blur(4px);
}

/* ========== 页面头部（固定导航）毛玻璃 ========== */
.page-header {
    background: rgba(255, 255, 255, 0.92) !important;
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}
.io-black-mode .page-header {
    background: rgba(20, 22, 26, 0.92) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

/* ========== 搜索输入框 ========== */
#search-text, .search-modal #m_search-text {
    background: rgba(255, 255, 255, 0.9) !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
}
.io-black-mode #search-text,
.io-black-mode .search-modal #m_search-text {
    background: rgba(30, 32, 36, 0.9) !important;
    border-color: rgba(255, 255, 255, 0.15) !important;
    color: #eee;
}

/* ========== 侧边栏菜单项文字颜色 ========== */
.sidebar-nav .flex-bottom a,
.sidebar-menu-inner a {
    color: #1f2937 !important;
}
.io-black-mode .sidebar-nav .flex-bottom a,
.io-black-mode .sidebar-menu-inner a {
    color: #e5e7eb !important;
}

/* ========== 浅色背景类（原 .bg-light 等） ========== */
.bg-light, .bg-white, .bg-o-muted, .muted-box,
.sites-card, .admin-sites .sites-card,
.manage-sites .sites-card, .sites-placeholder {
    background: rgba(255, 255, 255, 0.8) !important;
    backdrop-filter: blur(4px);
}
.io-black-mode .bg-light,
.io-black-mode .bg-white,
.io-black-mode .bg-o-muted,
.io-black-mode .muted-box,
.io-black-mode .sites-card,
.io-black-mode .admin-sites .sites-card,
.io-black-mode .manage-sites .sites-card,
.io-black-mode .sites-placeholder {
    background: rgba(30, 32, 36, 0.8) !important;
}

/* ========== 快讯、新闻等特殊区域背景 ========== */
.news-list .news-date, .news-list .news-item {
    background: transparent !important;
    border-left-color: rgba(0, 0, 0, 0.1);
}
.io-black-mode .news-list .news-date,
.io-black-mode .news-list .news-item {
    border-left-color: rgba(255, 255, 255, 0.15);
}

/* ========== 页脚背景 ========== */
.main-footer .footer-inner {
    background: rgba(255, 255, 255, 0.96) !important;
    backdrop-filter: blur(4px);
    border-top: 1px solid rgba(0, 0, 0, 0.05);
}
.io-black-mode .main-footer .footer-inner {
    background: rgba(20, 22, 26, 0.96) !important;
    border-top-color: rgba(255, 255, 255, 0.1);
}

/* ========== 调整部分阴影，使整体更轻盈 ========== */
.card, .block, .modal-content, .url-card .url-body:hover .card {
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05) !important;
}
.io-black-mode .card, .io-black-mode .block {
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3) !important;
}

/* 恢复全局滚动，防止内容被裁剪 */
html, body {
    height: auto !important;
    min-height: 100% !important;
}
body {
    overflow-y: auto !important;
}
.main-content {
    min-height: 100vh !important;
    height: auto !important;
}
/* 确保固定导航占位高度正确 */
.page-header + .placeholder {
    height: 74px !important;
}
@media (max-width: 767.98px) {
    .page-header + .placeholder {
        height: 66px !important;
    }
}