/* 對照表庫 · 表格樣式補丁（2026-10-07）
   問題：tables.css 只定義了面板外框（.tb-card），從未寫過 table / th / td，
        導致 zhenjiu-tables.js 輸出的 12 個表全部「無框無底色」，
        密集閱讀時很難對齊欄位（尤其對照表本身目的是逐欄比較）。

   ⚠️ 本檔刻意【只作用於針灸學】：
      tables.css 為全站六科共用，若直接改佢或用不帶 scope 的選擇器，
      會連帶改變其他五科既有樣式。故全部規則前綴 .zhenjiu-tables-body。
      錨點：zhenjiu/index.html 的 tbl-panel 加 class="zhenjiu-tables-body"。
   配色沿用 tables.css 既有的 CSS 變數。 */

/* ---------- 表格容器：可橫向捲動（手機唔撐爆版面）---------- */
.zhenjiu-tables-body .tb-card-body { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.zhenjiu-tables-body .tb-card-body::-webkit-scrollbar { height: 8px; }
.zhenjiu-tables-body .tb-card-body::-webkit-scrollbar-thumb {
  background: var(--border, #E0D7C8); border-radius: 999px;
}

/* ---------- 表格本體 ---------- */
.zhenjiu-tables-body .tb-card-body table {
  width: 100%;
  font-family: var(--font-sans, system-ui, sans-serif);
  font-size: 14px;
  line-height: 1.7;
  color: var(--ink, #2E2A25);
  /* 關鍵：每格都要有框線，密集欄位先睇得清 */
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--border, #E0D7C8);
  border-radius: 10px;
  overflow: hidden;
}

/* ---------- 表頭 ---------- */
.zhenjiu-tables-body .tb-card-body thead th,
.zhenjiu-tables-body .tb-card-body tr:first-child th {
  background: var(--accent, #A83E2E);
  color: #fff;
  font-weight: 600;
  font-size: 13.5px;
  letter-spacing: .02em;
  text-align: left;
  padding: 9px 12px;
  border: 1px solid rgba(255, 255, 255, .22);
  white-space: nowrap;
}

/* ---------- 資料格 ---------- */
.zhenjiu-tables-body .tb-card-body td {
  padding: 8px 12px;
  border: 1px solid var(--border, #E0D7C8);
  vertical-align: top;
  background: var(--paper, #FFFDF8);
}

/* ---------- 斑馬紋：逐行對齊較易 ---------- */
.zhenjiu-tables-body .tb-card-body tbody tr:nth-child(even) td,
.zhenjiu-tables-body .tb-card-body tr:nth-child(even):not(:first-child) td {
  background: var(--paper-2, #FBF6EC);
}

/* ---------- 首欄（項目名）稍加粗，方便掃讀 ---------- */
.zhenjiu-tables-body .tb-card-body tr > :first-child { font-weight: 600; color: var(--ink, #2E2A25); }

/* ---------- 表內粗體（老師重點）---------- */
.zhenjiu-tables-body .tb-card-body td strong { color: var(--accent, #A83E2E); font-weight: 700; }

/* ---------- 表內連結 ---------- */
.zhenjiu-tables-body .tb-card-body td a { color: var(--accent, #A83E2E); }

/* ---------- 窄屏：減少留白、字稍縮 ---------- */
@media (max-width: 640px) {
  .zhenjiu-tables-body .tb-card-body table { font-size: 13px; }
  .zhenjiu-tables-body .tb-card-body td,
  .zhenjiu-tables-body .tb-card-body thead th { padding: 7px 9px; }
}

/* ---------- 列印：框線必須保留（黑白列印仍要看清欄位）---------- */
@media print {
  .zhenjiu-tables-body .tb-card-body table { border: 1px solid #000; }
  .zhenjiu-tables-body .tb-card-body td,
  .zhenjiu-tables-body .tb-card-body thead th { border: 1px solid #000; }
  .zhenjiu-tables-body .tb-card-body thead th,
  .zhenjiu-tables-body .tb-card-body tr:first-child th {
    background: #eee !important; color: #000 !important; -webkit-print-color-adjust: exact;
  }
}
