/* ============================================================
   暗黑简约 · 重构版（带逐行注释）
   说明：每一行代码都附有注释，便于理解和修改
   ============================================================ */

/* ---------- 全局重置 & 基础 ---------- */
* { /* 通配符选择器，选中所有元素 */
    margin: 0; /* 清除默认外边距 */
    padding: 0; /* 清除默认内边距 */
    box-sizing: border-box; /* 让宽高包含内边距和边框，方便布局 */
}

body { /* 页面主体 */
    background: #0b0b0b; /* 深色背景，接近黑色 */
    color: #d4d4d4; /* 默认文字颜色为浅灰色 */
    font-family: "思源黑体", "Cascadia Mono", "Cascadia Mono", "Cascadia Mono", sans-serif; /* 字体栈，优先思源黑体，后备等宽和系统无衬线 */
    font-size: 19px; /* 基础字号 */
    line-height: 1.7; /* 行高为1.7倍，提升阅读舒适度 */
    padding: 0 20px; /* 左右留出20px内边距，防止内容贴边 */
}

/* ---------- 主容器 ---------- */
#home { /* 博客园主容器ID */
    max-width: 1700px; /* 最大宽度为1700px，在大屏幕上限制宽度 */
    margin: 0 auto; /* 水平居中 */
    padding: 0 0 30px 180px; /* 上0 右0 下30px 左180px，左内边距让文章区域向右缩进 */
}

/* ===== 页眉（标题 + 副标题 + 导航） ===== */
#header { /* 页眉区域 */
    margin-left: -160px; /* 负左边距，向左偏移160px，抵消 #home 的左内边距，使标题回到最左边 */
    padding-left: 50px; /* 左内边距50px，让标题文字不紧贴左边缘，留一点呼吸空间 */
}

#blogTitle h1 { /* 主标题（博客名） */
    font-size: 1.8rem; /* 字号为1.8倍根字号 */
    font-weight: 600; /* 加粗 */
    margin: 0; /* 清除默认外边距 */
}
#blogTitle h1 a { /* 主标题内的链接 */
    color: #f0f6fc; /* 亮白色 */
    text-decoration: none; /* 去掉下划线 */
    transition: color 0.2s; /* 颜色变化过渡0.2秒 */
}
#blogTitle h1 a:hover { /* 鼠标悬停时 */
    color: #ff8c00; /* 变为蓝色 */
}

#blogTitle h2 { /* 副标题 */
    font-size: 0.9rem; /* 稍小字号 */
    font-weight: 400; /* 常规粗细 */
    color: #8b949e; /* 中灰色 */
    margin-top: 2px; /* 上边距2px，与主标题拉开距离 */
}

#navigator { /* 导航栏容器 */
    margin-top: 12px; /* 上边距12px，与副标题保持间距 */
    padding-top: 0; /* 上内边距为0 */
}
#navList { /* 导航列表 */
    list-style: none; /* 去掉列表默认圆点 */
    display: flex; /* 弹性布局，水平排列 */
    flex-wrap: wrap; /* 允许换行 */
    gap: 15px 28px; /* 行间距15px，列间距28px */
    padding: 0; /* 清除内边距 */
}
#navList li { /* 每个导航项 */
    display: inline; /* 行内显示（已被flex覆盖，但保留） */
}
#navList a { /* 导航链接 */
    color: #8b949e; /* 灰色 */
    text-decoration: none; /* 去掉下划线 */
    font-size: 0.95rem; /* 字号 */
    font-weight: 450; /* 中等粗细 */
    transition: color 0.2s; /* 颜色过渡 */
}
#navList a:hover { /* 导航链接悬停 */
    color: #f0f6fc; /* 变亮白 */
}

/* ===== 隐藏博客园默认的管理栏和统计信息 ===== */
#top, /* 顶部管理栏（“博客园 首页 新随笔...”） */
#blogStats, /* 统计信息（旧版类名） */
.blogStats { /* 统计信息（新版类名，见你截图） */
    display: none !important; /* 强制隐藏 */
}

/* ===== 主内容 + 侧边栏布局 ===== */
#main { /* 主要区域（文章列表 + 侧边栏） */
    display: flex; /* 弹性布局，让文章和侧边栏并排 */
    gap: 100px; /* 两者间距100px */
    align-items: flex-start; /* 顶部对齐 */
    margin-top: 20px; /* 整体下移20px，与标题拉开距离 */
}

