/* ============================================================
 * 黄色マーカー — アプリコットデザイン / TONE BRANDING / Think for Design 共通仕様
 * 2026-08-24
 *
 * 仕様
 *   1. 記事本文の太字（strong / b）は自動で黄色マーカーになる
 *   2. 太字にせずマーカーだけ引きたいときは <span class="marker-y">
 *      （クラシックエディタのツールバー「マーカー」ボタン / Alt+Shift+M）
 *   3. 旧サイトから移植した .marker / .prose-marker / <mark> も同じ見た目に統一する
 *      ＝移行時に .marker-y のCSSが落ちて表示が消えていた分をここで復活させる
 *   4. 見出し・引用・キャプション・表見出しの中の太字は塗らない（1だけを抑止）
 *
 * 色 #fff59d は旧 TONE BRANDING の marker-y と同値。
 * 蛍光すぎず、白ベース・墨色の紙面になじむ濃度。
 *
 * このファイルは3サイトで内容を揃えてある。変えるときは3サイトとも直す。
 * ============================================================ */

:root {
	--marker-y: #fff59d;
}

/* ---- 1. 明示マーカー（新旧クラスをすべて同じ見た目へ） ---------------- */
.prose :is( .marker-y, .marker, .prose-marker, mark ) {
	background: var(--marker-y);
	color: inherit;
	padding: 0;
	-webkit-box-decoration-break: clone;
	        box-decoration-break: clone;
}

/* 旧5色バリエーション（.is-gold 等）もベタ塗りへ揃える */
.prose :is( .marker, .prose-marker, .marker-y ).is-yellow { background: #fff59d; }
.prose :is( .marker, .prose-marker, .marker-y ).is-gold { background: #ffe082; }
.prose :is( .marker, .prose-marker, .marker-y ).is-green { background: #c5e1a5; }
.prose :is( .marker, .prose-marker, .marker-y ).is-blue { background: #b3e5fc; }
.prose :is( .marker, .prose-marker, .marker-y ).is-pink { background: #f8bbd0; }

/* ---- 2. 太字＝自動マーカー（記事本文のみ） ---------------------------- */
/* works / project の概要文（.post-body の外の .prose）は対象外。記事だけを塗る。 */
.post-body .prose :is( strong, b ) {
	background: var(--marker-y);
}

/* ---- 3. 自動マーカーを塗らない場所 ------------------------------------ */
.post-body .prose :is( h1, h2, h3, h4, h5, h6, blockquote, figcaption, caption, th ) :is( strong, b ) {
	background: transparent;
}

/* ---- 4. クラシックエディタ（TinyMCE）内のプレビュー ----------------
 * add_editor_style() で iframe 内に読み込まれる。iframe の body は
 * id="tinymce" なので、フロント側には一切影響しない。
 * -------------------------------------------------------------------- */
body#tinymce :is( .marker-y, .marker, .prose-marker, mark ) {
	background: #fff59d;
	color: inherit;
	padding: 0;
	-webkit-box-decoration-break: clone;
	        box-decoration-break: clone;
}
body#tinymce :is( strong, b ) {
	background: #fff59d;
}
body#tinymce :is( h1, h2, h3, h4, h5, h6, blockquote, figcaption, caption, th ) :is( strong, b ) {
	background: transparent;
}