/* ===== 导航栏容器 - 更窄 ===== */
#navigator {
    background: rgba(255, 255, 255, 0.15) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border-radius: 16px !important;
    padding: 8px 16px !important;
    margin: 12px auto 20px auto !important;
    border: 1px solid rgba(255, 255, 255, 0.20) !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.06) !important;
    display: table !important;
    max-width: 92% !important;
    width: 70% !important;
}

/* ===== 导航列表 - 精确4等分 ===== */
#navList {
    display: flex !important;
    flex-wrap: nowrap !important;              /* 不换行 */
    justify-content: space-between !important; /* 两端对齐，精确4等分 */
    align-items: center !important;
    gap: 0 !important;                        /* 去掉间隙，由 space-between 控制 */
    background: transparent !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
    width: 100% !important;
}

/* ===== 每个导航项 - 精确均分 ===== */
#navList li {
    display: block !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    flex: 0 0 auto !important;                /* 不拉伸不收缩 */
    text-align: center !important;
    width: 16.6% !important;                    /* 精确4等分 */
    box-sizing: border-box !important;
}

/* ===== 导航链接 - 填充整个 li ===== */
#navList li a {
    display: block !important;
    padding: 10px 4px !important;             /* 左右内边距减小，由宽度控制 */
    border-radius: 6px !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.25) !important;
    text-decoration: none !important;
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    letter-spacing: 0.5px !important;
    white-space: nowrap !important;
    width: 100% !important;
    box-sizing: border-box !important;
    text-align: center !important;
}

/* ===== 导航链接：悬停效果 ===== */
#navList li a:hover {
    background: rgba(255, 255, 255, 0.25) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 30px rgba(102, 126, 234, 0.30) !important;
    border-color: rgba(255, 255, 255, 0.40) !important;
    color: #ffffff !important;
}

/* ===== 导航链接：当前激活状态 ===== */
#navList li a:active,
#navList li a.current,
#navList li a[class*="current"] {
    background: rgba(255, 255, 255, 0.30) !important;
    box-shadow: 0 4px 20px rgba(102, 126, 234, 0.25) !important;
    border-color: rgba(255, 255, 255, 0.50) !important;
}

/* ===== 下拉菜单 ===== */
#navList li ul {
    background: rgba(255, 255, 255, 0.88) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-radius: 12px !important;
    border: 1px solid rgba(255, 255, 255, 0.30) !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15) !important;
    padding: 8px 4px !important;
    min-width: 120px !important;
}
#navList li ul li {
    width: auto !important;                   /* 下拉菜单恢复自动宽度 */
    flex: none !important;
    text-align: left !important;
}
#navList li ul li a {
    color: #2c3e50 !important;
    background: transparent !important;
    text-shadow: none !important;
    border: none !important;
    padding: 6px 18px !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    width: auto !important;
    display: inline-block !important;
}
#navList li ul li a:hover {
    background: rgba(102, 126, 234, 0.12) !important;
    transform: none !important;
    box-shadow: none !important;
}

/* ===== 响应式：手机和平板适配 ===== */
@media screen and (max-width: 768px) {
    #navigator {
        border-radius: 12px !important;
        padding: 6px 10px !important;
        margin: 10px auto 16px auto !important;
        background: rgba(255, 255, 255, 0.20) !important;
        max-width: 96% !important;
    }
    #navList li a {
        padding: 8px 2px !important;
        font-size: 13px !important;
        border-radius: 4px !important;
    }
    #navList li {
        width: 25% !important;
    }
}

@media screen and (max-width: 480px) {
    #navigator {
        border-radius: 10px !important;
        padding: 4px 6px !important;
        margin: 8px auto 12px auto !important;
        max-width: 98% !important;
    }
    #navList li a {
        padding: 6px 2px !important;
        font-size: 11px !important;
        border-radius: 4px !important;
    }
    #navList li {
        width: 25% !important;
    }
}


