/*
 * 松乃鮨：ギャラリー（WordPress のギャラリーブロック）の横並び  2026-09-24
 * テーマの CSS がギャラリーの画像を幅 50%（!important）にしており、間隔 12px と合わさって
 * 1 行に 1 枚・幅いっぱいになっていたのを直す。列数は WordPress の columns-N を PC の列数にする。
 *   PC（1025px 以上）      ：columns-N のとおり
 *   タブレット（600〜1024px）：4 列→2、5 列→3、6 列以上→4
 *   スマートフォン（599px 以下）：2 列→2、3〜5 列→2、6 列以上→3
 * 最後の行（と列数より枚数が少ないギャラリー）は、画像を広げず左にそろえる（2026-09-25 鮎澤指示）。「切り抜き」（is-cropped）は正方形・中央基準で切り抜く。
 * スマートフォンでは、写真に重なる説明文（figcaption）を写真の下に出す（2026-09-25 鮎澤指示）。
 * 新しいビルド（/gallery-layout.css）と、現行 WordPress の「追加 CSS」は同じ内容。
 */
body .wp-block-gallery.has-nested-images {
  --mtz-gap: 12px;
  --mtz-cols: 3;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: var(--mtz-gap);
}
body .wp-block-gallery.has-nested-images.columns-1 { --mtz-cols: 1; }
body .wp-block-gallery.has-nested-images.columns-2 { --mtz-cols: 2; }
body .wp-block-gallery.has-nested-images.columns-3 { --mtz-cols: 3; }
body .wp-block-gallery.has-nested-images.columns-4 { --mtz-cols: 4; }
body .wp-block-gallery.has-nested-images.columns-5 { --mtz-cols: 5; }
body .wp-block-gallery.has-nested-images.columns-6 { --mtz-cols: 6; }
body .wp-block-gallery.has-nested-images.columns-7 { --mtz-cols: 7; }
body .wp-block-gallery.has-nested-images.columns-8 { --mtz-cols: 8; }
@media (max-width: 1024px) {
  body .wp-block-gallery.has-nested-images.columns-4 { --mtz-cols: 2; }
  body .wp-block-gallery.has-nested-images.columns-5 { --mtz-cols: 3; }
  body .wp-block-gallery.has-nested-images.columns-6,
  body .wp-block-gallery.has-nested-images.columns-7,
  body .wp-block-gallery.has-nested-images.columns-8 { --mtz-cols: 4; }
}
@media (max-width: 599px) {
  body .wp-block-gallery.has-nested-images:not(.columns-1) { --mtz-cols: 2; }
  body .wp-block-gallery.has-nested-images.columns-6,
  body .wp-block-gallery.has-nested-images.columns-7,
  body .wp-block-gallery.has-nested-images.columns-8 { --mtz-cols: 3; }
}
body .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) {
  flex: 0 0 auto !important;
  width: calc((100% - (var(--mtz-cols) - 1) * var(--mtz-gap)) / var(--mtz-cols)) !important;
  max-width: none;
  margin: 0 !important;
}
body .wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image) {
  aspect-ratio: 1 / 1;
}
body .wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image) img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* スマートフォン：説明文は写真の下に（写真は他と同じ正方形のまま） */
@media (max-width: 599px) {
  body .wp-block-gallery.has-nested-images {
    align-items: flex-start;
  }
  body .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image):has(figcaption),
  body .wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image):has(figcaption) {
    aspect-ratio: auto;
    overflow: visible;
  }
  body .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image):has(figcaption)::before {
    display: none;
  }
  body .wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image):has(figcaption) > a,
  body .wp-block-gallery.has-nested-images.is-cropped figure.wp-block-image:not(#individual-image):has(figcaption) img {
    flex: 0 0 auto;
    height: auto;
    aspect-ratio: 1 / 1;
  }
  body .wp-block-gallery.has-nested-images figure.wp-block-image:not(#individual-image) figcaption {
    position: static;
    max-height: none;
    overflow: visible;
    padding: 0.6em 0 0;
    background: none;
    color: inherit;
    text-shadow: none;
    line-height: 1.6;
  }
}
