/* ==========================================================================
   s-treatment-info — 施術概要 + 施術情報テーブル
   ========================================================================== */

/* ── 施術概要セクション ── */
.s-treatment-info {
  padding: var(--space-5-xl) 0 var(--space-3-xl);
}

.s-treatment-info__inner {
  container-type: inline-size;
  max-width: var(--width-content);
  margin: 0 auto;
  padding: 0 var(--space-3-xl);
}

.s-treatment-info__category {
  font-size: var(--font-size-sm);
  color: var(--color-text-light);
  margin-bottom: var(--space-xs);
}

.s-treatment-info__title {
  font-size: var(--font-size-4-xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-text);
  margin-bottom: var(--space-lg);
  line-height: var(--line-height-tight);
}

.s-treatment-info__desc {
  font-size: var(--font-size-md);
  color: var(--color-text);
  line-height: var(--line-height-relaxed);
  margin-bottom: var(--space-xl);
}

.s-treatment-info__tags {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
}

/* ── 施術情報テーブル ── */
.s-treatment-info-table {
  padding: 0 0 var(--space-5-xl);
}

.s-treatment-info-table__inner {
  --table-component-margin-block: var(--space-2-xl);
  container-type: inline-size;
  /* 外側sectionがs-layout-04の標準paddingを所有する。
     負marginで相殺すると本文・見出しの基準線から表だけ外れるため禁止。 */
  max-width: none;
  margin-inline: 0;
  margin-block: var(--table-component-margin-block);
  padding: 0;
}

.s-treatment-info-table__table {
  width: 100%;
  /* 本文ftb定義型（has-fixed-layout）と同じ列計算にしてラベル列幅を一致させる */
  table-layout: fixed;
  border-collapse: collapse;
}

.s-treatment-info-table__table th,
.s-treatment-info-table__table td {
  padding: var(--space-md) var(--space-lg);
  font-size: var(--font-size-xs);
  line-height: var(--line-height-relaxed);
  border-bottom: 1px solid var(--color-border-light, #f0f0f0);
  vertical-align: top;
  text-align: left;
}

/* 最下部見出し（リッチ流れ：施術概要・リスク・副作用） */
.s-treatment-info-table__heading {
  max-width: var(--width-content);
  margin: 0 auto;
  padding: 0 var(--space-3-xl);
}

/* ── 文字小さめのテーブルデザイン：施術ページ本文の定義型ftbテーブル（自由診療・未承認 等） ── */
.s-base-02 .entry-content .wp-block-flexible-table-block-table:not(:has(thead)) th,
.s-base-02 .entry-content .wp-block-flexible-table-block-table:not(:has(thead)) td {
  padding: var(--space-md) var(--space-lg) !important;
  font-size: var(--font-size-xs) !important;
  line-height: var(--line-height-relaxed);
  border-bottom: 1px solid var(--color-border-light, #f0f0f0);
  vertical-align: top;
  text-align: left;
}

.s-base-02 .entry-content .wp-block-flexible-table-block-table:not(:has(thead)) tr > :first-child {
  width: 28%;
  min-width: 12rem;
  font-weight: var(--font-weight-semibold);
  background: var(--color-bg-sub);
}

.s-treatment-info-table__table th {
  /* 本文ftb定義型の第1列(28%)と揃える */
  width: 28%;
  min-width: 12rem;
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
  background: var(--color-bg-sub);
}

.s-treatment-info-table__table td {
  color: var(--color-text);
}

/* 複数項目セルは disc リストで出力 */
.s-treatment-info-table__list {
  margin: 0;
  padding-left: var(--space-xl);
  list-style: disc;
}

.s-treatment-info-table__list li {
  margin: 0;
  padding-left: var(--space-3-xs);
}

.s-treatment-info-table__list li::marker {
  color: var(--color-primary);
}

.s-treatment-info-table__list li + li {
  margin-top: var(--space-2-xs);
}

/* リスト節が1項目のみ＝素のテキストで出す */
.s-treatment-info-table__text {
  margin: 0;
  font-size: var(--font-size-md);
  line-height: var(--line-height-relaxed);
  color: var(--color-text);
}

/* メタ駆動の最下部ブロック内 h3（c-heading-14ピル）の上下リズム。
   セクション先頭（テーブル無しでリストのみ）でも過剰に空けない。 */
.s-treatment-info-table__inner > .c-heading-14 {
  margin-block-start: var(--space-5-xl) !important;
}
.s-treatment-info-table__inner > .c-heading-14:first-child {
  margin-block-start: var(--space-md) !important;
}

/* ── 子施術カード一覧 ── */
.s-treatment-children {
  padding: var(--space-5-xl) 0;
}

.s-treatment-children__inner {
  container-type: inline-size;
  max-width: var(--width-content);
  margin: 0 auto;
  padding: 0 var(--space-3-xl);
}

.s-treatment-children .c-heading-01 {
  margin-bottom: var(--space-3-xl);
}

/* SP */
@container (max-width: 599px) {
  .s-treatment-info__title {
    font-size: var(--font-size-3-xl);
  }

  .s-treatment-info-table__table th,
  .s-treatment-info-table__table td {
    display: block;
    width: 100%;
    padding: var(--space-md) var(--space-lg);
  }

  .s-treatment-info-table__table th {
    border-bottom: none;
    padding-bottom: var(--space-2-xs);
  }
}