/* 3. O PULO DO GATO: Faz o miolo crescer e ocupar todo o espaço restante */
.conteudo-principal {
  flex: 1 1 auto; /* Permite crescer e enconhar conforme necessário */
  /* view-transition-name: miolo-conteudo; */
}

/* 4. O rodapé fica estático no final, sem encolher */
.rodape-site {
  flex-shrink: 0; /* Impede o rodapé de ser esmagado se a tela for pequena */
}

/* ==========================================================================
   LIGHTBOX - Galeria de Imagens (Nativo, sem plugins)
   ========================================================================== */

.lightbox-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.95);
  z-index: 9999;
  justify-content: center;
  align-items: center;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.lightbox-overlay.ativo {
  display: flex;
  opacity: 1;
}

.lightbox-container {
  position: relative;
  max-width: 90vw;
  max-height: 85vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

.lightbox-container img {
  max-width: 90vw;
  max-height: 85vh;
  object-fit: contain;
  border-radius: 8px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
  user-select: none;
  -webkit-user-drag: none;
}

.lightbox-btn {
  position: fixed;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.25);
  color: #fff;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.2s ease;
  z-index: 10001;
  backdrop-filter: blur(4px);
}

.lightbox-btn:hover {
  background: rgba(255, 255, 255, 0.3);
  border-color: rgba(255, 255, 255, 0.5);
  transform: scale(1.1);
}

.lightbox-btn-fechar {
  top: 20px;
  right: 20px;
}

.lightbox-btn-anterior {
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
}

.lightbox-btn-anterior:hover {
  transform: translateY(-50%) scale(1.1);
}

.lightbox-btn-proximo {
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
}

.lightbox-btn-proximo:hover {
  transform: translateY(-50%) scale(1.1);
}

.lightbox-contador {
  position: fixed;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  color: rgba(255, 255, 255, 0.8);
  font-size: 14px;
  font-family: 'Poppins', sans-serif;
  background: rgba(0, 0, 0, 0.5);
  padding: 6px 16px;
  border-radius: 20px;
  backdrop-filter: blur(4px);
  z-index: 10001;
}

.lightbox-legenda {
  position: fixed;
  bottom: 60px;
  left: 50%;
  transform: translateX(-50%);
  color: #fff;
  font-size: 16px;
  font-family: 'Poppins', sans-serif;
  text-align: center;
  max-width: 80vw;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.7);
  z-index: 10001;
}

/* Animação de entrada da imagem */
@keyframes lightbox-fade-in {
  from { opacity: 0; transform: scale(0.9); }
  to { opacity: 1; transform: scale(1); }
}

.lightbox-container img.animando {
  animation: lightbox-fade-in 0.3s ease forwards;
}
/* ==========================================================================
   SISTEMA DE TRANSIÇÃO DE PÁGINAS PREMIUM (VIEW TRANSITIONS)
   DESATIVADO - mantido apenas para referência futura
   ========================================================================== */

/* 1. Ativação apenas para navegação entre páginas (não âncoras) */
/*
@view-transition {
  navigation: standard;
}
*/

/* 2. Alvo da animação (Miolo do Conteúdo) */
/*
.conteudo-principal {
  view-transition-name: miolo-conteudo;
}
*/

/* Desativa animação padrão durante a transição entre links */
/*
:root::view-transition .conteudo-principal {
  animation: none;
}
*/

/* 3. Correção do motor de renderização do navegador */
/*
::view-transition-group(miolo-conteudo) {
  animation-duration: inherit;
  animation-timing-function: inherit;
}
*/

/*
::view-transition-old(miolo-conteudo),
::view-transition-new(miolo-conteudo) {
  mix-blend-mode: normal;
}
*/


/* ==========================================================================
   COREOGRAFIA DAS ANIMAÇÕES
   ========================================================================== */

/* --- SAÍDA (Página antiga esmaecendo) --- */
@keyframes fade-out {
  from { opacity: 1; }
  to { opacity: 0; }
}

/* --- ENTRADA (Página nova surgindo) --- */
@keyframes fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

/*
::view-transition-old(miolo-conteudo) {
  animation: 200ms ease-out both fade-out;
}

::view-transition-new(miolo-conteudo) {
  animation: 300ms ease-in both fade-in;
}
*/

/* ==========================================================================
   Conteúdo rico (editor Pell) — exibição pública
   Dependências: variáveis --color-* geradas pelo @theme em src/views/layout.php
   ========================================================================== */
.conteudo-rico {
  font-size: 1.05rem;
  line-height: 1.85;
}

.conteudo-rico > *:first-child { margin-top: 0; }
.conteudo-rico > *:last-child { margin-bottom: 0; }

.conteudo-rico p { margin: 0 0 1rem; }

.conteudo-rico h1,
.conteudo-rico h2 {
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 1.3;
  margin: 1.75rem 0 0.75rem;
  color: var(--color-foreground, hsl(0 0% 19%));
}

.conteudo-rico h3 {
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.35;
  margin: 1.5rem 0 0.5rem;
  color: var(--color-foreground, hsl(0 0% 19%));
}

.conteudo-rico blockquote {
  margin: 1.25rem 0;
  padding: 0.25rem 0 0.25rem 1rem;
  border-left: 4px solid var(--color-accent, hsl(21 100% 50%));
  font-style: italic;
  color: var(--color-muted-foreground, hsl(210 20% 40%));
}

.conteudo-rico ul,
.conteudo-rico ol { margin: 0 0 1rem; padding-left: 1.5rem; }
.conteudo-rico li { margin-bottom: 0.35rem; }

.conteudo-rico a {
  color: var(--color-primary, hsl(152 68% 31%));
  text-decoration: underline;
  text-underline-offset: 2px;
}
.conteudo-rico a:hover { color: var(--color-accent, hsl(21 100% 50%)); }

.conteudo-rico img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 1.25rem 0;
  border-radius: 0.75rem;
}

/* Colapsa <br><br> legados (14 registros) sem tocar no banco */
.conteudo-rico br + br { display: none; }