/* gallery.css — Gallery CPT: full page + reusable preview component.
   Follows the place-gallery look (12px radius, cream palette). */

/* ── Full gallery page ── */
.pg-gallery-wrap { max-width: var(--max-w, 1200px); margin: 0 auto; padding: 40px 32px 80px; }
.pg-gallery-title {
  font-family: var(--serif, serif); font-weight: 700; font-size: 38px;
  line-height: 1.1; letter-spacing: -.02em; margin: 0 0 10px; color: var(--ink, #1c1a17);
}
.pg-gallery-meta { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 14px; color: var(--muted, #8b8780); margin: 0 0 16px; }
.pg-gallery-meta a { color: var(--coral, #d85a30); font-weight: 600; }
.pg-gallery-av { width: 28px; height: 28px; border-radius: 50%; overflow: hidden; flex-shrink: 0; display: block; }
.pg-gallery-av img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }
.pg-gallery-desc { max-width: 760px; font-size: 16px; line-height: 1.75; color: var(--ink-soft, #4a4640); margin: 0 0 28px; }
.pg-gallery-desc p { margin-bottom: 1rem; }

/* Dynamic mosaic: a repeating rhythm of big (2×2), tall (1×2) and wide (2×1)
   tiles among the squares; dense flow backfills any holes. */
.pg-gallery-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 220px;
  grid-auto-flow: dense; gap: 14px;
}
.pg-gallery-item { margin: 0; border-radius: 12px; overflow: hidden; background: var(--ph, #ece7dc); }
.pg-gallery-item a { display: block; height: 100%; }
.pg-gallery-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* Tile shapes assigned per-photo from its aspect ratio (single-gallery.php):
   portraits → tall, featured landscapes → big (2×2 ≈ 3:2 frame), rest square.
   No wide 2×1 strips — they letterbox photos. */
.pg-tile-big  { grid-column: span 2; grid-row: span 2; }
.pg-tile-tall { grid-row: span 2; }
/* Captions sit inside the tile, over the lower edge */
.pg-gallery-item { position: relative; }
.pg-gallery-caption {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 18px 12px 10px;
  font-size: 12px; line-height: 1.45; color: #fff;
  background: linear-gradient(transparent, rgba(0,0,0,.55));
  pointer-events: none;
}
.pg-gallery-empty { color: var(--muted, #8b8780); font-style: italic; }

/* PhotoSwipe caption bar */
.pg-pswp-caption {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 10px 16px calc(10px + env(safe-area-inset-bottom));
  text-align: center; font-size: 13px; color: #fff; background: linear-gradient(transparent, rgba(0,0,0,.55));
  pointer-events: none;
}

/* ── Preview component (Place page, author page, archive) ── */
.pg-galprev { display: flex; flex-direction: column; gap: 8px; }
.pg-galprev-grid {
  position: relative; display: grid; gap: 4px; border-radius: 12px; overflow: hidden;
  grid-template-columns: repeat(4, 1fr); grid-auto-rows: 90px; text-decoration: none;
}
.pg-galprev-cell { overflow: hidden; background: var(--ph, #ece7dc); }
.pg-galprev-cell img { width: 100%; height: 100%; object-fit: cover; display: block; }
/* Count-specific layouts — every variant fills its grid with no empty cells.
   5 = lead 2×2 + four singles (two full rows of a 4-col grid). */
.pg-galprev-n5 .pg-galprev-cell:first-child { grid-column: span 2; grid-row: span 2; }
.pg-galprev-n1 { grid-template-columns: 1fr; grid-auto-rows: 220px; }
.pg-galprev-n2 { grid-template-columns: 1fr 1fr; grid-auto-rows: 160px; }
.pg-galprev-n3 { grid-template-columns: repeat(3, 1fr); grid-auto-rows: 130px; }
.pg-galprev-n4 { grid-template-columns: 1fr 1fr; grid-auto-rows: 110px; }
.pg-galprev-more {
  position: absolute; right: 8px; bottom: 8px; background: rgba(28,26,23,.78); color: #fff;
  font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 999px;
}
.pg-galprev-title {
  font-family: var(--serif, serif); font-weight: 700; font-size: 17px; color: var(--ink, #1c1a17);
  text-decoration: none;
}
.pg-galprev-title:hover { color: var(--coral, #d85a30); }
.pg-galprev-sub { font-size: 12.5px; color: var(--muted, #8b8780); }
.pg-galprev-sub a { color: var(--coral, #d85a30); }
.pg-galprev-curator { display: flex; align-items: center; gap: 7px; }
.pg-galprev-av {
  width: 22px; height: 22px; border-radius: 50%; overflow: hidden; flex-shrink: 0; display: block;
}
.pg-galprev-av .pg-avatar-img, .pg-galprev-av img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; }
.pg-galprev-avname { font-size: 12.5px; font-weight: 600; color: var(--ink, #1c1a17); text-decoration: none; }
.pg-galprev-avname:hover { color: var(--coral, #d85a30); }

/* Section wrapper used on place/author pages */
.pg-galleries-sec { margin-top: 40px; padding-top: 28px; border-top: 1px solid var(--line, #e4e0d6); }
.pg-galleries-label {
  font-size: 10px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase;
  color: var(--muted-2, #a39e94); margin-bottom: 14px;
}
.pg-galleries-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 28px; }

/* ── Compact gallery strip (place card inside guides) ── */
.pg-galstrip {
  display: flex; align-items: center; gap: 12px; margin-top: 14px;
  padding: 10px 12px; border: 1px solid var(--line, #e4e0d6); border-radius: 10px;
  background: var(--paper, #fbf8f2); text-decoration: none;
  transition: border-color .15s ease;
}
.pg-galstrip:hover { border-color: #ccc8be; }
.pg-galstrip-thumbs { display: flex; flex-shrink: 0; }
.pg-galstrip-thumb {
  width: 40px; height: 40px; border-radius: 8px; overflow: hidden;
  border: 2px solid #fff; margin-left: -10px; box-shadow: 0 1px 4px rgba(0,0,0,.15);
}
.pg-galstrip-thumb:first-child { margin-left: 0; }
.pg-galstrip-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pg-galstrip-label { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.pg-galstrip-title {
  font-size: 13px; font-weight: 700; color: var(--ink, #1c1a17);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.pg-galstrip:hover .pg-galstrip-title { color: var(--coral, #d85a30); }
.pg-galstrip-count { font-size: 11.5px; color: var(--muted, #8b8780); }

@media (max-width: 640px) {
  .pg-gallery-wrap { padding: 24px 20px 60px; }
  .pg-gallery-title { font-size: 28px; }
  /* Rows scale with the viewport so a big (2-col × 2-row) tile is always
     ≈3:2 — a natural landscape frame — instead of a fixed-height letterbox.
     Squares come out gently landscape (3:2), talls ≈3:4 portrait. */
  .pg-gallery-grid { grid-template-columns: 1fr 1fr; grid-auto-rows: calc((100vw - 56px) / 3); gap: 8px; }
  .pg-tile-big { grid-column: span 2; grid-row: span 2; }
  .pg-galprev-grid { grid-auto-rows: 70px; }
}