/* ============================================================
   文章详情页排版优化 · citronix_my11
   作用域：body.single-post（预览阶段仅此篇生效；整站启用时改为 body.single-post）
   参考主流新闻详情页：16px 正文 / 1.9 行高 / 段间距 22px /
   标题强调色 #a20000（与站点点缀色一致）/ 移动端响应式
   ============================================================ */

/* ---------- 字体与基础渲染 ---------- */
body.single-post .content {
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB",
                 "Microsoft YaHei", "微软雅黑", "Helvetica Neue", Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    padding-bottom: 15px;
}

/* ---------- 标题区 ---------- */
body.single-post .content h1.title {
    font-size: 27px;
    font-weight: 600;
    color: #1a1a1a;
    line-height: 1.55;
    letter-spacing: 0.3px;
    text-align: center;
    margin: 8px 0 16px;
    padding: 0 10px;
}
body.single-post .content .info {
    font-size: 13px;
    color: #999;
    margin: 0 0 26px;
    padding-bottom: 18px;
    border-bottom: 1px solid #ececec;
}
/* 标签胶囊（覆盖内联样式） */
body.single-post .content .info a[style] {
    background: #f7f7f7 !important;
    border: 1px solid #ececec !important;
    border-radius: 3px;
    color: #666 !important;
    font-size: 12px;
    line-height: 1;
    padding: 5px 12px !important;
    transition: all .2s ease;
}
body.single-post .content .info a[style]:hover {
    background: #a20000 !important;
    border-color: #a20000 !important;
    color: #fff !important;
}

/* ---------- 正文排版 ---------- */
body.single-post #textarea {
    font-size: 16px;
    line-height: 1.9;
    color: #333;
    letter-spacing: 0.3px;
    word-break: break-word;
}
body.single-post #textarea p {
    margin: 0 0 22px;
    text-align: justify;
}
body.single-post #textarea p:last-child {
    margin-bottom: 0;
}

/* 小节标题：左侧红色竖条，主流媒体样式 */
body.single-post #textarea h2 {
    font-size: 20px;
    font-weight: 600;
    color: #1a1a1a;
    line-height: 1.6;
    margin: 36px 0 18px;
    padding-left: 13px;
    border-left: 4px solid #a20000;
}
body.single-post #textarea h2:first-child {
    margin-top: 4px;
}
body.single-post #textarea h3 {
    font-size: 17px;
    font-weight: 600;
    color: #1a1a1a;
    line-height: 1.6;
    margin: 28px 0 14px;
}

/* 列表 */
body.single-post #textarea ul,
body.single-post #textarea ol {
    margin: 0 0 22px;
    padding-left: 28px;
}
body.single-post #textarea ul li,
body.single-post #textarea ol li {
    margin-bottom: 10px;
    line-height: 1.9;
    text-align: justify;
}
body.single-post #textarea ul li:last-child,
body.single-post #textarea ol li:last-child {
    margin-bottom: 0;
}
body.single-post #textarea ul li::marker,
body.single-post #textarea ol li::marker {
    color: #a20000;
}

/* 链接与强调 */
body.single-post #textarea a {
    color: #a20000;
    text-decoration: none;
    border-bottom: 1px solid rgba(162, 0, 0, .25);
    transition: all .2s ease;
}
body.single-post #textarea a:hover {
    color: #7d0000;
    border-bottom-color: #7d0000;
}
body.single-post #textarea strong,
body.single-post #textarea b {
    color: #1a1a1a;
    font-weight: 600;
}

/* 引用块 */
body.single-post #textarea blockquote {
    margin: 0 0 22px;
    padding: 14px 20px;
    background: #f8f8f8;
    border-left: 4px solid #c9c9c9;
    color: #666;
    border-radius: 0 3px 3px 0;
}

/* 文末合规声明（em）：弱化为注释条 */
body.single-post #textarea p > em:only-child,
body.single-post #textarea > p > em {
    display: block;
    margin: 34px 0 4px;
    padding: 13px 16px;
    background: #fafafa;
    border: 1px solid #f0f0f0;
    border-left: 3px solid #d5d5d5;
    border-radius: 2px;
    color: #999;
    font-size: 13px;
    font-style: normal;
    line-height: 1.8;
}

/* ---------- 上一篇 / 下一篇 ---------- */
body.single-post .preNext {
    margin-top: 34px;
}
body.single-post .preNext .text li {
    margin-bottom: 10px;
}
body.single-post .preNext .text li a {
    display: block;
    padding: 12px 16px;
    background: #f8f8f8;
    border: 1px solid #f0f0f0;
    border-radius: 4px;
    color: #444;
    font-size: 14px;
    line-height: 1.7;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: all .2s ease;
}
body.single-post .preNext .text li a:hover {
    background: #fdf3f3;
    border-color: #e8c8c8;
    color: #a20000;
    white-space: normal;
}

/* ============================================================
   移动端响应式（≤768px）
   ============================================================ */
@media screen and (max-width: 768px) {
    body.single-post .content h1.title {
        font-size: 21px;
        line-height: 1.6;
        padding: 0 4px;
        margin: 4px 0 12px;
        text-align: left;
    }
    body.single-post .content .info {
        margin-bottom: 20px;
        padding-bottom: 14px;
    }
    body.single-post #textarea {
        font-size: 16px;
        line-height: 1.85;
        letter-spacing: 0;
    }
    body.single-post #textarea p {
        margin-bottom: 18px;
    }
    body.single-post #textarea h2 {
        font-size: 18px;
        margin: 26px 0 14px;
        padding-left: 11px;
        border-left-width: 3px;
    }
    body.single-post #textarea ul,
    body.single-post #textarea ol {
        padding-left: 24px;
        margin-bottom: 18px;
    }
    body.single-post #textarea ul li,
    body.single-post #textarea ol li {
        margin-bottom: 8px;
    }
    body.single-post #textarea p > em:only-child,
    body.single-post #textarea > p > em {
        margin-top: 24px;
        padding: 11px 13px;
        font-size: 12px;
    }
    body.single-post .preNext .text li a {
        white-space: normal;
        padding: 10px 13px;
        font-size: 13px;
    }
}

