/* =====================================================================
   LISA’S ATELIER ハイライト式 ― テーマで足した画面（theme.css）
   実装担当。トップ以外のページ（固定ページ・投稿・一覧・404・予約のページ・企画のページ）で読む。
   - 読む順：fonts.css → tokens.css → base.css → nav → booking/line → footer →（予約のページ：rental-page）→ この theme.css。
   - 値は tokens.css の変数だけ（design.md「共通ルール」）。色・フォント・サイズは足さない。
   - クラスの頭は entry-（テーマの画面）。プラグインの画面を守る所は、プラグインの外側のクラス（.lisa47-project・.lrr-section）から。
   ===================================================================== */

/* ---------- 1. テーマの画面（固定ページ・投稿・一覧・404） ---------- */
.page-main { min-height: 50svh; }
.entry-head .entry-date { color: var(--color-text-sub); }

/* 本文（ブロックエディターで書いたもの）。段落の間・見出し・箇条書き・表・写真 */
.entry-content { overflow-wrap: anywhere; }
.entry-content > * + * { margin-top: 1em; }
.entry-content > :is(h2, h3, h4) { margin-top: var(--space-7); }
.entry-content h2 { font-size: var(--fs-md); }
.entry-content h3 { font-size: var(--fs-base); }
.entry-content h4 { font-size: var(--fs-sm); }
.entry-content ul,
.entry-content ol { margin: 0; padding-left: 1.4em; }
.entry-content li + li { margin-top: var(--space-1); }
.entry-content li::marker { color: var(--color-accent); }
.entry-content img { height: auto; border-radius: var(--radius-sm); }
.entry-content figure { margin-inline: 0; }
.entry-content figcaption { margin-top: var(--space-2); color: var(--color-text-sub); font-size: var(--fs-xs); }
.entry-content blockquote {
  margin-inline: 0;
  padding-left: var(--space-4);
  border-left: 2px solid var(--color-accent);
  color: var(--color-text-sub);
}
.entry-content hr { border: 0; border-top: 1px solid var(--color-border); }
.entry-content table {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  border-collapse: collapse;
  font-size: var(--fs-sm);
  line-height: var(--lh-snug);
}
.entry-content th,
.entry-content td {
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--color-border);
  text-align: start;
  vertical-align: top;
}
.entry-content th { background: var(--color-bg-sub); font-weight: var(--fw-bold); }
.entry-content .wp-block-button__link { border-radius: var(--radius-pill); }
.entry-content :is(.alignwide, .alignfull) { max-width: 100%; }

/* 一覧（お知らせ・カテゴリー・投稿者・検索） */
.entry-list { display: grid; gap: var(--space-3); margin: 0; padding: 0; list-style: none; }
.entry-card { gap: var(--space-1); color: inherit; text-decoration: none; }
@media (hover: hover) {
  .entry-card:hover .entry-card-title { color: var(--color-accent-text); }
}
.entry-empty { color: var(--color-text-sub); }

/* 前へ・次へ（一覧のページ・投稿の前後） */
.pagination,
.post-navigation { margin-top: var(--space-7); }
.pagination .nav-links,
.post-navigation .nav-links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-4);
  align-items: center;
  font-size: var(--fs-sm);
}
.pagination .page-numbers,
.post-navigation a {
  display: inline-flex;
  align-items: center;
  min-height: var(--tap);
  min-width: var(--tap);
  justify-content: center;
  color: var(--color-text);
}
.pagination .page-numbers.current { font-weight: var(--fw-bold); color: var(--color-accent-text); }
.post-navigation .nav-next { margin-left: auto; }

/* トップへ戻る */
.entry-back { display: flex; margin-top: var(--space-7); }
.entry-back--center { justify-content: center; }

/* パスワードで守ったページの form */
.post-password-form input[type="password"] {
  min-height: var(--tap);
  padding: 0 var(--space-3);
  border: 1px solid var(--color-border-strong);
  border-radius: var(--radius-sm);
  background: var(--color-surface);
  font-size: var(--fs-input);
}

/* ---------- 2. プラグインの画面を守る所（プラグインのファイルは変えない） ---------- */
/* ダークのとき：プラグインの画面は今のサイトと同じライトの色のまま（design.md 23.・karte.md ★レンタル5）。
   入力欄・ボタンなどの形（ブラウザの標準の色）もライトにして、紺の字が暗い地に乗らないようにする */
.lisa47-project,
.lrr-section { color-scheme: light; }

/* 47都道府県の交換便：企画のページ（プラグインの templates/project-page.php。<main class="lisa47-project">）
   - プラグインの CSS は、今のテーマの上に重なる帯（86px）の分だけ上をあけている。このテーマの上の帯は
     ページの流れの中にある（sticky）ので、その分のすき間ができる。上のすき間だけ消す（ほかはプラグインのまま）。
   - base.css の見出しの字（Kiwi Maru）・字間・行の高さ・改行の決まりが、プラグインの見出しに入らないようにする
     （プラグインの CSS が自分で書いていない所は、今のサイトと同じく受け継いだ字のまま）。
   - base.css の img { display: block } で、ラーメンと付け襟の絵（×の両わき）が縦に並ばないように、今のテーマと同じ inline に。 */
body .lisa47-project { padding-top: 0; } /* プラグインの .lisa47-project { padding-top: 86px } より強く（プラグインの CSS はこのあとに読まれる） */
.lisa47-project :is(h1, h2, h3, h4) {
  font-family: inherit;
  font-weight: inherit;
  line-height: inherit;
  letter-spacing: inherit;
  text-wrap: wrap;
  word-break: normal;
}
body .lisa47-project,
body .lisa47-project :is(button, input, select, textarea) { letter-spacing: normal; }
.lisa47-project .lisa47-intro-icons img { display: inline-block; vertical-align: middle; }

/* レンタル予約：予約のページ（page-rental.php。部品 booking/rental-page の data-slot="rental-plugin" の中）
   - 字間：body の字間（--ls-body）がプラグインの中に受け継がれないように、ふつうに戻す（#campaign の部品と同じ考え方）。
   - iPhone（〜767px）：外側の囲み（.card--soft）の余白と、ページの左右の余白の中では、プラグインの画面がせまくなり
     （390px で中の幅 約 276px）、札がはみ出し・見出しが「た／め」で切れる。そのため iPhone では囲みを外し、
     今のサイトと同じく画面の幅いっぱいにする（中の色・文字・余白はプラグインのまま）。PC は囲みのまま。 */
.rental-page-plugin { letter-spacing: normal; }
@media (max-width: 767px) {
  .rental-page .rental-page-plugin {
    margin-inline: calc(var(--gutter) * -1);
    padding: 0;
    border-radius: 0;
    background: transparent;
  }
  .rental-page-plugin .lrr-section:not(.lrr-section--waved) {
    margin-block: 0;
    border-radius: 0;
  }
}

/* 予約のページの中身が空のとき（プラグインが止まっている・表示が「公開」でない）：1行と DM のボタン（v2） */
.rental-page-closed {
  display: grid;
  justify-items: center;
  gap: var(--space-4);
  padding-block: var(--space-6);
  text-align: center;
}
