/* ============================================================
   SoulMem 文档主题
   —— 更大的字号与行距、宽松的彩色表格、明暗主题双适配
   —— 垂直节奏：分节留白（大段落）≥ 块级留白 ≥ 段落留白（小段落）
   ============================================================ */

/* ---------- 基础：字号与行距 ---------- */

/* 1rem = 10px 不变，正文从默认 1.6rem(16px) 提升到 1.75rem(17.5px) */
.content main {
    font-size: 1.75rem;
}

/* 行距从默认 1.45em 提升到 1.85em，阅读更舒展 */
.content p,
.content li,
.content blockquote {
    line-height: 1.85em;
}

/* 代码块行距 */
.content pre {
    line-height: 1.7;
    font-size: 1.45rem;
}

/* ---------- 垂直节奏（间距系统） ----------

   正文里有两种层级：
   · 小段落 —— 段落、列表项，间距最紧凑；
   · 大段落 —— 引用/代码块/表格等独立块，以及 h2~h4 分节、分隔线。

   原则：大段落之间的空白 ≥ 小段落之间的空白，否则相邻分节
   会被误读为连续段落（连续性暗示错误）。相邻元素的外边距
   会合并（取较大值），因此只要让标题与分隔线的上方留白
   不小于段落间距，节奏即可自动成立——这正是过去用 <br>
   手工撑间距想做的事，现在交给本文件统一负责。 */

.content p {
    margin: 1.1em 0;            /* 小段落：最紧凑 */
}
.content li {
    margin: 0.45em 0;
}
.content ul,
.content ol {
    margin: 1.1em 0;
}

.content blockquote,
.content pre,
.content table {
    margin: 1.5em 0;            /* 独立块：略松 */
}

/* 标题：顶部留白即分节边界（大段落） */
.content h1 {
    font-size: 2.7rem;
    margin-top: 2.2em;
    margin-bottom: 0.8em;
}
.content h2 {
    font-size: 2.2rem;
    margin-top: 2.8em;          /* 章节级分界 */
    margin-bottom: 0.7em;
    padding-bottom: 0.35em;
    border-bottom: 2px solid;
}
.content h3 {
    font-size: 1.85rem;
    margin-top: 2.4em;          /* 小节级分界 */
    margin-bottom: 0.6em;
}
.content h4 {
    font-size: 1.65rem;
    margin-top: 2em;            /* 子节级分界 */
    margin-bottom: 0.5em;
}

/* 分隔线：与标题同级的分界强度 */
.content hr {
    border: none;
    border-top: 1px solid var(--sm-hr);
    margin: 2.4em 0;
}

/* 兜底：独立成行的 <br> 不再充当间距（间距由本文件统一负责；
   段落内部的 <br>，如对话换行，不受影响） */
.content main > br {
    display: none;
}

/* ---------- 主题色变量（明暗双适配） ---------- */

:root {
    --sm-accent: #4f46e5;          /* 主色：靛蓝 */
    --sm-accent-soft: #6366f1;
    --sm-accent-deep: #3730a3;
    --sm-link: #2563eb;
    --sm-code-bg: #eef2ff;         /* 行内代码底 */
    --sm-code-fg: #3730a3;
    --sm-quote-bg: #eef2ff;
    --sm-hr: #d4d4d8;              /* 分隔线 */
    --sm-example-bg: #fdf6ec;      /* 叙事容器底：暖色（琥珀 50） */
    --sm-example-border: #d97706;  /* 叙事容器左边条：琥珀 600 */
    --sm-table-header-a: #4f46e5;
    --sm-table-header-b: #7c3aed;
    --sm-table-hover: #eef2ff;
    --sm-codeblock-border: #c7d2fe;
    --sm-badge-bg: #eef2ff;
    --sm-badge-fg: #3730a3;
}

/* 暗色主题（navy/coal/ayu/rust 均覆盖） */
.navy,
.coal,
.ayu,
.rust {
    --sm-accent: #818cf8;
    --sm-accent-soft: #a5b4fc;
    --sm-accent-deep: #6366f1;
    --sm-link: #93c5fd;
    --sm-code-bg: #1e293b;
    --sm-code-fg: #a5b4fc;
    --sm-quote-bg: #1e293b;
    --sm-hr: #3f3f46;
    --sm-example-bg: #221c14;      /* 叙事容器底：暖黑 */
    --sm-example-border: #f59e0b;  /* 叙事容器左边条：琥珀 500 */
    --sm-table-header-a: #4338ca;
    --sm-table-header-b: #6d28d9;
    --sm-table-hover: #1e293b;
    --sm-codeblock-border: #3730a3;
    --sm-badge-bg: #1e293b;
    --sm-badge-fg: #a5b4fc;
}