#mainContent { /* 文章列表区域 */
    flex: 1; /* 占据剩余空间，自动伸缩 */
    min-width: 0; /* 允许最小宽度为0，防止溢出 */
    overflow: hidden; /* 隐藏溢出内容 */
}

#sidebar { /* 侧边栏区域 */
    flex: 0 0 320px; /* 固定宽度320px，不伸缩 */
    min-width: 320px; /* 最小宽度也为320px */
    position: sticky; /* 粘性定位，滚动时保持可见 */
    top: 20px; /* 距离视口顶部20px时固定 */
}

/* ===== 文章卡片 ===== */
.day { /* 单篇文章卡片 */
    background: rgba(255, 255, 255, 0.03); /* 半透明白色背景，极淡 */
    border-radius: 12px; /* 圆角12px */
    padding: 28px 32px; /* 上下28px，左右32px内边距 */
    margin-bottom: 28px; /* 下边距28px，分隔卡片 */
    border: 1px solid #21262d; /* 深色边框 */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); /* 轻微阴影，增加立体感 */
    transition: border-color 0.2s, box-shadow 0.2s; /* 边框和阴影变化过渡 */
}
.day:hover { /* 卡片悬停效果 */
    border-color: #30363d; /* 边框变亮一点 */
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.4); /* 阴影加深 */
}
.day .dayTitle {
    font-size: 0rem;
    color: #ff8c00 !important;         /* 橙色，强制覆盖 */
    border-bottom: none;
    margin-bottom: 0px;
    padding-left: 0px;
}


.postTitle { /* 文章标题 */
    font-size: 1.6rem; /* 大号 */
    font-weight: 600; /* 加粗 */
    margin-bottom: 8px; /* 下边距8px */
    line-height: 1.3; /* 行高1.3 */
}
.postTitle a { /* 标题链接 */
    color: #f0f6fc; /* 亮白色 */
    text-decoration: none; /* 去掉下划线 */
    transition: color 0.2s; /* 颜色过渡 */
}
.postTitle a:hover { /* 标题链接悬停 */
    color: #ff8c00; /* 变蓝 */
}

.postCon { /* 文章摘要正文 */
    color: #c9d1d9; /* 浅灰 */
    font-size: 0.98rem; /* 接近基础字号 */
}
.postCon p { /* 段落 */
    margin-bottom: 1.2em; /* 段落下边距1.2倍字号 */
}
.postCon a { /* 摘要中的链接 */
    color: #ff8c00; /* 蓝色 */
    text-decoration: none; /* 去掉下划线 */
}
.postCon a:hover { /* 摘要链接悬停 */
    text-decoration: underline; /* 加下划线 */
}

/* ===== 文章元信息 ===== */
.postDesc { /* 文章底部信息（发布时间、阅读、评论等） */
    margin-top: 16px; /* 上边距16px */
    padding-top: 14px; /* 上内边距14px */
    border-top: 1px solid #21262d; /* 上边框，与正文分隔 */
    font-size: 0.82rem; /* 小号字体 */
    color: #8b949e; /* 灰色 */
    display: flex; /* 弹性布局，让元素水平排列 */
    flex-wrap: wrap; /* 允许换行 */
    gap: 4px 18px; /* 行间距4px，列间距18px */
}
.postDesc a { /* 元信息中的链接 */
    color: #8b949e; /* 灰色 */
    text-decoration: none;
}
.postDesc a:hover { /* 悬停变蓝 */
    color: #ff8c00;
}

/* ===== 分页 ===== */
.pager { /* 分页区域 */
    text-align: center; /* 居中 */
    padding: 30px 0 10px; /* 上30px 左右0 下10px */
    font-size: 0.95rem; /* 字号 */
}
.pager a { /* 分页链接 */
    color: #8b949e;
    text-decoration: none;
    margin: 0 4px; /* 左右4px间距 */
    padding: 4px 12px; /* 内边距 */
    border-radius: 6px; /* 圆角 */
    transition: background 0.2s, color 0.2s; /* 背景和颜色过渡 */
}
.pager a:hover { /* 悬停效果 */
    background: #21262d; /* 深色背景 */
    color: #f0f6fc; /* 亮白文字 */
}
.pager .current { /* 当前页码 */
    color: #f0f6fc;
    background: #21262d;
    padding: 4px 12px;
    border-radius: 6px;
}

