/* ============================================================================
   文章正文排版体系（PC） v1.0   2026-11-08
   ----------------------------------------------------------------------------
   为什么需要这个文件：
     Word 导入后，DocxParser 会把文档输出成干净的 h2/h3/p/img，
     而 ContentNormalizer 会剔除所有 class 与 style，只保留标签。
     所以想让文章“好看”，只能靠【标签级选择器】统一控制，不能依赖 class。

   设计基调：与站内学术风一致（墨蓝 #1a2a44 为骨、铜金 #B8860B 点睛）
   作用域：只在 .aricle_content 内生效，不影响页面其它区域
   引入：template/pc/view_article.htm 中 news.css 之后
   ============================================================================ */

/* ---------- 基础字号与行高 ---------- */
.aricle_content {
    font-size: 16px;
    color: #333;
    line-height: 1.9;
    word-wrap: break-word;
}

/* ---------- 段落 ---------- */
.aricle_content p {
    margin: 0 0 20px;
    font-size: 16px;
    line-height: 1.9;
    color: #333;
}

.aricle_content p:empty { display: none; }

/* ---------- H2 章节标题：左侧金色竖条 + 底部细线 ---------- */
.aricle_content h2 {
    position: relative;
    margin: 40px 0 18px;
    padding: 2px 0 10px 14px;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.5;
    color: #1a2a44;
    border-left: 4px solid #B8860B;
    border-bottom: 1px solid #EEF0F3;
}

/* ---------- H3 小节：金色圆点前缀 ---------- */
.aricle_content h3 {
    position: relative;
    margin: 28px 0 12px;
    padding-left: 16px;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.6;
    color: #1a2a44;
}

.aricle_content h3::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 7px;
    height: 7px;
    margin-top: -3.5px;
    background: #B8860B;
    border-radius: 50%;
}

/* ---------- H4 ---------- */
.aricle_content h4 {
    margin: 22px 0 10px;
    font-size: 16px;
    font-weight: 700;
    color: #1a2a44;
}

/* ---------- 引用块 ---------- */
.aricle_content blockquote {
    margin: 22px 0;
    padding: 16px 20px;
    background: #F8F9FB;
    border-left: 3px solid #B8860B;
    border-radius: 0 6px 6px 0;
    color: #555;
    font-size: 15px;
    line-height: 1.85;
}

.aricle_content blockquote p:last-child { margin-bottom: 0; }

/* ---------- 列表 ---------- */
.aricle_content ul,
.aricle_content ol {
    margin: 0 0 20px;
    padding-left: 24px;
}

.aricle_content li {
    margin-bottom: 10px;
    line-height: 1.85;
    color: #333;
}

.aricle_content li::marker { color: #B8860B; }
.aricle_content ol li::marker { font-weight: 700; }

/* ---------- 表格：斑马纹 + 圆角 ---------- */
.aricle_content table {
    width: 100%;
    margin: 22px 0;
    border-collapse: collapse;
    border: 1px solid #E5E8EC;
    border-radius: 6px;
    overflow: hidden;
    font-size: 14px;
}

.aricle_content th {
    padding: 11px 14px;
    background: #F2F4F7;
    color: #1a2a44;
    font-weight: 700;
    text-align: left;
    border-bottom: 1px solid #E5E8EC;
}

.aricle_content td {
    padding: 10px 14px;
    border-bottom: 1px solid #EEF0F3;
    line-height: 1.75;
}

.aricle_content tr:last-child td { border-bottom: none; }
.aricle_content tbody tr:nth-child(even) { background: #FAFBFC; }

/* ---------- 图片：圆角 + 轻阴影 + 居中 ---------- */
.aricle_content img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 10px auto;
    border-radius: 6px;
    box-shadow: 0 2px 10px rgba(26, 42, 68, .08);
}

/* ---------- 分割线 ---------- */
.aricle_content hr {
    width: 60px;
    height: 2px;
    margin: 36px auto;
    border: 0;
    background: linear-gradient(90deg, transparent, #B8860B, transparent);
}

/* ---------- 强调 ---------- */
.aricle_content strong { color: #1a2a44; font-weight: 700; }

/* 斜体在中文排版里常被当作“重点标记”，改成荧光笔效果 */
.aricle_content em {
    font-style: normal;
    background: linear-gradient(transparent 62%, rgba(184, 134, 11, .22) 0);
    padding: 0 2px;
}

/* ---------- 行内代码 ---------- */
.aricle_content code {
    padding: 2px 6px;
    background: #F2F4F7;
    border-radius: 4px;
    font-size: 13px;
    color: #B8860B;
    font-family: Consolas, Monaco, "Courier New", monospace;
}

/* ---------- 预格式化块（Word 里的代码/等宽段） ---------- */
.aricle_content pre {
    margin: 20px 0;
    padding: 16px 18px;
    background: #1a2a44;
    border-radius: 6px;
    overflow-x: auto;
}

.aricle_content pre code {
    padding: 0;
    background: transparent;
    color: #E8ECF1;
    font-size: 13px;
    line-height: 1.7;
}

/* ---------- 窄屏适配 ---------- */
@media (max-width: 640px) {
    .aricle_content h2 { font-size: 18px; margin: 30px 0 14px; }
    .aricle_content h3 { font-size: 16px; margin: 22px 0 10px; }
    .aricle_content table { font-size: 13px; }
    .aricle_content th,
    .aricle_content td { padding: 8px 10px; }
}

/* ---------- 图表容器（2026-11-11 新增） ----------
   md 导入时插图输出为 <p class="fig">，表格题注输出为 <p class="tbl-cap">。
   这两类段落会继承正文 p 的段后距，需要单独覆写成图文间距。 */
.aricle_content p.fig {
    margin: 26px 0 8px;
    text-align: center;
    line-height: 0;
}

.aricle_content p.fig img {
    margin: 0 auto;
}

.aricle_content p.tbl-cap {
    margin: 26px 0 10px;
    padding: 0;
    font-size: 14px;
    line-height: 1.6;
    color: #1a2a44;
    text-align: center;
}

.aricle_content p.tbl-cap strong {
    font-weight: 700;
    color: #1a2a44;
}

@media (max-width: 640px) {
    .aricle_content p.fig { margin: 20px 0 6px; }
    .aricle_content p.tbl-cap { margin: 20px 0 8px; font-size: 13px; }
}