/* ==========================================================================
   Leader Books スキン追加分
   トークン（色・書体・角丸・影）は style.css の :root が正本。
   ここには leader-books 固有の意匠だけを置く：書店の棚と書評誌の基調
   として、木の棚板、朱赤の判（セクションの番号・編集者の判）、本の背を
   思わせる表紙まわり、書誌の罫線。
   1.0.5 からは header.php／single.php／template-parts/guide-cards.php
   も子テーマで上書きし、共通部品の DOM 構造そのものを書店の形に
   組み替えている（このファイルには、その新部品の意匠も置く）。
   ========================================================================== */

/* ---- ヘッダー下は強い罫で締め、フッター（濃茶の帯）の手前には二重罫 ----
   サンプルのヘッダーは紙面に1本の罫、フッターは帯の手前の罫で誌面を
   区切る基調。親のフッターは --navy（濃茶）の帯になるため、帯の手前に
   二重罫を引いて書誌の奥付らしくする。 */
.bmb-site-header {
	border-bottom: 1px solid var(--lb-line2);
}

.bmb-footer {
	border-top: 3px double var(--lb-line2);
}

/* フッター下段の区切りは、親指定が kikuo-fun の金色前提なので紙色に読み替える */
.bmb-footer__bottom {
	border-top-color: rgba(250, 244, 230, 0.3);
}

@media (prefers-color-scheme: dark) {
	.bmb-footer__bottom {
		border-top-color: rgba(242, 232, 210, 0.3);
	}
}

/* ---- ヘッダー：書店の「看板」（1.0.5。header.php 上書きの新部品） ----
   1.0.4 までは親のヘッダー（左にサイト名／右にピル列）を CSS で縦積みに
   組み替えて看板に見立てていたが、モバイルではブランドが消え、ピルの
   形も他サイトと共通のままだった。1.0.5 では header.php を上書きし、
   看板そのものの DOM にした：中央に大きな明朝のサイト名、その下に
   キャッチコピー（タグライン）、さらに下に「・」区切りのテキスト
   ナビを中央寄せ。モバイルでも看板は出す。フレッシュバーは廃止。
   スマートヘッダーの土台（.bmb-site-header の sticky／transform）は
   親のまま効く。 */
.bmb-lb-header__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	padding-top: 18px;
	padding-bottom: 12px;
}

.bmb-lb-kanban {
	text-align: center;
}

.bmb-lb-kanban__name {
	font-family: var(--font-serif);
	font-weight: 900;
	font-size: 1.875rem;
	letter-spacing: 0.05em;
	color: var(--ink);
	text-decoration: none;
}

.bmb-lb-kanban__catch {
	margin: 6px 0 0;
	font-size: 0.8125rem;
	color: var(--ink-soft);
	letter-spacing: 0.04em;
}

/* テキストナビ：ピルをやめ、「・」で区切った文字の並びにする。
   区切りはリスト項目の前（先頭と「トップ」導線を除く）に置く。
   幅が足りない場合は横スクロールで逃がす（親のナビ列と同じ作法）。 */
.bmb-lb-nav {
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 100%;
	overflow-x: auto;
	scrollbar-width: none;
	font-size: 0.9375rem;
}

.bmb-lb-nav::-webkit-scrollbar {
	display: none;
}

.bmb-lb-nav__home {
	flex: none;
	color: var(--ink);
	text-decoration: none;
	font-weight: 700;
	white-space: nowrap;
}

.bmb-lb-nav__list {
	display: flex;
	align-items: center;
	list-style: none;
	margin: 0;
	padding: 0;
}

.bmb-lb-nav__list li {
	display: flex;
	align-items: center;
	white-space: nowrap;
}

.bmb-lb-nav__list li::before {
	content: "・";
	margin: 0 4px;
	color: var(--gold-ink);
}

.bmb-lb-nav__list a {
	color: var(--ink);
	text-decoration: none;
	padding: 6px 4px;
}

/* 先頭項目の区切りは、「トップ」導線との間の区切りとして働く */

.bmb-lb-nav a:hover {
	color: var(--gold-ink);
}

/* 現在地は朱の下線＋太字で示す（面では塗らない） */
.bmb-lb-nav .current-menu-item > a,
.bmb-lb-nav .current_page_item > a {
	font-weight: 900;
	color: var(--gold-ink);
	border-bottom: 3px solid var(--gold);
}

