/*
 * c-content
 * ページ本文（the_content）向けの基本タイポグラフィ
 */

:where(.c-content) {
  color: var(--wp--preset--color--basic-text);
  line-height: 1.9;
}

/* ブロック間の基本余白 */
:where(.c-content) > * + * {
  margin-top: var(--wp--preset--spacing--lg);
}

/* 見出し（コンポーネント見出しは除外しやすいよう、c-系クラスを持つものは触らない） */
:where(.c-content) :where(h2, h3, h4, h5):not([class*="c-"]) {
  line-height: 1.4;
  font-weight: var(--wp--custom--font-weight--bold);
  color: var(--wp--preset--color--basic-text);
  scroll-margin-top: 10rem;
}

:where(.c-content) h2:not([class*="c-"]) {
  font-size: var(--wp--preset--font-size--2-xl);
  margin-top: var(--wp--preset--spacing--2-xl);
  padding-bottom: var(--wp--preset--spacing--xs);
  border-bottom: 1px solid var(--wp--preset--color--primary-lighter);
  margin-bottom: var(--wp--preset--spacing--lg);
}

:where(.c-content) h3:not([class*="c-"]) {
  font-size: var(--wp--preset--font-size--xl);
  margin-top: var(--wp--preset--spacing--xl);
}

:where(.c-content) h4:not([class*="c-"]) {
  font-size: var(--wp--preset--font-size--lg);
  margin-top: var(--wp--preset--spacing--lg);
}

:where(.c-content) h5:not([class*="c-"]) {
  font-size: var(--wp--preset--font-size--md);
  margin-top: var(--wp--preset--spacing--lg);
}

/* Gutenberg見出し（c-系が付いていないものだけ） */
:where(.c-content) :where(.wp-block-heading):not([class*="c-"]) {
  line-height: 1.4;
}

/* 段落 */
:where(.c-content) :where(p):not([class*="c-"]) {
  margin: 0;
  margin-bottom: 1em;
}

/* リスト（c-系リストコンポーネント等は除外） */
:where(.c-content) :where(ul, ol):not([class*="c-"]) {
  padding-left: 1.4em;
  margin: 0;
}
:where(.c-content) > :where(figure):not([class*="c-"]) img {
  margin: 1em 0;
  max-width: 100%;
  height: auto;
  border-radius: var(--wp--custom--border--radius--sm);
}

:where(.c-content) :where(li):not([class*="c-"]) {
  margin: 0.35em 0;
}

/* リンク */
:where(.c-content) a {
  color: var(--wp--preset--color--primary-darkest);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

:where(.c-content) a:hover {
  opacity: 0.85;
}

/* 引用 */
:where(.c-content) :where(blockquote):not([class*="c-"]) {
  margin: 0;
  padding: var(--wp--preset--spacing--lg);
  background: var(--wp--preset--color--primary-lightest);
  border-left: 4px solid var(--wp--preset--color--primary);
  border-radius: var(--wp--custom--border--radius--md);
}

/* テーブル */
:where(.c-content) :where(table):not([class*="c-"]) {
  width: 100%;
  border-collapse: collapse;
  overflow: hidden;
  border-radius: var(--wp--custom--border--radius--md);
  border: 1px solid var(--wp--preset--color--primary-lighter);
}

/* WPのテーブルブロックは横スクロールを許可 */
:where(.c-content) :where(.wp-block-table):not([class*="c-"]) {
  display: block;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

:where(.c-content) :where(th, td):not([class*="c-"]) {
  padding: 0.75em 0.9em;
  border-bottom: 1px solid var(--wp--preset--color--primary-lighter);
}

:where(.c-content) :where(th):not([class*="c-"]) {
  text-align: left;
  background: var(--wp--preset--color--primary-lightest);
}

/* 画像 */
:where(.c-content) :where(img):not([class*="c-"]) {
  max-width: 100%;
  height: auto;
}

/* 区切り線 */
:where(.c-content) :where(hr):not([class*="c-"]) {
  border: 0;
  border-top: 1px solid var(--wp--preset--color--primary-lighter);
  margin: var(--wp--preset--spacing--2-xl) 0;
}

/* コード */
:where(.c-content) :where(code):not([class*="c-"]) {
  font-family:
    ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
    "Courier New", monospace;
  font-size: 0.95em;
  background: var(--wp--preset--color--primary-lightest);
  padding: 0.1em 0.35em;
  border-radius: var(--wp--custom--border--radius--sm);
}

:where(.c-content) :where(pre):not([class*="c-"]) {
  background: var(--wp--preset--color--primary-lightest);
  padding: var(--wp--preset--spacing--lg);
  border-radius: var(--wp--custom--border--radius--md);
  overflow: auto;
}
