/* =====================================================================
   日台手帳 — WordPress 向けの追加スタイル（デザイン本体は style.css）
   ===================================================================== */

/* 管理バー表示時の固定ヘッダー */
.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-header { top: 46px; } }

/* 繁體中文（<html data-lang="zh">）: LINE Seed TW に差し替える（@font-face は fonts.css）。配色・レイアウトは共通。
   --font-serif / --font-hand / --font-num は style.css で --font-sans を参照しているので、ここは --font-sans だけ上書きすればよい */
html[data-lang="zh"] {
  --font-sans: "LINE Seed TW", "LINE Seed JP", "PingFang TC", "Microsoft JhengHei", system-ui, sans-serif;
}
html[data-lang="zh"] .mode-note { max-width: 190px; }

/* 行き先タブ: 未提供のモード（繁體中文の台湾を旅する） */
.mode-tab.is-soon { opacity: .6; cursor: default; }
.mode-tab.is-soon .soon { font-size: 10px; border: 1px solid currentColor; border-radius: 3px; padding: 0 4px; margin-left: 2px; }

/* 言語メニュー・ドロワーの言語リンク */
.lang-menu a[hreflang] { color: var(--ink); }
.drawer-foot a { text-decoration: underline; text-underline-offset: 2px; }

/* アクセシビリティ用 */
.screen-reader-text { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* ブロックエディタの標準ブロックをデザインの本文スタイルに寄せる */
.article-body .wp-block-heading { font-weight: 700; }
.article-body .wp-block-image, .article-body figure.wp-block-image { margin: 22px 0; }
.article-body .wp-block-image img, .article-body img:not(.ph img) { height: auto; border-radius: 8px; }
.article-body .wp-block-image figcaption, .article-body figcaption { font-size: 11px; color: var(--ink-3); margin-top: 6px; text-align: right; }
.article-body .wp-block-table { overflow-x: auto; margin: 18px 0; }
.article-body .wp-block-table table { width: 100%; border-collapse: collapse; font-size: 13.5px; background: #fff; }
.article-body .wp-block-table th, .article-body .wp-block-table td { border: 1px solid var(--line); padding: 8px 10px; text-align: left; }
.article-body .wp-block-table th { background: var(--paper-2); font-weight: 700; }
.article-body .wp-block-quote { border-left: 3px solid var(--accent); padding: 6px 14px; color: var(--ink-2); background: #fff; margin: 18px 0; }
.article-body .wp-block-embed { margin: 22px 0; }
.article-body .wp-block-embed iframe { max-width: 100%; }
.article-body .wp-block-list, .article-body ul.wp-block-list { padding-left: 1.4em; margin: 12px 0; }
.article-body .wp-block-list li { margin: 4px 0; }
.article-body .aligncenter { display: block; margin-left: auto; margin-right: auto; }
.article-body .alignwide, .article-body .alignfull { max-width: 100%; }

/* アイキャッチ（実画像）を .ph の中で全面表示 */
.ph img.wp-post-image, .ph img.attachment-large, .ph img.attachment-medium_large, .ph img.attachment-jptw-card, .ph img.attachment-jptw-hero { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* 地域のシルエットアイコン（エリアピル・地方ボタン。inc/template-tags.php jptw_area_icon。塗り色は地図の色） */
.area-ic { width: 32px; height: 32px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex: none; color: var(--ink); background: var(--paper-2); }
.area-ic .ic { width: 20px; height: 20px; }
/* 地方ボタン・ヘッダーのエリアメニューはバッジ無しのアイコンだけ（.area-ic--plain。色・大きさは style.css の Area）。インライン style は付かない */
.area-ic--plain { background: none; }
.region-btn:hover .area-ic--plain .ic { color: var(--accent-ink); }

/* 店舗情報ブロックの簡略地図（inc/template-tags.php jptw_mini_map の SVG 文字）も LINE Seed に */
.map svg text { font-family: var(--font-sans); }

/* 店舗情報ブロックの Google マップ埋め込み */
.map--embed { aspect-ratio: 16 / 7; border-radius: 8px; overflow: hidden; margin-top: 12px; background: #EEF2EC; }
.map--embed iframe { width: 100%; height: 100%; border: 0; }

/* 広告枠（実タグ差し込み時） */
.ad-tag { display: flex; justify-content: center; align-items: center; margin: 0 auto; }

/* 検索結果の 0 件 */
.empty { background: #fff; border: 1px dashed var(--line-2); border-radius: var(--radius); padding: 28px 16px; text-align: center; color: var(--ink-2); font-size: 14px; }

/* ページネーション（WP 側で生成する場合の互換） */
.pagination .page-numbers { display: inline-flex; }

/* 一覧の絞り込みセレクトは選択で送信（wp.js）。JS 無効時のための送信ボタン */
.filter-bar .filter-submit { display: none; }
.no-js .filter-bar .filter-submit { display: inline-flex; }

/* ---------- Contact Form 7（デザインの .form を適用） ---------- */
.form .lbl { display: flex; align-items: center; }
.form .wpcf7-form-control-wrap { display: block; }
.form .wpcf7-acceptance .wpcf7-list-item { margin: 0; }
.form .check { display: block; }
.form .wpcf7-acceptance label { display: flex; align-items: center; gap: 8px; font-weight: 500; font-size: 13.5px; }
.form .wpcf7-acceptance input { width: 18px; height: 18px; accent-color: var(--accent); flex: none; }
.form .wpcf7-acceptance a { text-decoration: underline; text-underline-offset: 3px; }
.form .wpcf7-not-valid-tip { display: block; font-size: 12px; font-weight: 500; color: var(--accent-ink); margin-top: 4px; }
.form .wpcf7-form-control.wpcf7-not-valid { border-color: var(--accent); }
.form .actions { flex-wrap: wrap; align-items: center; gap: 8px; }
.form .wpcf7-submit { cursor: pointer; font-family: inherit; }
.form .form-note { font-size: 12px; color: var(--ink-3); text-align: center; margin: 0; }
.wpcf7-spinner { margin: 0; }
.wpcf7 form .wpcf7-response-output { margin: 16px 0 0; padding: 12px 14px; border-radius: 8px; font-size: 13.5px; border: 1px solid var(--accent-soft); background: var(--accent-tint); color: var(--ink-2); }
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.failed .wpcf7-response-output, .wpcf7 form.aborted .wpcf7-response-output, .wpcf7 form.spam .wpcf7-response-output { border-color: #E8B4A8; background: #FBE9E4; color: #9E2C16; }
.wpcf7 form.sent .wpcf7-response-output { border-color: #BFD8CC; background: #E2EEE9; color: #1A4F42; }

/* ---------- 2026-10-12 修正指示（記事ページ）。style.css はデザイン v1.0 の写しなので上書きはここに置く ---------- */
/* 修正 1: 記事ページ（/articles/{slug}/ ・ /jp/articles/{slug}/）の背景は白 */
body.single-post { background: #fff; }
body.single-post #main { background: #fff; }
/* 修正 3: 記事末の共有ボタンは親要素の幅いっぱいに均等配置。SNS は正規ロゴ（inc/template-tags.php jptw_share） */
.share-row { max-width: none; }
.share-btn .ic--brand { width: 16px; height: 16px; }
.share-btn--icon .ic--brand { width: 15px; height: 15px; }
/* 修正 4: 編集方針の注記の上側余白（PC） */
@media (min-width: 1024px) {
  .policy-link { margin-top: 32px; }
}
/* 修正 5: フッター上端の線は出さない */
.site-footer { border-top: 0; }
/* SP の横スクロール対策（2026-10-12）: 本文内の CTA ボタン（.btn は white-space: nowrap）が 320px 幅で画面幅を超えていたので折り返す。
   html の overflow-x: clip はビューポートに hidden として適用され、ページ全体の横スクロールを起こさない保険（内側の .area-scroll / .cat-scroll 等の横スクロールには影響しない） */
.article-body .btn { white-space: normal; max-width: 100%; text-align: center; line-height: 1.4; }
html { overflow-x: clip; }

/* ---------- 記事数に応じた表示（inc/sparse.php）。記事が少ない間の「準備中」・件数・代替リスト ---------- */
.soon { display: inline-block; font-size: 10px; font-weight: 500; line-height: 1.7; padding: 0 7px; border-radius: 999px; background: var(--paper-2); color: var(--ink-3); border: 1px solid var(--line-2); white-space: nowrap; vertical-align: middle; }
.cnt { font-family: var(--font-num); font-style: italic; font-weight: 400; font-size: 11px; color: var(--ink-3); margin-left: 4px; }
/* 地方ボタン・カテゴリカード・メガメニュー: 記事のないものは薄く、リンクなし（地方ボタンは style.css の .region-btn.is-soon = 灰色の文字＋名前の下に「準備中」） */
.cat-card.is-soon, .mega-col.is-soon { opacity: .55; cursor: default; }
.region-btn.is-soon { cursor: default; }
.region-btn.is-soon:hover, .cat-card.is-soon:hover { border-color: var(--line); color: var(--ink-3); box-shadow: none; transform: none; }
.cat-card.is-soon .ic { filter: grayscale(1); }
.region-btn-r .cnt { margin: 0; }
.cat-card.is-soon { gap: 4px; }
.mega-col.is-soon .mega-head { cursor: default; }
.mega-col .soon { margin-left: 6px; }
/* 日本地図: 記事のない地方は薄く */
.area-map .region.is-empty { cursor: default; }
.area-map .region.is-empty path { opacity: .32; }
.area-map .region.is-empty:hover path { filter: none; }
.area-map .region.is-empty text { fill: var(--ink-3); }
/* エリア一覧ページ */
.area-block.is-soon { opacity: .6; }
.area-block h3 .cnt, .area-block h3 .soon { margin-left: 2px; }
.area-block .prefs span.is-soon { font-size: 13px; padding: 5px 10px; border: 1px dashed var(--line-2); border-radius: 999px; color: var(--ink-3); background: transparent; }
/* 番号なしのリスト（ランキングの代わりの新着） */
.ranking--plain .rank { grid-template-columns: 96px 1fr; }
.ranking--compact.ranking--plain .rank { grid-template-columns: 72px 1fr; }
/* トップ: サイドバー無しの 1 カラム */
.layout--single { grid-template-columns: minmax(0, 1fr) !important; }
.layout--single .ad-wrap { padding-top: 28px; }
/* 0 件のときのフォールバック（新着） */
.fallback { margin-top: 32px; }
/* 絞り込みバー: 片方だけのとき */
.filter-row--1 { grid-template-columns: 1fr; }
.filter-bar--subs { grid-template-columns: 1fr !important; }
/* 特集一覧: 準備中の特集 */
.soon-list { padding-top: 32px; }
.soon-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.soon-item { background: #fff; border: 1px dashed var(--line-2); border-radius: var(--radius); padding: 14px 16px; }
.soon-item h3 { font-family: var(--font-serif); font-size: 16px; margin-top: 8px; color: var(--ink-2); }
.soon-item p { font-size: 12.5px; color: var(--ink-3); margin-top: 4px; }
@media (min-width: 1024px) {
  .ranking--plain .rank { grid-template-columns: 100px 1fr; }
  .ranking--compact.ranking--plain .rank { grid-template-columns: 72px 1fr; }
  .filter-row--1 { grid-template-columns: 170px; }
}
/* 記事をさがす（.finder）: セレクトが 1 つ／0 のときのフォーム列 */
@media (min-width: 768px) {
  .finder--sel1 .finder-form { grid-template-columns: 1.4fr 1fr auto; }
  .finder--sel0 .finder-form { grid-template-columns: 1fr auto; }
}
/* 地方ボタンの「準備中」: 名前を折り返さない */
.region-btn.is-soon .region-btn-name { white-space: nowrap; }