/* ===== 侧边栏卡片 ===== */
.sidebar-block { /* 侧边栏的每个模块卡片 */
    background: rgba(255, 255, 255, 0.03); /* 半透明背景 */
    border-radius: 12px;
    padding: 20px 24px; /* 内边距 */
    margin-bottom: 24px; /* 下边距分隔 */
    border: 1px solid #21262d;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}
.sidebar-block h3 { /* 卡片标题 */
    font-size: 0.8rem;
    text-transform: uppercase; /* 大写 */
    letter-spacing: 0.08em; /* 字间距 */
    color: #8b949e;
    margin-bottom: 12px; /* 与内容间距 */
    font-weight: 500; /* 中等粗细 */
    border-bottom: 1px solid #21262d; /* 下边框分割 */
    padding-bottom: 10px; /* 下内边距 */
}
.sidebar-block ul { /* 卡片内列表 */
    list-style: none;
    padding: 0;
    margin: 0;
}
.sidebar-block li { /* 列表项 */
    margin-bottom: 6px; /* 项目间距 */
}
.sidebar-block a { /* 卡片内链接 */
    color: #c9d1d9;
    text-decoration: none;
    transition: color 0.2s;
    font-size: 0.93rem;
}
.sidebar-block a:hover { /* 悬停变蓝 */
    color: #ff8c00;
}

/* ===== 代码块 ===== */
.cnblogs-markdown .hljs, /* 高亮代码容器（博客园markdown） */
.cnblogs-post-body .hljs, /* 高亮代码容器（博客园post） */
.cnblogs-markdown pre, /* 代码块预格式化 */
.cnblogs-post-body pre,
.cnblogs-markdown pre code, /* 代码块中的code标签 */
.cnblogs-post-body pre code,
.hljs code,
pre code { /* 通用选择器，确保覆盖所有代码块 */
    background: #1e1e1e !important; /* 深色背景，强制 */
    border-radius: 8px !important;
    padding: 16px 20px !important;
    border: 1px solid #30363d !important;
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.3) !important; /* 内阴影 */
    overflow-x: auto !important; /* 横向滚动 */
    font-family: "Cascadia Code", Consolas, "Cascadia Code", monospace !important; /* 等宽字体 */
    font-size: 1rem !important;
    line-height: 1.6 !important;
    color: #d4d4d4 !important; /* 文字颜色，保证可见 */
}

/* 代码块滚动条 */
.cnblogs-markdown pre::-webkit-scrollbar, /* Webkit浏览器（Chrome, Edge, Safari） */
.cnblogs-post-body pre::-webkit-scrollbar,
.cnblogs-markdown pre code::-webkit-scrollbar,
.cnblogs-post-body pre code::-webkit-scrollbar {
    height: 6px; /* 滚动条高度 */
    width: 6px;
}
.cnblogs-markdown pre::-webkit-scrollbar-track,
.cnblogs-post-body pre::-webkit-scrollbar-track,
.cnblogs-markdown pre code::-webkit-scrollbar-track,
.cnblogs-post-body pre code::-webkit-scrollbar-track {
    background: #161b22; /* 轨道背景 */
    border-radius: 4px;
}
.cnblogs-markdown pre::-webkit-scrollbar-thumb,
.cnblogs-post-body pre::-webkit-scrollbar-thumb,
.cnblogs-markdown pre code::-webkit-scrollbar-thumb,
.cnblogs-post-body pre code::-webkit-scrollbar-thumb {
    background: #30363d; /* 滑块颜色 */
    border-radius: 4px;
}
.cnblogs-markdown pre::-webkit-scrollbar-thumb:hover,
.cnblogs-post-body pre::-webkit-scrollbar-thumb:hover,
.cnblogs-markdown pre code::-webkit-scrollbar-thumb:hover,
.cnblogs-post-body pre code::-webkit-scrollbar-thumb:hover {
    background: #484f58; /* 滑块悬停 */
}

