/* ==========================================================================
   HybridMag — 文章表格样式优化（品牌色：赭石土褐色系）
   作用域：.entry-content / .comment-content 内的表格
   设计语言与代码块高亮（code-highlight.css）保持一致，统一站点调性。
   ========================================================================== */

:root {
  --hm-table-border: #DCC9A3;          /* 边框：暖棕米 */
  --hm-table-head-bg: #8A624A;         /* 表头底：主色赭棕 */
  --hm-table-head-fg: #FBF3E2;         /* 表头字：暖白 */
  --hm-table-head-border: #6F5F4A;     /* 表头边框：深棕标题色 */
  --hm-table-zebra: rgba(220, 201, 163, 0.22);  /* 偶数行斑马纹 */
  --hm-table-hover: rgba(185, 156, 109, 0.20);  /* 行 hover 高亮 */
  --hm-table-cell: #3a322b;            /* 单元格文字（浅色模式） */
  --hm-table-caption: #8A7d6b;         /* 表注/标题文字 */
}

/* --- 移动端 / 宽表：横向滚动包裹（JS 会把 .entry-content 直接子表格包进来） --- */
.hm-table-scroll {
  display: block;
  width: max-content;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: 0 0 1.6em;
  border: 1px solid var(--hm-table-border);
  border-radius: 10px;
  box-shadow: 0 1px 3px rgba(58, 50, 43, 0.07);
}

/* 滚动提示：超出时出现细滚动条（暖色） */
.hm-table-scroll::-webkit-scrollbar {
  height: 8px;
}
.hm-table-scroll::-webkit-scrollbar-thumb {
  background: var(--hm-table-border);
  border-radius: 8px;
}
.hm-table-scroll::-webkit-scrollbar-track {
  background: transparent;
}

/* --- 表格本体 --- */
.entry-content table,
.comment-content table {
  border-collapse: collapse;
  width: auto;            /* 允许宽表超出容器 → 外层 .hm-table-scroll 横向滚动 */
  min-width: 100%;
  margin: 0;
  font-size: 0.94rem;
  line-height: 1.6;
  color: var(--hm-table-cell);
  background: #fffdf8;
}

/* 单元格边框统一用品牌边色（覆盖主题默认的 --hybridmag-color-border） */
.entry-content table th,
.entry-content table td,
.comment-content table th,
.comment-content table td {
  border: 1px solid var(--hm-table-border);
  padding: 9px 16px;
  vertical-align: top;
  text-align: left;
}

/* --- 表头 --- */
.entry-content table th,
.comment-content table th {
  background: var(--hm-table-head-bg);
  color: var(--hm-table-head-fg);
  border-color: var(--hm-table-head-border);
  font-weight: 600;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

/* --- 斑马纹（仅非 Gutenberg stripes 风格时启用，避免与块样式冲突） --- */
.entry-content table:not(.is-style-stripes) tbody tr:nth-child(even) td,
.comment-content table:not(.is-style-stripes) tbody tr:nth-child(even) td {
  background: var(--hm-table-zebra);
}

/* --- 行 hover 高亮 --- */
.entry-content table tbody tr:hover td,
.comment-content table tbody tr:hover td {
  background: var(--hm-table-hover);
  transition: background-color 0.15s ease;
}

/* --- 表注 / 标题（wp-block-table 的 figcaption 等） --- */
.entry-content .wp-block-table figcaption,
.entry-content table caption {
  caption-side: bottom;
  text-align: center;
  font-size: 0.85rem;
  color: var(--hm-table-caption);
  padding-top: 8px;
}

/* ==========================================================================
   暗色模式（跟随主题 html.hm-dark）
   ========================================================================== */
html.hm-dark .hm-table-scroll {
  border-color: rgba(220, 201, 163, 0.20);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}
html.hm-dark .hm-table-scroll::-webkit-scrollbar-thumb {
  background: rgba(220, 201, 163, 0.30);
}

html.hm-dark .entry-content table,
html.hm-dark .comment-content table {
  background: #1b1712;
  color: #e8dfce;
}

html.hm-dark .entry-content table th,
html.hm-dark .comment-content table th {
  background: #4a382c;          /* 深棕表头，保留品牌层次而非死黑 */
  color: #f3ead7;
  border-color: #5a4636;
}
html.hm-dark .entry-content table th,
html.hm-dark .comment-content table td,
html.hm-dark .entry-content table td {
  border-color: rgba(220, 201, 163, 0.16);
}

html.hm-dark .entry-content table:not(.is-style-stripes) tbody tr:nth-child(even) td,
html.hm-dark .comment-content table:not(.is-style-stripes) tbody tr:nth-child(even) td {
  background: rgba(255, 255, 255, 0.035);
}

html.hm-dark .entry-content table tbody tr:hover td,
html.hm-dark .comment-content table tbody tr:hover td {
  background: rgba(201, 162, 39, 0.12);   /* 暗色下用金线远山做 hover 反馈 */
}

html.hm-dark .entry-content .wp-block-table figcaption,
html.hm-dark .entry-content table caption {
  color: #b9b0a0;
}

/* --- Gutenberg 条纹风格在暗色下保留可读性 --- */
html.hm-dark .wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
  background-color: rgba(255, 255, 255, 0.03);
}