/**
 * WordPress-specific bridges (core blocks → DesignKit look).
 */

/*
 * WP global-styles の `:where(figure){ margin: 0 0 1em }` は unlayered。
 * theme.css の @layer 内 margin:0 では勝てないため、ここ（layer 外）で打ち消す。
 */
.c--frontReel_slide {
  margin: 0;
}

.c--frontReel_fg,
.c--frontReel_bg {
  max-width: none;
}

/* 管理バー表示時: fixed ヘッダーは viewport 基準のため下げる（layer 外で優先） */
body.admin-bar .c--siteHeader {
  inset-block-start: var(--wp-admin--admin-bar--height, 32px);
}

@media (max-width: 1119px) {
  body.admin-bar .c--siteNav {
    inset-block-start: var(--wp-admin--admin-bar--height, 32px);
  }
}

/* Note カテゴリ nav（layer 外 — blocks の .b--tax より確実に優先） */
.c--noteMain .b--tax:not(.b--tax--tag):not(.b--tax--cat) a {
  color: var(--brand);
  text-decoration: none;
  border-block-end: 1px solid transparent;
}

.c--noteMain .b--tax:not(.b--tax--tag):not(.b--tax--cat) a:hover,
.c--noteMain .b--tax:not(.b--tax--tag):not(.b--tax--cat) a:focus-visible {
  color: var(--brand);
  border-block-end-color: transparent;
  opacity: 0.82;
}

.c--noteMain .b--tax:not(.b--tax--tag):not(.b--tax--cat) a[aria-current="page"] {
  color: var(--brand);
  opacity: 1;
  border-block-end-color: currentColor;
}

/* Works 詳細: ヘッダーとギャラリー同じコンテンツ幅（xl） */
.c--workHeader .is--wrapper,
.c--workGallery .is--wrapper {
  --contentSize: var(--sz--xl, 100rem);
}

/*
 * 段落同士の上余白（layer 外）。
 * blocks.css の `.c--entryBody p { margin: 0 }` と、
 * WP global-styles の unlayered margin リセットより優先する。
 */
.c--entryBody.l--flow > * + :is(p, .wp-block-paragraph) {
  margin-block-start: var(--s35);
}

/* 記事内画像ブロックの前後余白（layer 外） */
.c--entryBody.l--flow > :is(.b--figure, figure.wp-block-image, .wp-block-image) {
  margin-block: var(--s50);
  margin-inline: 0;
}

.c--entryBody.l--flow > :is(.b--figure, figure.wp-block-image, .wp-block-image):first-child {
  margin-block-start: 0;
}

.c--workGallery_stack.c--entryBody > * + * {
  margin-block-start: 0;
}

.c--workGallery_stack.c--entryBody.l--flow > :is(.b--figure, figure.wp-block-image, .wp-block-image) {
  margin-block: var(--s50);
}

.c--workGallery_stack.c--entryBody :is(h2, h3, h4, .wp-block-heading) {
  margin-block: 0;
}

.c--workGallery_stack.c--entryBody.l--stack {
  --g: var(--s35);
  gap: var(--s35);
}

.c--entryBody hr.wp-block-separator {
  border: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    color-mix(in srgb, var(--text) 20%, transparent) 8%,
    color-mix(in srgb, var(--divider) 85%, var(--text) 40%) 50%,
    color-mix(in srgb, var(--text) 20%, transparent) 92%,
    transparent 100%
  );
}

