/* ==========================================================================
   Content（本文のデフォルト）
   - フロントとエディターの両方に読み込む（functions.php）
   - 文字サイズ・色・引用・コードなどは theme.json、ここでは theme.json で書けない部分だけ
   - 装飾は :where() で詳細度0にし、パターンやブロック側の指定を常に優先させる
   ========================================================================== */

/* --- 段落 --- */
:where(p) {
	overflow-wrap: anywhere;
	line-break: strict;
}

/* --- 見出し：本文の中（投稿・固定ページ本文の直下、パターン内の .entry-content の直下）だけ上に余白と装飾 ---
   余白はレイアウトの blockGap（:root :where(.is-layout-flow) > *）より強くする必要があるため :where() にしない */
.wp-block-post-content > * + h2,
.entry-content > * + h2,
.is-root-container > * + h2 {
	margin-block-start: 3.5rem;
}

.wp-block-post-content > * + :is(h3, h4, h5, h6),
.entry-content > * + :is(h3, h4, h5, h6),
.is-root-container > * + :is(h3, h4, h5, h6) {
	margin-block-start: 2.5rem;
}

/* 見出しの直後 */
.wp-block-post-content > :is(h2, h3, h4, h5, h6) + *,
.entry-content > :is(h2, h3, h4, h5, h6) + *,
.is-root-container > :is(h2, h3, h4, h5, h6) + * {
	margin-block-start: 1.75rem;
}

/* h2：下線（左だけアクセント色） */
:where(.wp-block-post-content, .entry-content, .is-root-container) > :where(h2:not(.has-background)) {
	padding-bottom: 0.5em;
	border-bottom: 1px solid var(--wp--preset--color--line);
	background-image: linear-gradient(var(--wp--preset--color--accent), var(--wp--preset--color--accent));
	background-repeat: no-repeat;
	background-position: left bottom;
	background-size: 64px 3px;
}

/* h3：左に縦線 */
:where(.wp-block-post-content, .entry-content, .is-root-container) > :where(h3:not(.has-background)) {
	padding-left: 0.75em;
	border-left: 4px solid var(--wp--preset--color--accent);
}

/* --- リスト --- */
:where(.wp-block-list) {
	padding-inline-start: 1.5em;
}

:where(.wp-block-list > li + li),
:where(.wp-block-list li > .wp-block-list) {
	margin-block-start: 0.5em;
}

:where(ul.wp-block-list > li)::marker {
	color: var(--wp--preset--color--label);
}

:where(ol.wp-block-list > li)::marker {
	color: var(--wp--preset--color--contrast);
	font-weight: 700;
}

/* --- テーブル（コアの .wp-block-table td 等より強くするため table を挟む） --- */
.wp-block-table table {
	width: 100%;
	font-size: 15px;
	line-height: 1.7;
}

.wp-block-table table :is(th, td) {
	padding: 12px 16px;
	border: 1px solid var(--wp--preset--color--line);
	text-align: left;
	vertical-align: top;
}

.wp-block-table table th {
	background-color: var(--wp--preset--color--secondary);
	color: var(--wp--preset--color--contrast);
	font-weight: 700;
}

/* 行の見出し（左列が th の表）：幅をそろえる */
.wp-block-table table tbody th:first-child {
	width: 35%;
}

.wp-block-table table :is(thead, tfoot) {
	border: 0;
}

.wp-block-table table thead th {
	border-bottom: 2px solid var(--wp--preset--color--contrast);
}

/* 縞模様スタイル */
.wp-block-table.is-style-stripes {
	border-bottom: 0;
}

.wp-block-table.is-style-stripes table tbody tr:nth-child(odd) {
	background-color: var(--wp--preset--color--secondary);
}

.wp-block-table.is-style-stripes table :is(th, td) {
	border-width: 0 0 1px;
}

/* --- 区切り線（色の指定がないとき） --- */
.wp-block-separator:not(.has-text-color):not(.has-background) {
	border: 0;
	border-top: 1px solid var(--wp--preset--color--line);
	opacity: 1;
}

/* --- 本文中のリンク（ボタン以外） --- */
:where(.wp-block-post-content, .entry-content, .is-root-container) :where(p, li, td, figcaption) > a:where(:not(.wp-element-button)) {
	text-underline-offset: 0.2em;
}