/* ===== 引用块 ===== */
blockquote { /* 引用文本 */
    margin: 16px 0; /* 上下16px，左右0 */
    padding: 8px 16px 8px 20px; /* 上8 右16 下8 左20 */
    border-left: 4px solid #30363d; /* 左侧边框，突出引用 */
    background: rgba(255, 255, 255, 0.02); /* 极淡背景 */
    border-radius: 0 6px 6px 0; /* 右侧圆角 */
    color: #8b949e; /* 灰色文字 */
}

/* ===== 表格 ===== */
table { /* 表格 */
    border-collapse: collapse; /* 合并边框 */
    width: 100%; /* 占满容器宽度 */
    margin: 16px 0; /* 上下边距 */
    font-size: 0.95rem;
}
th, td { /* 表头和单元格 */
    border: 1px solid #21262d; /* 边框 */
    padding: 8px 14px; /* 内边距 */
    text-align: left; /* 左对齐 */
}
th { /* 表头 */
    background: #161b22; /* 深色背景 */
    color: #f0f6fc; /* 亮文字 */
}

/* ===== 页脚 ===== */
#footer { /* 页面底部 */
    margin-top: 50px; /* 与主体间距 */
    padding-top: 24px;
    border-top: 1px solid #21262d; /* 上边框分割 */
    text-align: center; /* 居中 */
    color: #8b949e;
    font-size: 0.82rem;
}
#footer a { /* 页脚链接 */
    color: #8b949e;
    text-decoration: none;
}
#footer a:hover {
    color: #ff8c00; /* 悬停变蓝 */
}

/* ===== 全局滚动条 ===== */
::-webkit-scrollbar { /* 浏览器滚动条 */
    width: 8px;
    height: 8px;
}
::-webkit-scrollbar-track {
    background: #0d0d0d;
}
::-webkit-scrollbar-thumb {
    background: #30363d;
    border-radius: 8px;
}
::-webkit-scrollbar-thumb:hover {
    background: #484f58;
}

/* ===== 选中文字样式（橙色） ===== */
::selection { /* 鼠标拖拽选中的文本 */
    background-color: #ff8c00 !important; /* 橙色背景 */
    color: #1e1e1e !important; /* 深色文字，确保对比 */
}
.cnblogs-markdown pre code::selection, /* 代码块内选中文字同样样式 */
.cnblogs-post-body pre code::selection {
    background-color: #ff8c00 !important;
    color: #1e1e1e !important;
}

/* ===== 响应式：移动端适配 ===== */
@media (max-width: 820px) { /* 平板及以下 */
    #main { /* 主布局改为纵向排列 */
        flex-direction: column;
        gap: 30px;
    }
    #sidebar { /* 侧边栏宽度自适应 */
        flex: 1 1 100%;
        min-width: 0;
        position: static; /* 取消粘性 */
    }
    #header { /* 页眉重置，去掉负边距，恢复普通内边距 */
        padding: 14px 0 10px;
        margin-left: 0;
        padding-left: 0;
    }
    #home { /* 主容器内边距改为左右20px，文章不再缩进 */
        padding: 0 20px 30px 20px;
    }
    #blogTitle h1 { /* 标题缩小 */
        font-size: 1.5rem;
    }
    .day { /* 卡片内边距减小 */
        padding: 20px 18px;
    }
}

@media (max-width: 480px) { /* 手机小屏 */
    body {
        padding: 0 12px; /* 左右内边距更小 */
    }
    #header {
        padding: 10px 0 8px;
    }
    #blogTitle h1 {
        font-size: 1.3rem;
    }
    .day {
        padding: 16px 14px;
    }
    .sidebar-block {
        padding: 16px 18px;
    }
}
/* ===== 清除日期分组的卡片样式，仅保留纯容器 ===== */
.day {
    background: transparent !important;      /* 去掉背景 */
    border: none !important;                /* 去掉边框 */
    box-shadow: none !important;            /* 去掉阴影 */
    padding: 0 !important;                  /* 去掉内边距 */
    margin-bottom: 30px;                    /* 与下一组保持间距 */
}

/* 评论表单容器背景变黑 */
#commentbox_main,
#commentbox_main,
.commentbox_main {
    background: #0b0b0b !important;
    color: #d4d4d4 !important;
    padding: 15px !important;
    border-radius: 8px !important;
}