/* モバイルでも看板を出す。文字は一段下げ、キャッチコピーは詰める */
@media (max-width: 640px) {
	.bmb-lb-header__inner {
		padding-top: 12px;
		padding-bottom: 8px;
		gap: 6px;
	}

	.bmb-lb-kanban__name {
		font-size: 1.375rem;
	}

	.bmb-lb-kanban__catch {
		font-size: 0.75rem;
		margin-top: 4px;
	}

	.bmb-lb-nav {
		font-size: 0.875rem;
		justify-content: flex-start;
	}
}

/* ---- 参照リンクは深い青緑（サンプルの --accent2 の基調） ----
   親の既定は a の色＝--gold-ink（このサイトでは朱赤）だが、サンプルでは
   本文のリンクは一貫して青緑で、朱赤は見出しタグ・判・日付の専用色。
   ナビ・カード題字・フッターリンクなど部品側で色を指定しているものは
   そちらが勝つため、この上書きが効くのは本文リンクや「詳しく見る」系の
   参照リンクに限られる（portal と同じ型）。 */
a {
	color: var(--lb-link);
}

/* ---- セクション見出し：キッカーを「朱の下線つき番号」に読み替える ----
   サンプルの節見出しは、明朝の番号に朱赤の3px下線を引く意匠（.sec-no）。
   親のキッカー（英字ラベル）がその位置にあたるため、明朝・朱・下線で
   書評誌の節番号らしくする。 */
.bmb-section__kicker {
	font-family: var(--font-serif);
	font-weight: 900;
	letter-spacing: 0.12em;
	color: var(--gold-ink);
	border-bottom: 3px solid var(--gold);
	padding-bottom: 2px;
}

/* ---- ボタン：主ボタンは墨（濃茶）地に紙色（サンプルの .btn の基調） ----
   親の指定は「背景 var(--navy)／文字 var(--accent-soft)」で、このサイト
   では淡い赤地の色が文字になり判読はできるが、サンプルの素直な紙色に
   合わせる（portal と同じ読み替え）。 */
.bmb-btn--primary {
	background: var(--ink);
	border-color: var(--ink);
	color: var(--bg);
}

.bmb-btn--primary:hover {
	opacity: 0.88;
}

/* ---- 検索フォーム：棚の索引ボックス（サンプルの検索ボックスの基調） ---- */
.bmb-main .search-form,
.bmb-notfound .search-form {
	background: var(--surface-2);
	border: 1px solid var(--lb-line2);
	padding: 16px;
}

.search-form input[type="search"] {
	border-color: var(--lb-line2);
	border-radius: 2px;
}

.search-form button,
.search-form input[type="submit"] {
	background: var(--ink);
	border-color: var(--ink);
	border-radius: 2px;
	color: var(--bg);
}

/* ---- 案内カード（ダーク面）のCTA指定は 1.0.5 で札形式に移した ----
   旧指定（ライトモードだけ .bmb-guide__card.is-dark のCTAを白文字に）は、
   案内を店頭の札（.bmb-lb-guide）に組み替えたため対象が無くなった。
   札のCTAの対比担保は、このファイル末尾の .bmb-lb-guide の指定が担う。 */

/* ---- カード：本が並ぶ棚に見立てる ----
   カードの台座に木の棚板（サンプルの .shelf-board の木グラデーション）を
   敷き、題字まわりの罫は強い方の線にする。表紙（アイキャッチ）には
   本の背の陰を左端に落とし、書影・著者写真が「棚に立っている」ように
   見せる。 */
.bmb-card {
	border-color: var(--lb-line2);
	border-bottom: 5px solid var(--lb-wood2);
}

/* 表紙の左端に「背」の陰の帯を重ねる（サンプルの .bookcover の背の意匠）。
   メディア枠（position: relative の a 要素）の ::before で画像の上に帯を
   置く。キャプション（absolute 配置）が DOM 順で後に来るため、帯は
   キャプションの下に回り、文字は隠れない。 */
.bmb-card__media::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 10px;
	background: linear-gradient(to right, rgba(44, 35, 24, 0.38), rgba(44, 35, 24, 0));
	pointer-events: none;
}

