/* ----------------------------------------------------------------------------------------------------
 * 管理画面・フロントエンド共通
---------------------------------------------------------------------------------------------------- */
.editor-styles-wrapper,
.editor-styles {
  padding-right: var(--wp--preset--spacing--30);
  padding-left: var(--wp--preset--spacing--30);
  color: #000000;
  background-color: #ffffff;
  font-size: var(--wp--preset--font-size--medium);

  .alignfull {
    margin-right: calc(var(--wp--preset--spacing--30) * -1);
    margin-left: calc(var(--wp--preset--spacing--30) * -1);
  }

  /* 見出し */
  h2.wp-block-heading {
    margin-top: var(--wp--preset--spacing--80);
  }

  h3.wp-block-heading {
    margin-top: var(--wp--preset--spacing--70);
  }

  h4.wp-block-heading {
    margin-top: var(--wp--preset--spacing--60);
  }

  /* リンク */
  a:not([class]) {
    text-decoration: underline;
    color: var(--wp--preset--color--links);

    &:hover {
      text-decoration: none;
    }
  }

  a:hover {
    opacity: 0.7;
  }
}

/* ----------------------------------------------------------------------------------------------------
 * フロントエンド
---------------------------------------------------------------------------------------------------- */
.editor-styles {
  display: flow-root;

  /* ブロック間のスペーサー */
  > *:not(:first-child) {
    margin-top: var(--wp--style--block-gap);
  }

  .wp-block-spacer {
    margin-top: 0;
  }

  /* コンテナサイズ */
  > * {
    max-width: var(--wp--style--global--content-size);
    margin-left: auto;
    margin-right: auto;
  }

  > .alignwide {
     max-width: var(--wp--style--global--wide-size);
  }

  > .alignfull {
     max-width: none;
  }

  /* 配置 */
  /*
  .aligncenter {
    display: block;
    margin-right: auto;
    margin-left: auto;
  }

  .alignright {
    float: right;
    margin-bottom: 1em;
    margin-left: 1em;
  }

  .alignleft {
    float: left;
    margin-right: 1em;
    margin-bottom: 1em;
  }
  */
}

/* ----------------------------------------------------------------------------------------------------
 * スタイル
---------------------------------------------------------------------------------------------------- */
/* すべての投稿ページ */
body.editor-styles-wrapper[class*="post-type-"],
body.single :where(.editor-styles),
body.archive :where(.editor-styles),
body.term :where(.editor-styles),
body.page :where(.editor-styles) {
  h2.wp-block-heading {
    position: relative;
    padding-left: 0.75em;

    &::before {
      position: absolute;
      top: 0;
      left: 0;
      display: block;
      width: 0.5em;
      height: 100%;
      content: '';
      background-color: var(--wp--preset--color--primary);
    }
  }

  h3.wp-block-heading {
    position: relative;
    padding-left: 1.25em;

    &::before {
      position: absolute;
      top: 0;
      left: 0;
      translate: 0 6.65%;
      display: block;
      width: 1em;
      content: '';
      aspect-ratio: 1 / 1;
      background-color: var(--wp--preset--color--primary);
    }
  }

  h4.wp-block-heading {
    color: var(--wp--preset--color--primary);
  }
}

/* すべての投稿タイプ */
/*
body.editor-styles-wrapper:not(.post-type-page),
body.single :where(.editor-styles),
body.archive :where(.editor-styles),
body.term :where(.editor-styles) {
}
*/

/* すべての固定ページ */
/*
body.editor-styles-wrapper.post-type-page,
body.page :where(.editor-styles) {
}
*/

/* 特定のカスタム投稿タイプ（例：news） */
/*
body.editor-styles-wrapper.post-type-news,
body.single-news :where(.editor-styles),
body.post-type-archive-news :where(.editor-styles),
body[class*="tax-news"] :where(.editor-styles) {
}
*/

/* 特定の固定ページ（例：id=2） */
/*
body.editor-styles-wrapper.post-type-page,
body.page-id-2 :where(.editor-styles) {
}
*/