/* ==========================================================================
   mz-post-color.css — 投稿関連ページのカラー調整
   ==========================================================================
   お知らせ / ブログ / 投稿詳細 / カテゴリー・月別アーカイブ / 検索結果で、
   octheme 標準のレイアウト・カード構造・余白・サイドバー構造・
   ページネーション・サムネイル表示はそのまま維持し、配色だけを
   mizunoshika 既存サイトの色へ寄せる。

   読み込み条件は inc/mz-functions.php の mz_is_post_design_page()。
   スコープは body.mz-post のみで、コンタクト / 完了 / 404 / 固定ページ /
   TOP には一切適用されない。

   mizunoshika 既存サイトから抽出した色（新しい色は追加していない）:
     #2f4c70  見出し帯 .gnv_tmp_h3_bg（mz-static.css）／メインカラー
     #063267  ボタン .btn01 ／フッター見出し --mz-color-footer-heading
     #172c44  リンク --mz-color-link（mz-common.css）
     #514e47  本文 --mz-color-text（mz-common.css）
     #e6edf6  フッター背景 --mz-color-footer-bg（mz-common.css）
     #ccc     表・入力欄の罫線（mz-static.css / oc-blog-style.css）
   ========================================================================== */

/* --------------------------------------------------------------------------
   カラートークンの差し替え
   --------------------------------------------------------------------------
   octheme の投稿系 CSS は色の大半を --wp--preset--color--* 経由で参照している。
   primary（メインカラー #2f4c70）は theme.json でサイト全体に適用済みなので、
   ここでは投稿系だけ変えたい残りの 2 色を body.mz-post で上書きする。
   継承で解決される変数なので !important も詳細度の細工も不要。 */
body.mz-post {
	/* 旧 #0d6efd。theme.json の elements.link が参照するリンク色. */
	--wp--preset--color--accent: #172c44;
	/* 旧 #212529。本文色. */
	--wp--preset--color--text: #514e47;
}

/* --------------------------------------------------------------------------
   トークンを経由していない色（oc-blog-style.css 内の直接指定）
   --------------------------------------------------------------------------
   いずれも body.mz-post を前置して詳細度で上回らせている。 */

/* 淡い青の面（ページネーションの現在ページ / カテゴリー件数バッジ /
   警告ボックス / 記事内カテゴリーラベル）: 旧 #e6ebf5 → フッターと同じ #e6edf6 */
body.mz-post .pagination .page-numbers.current {
	background-color: #e6edf6;
	border-color: #e6edf6;
}

body.mz-post .blog-sidebar .cate-sidebar .cat-item a .cat-count,
body.mz-post .blog-content .warning-box,
body.mz-post .blog-content .insert-blog .insert-cate {
	background-color: #e6edf6;
}

/* 罫線・枠: 旧 #959fb1（青みがかったグレー）→ サイト内で使っている #ccc */
body.mz-post .blog-sidebar .cate-sidebar .cat-item,
body.mz-post .blog-sidebar .wp-block-latest-posts__list.wp-block-latest-posts li {
	border-bottom-color: #ccc;
}

body.mz-post .author-content,
body.mz-post .blog-content .insert-blog {
	border-color: #ccc;
}

/* 文字色: 旧 #333333 → 本文色 #514e47 */
body.mz-post .blog-sidebar .cate-sidebar .cat-item a .cat-name,
body.mz-post .blog-sidebar .wp-block-latest-posts__list.wp-block-latest-posts a,
body.mz-post .blog-sidebar .wp-block-latest-posts__list.wp-block-latest-posts a:hover,
body.mz-post .blog-content figcaption {
	color: #514e47;
}

/* --------------------------------------------------------------------------
   リンク
   --------------------------------------------------------------------------
   theme.json の elements.link は
     通常 = --wp--preset--color--accent（#172c44）
     hover = --wp--preset--color--primary（#2f4c70）
   となり、上のトークン差し替えだけで mizunoshika の色になる。
   :visited は octheme・theme.json とも未指定で、作成者スタイルの
   `a { color }` が UA スタイルシートの a:visited に優先するため、
   ブラウザ既定の紫にはならない。 */

/* 記事カード全体がリンク（octheme 標準）。カード内の色は
   タイトル = .text-primary-color、日付 = .text-dark で個別指定されており、
   カテゴリー名だけがリンク色を継承する。 */
body.mz-post .blog-item:hover .blog-title {
	text-decoration: underline;
}

/* --------------------------------------------------------------------------
   ボタン・ページネーションの状態色
   --------------------------------------------------------------------------
   octheme は .back-btn / .pagination / .article-pagination に hover・focus の
   指定を持っていない（枠と文字色だけ）。形・サイズはそのままに、octheme 自身の
   .more-info-btn と同じ「通常は白抜き、hover で塗りつぶし」のパターンへ揃える。
   色は上のトークン（#2f4c70 / #063267）だけを使い、新しい色は足していない。 */

/* 「記事一覧へ」: 文字色を枠と同じメインカラーに（従来はリンク色を継承していた） */
body.mz-post .back-btn {
	color: var(--wp--preset--color--primary);
}

body.mz-post .back-btn:hover,
body.mz-post .back-btn:focus-visible,
body.mz-post .pagination a.page-numbers:hover,
body.mz-post .pagination a.page-numbers:focus-visible {
	background-color: var(--wp--preset--color--primary);
	color: #fff;
}

/* 前後記事リンク: 色だけに頼らず下線でも状態が分かるようにする */
body.mz-post .article-pagination .pagination-link:hover,
body.mz-post .article-pagination .pagination-link:focus-visible {
	color: #063267;
	text-decoration: underline;
}

/* キーボード操作時のフォーカス表示（octheme 側に指定がないため補う） */
body.mz-post .back-btn:focus-visible,
body.mz-post .pagination a.page-numbers:focus-visible,
body.mz-post .oc-searchform__input:focus-visible,
body.mz-post .oc-searchform__submit:focus-visible,
body.mz-post .blog-item:focus-visible,
body.mz-post .blog-sidebar a:focus-visible {
	outline: 2px solid #063267;
	outline-offset: 2px;
}

body.mz-post .oc-searchform__submit:hover {
	background-color: #063267;
	opacity: 1;
}

/* --------------------------------------------------------------------------
   本文中リンクの視認性
   --------------------------------------------------------------------------
   リンク色が octheme 標準の #0d6efd（鮮やかな青）から mizunoshika の
   #172c44（濃紺）へ変わると、本文色 #514e47 との差が小さくなる。
   色だけに頼らず判別できるよう、記事本文のテキストリンクに下線を付ける。
   色は変更していない（装飾のみ）。 */
body.mz-post .blog-content p a,
body.mz-post .blog-content li a,
body.mz-post .blog-content td a,
body.mz-post .blog-content th a {
	text-decoration: underline;
}