/* ============================================================
   Post Content Table — theme-adaptive, readable in both modes
   设计原则：
   1) 不硬编码背景色，用半透明叠加 → 自动贴合亮/暗主题
   2) 正文用 currentColor + 适度透明度 → 始终保持与页面文本同调
   3) 表头唯一"强对比"锚点 → 扫读有方向感
   4) Badge 去重锤化 → 与表格融合，不抢视线
   ============================================================ */

.post-container table {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    border-collapse: collapse;
    border-spacing: 0;
    margin: 1.6em 0;
    font-size: 0.92em;
    line-height: 1.7;
    border: 1px solid rgba(128, 128, 128, 0.22);
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
    background: transparent; /* ← 关键：不再强制浅白底 */
}

/* 保留 table semantics 同时允许横向滚动 */
.post-container table > thead,
.post-container table > tbody,
.post-container table > tfoot {
    display: table;
    width: 100%;
    table-layout: auto;
}

.post-container table th,
.post-container table td {
    padding: 12px 16px;
    border-top: 1px solid rgba(128, 128, 128, 0.15);
    text-align: left;
    vertical-align: top;
    word-break: break-word;
    color: inherit; /* ← 关键：跟随页面正文颜色 */
}

/* 首行 td 不画上边框（表头下边框已经够粗） */
.post-container table tbody tr:first-child td {
    border-top: none;
}

/* 表头 — 唯一的"强对比"区块 */
.post-container table thead th {
    background: rgba(139, 92, 246, 0.08); /* 淡紫底，亮暗通吃 */
    font-weight: 600;
    border-top: none;
    border-bottom: 2px solid #8b5cf6; /* 紫色 accent */
    white-space: nowrap;
    color: inherit;
    letter-spacing: 0.02em;
}

/* 斑马纹 — 用极淡的叠加，不会撞主题 */
.post-container table tbody tr:nth-child(even) {
    background: rgba(128, 128, 128, 0.04);
}

/* Hover */
.post-container table tbody tr {
    transition: background-color 0.12s ease-in-out;
}
.post-container table tbody tr:hover {
    background: rgba(139, 92, 246, 0.08);
}

/* 行内 code / badge —— 去重锤化 */
.post-container table code {
    background: rgba(139, 92, 246, 0.1);
    color: #7c3aed;
    padding: 2px 7px;
    border-radius: 5px;
    font-size: 0.9em;
    font-family: ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;
    border: 1px solid rgba(139, 92, 246, 0.18);
    white-space: nowrap;
}

/* 对齐语法支持 */
.post-container table th[align="center"],
.post-container table td[align="center"] { text-align: center; }
.post-container table th[align="right"],
.post-container table td[align="right"] { text-align: right; }

/* 第一列稍微强调（层名那种 key 列自然更显眼） */
.post-container table tbody td:first-child {
    font-weight: 500;
}

/* ============================================================
   Dark mode —— 仅调整 code badge 颜色（其它都用半透明自适应）
   ============================================================ */

[data-theme="dark"] .post-container table {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
    border-color: rgba(167, 139, 250, 0.25);
}
[data-theme="dark"] .post-container table thead th {
    background: rgba(167, 139, 250, 0.15);
    border-bottom-color: #a78bfa;
}
[data-theme="dark"] .post-container table tbody tr:nth-child(even) {
    background: rgba(255, 255, 255, 0.03);
}
[data-theme="dark"] .post-container table tbody tr:hover {
    background: rgba(167, 139, 250, 0.12);
}
[data-theme="dark"] .post-container table code {
    background: rgba(167, 139, 250, 0.14);
    color: #c4b5fd;
    border-color: rgba(167, 139, 250, 0.28);
}
[data-theme="dark"] .post-container table th,
[data-theme="dark"] .post-container table td {
    border-top-color: rgba(167, 139, 250, 0.14);
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme]) .post-container table {
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
        border-color: rgba(167, 139, 250, 0.25);
    }
    :root:not([data-theme]) .post-container table thead th {
        background: rgba(167, 139, 250, 0.15);
        border-bottom-color: #a78bfa;
    }
    :root:not([data-theme]) .post-container table tbody tr:nth-child(even) {
        background: rgba(255, 255, 255, 0.03);
    }
    :root:not([data-theme]) .post-container table tbody tr:hover {
        background: rgba(167, 139, 250, 0.12);
    }
    :root:not([data-theme]) .post-container table code {
        background: rgba(167, 139, 250, 0.14);
        color: #c4b5fd;
        border-color: rgba(167, 139, 250, 0.28);
    }
    :root:not([data-theme]) .post-container table th,
    :root:not([data-theme]) .post-container table td {
        border-top-color: rgba(167, 139, 250, 0.14);
    }
}

/* ============================================================
   Mermaid dark bg —— 保留原有规则
   ============================================================ */
[data-theme="dark"] pre.mermaid {
    background: rgba(8, 17, 35, 0.78) !important;
    border-radius: 8px;
    padding: 16px;
}
@media (prefers-color-scheme: dark) {
    :root:not([data-theme]) pre.mermaid {
        background: rgba(8, 17, 35, 0.78) !important;
        border-radius: 8px;
        padding: 16px;
    }
}

/* ============================================================
   Mobile
   ============================================================ */
@media (max-width: 640px) {
    .post-container table { font-size: 0.86em; }
    .post-container table th,
    .post-container table td { padding: 10px 12px; }
}