/*
 * s-table-system — テーブル共通コンポーネント
 * Flex Table / core/table のラッパーへ用途クラスを付けて使用する。
 * 表の内容・セル属性は変更せず、用途ごとの見た目だけを定義する。
 */

/* 料金表：縦罫線なし、横線のみ */
.s-table--price.s-table--price.s-table--price > table {
  --table-header-bg: var(--color-table-header);
  --table-header-first-bg: var(--color-table-header-light);
  --table-cell-border: var(--color-border-light);
  border-collapse: collapse;
  border-inline: 0;
}
.s-table--price.s-table--price.s-table--price > table thead th {
  background: var(--table-header-bg);
  border-bottom: 1px solid var(--table-cell-border);
}
.s-table--price.s-table--price.s-table--price > table thead th:first-child { background: var(--table-header-first-bg); }
.s-table--price.s-table--price.s-table--price > table :is(th, td) {
  border-inline: 0;
}

/* 比較表：縦横罫線＋比較対象の見出しを固定しやすい構造 */
.s-table--comparison.s-table--comparison.s-table--comparison > table {
  --table-header-bg: var(--color-table-header);
  --table-header-first-bg: var(--color-table-header-light);
  --table-accent-bg: var(--color-primary-lightest);
  --table-cell-border: var(--color-border-light);
  border-collapse: collapse;
}
.s-table--comparison.s-table--comparison.s-table--comparison > table thead th { background: var(--table-header-bg); }
.s-table--comparison.s-table--comparison.s-table--comparison > table thead th:first-child { background: var(--table-header-first-bg); }
.s-table--comparison.s-table--comparison.s-table--comparison > table tbody td:nth-child(2) { background: var(--table-accent-bg); }
.s-table--comparison.s-table--comparison.s-table--comparison > table :is(th, td) {
  border-inline-end: 1px solid var(--color-border-light);
}
.s-table--comparison.s-table--comparison.s-table--comparison > table :is(th, td):last-child {
  border-inline-end: 0;
}

/* 定義表：項目＋説明。ストライプは variant 側で選択可能 */
.s-table--definition.s-table--definition.s-table--definition > table {
  border-collapse: collapse;
}
.s-table--definition.s-table--definition.s-table--definition > table tbody td:first-child {
  font-weight: var(--font-weight-semibold);
  text-align: left;
}
.s-table--definition--striped.s-table--definition--striped > table tbody tr:nth-child(even) {
  background: var(--color-bg-sub);
}

/* 診療時間表＋注記を1ブロックとして扱う */
.s-table-schedule.s-table-schedule {
  --table-header-bg: var(--color-table-header);
  --table-header-first-bg: var(--color-table-header-light);
  --table-cell-border: var(--color-border-light);
  container-type: inline-size;
  margin-block: var(--table-component-margin-block, var(--space-2-xl));
}
.s-table-schedule--top { --table-header-bg: var(--color-table-header); }
.s-table-schedule--access { --table-header-bg: var(--color-primary); }
.s-table-schedule--recruit { --table-header-bg: var(--color-gray-dark); }
.s-table-schedule > .wp-block-flexible-table-block-table > table thead th { background: var(--table-header-bg); }
.s-table-schedule > .wp-block-flexible-table-block-table > table thead th:first-child { background: var(--table-header-first-bg); }
/* 診療時間表と注記は1組。共通余白は外側グループだけに持たせる。 */
.s-table-schedule.s-table-schedule > .wp-block-flexible-table-block-table.wp-block-flexible-table-block-table {
  margin-block: 0;
}
.s-table-schedule__note {
  margin: var(--space-sm) 0 0;
  color: var(--color-text-light);
  font-size: var(--font-size-sm);
  line-height: var(--line-height-normal);
}
.s-table-schedule--top .s-table-schedule__note {
  color: var(--color-text);
}
.s-table-schedule--access .s-table-schedule__note {
  color: var(--color-primary-dark);
}
.s-table-schedule--recruit .s-table-schedule__note {
  font-size: var(--font-size-xs);
}

@container (max-width: 767px) {
  .s-table-schedule__note { font-size: var(--font-size-xs); }
}