@layer lism-block {
  .wp-block-image,
  .wp-block-image img {
    max-width: 100%;
    height: auto;
  }

  .wp-block-image figcaption,
  .wp-block-gallery figcaption {
    margin-block-start: var(--s20);
    font-size: var(--fz--xs);
    color: var(--text-2);
    letter-spacing: var(--lts--xl);
  }

  .c--entryBody .wp-block-image figcaption,
  .c--entryBody .wp-block-gallery figcaption {
    margin-block-start: 0;
    letter-spacing: var(--lts--l);
  }

  .wp-block-quote {
    margin: var(--s50) 0;
    padding-inline-start: var(--s40);
    border-inline-start: 1px solid var(--brand);
    font-size: var(--fz--l);
    line-height: var(--lh--l);
  }

  .wp-block-quote cite {
    display: block;
    margin-block-start: var(--s20);
    font-size: var(--fz--xs);
    color: var(--text-2);
    font-style: normal;
  }

  .wp-block-details {
    border-block-end: 1px solid var(--divider);
  }

  .wp-block-details summary {
    cursor: pointer;
    padding-block: var(--s30);
    font-weight: var(--fw--normal);
  }

  .wp-block-embed {
    margin-block: var(--s40);
  }

  .wp-block-table table {
    width: 100%;
    border-collapse: collapse;
  }

  .wp-block-table td,
  .wp-block-table th {
    border-block-end: 1px solid var(--divider);
    padding: var(--s20) var(--s15);
    text-align: start;
  }

  .c--entryBody > * + * {
    margin-block-start: var(--s40);
  }

  .c--entryBody .alignwide {
    max-width: min(100%, 72rem);
  }

  .c--entryBody .alignfull {
    width: 100vw;
    max-width: 100vw;
    margin-inline: calc(50% - 50vw);
  }

  /* Pager: style WP defaults inside .b--pager */
  .b--pager .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.5em;
    padding: 0.4em 0.6em;
    color: var(--text-2);
    text-decoration: none;
    letter-spacing: var(--lts--xl);
    font-size: var(--fz--xs);
  }

  .b--pager .page-numbers.current,
  .b--pager .page-numbers:hover {
    color: var(--text);
  }

  .b--pager_inner {
    display: flex;
    flex-wrap: wrap;
    gap: var(--s15);
    justify-content: center;
  }

  .wp-block-group.is-style-band-light {
    color: hsl(28 14% 8%);
    background: hsl(32 4% 78%);
  }

  .wp-block-quote.is-style-tomoshibi-light {
    border-inline-start-color: var(--brand);
    color: var(--light);
  }

  .wp-block-image.is-style-tomoshibi-figure figcaption {
    letter-spacing: var(--lts--xl);
  }

  /* Contact Form 7 → DesignKit .b--form */
  .b--form .wpcf7 {
    display: contents;
  }

  .b--form .wpcf7-form {
    display: grid;
    gap: var(--s35);
  }

  .b--form .wpcf7-form > p,
  .b--form .b--field {
    display: grid;
    gap: var(--s10);
    margin: 0;
  }

  .b--form .wpcf7-form label:not(.b--field_label) {
    font-size: var(--fz--xs);
    letter-spacing: var(--lts--xl);
    color: var(--text-2);
  }

  .b--form .wpcf7-form-control-wrap {
    display: block;
  }

  .b--form .wpcf7-form-control:not(.wpcf7-submit):not(.wpcf7-acceptance) {
    width: 100%;
    appearance: none;
    background: color-mix(in srgb, var(--base-2) 55%, transparent);
    border: 1px solid var(--divider);
    border-radius: 0;
    color: var(--text);
    font: inherit;
    font-size: var(--fz--m);
    padding: var(--s20) var(--s25);
    transition:
      border-color 0.4s var(--ease-out),
      background-color 0.4s var(--ease-out);
  }

  .b--form .wpcf7-form-control:not(.wpcf7-submit):hover {
    border-color: color-mix(in srgb, var(--text-2) 55%, var(--divider));
  }

  .b--form .wpcf7-form-control:not(.wpcf7-submit):focus {
    outline: none;
    border-color: var(--brand);
    background: color-mix(in srgb, var(--base-2) 80%, transparent);
  }

  .b--form .wpcf7-form-control:not(.wpcf7-submit)::placeholder {
    color: color-mix(in srgb, var(--text-2) 70%, transparent);
  }

  .b--form select.wpcf7-form-control {
    background-image:
      linear-gradient(45deg, transparent 50%, var(--text-2) 50%),
      linear-gradient(135deg, var(--text-2) 50%, transparent 50%);
    background-position:
      calc(100% - var(--s25) - 0.25em) 50%,
      calc(100% - var(--s25)) 50%;
    background-size:
      0.35em 0.35em,
      0.35em 0.35em;
    background-repeat: no-repeat;
    padding-inline-end: calc(var(--s25) + var(--s30));
  }

  .b--form textarea.wpcf7-form-control {
    min-height: 8rem;
    resize: vertical;
  }

  .b--form .wpcf7-submit {
    margin: 0;
  }

  .b--form .wpcf7-response-output {
    margin: 0;
    padding: var(--s20) var(--s25);
    border: 1px solid var(--divider);
    font-size: var(--fz--s);
    color: var(--text-2);
  }

  .b--form .wpcf7-not-valid-tip {
    font-size: var(--fz--xs);
    color: var(--brand);
    margin-block-start: var(--s10);
  }

  .b--form .wpcf7-spinner {
    margin-inline-start: var(--s15);
  }

  .c--entryBody .wp-block-buttons,
  .c--servicePage_body .wp-block-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: var(--s20);
    align-items: center;
  }

  .c--entryBody .wp-block-button,
  .c--servicePage_body .wp-block-button {
    margin: 0;
  }
}

