/*
  WordPress 固有の事情に対処するための上書き。
  tp.css は元サイトからそのまま持ってきたもので触らない決まりなので、
  「WordPress だからこうなる」という調整はすべてここに書く。
  読み込み順は reset.css → tp.css → wp.css（このファイルが最後）。
*/

/* ============================================================
   管理バーとヘッダーの重なり

   ログインすると WordPress が html に margin-top:32px を !important で当てる。
   ところが .tpHdr は position:fixed なので、この margin の影響を受けず
   画面の一番上に貼り付いたままになる。
   一方 .tpKv は通常フローなので 32px ぶん下がる。
   結果、ヘッダーの下端(84px)とヒーローの上端(116px)のあいだに
   32px の白い隙間ができる（実測で確認）。

   固定ヘッダーを管理バーのぶんだけ下げれば、両者の位置が揃って隙間が消える。
   数値は WordPress の admin-bar.css が使っているものと同じ。
   ============================================================ */

body.admin-bar .tpHdr {
	top: 32px;
}

@media screen and (max-width: 782px) {
	body.admin-bar .tpHdr {
		top: 46px;
	}
}

/*
  600px 以下では管理バーが position:absolute になり、スクロールで流れて消える。
  ヘッダーを 46px 下げたままだと、スクロール後に上へ 46px の白帯が残る。
  そのため、この幅のときだけ「一番上にいるか」で切り替える。
  切り替えは assets/js/chrome.js の initAdminBar が担当し、
  スクロールすると body に isScrolled が付く。
*/
@media screen and (max-width: 600px) {
	body.admin-bar.isScrolled .tpHdr {
		top: 0;
	}
}

/* ============================================================
   ブロックエディタで書いた本文

   お知らせ・コラムの本文は the_content() で出るため、
   .tpProse の中に WordPress のブロックが入ってくる。
   段落や見出しは .tpProse の指定で足りるが、
   ブロック特有のものだけ最低限そろえる。
   ============================================================ */

.tpProse .wp-block-image {
	margin-top: 24px;
}

.tpProse .wp-block-image img {
	max-width: 100%;
	height: auto;
	border-radius: 6px;
}

.tpProse figcaption {
	margin-top: 8px;
	font-size: 13px;
	color: #6f7d76;
}

.tpProse .wp-block-quote {
	margin-top: 24px;
	padding-left: 20px;
	border-left: 3px solid var(--accent);
}