/*
/* ===== 全局背景 ===== */
body {
    background-image: url(https://cdn.luogu.com.cn/upload/image_hosting/1v5tn0j4.png),
                      url(https://imgbob.net/ib/kqLPnmJnaIwgVsN_1784375987.png);
    background-attachment: fixed;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    font-family: 'Segoe UI', '微软雅黑', sans-serif;
}
*/
body {
    /* 顺序很关键：第一张在最上层。高清在上、模糊在下 */
    background-image: url(https://imgbob.net/ib/kqLPnmJnaIwgVsN_1784375987.png),
                      url(https://cdn.luogu.com.cn/upload/image_hosting/1v5tn0j4.png);
    background-attachment: fixed;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

/* ===== 内容容器：更窄 + 更透明 =====
#mainContent {
    width: 120% !important;           /* 主内容变窄，默认约75% */
    max-width: 1024px !important;      /* 限制最大宽度 */
    background: rgba(255, 255, 255, 0.45) !important;  /* 更透明 (0.45) */
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border-radius: 16px;
    padding: 28px 35px !important;
    margin: 25px auto !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.25);
}

/* ===== 侧边栏：同步更窄更透明 ===== */
#sideBar {
    width: 20% !important;            /* 侧边栏变窄 */
    min-width: 180px;
    background: rgba(255, 255, 255, 0.40) !important;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border-radius: 16px;
    padding: 20px 18px !important;
    margin: 25px 0 !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.25);
} */

/* ===== 页面整体布局 ===== */
#container {
    display: flex;
    justify-content: center;
    gap: 28px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px 30px;
}

/* ===== 文章主体 - 宽度与导航栏一致 ===== */
#mainContent {
    width: 70% !important;              /* 与导航栏 width: 70% 保持一致 */
    max-width: 92% !important;          /* 与导航栏 max-width: 92% 保持一致 */
    background: rgba(255, 255, 255, 0.45) !important;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border-radius: 16px;
    padding: 28px 35px !important;
    margin: 25px auto !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.25);
    box-sizing: border-box !important;
}

/* ===== 侧边栏 ===== */
#sideBar {
    width: 20% !important;
    min-width: 180px;
    background: rgba(255, 255, 255, 0.40) !important;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border-radius: 16px;
    padding: 20px 18px !important;
    margin: 25px 0 !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.25);
}


/* ===== 文章详情页与列表页适配 ===== */
#topics, .post, .feedback_area, .entrylist, .day {
    background: rgba(255, 255, 255, 0.45) !important;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border-radius: 16px;
    padding: 25px 30px !important;
    margin: 20px auto !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.25);
}

/* ===== 博客标题与导航 ===== */
#Header h1 a, #Header h1 {
    color: #fff !important;
    text-shadow: 0 2px 16px rgba(0, 0, 0, 0.6);
    font-size: 28px;
}
#navList {
    background: rgba(0, 0, 0, 0.15);
    border-radius: 40px;
    padding: 6px 18px;
    backdrop-filter: blur(4px);
}
#navList li a {
    color: #fff !important;
    font-weight: 600;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.5);
    background: rgba(255, 255, 255, 0.10);
    padding: 4px 14px;
    border-radius: 30px;
    margin: 0 3px;
    transition: 0.3s;
}
#navList li a:hover {
    background: rgba(255, 255, 255, 0.25);
}

/* ===== 链接颜色 ===== */
a:link, a:visited {
    color: #0055aa;
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: 0.2s;
}
a:hover {
    color: #cc3300;
    border-bottom-color: #cc3300;
}

/* ===== 代码块 ===== */
.cnblogs_code, .cnblogs_code div {
    background: rgba(0, 0, 0, 0.04) !important;
    border-radius: 8px;
    border: 1px solid rgba(0,0,0,0.06) !important;
}

/* ===== 响应式：手机端侧边栏恢复在上方 ===== */
@media screen and (max-width: 768px) {
    #container {
        flex-direction: column !important;   /* 手机端改为垂直排列 */
        align-items: center !important;
        padding: 12px !important;
    }
    #sideBar {
        width: 92% !important;
        margin: 12px auto !important;
        order: 0 !important;                 /* 手机端恢复默认顺序 */
    }
    #mainContent {
        width: 92% !important;
        padding: 16px 18px !important;
        order: 0 !important;
    }
}