/* ---------- 链接与强调色 ---------- */

.content a {
    color: var(--sm-link);
}
.content a:hover {
    text-decoration-thickness: 2px;
}

/* 标题着色：一级用主色，二级用主色系 */
.content h1 {
    color: var(--sm-accent);
}
.content h2 {
    color: var(--sm-accent);
    border-bottom-color: var(--sm-accent-soft);
}
.content h3,
.content h4 {
    color: var(--sm-accent-deep);
}

/* 行内代码 */
.content code {
    font-size: 0.88em;
    background: var(--sm-code-bg);
    color: var(--sm-code-fg);
    border-radius: 4px;
    padding: 0.15em 0.4em;
}
/* 代码块内行内代码还原 */
.content pre code {
    background: none;
    color: inherit;
    padding: 0;
    font-size: 1.4rem;              /* 约 14px，代码块内不再继承缩小 */
}

/* 代码块：圆角 + 彩色边框 */
.content pre {
    border-radius: 10px;
    border: 1px solid var(--sm-codeblock-border);
    padding: 1.2em 1.4em;
}

/* ---------- 引用块 ---------- */

.content blockquote {
    background: var(--sm-quote-bg);
    border-left: 4px solid var(--sm-accent);
    border-radius: 0 8px 8px 0;
    padding: 0.8em 1.2em;
}
.content blockquote p {
    margin: 0.4em 0;
}

/* ---------- 块引用标签卡片（内置五标签） ---------- */

/* 标题中文化：隐藏英文标题文本，用伪元素显示中文 */
.content .blockquote-tag-title {
    font-size: 0;
    line-height: 1;
}
.content .blockquote-tag-title::after {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 1.4;
}
.content .blockquote-tag-note .blockquote-tag-title::after      { content: "注释"; }
.content .blockquote-tag-tip .blockquote-tag-title::after       { content: "建议"; }
.content .blockquote-tag-important .blockquote-tag-title::after { content: "核心设计"; }
.content .blockquote-tag-warning .blockquote-tag-title::after   { content: "争议"; }
.content .blockquote-tag-caution .blockquote-tag-title::after   { content: "注意"; }

/* 左边条按类别着色（覆盖默认主色条） */
.content .blockquote-tag-note      { border-left-color: var(--blockquote-note-color); }
.content .blockquote-tag-tip       { border-left-color: var(--blockquote-tip-color); }
.content .blockquote-tag-important { border-left-color: var(--blockquote-important-color); }
.content .blockquote-tag-warning   { border-left-color: var(--blockquote-warning-color); }
.content .blockquote-tag-caution   { border-left-color: var(--blockquote-caution-color); }

/* ---------- 叙事容器（未加标签的块引用） ---------- */

.content blockquote:not(.blockquote-tag) {
    background: var(--sm-example-bg);
    border-left-color: var(--sm-example-border);
}

/* ---------- 表格：宽松 + 彩色 ---------- */

.content table {
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
    width: 100%;
}
.content table td,
.content table th {
    padding: 0.8em 1.1em;           /* 从默认 0.5em 6px 提升 */
    border: none;
    line-height: 1.6;
    font-size: 1.5rem;              /* 表内文字略小于正文 */
}
/* 表头：渐变 + 白字 */
.content table thead {
    background: linear-gradient(135deg, var(--sm-table-header-a), var(--sm-table-header-b));
}
.content table thead th,
.content table thead td {
    color: #ffffff;
    font-weight: 700;
    letter-spacing: 0.02em;
    border-bottom: none;
}
/* 行分隔线：柔和 */
.content table tbody tr {
    border-bottom: 1px solid var(--table-border-color);
}
.content table tbody tr:last-child {
    border-bottom: none;
}
/* 斑马纹 + 悬停高亮 */
.content table tbody tr:nth-child(2n) {
    background: var(--table-alternate-bg);
}
.content table tbody tr:hover {
    background: var(--sm-table-hover);
}

/* ---------- 侧边栏：行距与选中色 ---------- */

.sidebar .sidebar-scrollbox {
    font-size: 1.5rem;
}
.sidebar .chapter li a,
.sidebar .chapter li a.active {
    line-height: 2;
}
.sidebar .chapter li a.active {
    color: var(--sm-accent);
    font-weight: 600;
}

/* ---------- 徽章/状态条（页脚等） ---------- */

.content .badge,
.content mark {
    background: var(--sm-badge-bg);
    color: var(--sm-badge-fg);
    border-radius: 4px;
    padding: 0.15em 0.4em;
}

/* ---------- 打印（print.html）同样适用 ---------- */

@media print {
    .content main {
        font-size: 12pt;
    }
    .content p,
    .content li,
    .content blockquote {
        line-height: 1.7;
    }
}
