@layer patterns {
  /* Styling for markup written by hand inside post bodies (custom HTML blocks).
     The current site defined these in the design theme's style.css, which the new
     theme no longer loads, so the articles lost their tables, headings and buttons.
     Everything here is scoped to .entry-content so it only reaches article bodies. */

  /* ---- 見出し ---- */
  .entry-content .post_title {
    padding: 0.625rem 1.25rem;
    color: var(--ikuta-color-white);
    text-align: center;
    background: var(--ikuta-color-purple-deep);
    border-block-end: 1px solid var(--ikuta-color-white);
  }

  .entry-content .post_sub_title {
    padding: 0.3125rem 0.625rem;
    font-weight: 700;
    border-inline-start: 5px solid var(--ikuta-color-purple-deep);
  }

  .entry-content .post_sub_title2 {
    margin: 0 0 0.625rem;
    font-family: var(--ikuta-font-mincho);
    font-size: 1.25rem;
    text-align: center;
  }

  /* ---- 2カラム ---- */
  .entry-content .post_col2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .entry-content .post_col2 > * {
    width: calc(50% - 1rem);
  }

  /* ---- 記事内の定型テーブル ---- */
  .entry-content #post_data table,
  .entry-content #setsubun-guest table {
    width: 100%;
    background: var(--ikuta-color-white);
  }

  .entry-content #post_data table th,
  .entry-content #setsubun-guest table th {
    padding: 0.625rem 1.25rem;
    color: var(--ikuta-color-white);
    text-align: center;
    background: var(--ikuta-color-purple-deep);
    border: 0;
    border-block-end: 1px solid var(--ikuta-color-white);
  }

  .entry-content #post_data table th {
    border: 1px solid var(--ikuta-color-purple-deep);
    border-block-end: 1px solid var(--ikuta-color-white);
  }

  /* Some articles stack several tables in one custom HTML block. */
  .entry-content #post_data table + table {
    margin-block-start: var(--ikuta-space-3);
  }

  .entry-content #post_data table tr:last-child th {
    border-block-end: 1px solid var(--ikuta-color-purple-deep);
  }

  .entry-content #post_data table td {
    padding: 0.625rem 1.25rem;
    border: 1px solid var(--ikuta-color-purple-deep);
  }

  .entry-content #setsubun-guest table td {
    padding: 0.625rem 1.25rem;
    border: 0;
    border-block-end: 1px dotted var(--ikuta-color-purple-deep);
  }

  /* ---- 「厄除けご祈祷のご案内」記事 ---- */
  .entry-content #yakuyoke .table {
    width: 100%;
    margin: 0 0 0.625rem;
    border-block-start: 1px solid var(--ikuta-color-border);
    border-inline-end: 1px solid var(--ikuta-color-border);
  }

  .entry-content #yakuyoke .table th {
    width: 11.25rem;
    padding: 0.625rem 1.25rem;
    font-size: 0.9375rem;
    font-weight: 400;
    background: var(--ikuta-color-white);
    border: 0;
    border-block-end: 1px solid var(--ikuta-color-border);
    border-inline-start: 1px solid var(--ikuta-color-border);
  }

  .entry-content #yakuyoke .table th.title {
    color: var(--ikuta-color-white);
    font-family: var(--ikuta-font-mincho);
    background: linear-gradient(#606060, #303030);
  }

  .entry-content #yakuyoke .table td {
    padding: 0.625rem 1.25rem;
    font-size: 0.9375rem;
    background: var(--ikuta-color-white);
    border: 0;
    border-block-end: 1px solid var(--ikuta-color-border);
    border-inline-start: 1px solid var(--ikuta-color-border);
  }

  .entry-content .yaku {
    width: 100%;
    margin: 1.25rem 0 0;
  }

  .entry-content .yaku th,
  .entry-content .yaku td {
    text-align: center;
  }

  .entry-content .yaku td {
    padding: 0.625rem;
    background: var(--ikuta-color-white);
    border: 0;
    border-block-end: 1px solid var(--ikuta-color-gold);
    border-inline: 1px solid var(--ikuta-color-gold);
  }

  .entry-content .yaku .date {
    color: var(--ikuta-color-white);
    background: #666;
    border: 1px solid #666;
  }

  .entry-content .yaku .female,
  .entry-content .yaku .male {
    padding: 0.625rem;
    color: var(--ikuta-color-white);
    background: var(--ikuta-color-gold);
  }

  .entry-content .yaku .female {
    border-inline-end: 1px solid var(--ikuta-color-white);
  }

  /* ---- 祭事スケジュール表 ---- */
  .entry-content table.fes-time {
    width: 100%;
    max-width: 50rem;
    margin: 1.25rem auto 2.5rem;
  }

  .entry-content table.fes-time thead th {
    color: var(--ikuta-color-muted);
  }

  .entry-content table.fes-time thead th.day-title {
    padding: 0.625rem 0;
    color: var(--ikuta-color-purple-deep);
    font-size: 1.75rem;
  }

  .entry-content table.fes-time tbody tr {
    border-block-start: 1px dashed #d5d5d5;
  }

  .entry-content table.fes-time tbody tr:last-child {
    border-block-end: 1px dashed #d5d5d5;
  }

  .entry-content table.fes-time tbody th {
    width: 11.25rem;
    padding: 0.625rem;
    background: #fde6e7;
    border: 0;
  }

  .entry-content table.fes-time tbody td {
    padding: 0.625rem;
    border: 0;
  }

  /* ---- 出演者一覧など ---- */
  .entry-content .guest_list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
  }

  .entry-content .guest_list li {
    width: 50%;
    padding: 0.625rem 0;
    text-align: center;
  }

  .entry-content .enmoku {
    border: 1px dotted var(--ikuta-color-purple-deep);
  }

  /* ---- 記事内のボタン ----
     Sized here rather than through the block's own width attribute, so article
     buttons match the "新着情報一覧へ" button (.c-button--wide) below them. */
  .entry-content .wp-block-buttons .wp-block-button {
    width: min(100%, 25rem);
  }

  .entry-content .wp-block-buttons .wp-block-button__link {
    display: flex;
    width: 100%;
  }

  /* ---- 旧テーマのボタン。2024年6月以前の記事がまだ使っている ---- */
  .entry-content .link_button a:link,
  .entry-content .link_button a:visited {
    display: block;
    width: 100%;
    min-height: var(--c-button-height);
    margin: 0 auto 1.25rem;
    padding: var(--c-button-padding);
    color: var(--ikuta-color-white);
    text-align: center;
    text-decoration: none;
    background: var(--c-button-gradient);
    border: 1px solid var(--c-button-border);
    box-shadow: var(--c-button-shadow);
    transition: filter var(--ikuta-motion-duration) var(--ikuta-motion-easing);
  }

  .entry-content .link_button a:hover {
    filter: brightness(1.12);
  }

  .entry-content .link_button a:focus-visible {
    outline: 3px solid var(--ikuta-color-focus);
    outline-offset: 2px;
  }

  /* ---- 幅・余白のユーティリティ ---- */
  .entry-content .w200,
  .entry-content .w300,
  .entry-content .w400,
  .entry-content .w500,
  .entry-content .w600,
  .entry-content .w700,
  .entry-content .w800 {
    width: 100%;
    margin-inline: auto;
  }

  .entry-content .w200 { max-width: 12.5rem; }
  .entry-content .w300 { max-width: 18.75rem; }
  .entry-content .w400 { max-width: 25rem; }
  .entry-content .w500 { max-width: 31.25rem; }
  .entry-content .w600 { max-width: 37.5rem; }
  .entry-content .w700 { max-width: 43.75rem; }
  .entry-content .w800 { max-width: 50rem; }

  .entry-content .mb4 { margin-block-end: 2.5rem !important; }
  .entry-content .center_position { text-align: center; }
  .entry-content .font-serif { font-family: var(--ikuta-font-mincho); }
  .entry-content .column-gap { grid-gap: 3px; }

  .entry-content .img-container {
    width: 100%;
    max-width: 56.25rem;
    margin-inline: auto;
  }

  /* ---- 埋め込み動画 ---- */
  .entry-content .youtube,
  .entry-content .youtube_area {
    position: relative;
    width: 100%;
    height: 0;
    padding-block-end: 56.25%;
    overflow: hidden;
  }

  .entry-content .youtube { margin-block-end: 3.125rem; }

  .entry-content .youtube iframe,
  .entry-content .youtube_movie {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
  }

  /* ---- PC / SP 出し分け ---- */
  @media (width >= 48.75rem) {
    .entry-content .pc_display { display: block; }
    .entry-content .sp_display { display: none; }
  }

  @media (width < 48.75rem) {
    .entry-content .pc_display { display: none; }
    .entry-content .sp_display { display: block; }
  }

  /* ---- スマートフォン ---- */
  @media (width < 39.9rem) {
    .entry-content .post_col2 > * { width: 100%; }

    .entry-content #post_data table th,
    .entry-content #post_data table td,
    .entry-content #setsubun-guest table th,
    .entry-content #setsubun-guest table td {
      display: block;
      width: 100%;
      vertical-align: middle;
    }

    .entry-content .yaku td { padding: 2%; }
    .entry-content .yaku .female,
    .entry-content .yaku .male { padding: 2%; }

    .entry-content .guest_list li { width: 100%; }

    .entry-content table.fes-time tbody th { width: auto; }
  }
}

/* Deliberately outside @layer.

   Core ships its own block margins (figure.wp-block-image is margin: 0 0 1em)
   as unlayered CSS, which outranks anything the theme puts in a layer. The old
   articles hid that by padding every gap with a spacer block; with the spacers
   removed the images would sit flush against the paragraph above them. These
   rules restate the theme's rhythm where core would otherwise win. */
.entry-content > figure.wp-block-image,
.entry-content > figure.wp-block-gallery,
.entry-content > figure.wp-block-table,
.entry-content > figure.wp-block-embed,
.entry-content > div.wp-block-columns,
.entry-content > div.wp-block-buttons {
  margin-block: var(--ikuta-space-3) 0;
}

.entry-content > :first-child {
  margin-block-start: 0;
}