/* ============================================================
   栏目/标签列表页排版（body.archive 含 category 与 tag 归档）
   ============================================================ */

/* ---------- 列表行 ---------- */
body.archive .news_list2 {
    margin-top: 4px;
}
body.archive .news_list2 li {
    height: auto;
    line-height: 1.6;
    padding: 12px 8px;
    border-bottom: 1px solid #f0f0f0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    transition: background .2s ease;
}
body.archive .news_list2 li:hover {
    background: #fafafa;
}
body.archive .news_list2 li span.title {
    width: auto;
    flex: 1 1 auto;
    min-width: 0;
    height: auto;
    line-height: 1.6;
    font-size: 15px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
body.archive .news_list2 li span.title a {
    color: #333;
    transition: color .2s ease;
}
body.archive .news_list2 li span.title a:hover {
    color: #a20000;
}
body.archive .news_list2 li span.time {
    float: none;
    flex: 0 0 auto;
    font-size: 13px;
    color: #999;
    font-variant-numeric: tabular-nums;
}

/* ---------- 窗口式分页（覆盖 base.css 旧样式） ---------- */
body.archive .page_list {
    margin: 28px 0 6px;
    overflow: visible;
}
body.archive .page_list ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
}
body.archive .page_list ul li {
    border: 1px solid #e5e5e5;
    border-radius: 3px;
    padding: 0;
    margin: 0;
    background: #fff;
    min-width: 36px;
    height: 36px;
    line-height: 34px;
    text-align: center;
    font-size: 14px;
    color: #666;
    transition: all .2s ease;
}
body.archive .page_list ul li a {
    display: block;
    color: #555;
}
body.archive .page_list ul li a:hover {
    color: #a20000;
}
body.archive .page_list ul li:hover {
    border-color: #a20000;
    background: #fdf3f3;
    color: #a20000;
}
body.archive .page_list ul li:hover a {
    color: #a20000;
}
body.archive .page_list ul li.cx-num a {
    padding: 0 10px;
}
body.archive .page_list ul li.cx-btn a,
body.archive .page_list ul li.cx-btn span {
    padding: 0 14px;
}
body.archive .page_list ul li.cx-cur {
    background: #a20000;
    border-color: #a20000;
    color: #fff;
    font-weight: 600;
}
body.archive .page_list ul li.cx-cur span {
    display: block;
    padding: 0 10px;
    color: #fff;
}
body.archive .page_list ul li.cx-cur:hover {
    background: #a20000;
    border-color: #a20000;
    color: #fff;
}
body.archive .page_list ul li.cx-dots {
    border: none;
    background: none;
    min-width: auto;
    color: #999;
}
body.archive .page_list ul li.cx-dots:hover {
    border: none;
    background: none;
    color: #999;
}
body.archive .page_list ul li.cx-dis {
    border-color: #eee;
    background: #fafafa;
    color: #ccc;
    cursor: default;
}
body.archive .page_list ul li.cx-dis:hover {
    border-color: #eee;
    background: #fafafa;
    color: #ccc;
}
body.archive .cx-pageinfo {
    text-align: center;
    font-size: 12px;
    color: #999;
    margin: 12px 0 0;
}

/* ---------- 列表页移动端 ---------- */
@media screen and (max-width: 768px) {
    body.archive .news_list2 li {
        padding: 11px 4px;
        gap: 10px;
    }
    body.archive .news_list2 li span.title {
        font-size: 14px;
    }
    body.archive .news_list2 li span.time {
        font-size: 12px;
    }
    body.archive .page_list {
        margin-top: 22px;
    }
    body.archive .page_list ul {
        gap: 6px;
    }
    body.archive .page_list ul li {
        min-width: 32px;
        height: 32px;
        line-height: 30px;
        font-size: 13px;
    }
    body.archive .page_list ul li.cx-num a {
        padding: 0 8px;
    }
    body.archive .page_list ul li.cx-btn a,
    body.archive .page_list ul li.cx-btn span,
    body.archive .page_list ul li.cx-dis span {
        padding: 0 10px;
    }
    body.archive .page_list ul li.cx-cur span {
        padding: 0 8px;
    }
}

/* ===== 相关文章推荐（D3 内链优化 20261013d） ===== */
.cx-related{margin:30px 0 0;}
.cx-related h3{font-size:18px;font-weight:700;color:#333;border-left:4px solid #a20000;padding-left:10px;margin:0 0 12px;line-height:1.5;}
.cx-related ul{list-style:none;margin:0;padding:0;}
.cx-related li{padding:9px 2px;border-bottom:1px dashed #e8e8e8;display:flex;justify-content:space-between;align-items:baseline;gap:14px;}
.cx-related li a{color:#333;text-decoration:none;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cx-related li a:hover{color:#a20000;}
.cx-related li span{color:#999;font-size:13px;flex:none;font-family:Arial,sans-serif;}
@media (max-width:768px){
    .cx-related li a{white-space:normal;display:inline;}
}