/* 输入框、文本域背景变黑 */
#commentform input[type="text"],
#commentform textarea,
#commentbox_main input[type="text"],
#commentbox_main textarea,
.commentbox_main input,
.commentbox_main textarea {
    background: #1e1e1e !important;
    color: #d4d4d4 !important;
    border: 1px solid #30363d !important;
    border-radius: 4px !important;
    padding: 8px 12px !important;
    font-family: inherit;
}

/* 提交按钮样式（可选） */
#commentform input[type="submit"],
#commentbox_main input[type="submit"] {
    background: #21262d !important;
    color: #ff8c00 !important;
    border: 1px solid #30363d !important;
    padding: 8px 20px !important;
    border-radius: 6px !important;
    cursor: pointer;
}
#commentform input[type="submit"]:hover,
#commentbox_main input[type="submit"]:hover {
    background: #30363d !important;
}
/* 隐藏博客文章详情页的“编辑推荐”模块 */
#blog_post_info {
    display: none !important;
}
#cnblogs_ch{
    display: none !important;
}
#under_post_card1{
    display: none !important;
}
#comment_nav{
    display: none !important;
}
#postDesc{
    display: none !important;
}
#profile_block{
    display: none !important;
}
#sidebar_search {
    display: none !important;
}
/* ===== 自定义日历样式（暗黑橙色主题） ===== */
#my-calendar {
    background: #1e1e1e;
    border-radius: 12px;
    padding: 16px 12px 20px 12px;
    color: #d4d4d4;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    margin-bottom: 20px;
}

/* 标题行 */
.my-calendar .cal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}
.my-calendar .cal-title {
    font-size: 1.1rem;
    font-weight: 600;
    color: #ff8c00; /* 橙色 */
}
.my-calendar .cal-prev,
.my-calendar .cal-next {
    background: none;
    border: 1px solid #30363d;
    color: #d4d4d4;
    font-size: 1.2rem;
    width: 30px;
    height: 30px;
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
}
.my-calendar .cal-prev:hover,
.my-calendar .cal-next:hover {
    background: #30363d;
    color: #ff8c00;
}

/* 星期行 */
.my-calendar .cal-weekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    text-align: center;
    font-size: 0.8rem;
    color: #8b949e;
    margin-bottom: 6px;
    border-bottom: 1px solid #30363d;
    padding-bottom: 6px;
}

/* 日期网格 */
.my-calendar .cal-days {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 3px;
    text-align: center;
}
.my-calendar .cal-day,
.my-calendar .cal-empty {
    padding: 6px 0;
    font-size: 0.95rem;
    border-radius: 4px;
    transition: background 0.2s;
}
.my-calendar .cal-day {
    color: #d4d4d4;
    cursor: default;
}
.my-calendar .cal-day:hover {
    background: #30363d;
}
.my-calendar .cal-today {
    background: #ff8c00;
    color: #0b0b0b;
    font-weight: 700;
    border-radius: 4px;
}
.my-calendar .cal-empty {
    color: transparent;
}
/* ===== 修复日历被压成细长条 ===== */
#my-calendar-container,
#my-calendar-container .my-calendar {
    width: 100% !important;          /* 占满父容器宽度 */
    display: block !important;       /* 块级元素，确保占一行 */
    box-sizing: border-box;
}

/* 确保网格占满容器宽度，每个格子平均分配 */
#my-calendar-container .cal-days {
    grid-template-columns: repeat(7, 1fr) !important;
    width: 100% !important;
}

/* 每个日期格子保持正方形，且不溢出 */
#my-calendar-container .cal-day,
#my-calendar-container .cal-empty {
    aspect-ratio: 1 / 1 !important;
    min-width: 0 !important;         /* 防止溢出 */
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    font-size: 0.85rem;
}
blockquote {
    color: #f0f6fc !important;          /* 文字变白 */
    background: rgba(255, 140, 0, 0.08) !important; /* 淡橙色背景 */
    border-left-color: #ff8c00 !important; /* 左侧边框变橙色 */
}
.commentbox_title_left a,
.commentbox_title_left span,
.commentbox_title_left {
    color: #d4d4d4 !important;
}