.bmb-record-card {
	border-color: var(--lb-line2);
}

/* ヒーローの大写真（今週の一冊の書影枠にあたる）には本の影を落とす */
.bmb-hero__media {
	box-shadow: 10px 14px 24px rgba(50, 35, 10, 0.28);
}

/* ---- 編集者カード：名前に朱の判（選書の「選」）を添える ----
   サンプルの編集部見出しには「選」の判が付く。このサイトの信用の置き方
   として、プロフィールminiの編集者名の脇にも同じ判を出す。 */
.bmb-profile-mini {
	border: 1px solid var(--lb-line2);
}

.bmb-profile-mini__name::after {
	content: "選";
	display: inline-grid;
	place-items: center;
	width: 34px;
	height: 34px;
	margin-left: 10px;
	border: 2px solid var(--gold);
	border-radius: 4px;
	color: var(--gold-ink);
	font-family: var(--font-serif);
	font-size: 0.72rem;
	font-weight: 900;
	line-height: 1.2;
	text-align: center;
	vertical-align: middle;
	transform: rotate(3deg);
}

/* ---- 記事本文：書誌の罫と引用の基調 ----
   書評の書誌表は、見出しセルを明朝＋一段濃い紙にして「書誌欄」らしく。
   引用（本からの引用）は明朝＋朱の左帯で、本文の声と区別する。 */
.bmb-article__body table th {
	font-family: var(--font-serif);
	background: var(--surface-2);
}

.bmb-article__body blockquote {
	font-family: var(--font-serif);
	border-left: 3px solid var(--gold);
}

/* ---- 場面チップは棚の分類チップ寄りに（サンプルの棚チップの基調） ---- */
.bmb-chip {
	background: var(--surface);
	border-color: var(--lb-line2);
	color: var(--ink-soft);
}

/* ---- 数字は等幅で揃える（書誌・収録数の tabular-nums の基調） ---- */
.bmb-num,
.bmb-numbers-panel__value,
.bmb-numbers-single__value,
.bmb-timeline__when {
	font-variant-numeric: tabular-nums;
}

/* ---- 写真の壁：キャプションは小さく淡く（著者写真の場面注記の基調） ---- */
.bmb-photo-wall__item figcaption {
	font-size: 0.78rem;
	color: var(--ink-soft);
	line-height: 1.6;
}

/* ---- 著者の棚セクション：チップ内の件数は小さく淡く添える（front-page.php 1b） ---- */
.bmb-author-shelf .bmb-chip__count {
	margin-left: 8px;
	font-size: 0.72rem;
	font-weight: 400;
	opacity: 0.75;
}

/* ---- フロントの記事カード：書影が主役の縦長寄り（1.0.4） ----
   親のカード写真は 16/10 の横長で、動画キャプチャ前提の比率。この
   サイトのカード写真は書影・著者写真が主役のため、フロントの
   カードだけ一段縦長寄り（4/3）にし、本が棚に立つ比率に近づける。
   対象はフロントページに限る：body の home かつ blog でない面が
   静的フロントに一致し、投稿ページ（記事一覧＝home.php）は親の
   比率のまま。フロントで .bmb-card__img を描くのは最新記事グリッド
   のみ（記録カード・写真の壁は別部品）なので、実質そのカードに
   絞られる。元写真は横長のものも混ざるため、object-fit: cover の
   切り取りが暴れない一段分に留めた。既存の「背の陰」（メディア枠の
   ::before）と棚板（カード下端の木）はそのまま効く。 */
.home:not(.blog) .bmb-card__img {
	aspect-ratio: 4 / 3;
}

/* ---- 記事ページ：書影先行（1.0.5。single.php が出す .bmb-lb-cover） ----
   書評の主役写真は、タイトルより先に「書影」として置く。本文幅いっぱい
   ではなく一段絞って中央に据え、本の影と背の陰で「棚から抜いた1冊」に
   見せる。影はヒーロー（.bmb-hero__media）の既存指定より強めに。 */
.bmb-lb-cover {
	max-width: 560px;
	margin: 0 auto 28px;
	box-shadow: 14px 18px 32px rgba(50, 35, 10, 0.32);
	position: relative;
}

