/* Modelos de galeria (Fase 3, 10/09/2026). Não edita o bloco GALERIA do blog.css (layout.css do tema 2.6.95):
   complementa por data-layout (escrito por gutenberg.galerias a partir de columns-N) e por is-style-<modelo>,
   para o dia em que o tema registrar os estilos no editor. Os !important existem porque o tema já os usa nas
   mesmas propriedades (width/height/grid). Lightbox: inalterado, seleciona .wp-block-gallery. */

/* grade-2 / grade-3: as grades do tema, explícitas */
.entry-content .wp-block-gallery[data-layout="grade-2"],
.entry-content .wp-block-gallery.is-style-grade-2 { grid-template-columns: repeat(2, 1fr) !important; }
.entry-content .wp-block-gallery[data-layout="grade-3"],
.entry-content .wp-block-gallery.is-style-grade-3 { grid-template-columns: repeat(3, 1fr) !important; }

/* mosaico: 3 colunas; a 1ª de cada 6 ocupa 2×2; dense preenche os buracos */
.entry-content .wp-block-gallery[data-layout="mosaico"],
.entry-content .wp-block-gallery.is-style-mosaico { grid-template-columns: repeat(3, 1fr) !important; grid-auto-flow: dense; }
/* A célula grande mantém 4:3 (2 colunas + gap ÷ 2 linhas + gap ≈ 4:3): com `auto`, uma foto em retrato esticava as duas
   linhas pela altura intrínseca e abria buracos ao lado (post "Gelo"). O stretch do grid fecha os 2 px que faltam. */
.entry-content .wp-block-gallery[data-layout="mosaico"] > figure:nth-child(6n+1),
.entry-content .wp-block-gallery.is-style-mosaico > figure:nth-child(6n+1) { grid-column: span 2; grid-row: span 2; aspect-ratio: 4/3; }

/* tira: faixa horizontal com rolagem e a proporção original de cada foto */
.entry-content .wp-block-gallery[data-layout="tira"],
.entry-content .wp-block-gallery.is-style-tira {
  display: flex !important; overflow-x: auto; gap: 8px !important; scroll-snap-type: x mandatory;
  padding-bottom: 8px; scrollbar-width: thin; -webkit-overflow-scrolling: touch;
}
.entry-content .wp-block-gallery[data-layout="tira"] > figure,
.entry-content .wp-block-gallery.is-style-tira > figure { flex: 0 0 auto; width: auto !important; height: 340px; aspect-ratio: auto; scroll-snap-align: start; }
.entry-content .wp-block-gallery[data-layout="tira"] > figure img,
.entry-content .wp-block-gallery.is-style-tira > figure img { width: auto !important; height: 100% !important; max-width: none !important; object-fit: contain; }

/* destaque: a 1ª em 16:9 na largura toda; as demais em 3 colunas */
.entry-content .wp-block-gallery[data-layout="destaque"],
.entry-content .wp-block-gallery.is-style-destaque { grid-template-columns: repeat(3, 1fr) !important; }
.entry-content .wp-block-gallery[data-layout="destaque"] > figure:first-child,
.entry-content .wp-block-gallery.is-style-destaque > figure:first-child { grid-column: 1 / -1; aspect-ratio: 16/9; }

/* Página de modelos */
.sl-modelo { margin: 2.5rem 0 3.5rem; }
.sl-modelo > .section-head { margin-bottom: 0.5rem; }
.sl-modelo > p { color: var(--text-soft); max-width: 62ch; margin: 0 0 1rem; }
.sl-modelo .entry-content .wp-block-gallery { margin: 0.5em 0 !important; }
.sl-modelo-vazio { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; font-family: var(--f-mono); font-size: 12px; letter-spacing: 0.1em; color: var(--muted-deep); }

/* Os breakpoints são os do tema (720/480). Sem isto, os !important acima venceriam a regra móvel do blog.css. */
@media (max-width: 720px) {
  .entry-content .wp-block-gallery[data-layout="grade-3"], .entry-content .wp-block-gallery.is-style-grade-3,
  .entry-content .wp-block-gallery[data-layout="mosaico"], .entry-content .wp-block-gallery.is-style-mosaico,
  .entry-content .wp-block-gallery[data-layout="destaque"], .entry-content .wp-block-gallery.is-style-destaque { grid-template-columns: repeat(2, 1fr) !important; }
  .entry-content .wp-block-gallery[data-layout="tira"] > figure, .entry-content .wp-block-gallery.is-style-tira > figure { height: 240px; }
}
@media print {
  .entry-content .wp-block-gallery[data-layout="tira"], .entry-content .wp-block-gallery.is-style-tira { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; overflow: visible; }
  .entry-content .wp-block-gallery[data-layout="tira"] > figure, .entry-content .wp-block-gallery.is-style-tira > figure { height: auto; aspect-ratio: 4/3; width: 100% !important; }
}