/*
Theme Name: 湯呑屋。のひだまり
Theme URI: https://yunomiya-no-hidamari.com/
Author: 湯呑屋。
Description: 小説執筆ノウハウブログ「湯呑屋。のひだまり」のリニューアルテーマ。デザインは css/style.css（静的モック site_design と共通）。旧Cocoon記事の互換スタイル入り。
Version: 1.0.6
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: yunomiya
*/

/* ==========================================================
   WordPress 専用の補助スタイル（デザイン本体は css/style.css）
   ========================================================== */

/* 広告ウィジェット（目次の下 / まとめの下 / サイドバー）。空なら何も出力しない */
.ad-area { margin-top: var(--sp-xl); text-align: center; }
.sidebar .ad-area { margin-top: 0; }
.ad-area .widget + .widget { margin-top: var(--sp-md); }

/* WP標準のクラス */
.screen-reader-text {
  border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
  height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important;
}
.alignleft { float: left; margin: 0 24px 16px 0; }
.alignright { float: right; margin: 0 0 16px 24px; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.wp-caption { max-width: 100%; }
.wp-caption-text { margin-top: 12px; font-size: 12.5px; color: var(--faint); text-align: center; }
.article-body::after { content: ""; display: table; clear: both; }

/* ブロックエディタの「ハイライト」はサイトのマーカー（下半分の黄色）で表示する */
.article-body mark { background: linear-gradient(transparent 62%, var(--marker) 62%) !important; color: inherit; padding: 0; }

/* 固定ページ本文の先頭（h1 の直後） */
.page-body { margin-top: 32px; }

/* 記事の実践枠（カスタムフィールドで入れた場合のみ表示） */
.practice .p-body p { margin: 0; }

/* コメント（wp_list_comments / comment_form の出力をデザインに合わせる） */
.comments .comment-list { list-style: none; margin: 0; padding: 0; }
.comments .comment-list li.comment { flex-wrap: wrap; }
.comments .comment-list .children { flex-basis: 100%; list-style: none; margin: 8px 0 0 56px; padding: 0 0 0 20px; border-left: 2px solid var(--border-blue); }
.comments .comment-list .children .comment { padding: 16px 0 0; border-bottom: none; }
.comments .comment .c-body { flex: 1; min-width: 0; }
.comments .comment .c-body p { margin: 10px 0 0; }
.comments .comment .c-reply { margin-top: 8px; font-size: 12px; }
.comments .comment .face img { width: 100%; height: 100%; object-fit: cover; }
.comments .no-comments { margin-top: 24px; font-size: 14px; color: var(--muted); }
/* 「コメントを書く」見出しごと枠に入れる（#respond を枠にする） */
.comments .comment-respond { margin-top: 36px; background: var(--bg-sub); border: 1px solid #DDD6C6; padding: 28px 32px 32px; }
.comments .comment-respond .comment-form { margin: 0; background: none; border: none; padding: 0; }
.comment-form p { margin: 0; }
.comment-form .comment-form-comment { margin-top: 16px; }
.comment-form .f-grid { margin-top: 16px; }
.comment-form .comment-notes, .comment-form .logged-in-as { margin-top: 12px; font-size: 12px; color: var(--muted); }
.comment-form .comment-form-cookies-consent { display: flex; gap: 8px; align-items: baseline; margin-top: 12px; font-size: 12px; color: var(--muted); }
.comment-form .comment-form-cookies-consent input { width: auto; }
.comment-form .form-submit { margin-top: 18px; text-align: right; }
.comment-form label { display: block; margin-bottom: 6px; font-size: 13px; font-weight: 700; }
.comment-reply-title { font-size: 13px; font-weight: 700; letter-spacing: .24em; color: #6E6A5F; margin: 0; }
.comment-reply-title small { margin-left: 12px; letter-spacing: 0; font-weight: 500; }

/* Contact Form 7（お問い合わせページ）をフォーム共通デザインに合わせる */
.wpcf7 form > p, .wpcf7 form .wpcf7-form-control-wrap { display: block; }
.wpcf7 form > p { margin: 28px 0 0; font-size: 13.5px; font-weight: 700; }
.wpcf7 input[type="text"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"], .wpcf7 input[type="url"], .wpcf7 textarea, .wpcf7 select {
  width: 100%; margin-top: 10px; border: 1px solid #B9B4A6; background: #FFFFFE;
  padding: 13px 16px; font-size: 15px; font-weight: 400; color: var(--text); outline: none; line-height: 1.8;
}
.wpcf7 input:focus, .wpcf7 textarea:focus, .wpcf7 select:focus { border-color: var(--accent); }
.wpcf7 input[type="submit"] {
  background: var(--accent-deep); color: #fff; border: none; font-size: 14px; font-weight: 700; letter-spacing: .06em;
  padding: 14px 56px; cursor: pointer; transition: background .15s ease;
}
.wpcf7 input[type="submit"]:hover { background: var(--accent-hover); }
.wpcf7 .wpcf7-response-output { margin: 24px 0 0 !important; padding: 12px 16px !important; font-size: 13px; }

/* 管理バー表示時: スマホ幅（600px以下）では管理バーはスクロールで流れるので、追従ヘッダーは上端でよい */
@media (max-width: 600px) {
  .admin-bar .site-header { top: 0; }
}