/* 背の陰：書影の左端に帯を落とす（カードの .bmb-card__media と同じ意匠） */
.bmb-lb-cover::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	width: 12px;
	background: linear-gradient(to right, rgba(44, 35, 24, 0.38), rgba(44, 35, 24, 0));
	pointer-events: none;
	z-index: 1;
}

.bmb-lb-cover figcaption {
	padding: 10px 4px 0;
	font-size: 0.8125rem;
	color: var(--ink-soft);
}

/* ---- 記事ページ：著者の棚の行リスト（1.0.5。single.php） ----
   フロントの著者の棚（チップ列）と同じ棚の、記事ページ側の形。
   小さな書影＋書名＋著者名の行を、棚板の罫で区切って並べる。 */
.bmb-lb-shelf__list {
	list-style: none;
	margin: 0;
	padding: 0;
	border-top: 1px solid var(--lb-line2);
}

.bmb-lb-shelf__row {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 12px 6px;
	border-bottom: 5px solid var(--lb-wood2);
	color: var(--ink);
	text-decoration: none;
}

.bmb-lb-shelf__row:hover {
	background: var(--surface-2);
}

.bmb-lb-shelf__media {
	flex: 0 0 96px;
}

.bmb-lb-shelf__img {
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	display: block;
	border-radius: 2px;
}

.bmb-lb-shelf__body {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.bmb-lb-shelf__title {
	font-family: var(--font-serif);
	font-weight: 900;
	line-height: 1.55;
}

.bmb-lb-shelf__author {
	font-size: 0.8125rem;
	color: var(--ink-soft);
}

/* ---- 案内：店頭の札（1.0.5。template-parts/guide-cards.php の上書き） ----
   縦長の札を横に並べる。各札の上部に「選」の印（プロフィールmini の
   編者の判と同じ意匠）を置き、店頭で選書の札が挟まっている姿にする。
   先頭の札（is-dark）は濃茶地で、並びの中で第一の案内であることを示す。 */
.bmb-lb-guide {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 16px;
}

@media (max-width: 768px) {
	.bmb-lb-guide {
		grid-template-columns: 1fr;
	}
}

.bmb-lb-guide__tag {
	position: relative;
	background: var(--surface);
	border: 1px solid var(--lb-line2);
	border-top: 4px solid var(--lb-wood);
	border-radius: 2px;
	padding: 20px 18px 18px;
	display: flex;
	flex-direction: column;
}

.bmb-lb-guide__seal {
	align-self: flex-start;
	display: inline-grid;
	place-items: center;
	width: 32px;
	height: 32px;
	margin-bottom: 10px;
	border: 2px solid var(--gold);
	border-radius: 4px;
	color: var(--gold-ink);
	font-family: var(--font-serif);
	font-size: 0.72rem;
	font-weight: 900;
	line-height: 1.2;
	text-align: center;
	transform: rotate(3deg);
}

.bmb-lb-guide__label {
	font-family: var(--font-serif);
	font-weight: 900;
	font-size: 1.0625rem;
	margin-bottom: 6px;
}

.bmb-lb-guide__text {
	font-size: 0.875rem;
	margin: 0 0 12px;
}

.bmb-lb-guide__cta {
	margin-top: auto;
	display: inline-flex;
	align-items: center;
	align-self: flex-start;
	min-height: 44px;
	padding: 6px 18px;
	border-radius: 2px;
	border: 1px solid var(--ink);
	background: var(--ink);
	color: var(--bg);
	font-weight: 700;
	text-decoration: none;
}

.bmb-lb-guide__tag.is-dark {
	background: var(--navy);
	border-color: var(--navy);
	border-top-color: var(--lb-wood);
	color: var(--navy-ink);
}

.bmb-lb-guide__tag.is-dark .bmb-lb-guide__seal {
	border-color: var(--gold-bright);
	color: var(--gold-bright);
}

/* 濃茶地の札のCTAは朱赤地＋白文字（サンプルの .btn.stampb の基調。
   親カード時代の同色化対策を引き継ぐ） */
.bmb-lb-guide__tag.is-dark .bmb-lb-guide__cta {
	background: var(--gold);
	border-color: var(--gold);
	color: #fff;
}

@media (prefers-color-scheme: dark) {
	.bmb-lb-guide__tag.is-dark .bmb-lb-guide__cta {
		color: #211b13;
	}
}