/* core/button — WP グローバル（unlayered）より .b--btn を優先 */
.c--entryBody .wp-block-button .wp-block-button__link.b--btn,
.c--servicePage_body .wp-block-button .wp-block-button__link.b--btn {
  border-radius: 0;
  box-shadow: none;
  text-decoration: none;
  min-height: unset;
}

.c--entryBody .wp-block-button .wp-block-button__link.b--btn:not(:hover):not(:focus-visible),
.c--servicePage_body .wp-block-button .wp-block-button__link.b--btn:not(:hover):not(:focus-visible) {
  background-color: transparent;
  color: var(--text);
}

/*
 * .b--btn — global-styles の `a:where(:not(.wp-element-button)) { color: brand }` より優先。
 * ホバー時は .b--btn_en だけ黒指定があり、英語ラベル（span[lang="en"]）が brand 同色で消える。
 */
a.b--btn,
a.b--btn:visited {
  color: var(--text);
  text-decoration: none;
}

a.b--btn:hover,
a.b--btn:focus-visible {
  color: #000;
  background-color: var(--brand);
  border-color: var(--brand);
}

a.b--btn:hover span,
a.b--btn:focus-visible span {
  color: inherit;
}

a.b--btn:hover .b--btn_en,
a.b--btn:focus-visible .b--btn_en {
  opacity: 0.72;
}

a.b--btn.b--btn--ghost:hover,
a.b--btn.b--btn--ghost:focus-visible {
  color: var(--light);
  background-color: transparent;
  border-color: transparent;
  box-shadow: none;
}

/*
 * Note 紙面のリンク文字色。
 * theme.json の link は global-styles の unlayered
 * `a:where(:not(.wp-element-button))` になり、@layer 内の theme.css より優先される。
 * 暗い面用の brand（薄い象牙）が明るい紙面で読めなくなるため、Note だけ本文色に戻す。
 */
.c--noteMain .b--share_btn,
.c--noteMain .b--share_btn:hover,
.c--noteMain .b--share_btn:focus-visible,
.c--noteMain .b--share_btn.is-copied {
  color: var(--text);
}

.c--noteMain .c--socialLink {
  color: color-mix(in srgb, var(--text) 88%, var(--text-2));
}

.c--noteMain .c--socialLink:hover,
.c--noteMain .c--socialLink:focus-visible {
  color: var(--link);
}

.c--noteMain a.b--btn,
.c--noteMain a.b--btn:visited {
  color: var(--text);
}

.c--noteMain a.b--btn:hover,
.c--noteMain a.b--btn:focus-visible {
  color: var(--base);
  background-color: var(--text);
  border-color: var(--text);
}

.c--noteMain a.b--btn:hover span,
.c--noteMain a.b--btn:focus-visible span {
  color: inherit;
}

.c--noteMain .b--workAdjacent_home.b--textLink {
  color: var(--text);
}

.c--noteMain .b--workAdjacent_home.b--textLink:hover,
.c--noteMain .b--workAdjacent_home.b--textLink:focus-visible {
  color: var(--link);
}