/* ===== Therapist 個別ページ専用（縦積み・安定版） ===== */

/* 器 */
body.single-therapist #main.tl-wrap{
  max-width: 1180px;
  margin: 0 auto;
  padding: 32px 20px 80px;
}

/* 既存テーマのfloat/レイアウトを無効化 */
body.single-therapist .tl-profile,
body.single-therapist .ek-hero,
body.single-therapist .ek-main,
body.single-therapist .tl-card,
body.single-therapist .tl-sec{
  float:none !important;
  width:auto !important;
  clear:none !important;
  position:static !important;
}

/* 縦積みの基本余白 */
body.single-therapist .tl-profile.is-vstack > *{ margin-bottom:28px; }

/* ===== 画像エリア ===== */
body.single-therapist .ek-main{ margin:0; }
body.single-therapist .ek-main img{
  display:block; width:100%; height:auto; object-fit:cover; border-radius:12px;
}

/* サムネ：常に表示（横スクロール可） */
body.single-therapist .ek-thumbs{
  display:flex !important;
  gap:10px;
  margin:12px 0 0;
  padding:6px 2px;
  overflow-x:auto;
  scrollbar-width:thin;
  -webkit-overflow-scrolling:touch;
}
body.single-therapist .ek-thumbs li{ list-style:none; flex:0 0 auto; }
body.single-therapist .ek-thumb{
  display:block; width:86px; height:86px;
  border-radius:10px; overflow:hidden;
  border:2px solid transparent; background:#f6f6f6;
  cursor:pointer; padding:0;
}
body.single-therapist .ek-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
body.single-therapist .ek-thumb.is-active{ border-color:#f4b65b; }

/* ===== プロフィールカード ===== */
body.single-therapist .tl-card{
  background:#fff;
  border-radius:14px;
  box-shadow:0 8px 24px rgba(0,0,0,.06);
  padding:20px 22px;
}
body.single-therapist .tl-name{ font-size:1.6rem; margin:0 0 6px; }
body.single-therapist .tl-meta{ margin:10px 0 12px; padding:0; }
body.single-therapist .tl-meta li{
  list-style:none;
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:8px 0;
  background:transparent !important;
  border:0 !important; box-shadow:none !important;
  min-width:0; white-space:normal;
}
body.single-therapist .tl-meta li span{ color:#8e8e8e; font-size:.92rem; }
body.single-therapist .tl-meta li b{ font-weight:600; }

/* CTA / SNS / タグ */
body.single-therapist .tl-cta{ margin:10px 0 8px; }
body.single-therapist .tl-btn{
  display:inline-block; padding:10px 16px; border-radius:24px; font-weight:700;
  background:#ff8f6b; color:#fff; text-decoration:none;
}
body.single-therapist .tl-btn--ghost{
  background:#fff; color:#ff8f6b; border:1px solid #ff8f6b;
}
body.single-therapist .tl-social{ display:flex; gap:10px; flex-wrap:wrap; margin:8px 0; }
body.single-therapist .tl-sns{ font-size:.92rem; text-decoration:none; }
body.single-therapist .tl-tags{ display:flex; gap:8px; flex-wrap:wrap; margin-top:6px; }
body.single-therapist .tl-tag{
  display:inline-block; padding:6px 10px; border-radius:20px; background:#fff8e7; color:#6a4b00; font-size:.9rem; text-decoration:none;
}

/* ===== 本文・セクション ===== */
body.single-therapist .tl-sec{ background:transparent; }
body.single-therapist .tl-title{ font-size:1.2rem; margin:0 0 8px; }
body.single-therapist .tl-content p{ line-height:1.9; }

/* チップ */
body.single-therapist .tl-menu{ display:flex; flex-wrap:wrap; gap:8px; }
body.single-therapist .tl-chip{
  display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border-radius:20px; background:#fff8e7; color:#6a4b00;
}
body.single-therapist .tl-badge{ padding:2px 8px; border-radius:12px; background:#eee; }
body.single-therapist .tl-badge.ok{ background:#d7f5d7; }
body.single-therapist .tl-badge.maybe{ background:#fff7c6; }
body.single-therapist .tl-badge.no{ background:#ffd9d6; }

/* スマホ最適化（安全に余白だけ軽く） */
@media (max-width: 768px){
  body.single-therapist #main.tl-wrap{ padding:20px 14px 80px; }
  body.single-therapist .ek-thumb{ width:74px; height:74px; }
  body.single-therapist .tl-card{ padding:16px 16px; }
}

/* ===== PCの2カラムとセクションの配置を確定（画像左／カード右） ===== */
@media (min-width: 992px){

  /* 2カラムの器 */
  body.single-therapist .tl-profile{
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 420px; /* 左=画像, 右=カード */
    gap: 28px 28px;
    align-items: start;
  }

  /* header(=ヒーロー)は中身だけ並べる */
  body.single-therapist .tl-hero{ display: contents !important; }

  /* 左：画像＋サムネ */
  body.single-therapist .ek-left{ grid-column: 1; }
  body.single-therapist .ek-main{ margin: 0; }
  body.single-therapist .ek-main img{
    display:block; width:100%; height:auto; object-fit:cover; border-radius:12px;
  }
  body.single-therapist .ek-thumbs{
    display:flex !important; gap:10px; margin:12px 0 0; padding:6px 2px;
    overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:thin;
  }
  body.single-therapist .ek-thumbs li{ list-style:none; flex:0 0 auto; }
  body.single-therapist .ek-thumb{
    width:86px; height:86px; padding:0; border-radius:10px; overflow:hidden;
    border:2px solid transparent; background:#f6f6f6; cursor:pointer;
  }
  body.single-therapist .ek-thumb img{ width:100%; height:100%; object-fit:cover; }
  body.single-therapist .ek-thumb.is-active{ border-color:#f4b65b; }

  /* 右：プロフィールカード（常に右カラム） */
  body.single-therapist .tl-head{
    grid-column: 2;
    position: sticky; top: 88px; z-index: 2;
    align-self: start;
    background:#fff; border-radius:14px; padding:20px 22px;
    box-shadow:0 8px 24px rgba(0,0,0,.06);
  }

  /* “本文”だけはカードの直下（右カラム）に来る */
  body.single-therapist .ek-right-content{ grid-column: 2; }

  /* それ以外のセクション（提供メニュー／スケジュールなど）は
     横並びにならないように、ページ幅いっぱい（2カラムをまたいで）縦に積む */
  body.single-therapist .tl-sec{ grid-column: 1 / -1; }

  /* メタ行の謎背景を完全無効化（Cocoon対策） */
  body.single-therapist .tl-head .tl-meta{ margin:14px 0 10px; padding:0; }
  body.single-therapist .tl-head .tl-meta li{
    list-style:none; display:flex; align-items:center; justify-content:space-between;
    gap:10px; padding:8px 0; background:transparent !important; border:0 !important;
    box-shadow:none !important; min-width:0; white-space:normal;
  }
  body.single-therapist .tl-head .tl-meta li span{ color:#8e8e8e; font-size:.92rem; }
  body.single-therapist .tl-head .tl-meta li, 
  body.single-therapist .tl-head .tl-meta li *{ background-image:none !important; }
}

/* ===== SP/タブでは縦積み（ここは“今の表示が完璧”とのことなので変更なしの保険） ===== */
@media (max-width: 991.98px){
  body.single-therapist .tl-profile{ display:block !important; }
  body.single-therapist .tl-head{ position:static; }
  body.single-therapist .ek-thumbs{ margin-top:10px; }
}

/* === 画像カラムが右に寄ってしまうのを完全固定して左寄せ === */
@media (min-width: 992px){
  /* 左カラム（画像＋サムネ）を“左に固定” */
  body.single-therapist .ek-left{
    grid-column: 1 !important;
    justify-self: start !important;
    text-align: left !important;
    margin: 0 !important;
    float: none !important;
  }

  /* figure 自体を全幅にして余白やセンタリングを無効化 */
  body.single-therapist .ek-left .ek-main{
    width: 100% !important;
    margin: 0 !important;
    text-align: left !important;
    float: none !important;
  }

  /* 画像の幅・余白・float を完全リセット（右寄せ対策） */
  body.single-therapist .ek-left .ek-main img{
    display: block !important;
    width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    float: none !important;
  }

  /* 画像のサムネイル列も左寄せ */
  body.single-therapist .ek-thumbs{
    justify-content: flex-start !important;
    text-align: left !important;
  }
}

/* ==== 最優先パッチ：PCの2カラム位置を強制固定（画像=左 / カード=右） ==== */
@media (min-width: 992px){
  /* グリッドそのものを確定 */
  body.single-therapist .tl-profile{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 420px !important;
    grid-column-gap:28px; grid-row-gap:28px;
    justify-items:stretch; align-items:start;
    text-align:left !important;
  }
  /* ヒーローのラッパーを“透明化”して子要素をグリッドの直下にする */
  body.single-therapist .tl-hero{ display:contents !important; }

  /* —— 位置を絶対指定（ここが肝） —— */
  body.single-therapist .ek-left{        grid-column:1 !important; grid-row:1 !important; }
  body.single-therapist .tl-head{        grid-column:2 !important; grid-row:1 !important; }
  body.single-therapist .ek-right-content{grid-column:2 !important; grid-row:2 !important; }
  /* 以降のセクション（提供メニュー/スケジュール等）は2カラムをまたいで縦積み */
  body.single-therapist .tl-sec{
    grid-column:1 / -1 !important; grid-row:auto !important;
    display:block !important; width:100% !important;
  }

  /* テーマ由来の右寄せ/回り込みを完全無効化 */
  body.single-therapist .tl-profile,
  body.single-therapist .tl-profile *{
    float:none !important;
  }
  body.single-therapist .ek-left,
  body.single-therapist .ek-left *,
  body.single-therapist .ek-main,
  body.single-therapist .ek-main img{
    margin:0 !important; text-align:left !important;
    width:100% !important; height:auto !important;
  }

  /* サムネは常に左寄せ */
  body.single-therapist .ek-thumbs{
    justify-content:flex-start !important;
    text-align:left !important;
  }
}

/* ===== 最終パッチ：PCは .tl-hero を強制2カラム（画像 左 / カード 右） ===== */
@media (min-width: 992px){
  /* ヘッダーを確実に2カラム化 */
  body.single-therapist .tl-hero{
    display:flex !important;
    align-items:flex-start !important;
    gap:28px !important;
    width:100% !important;
    float:none !important;
    text-align:left !important;
  }
  /* 左：画像ブロック */
  body.single-therapist .tl-hero .ek-left{
    order:1 !important;
    flex:1 1 0 !important;        /* 左は可変幅 */
    min-width:0 !important;
    float:none !important;
    margin:0 !important;
  }
  body.single-therapist .tl-hero .ek-left .ek-main,
  body.single-therapist .tl-hero .ek-left .ek-main img{
    display:block !important;
    width:100% !important;
    height:auto !important;
    margin:0 !important;
    float:none !important;
    object-fit:cover !important;
  }
  body.single-therapist .tl-hero .ek-thumbs{
    justify-content:flex-start !important;
    margin-top:12px !important;
  }

  /* 右：プロフィールカード（固定幅） */
  body.single-therapist .tl-hero .tl-head{
    order:2 !important;
    flex:0 0 420px !important;     /* 右は420px固定 */
    max-width:420px !important;
    position:sticky !important;
    top:88px !important;
    align-self:flex-start !important;
    float:none !important;
  }

  /* 以降のセクションは幅いっぱいで縦積み（横並びさせない） */
  body.single-therapist .tl-sec{
    display:block !important;
    width:100% !important;
    float:none !important;
    clear:both !important;
  }
}

/* テーマの強い右寄せ/回り込みを全消し（保険） */
body.single-therapist .tl-hero *{
  float:none !important;
}

/* ===== 最終上書きパッチ（PCの右寄り/横並び暴走を完全停止） ===== */

/* 1) とにかく縦積みに固定。過去の grid 指定を無効化 */
@media (min-width: 992px){
  body.single-therapist .tl-profile{
    display:block !important;     /* ← grid を殺す */
    width:100% !important;
  }
}

/* 2) 画像コンテナは .ek-hero。ここを“全幅・左寄せ”に強制 */
body.single-therapist .ek-hero{
  display:block !important;
  width:100% !important;
  text-align:left !important;
  float:none !important;
  margin:0 !important;
  clear:both !important;
}

/* 3) figure と画像の右寄せ/float/余白を全リセット */
body.single-therapist .ek-hero .ek-main,
body.single-therapist .ek-hero .ek-main img{
  display:block !important;
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  margin:0 !important;
  float:none !important;
  object-fit:cover !important;
}

/* 4) サムネは常に左寄せで下に続く */
body.single-therapist .ek-hero .ek-thumbs{
  display:flex !important;
  gap:10px !important;
  margin:12px 0 0 !important;
  padding:6px 2px !important;
  overflow-x:auto !important;
  justify-content:flex-start !important;
  -webkit-overflow-scrolling:touch !important;
  scrollbar-width:thin !important;
}

/* 5) プロフィールカードや以降のセクションは横並び禁止（全幅で縦に積む） */
body.single-therapist .tl-card,
body.single-therapist .tl-sec{
  display:block !important;
  width:100% !important;
  float:none !important;
  clear:both !important;
}

/* 6) 旧指定の影響を念のため掃除（過去の .tl-hero 等を全無効化） */
@media (min-width: 992px){
  body.single-therapist .tl-hero{ display:block !important; }  /* 使ってないが保険 */
}
body.single-therapist .tl-profile *,
body.single-therapist .ek-hero *,
body.single-therapist .tl-card *,
body.single-therapist .tl-sec *{
  background-image:none !important; /* Cocoonの謎装飾対策の保険 */
}

/* =========================
   PCは 画像=左 / カード=右 の2カラムに固定
   ========================= */
@media (min-width: 992px){
  /* 2カラムの器：左(画像) ~680px / 右(カード) 420px */
  body.single-therapist .tl-profile{
    display:grid !important;
    grid-template-columns: minmax(0, 680px) 420px !important;
    column-gap: 32px !important;
    align-items: start !important;
    justify-items: stretch !important;
  }

  /* 位置の確定（ズレ防止に !important） */
  body.single-therapist .ek-hero{ grid-column:1 !important; grid-row:1 !important; }
  body.single-therapist .tl-card{ grid-column:2 !important; grid-row:1 !important; }

  /* 画像の“巨大化/中央寄せ”を完全リセット */
  body.single-therapist .ek-hero{ width:100% !important; margin:0 !important; text-align:left !important; }
  body.single-therapist .ek-hero .ek-main{ width:100% !important; margin:0 !important; }
  body.single-therapist .ek-hero .ek-main img{
    display:block !important;
    width:100% !important;   /* ← カラム幅に収まる */
    height:auto !important;
    margin:0 !important;
    max-width:100% !important;
  }

  /* サムネは左寄せで画像の直下 */
  body.single-therapist .ek-hero .ek-thumbs{
    display:flex !important; gap:10px !important;
    margin:12px 0 0 !important; padding:6px 2px !important;
    justify-content:flex-start !important; overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important; scrollbar-width:thin !important;
  }

  /* カードの見た目（必要なら sticky） */
  body.single-therapist .tl-card{
    width:100% !important;
    position:sticky; top:96px; z-index:1;
    background:#fff; border-radius:14px; box-shadow:0 8px 24px rgba(0,0,0,.06);
    padding:20px 22px;
  }

  /* 以降のセクションは横並び禁止で2カラムをまたいで縦積み */
  body.single-therapist .tl-sec{ grid-column:1 / -1 !important; display:block !important; width:100% !important; }

  /* 旧float/gridの影響を全掃除（保険） */
  body.single-therapist .tl-profile, 
  body.single-therapist .tl-profile *{ float:none !important; }
}

/* ===== キャッチコピー帯を最上段・全幅に固定 ===== */
@media (min-width: 992px){
  /* 帯を1行目・全幅 */
  body.single-therapist .tl-marquee{
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
    margin: 0 0 16px !important;  /* 帯の下に少し余白 */
  }

  /* 画像とカードは2行目に並べる */
  body.single-therapist .ek-hero{ grid-column: 1 !important; grid-row: 2 !important; }
  body.single-therapist .tl-card{ grid-column: 2 !important; grid-row: 2 !important; }

  /* 以降のセクションは帯＋2カラムの下で全幅縦積み */
  body.single-therapist .tl-sec{ grid-column: 1 / -1 !important; grid-row: auto !important; }
}

/* ===== セクション見出し上の余白を調整 ===== */
body.single-therapist .tl-sec {
  margin-top: 36px !important; /* ← 現在の倍以上開いている場合はこのくらいが自然 */
  padding-top: 0 !important;
}

/* 最初のセクション（プロフィール）は画像の直下なので少しだけ狭く */
body.single-therapist .tl-sec:first-of-type {
  margin-top: 28px !important;
}

/* 見出し（h2）自体の余白も軽く詰める */
body.single-therapist .tl-title {
  margin-top: 0 !important;
  margin-bottom: 12px !important;
  line-height: 1.4;
}

/* ===============================
   ▼ 余白調整：各セクション見出し上を詰める
   =============================== */

/* セクション共通：上の余白をややタイトに */
body.single-therapist .tl-sec {
  margin-top: 18px !important; /* 以前よりさらに詰める */
}

/* 「提供メニュー」だけはさらに詰める */
body.single-therapist .tl-sec.tl-sec--menu {
  margin-top: 12px !important;
}

/* 「今週のスケジュール」もさらに詰める */
body.single-therapist .tl-sec.tl-sec--schedule {
  margin-top: 12px !important;
}

/* 見出し自体の上余白も軽く */
body.single-therapist .tl-title {
  margin-top: 0 !important;
  margin-bottom: 8px !important;
}


/* ===============================
   ▼ ボタン色：在籍一覧に戻るをオレンジ固定
   =============================== */
body.single-therapist .tl-btn--back {
  background: #ff8f6b !important;
  color: #fff !important;
  border: 1px solid #ff8f6b !important;
  box-shadow: 0 0 0 2px rgba(255,143,107,.25);
}
body.single-therapist .tl-btn--back:hover {
  filter: brightness(0.95);
}

/* === セクション間の余白をさらにタイトに（相殺対策込み） === */
body.single-therapist .tl-sec{
  margin-top: 12px !important;      /* 上を小さく */
  margin-bottom: 12px !important;   /* 下も小さく（相殺の元をカット） */
  padding-top: 0 !important;
}

/* 見出しの上ぶれを完全に止める */
body.single-therapist .tl-sec > *:first-child{
  margin-top: 0 !important;
}
body.single-therapist .tl-title{        /* 見出し自体 */
  margin-top: 0 !important;
  margin-bottom: 8px !important;
}

/* 提供メニュー：下側も詰める（次のセクションとの相殺対策） */
body.single-therapist .tl-sec--menu{
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}
body.single-therapist .tl-menu{          /* チップ群の余白も控えめに */
  margin-bottom: 8px !important;
}

/* 今週のスケジュール：最上部に見出しが来る実装でも上マージンを無効化 */
body.single-therapist .tl-sec--schedule{
  margin-top: 10px !important;
}
body.single-therapist .tl-sec--schedule :where(h2,h3,h4):first-child{
  margin-top: 0 !important;
}