/* Ajustes de compatibilidade com o WordPress, mantendo o design original. */

/* ------------------------------------------------------------------ */
/* Logo do rodapé: se a versão configurada no Customizer for escura,    */
/* fica pouco visível em cima do fundo azul-marinho do footer.          */
/* Fundo branco arredondado atrás da logo pra garantir contraste.       */
/* ------------------------------------------------------------------ */
.footer-grid .custom-logo,
.footer-grid > div:first-child > img{
  display: inline-block;
  background: #fff;
  border-radius: 8px;
  padding: 10px 16px;
  box-sizing: content-box;
}

/* Espaço para a admin bar quando o usuário está logado */
body.admin-bar header{ top: 32px; }
@media screen and (max-width: 782px){
  body.admin-bar header{ top: 46px; }
}

/* Item de menu ativo (WordPress adiciona a classe current-menu-item) */
nav ul li.current-menu-item > a,
nav ul li.current_page_item > a{
  color: var(--blue);
}

/* Suporte a imagens com legenda (wp_get_attachment / [caption]) */
.wp-caption{ max-width: 100%; }
.wp-caption-text{ font-size: 13px; color: var(--muted); margin-top: 6px; }

/* Alinhamentos padrão do editor de blocos, caso usados em páginas internas */
.alignleft{ float:left; margin:0 20px 10px 0; }
.alignright{ float:right; margin:0 0 10px 20px; }
.aligncenter{ display:block; margin:0 auto 10px; }

/* Conteúdo textual simples em páginas internas (Sobre, Serviços, Atendimento) */
.page-header{ padding-top: 60px; }
.page-content{ padding: 70px 24px 96px; }
.page-content .content-wrap{ max-width: 900px; margin: 0 auto; }
.page-content h2{ font-size: 28px; margin-bottom: 18px; }
.page-content h3{ font-size: 20px; margin: 30px 0 12px; }
.page-content p{ margin-bottom: 16px; }

/* Página de Atendimento: dois blocos (fale conosco / canal de denúncias) */
.atendimento-grid{
  max-width: 1180px; margin: 0 auto; display:grid;
  grid-template-columns: 1fr 1fr; gap: 40px;
}
@media (max-width: 900px){ .atendimento-grid{ grid-template-columns: 1fr; } }
.denuncia-card{
  background:#fff; border-radius:14px; padding:34px;
  box-shadow: 0 14px 34px rgba(0,0,0,.08); border: 1px solid var(--line);
}
.denuncia-card h3{ margin-top: 0; }
.denuncia-toggle{ display:flex; gap:10px; margin-bottom:20px; }
.denuncia-toggle button{
  flex:1; padding:10px 14px; border-radius:8px; border:1px solid var(--line);
  background:#fff; font-weight:600; cursor:pointer;
}
.denuncia-toggle button.active{ background: var(--navy); color:#fff; border-color: var(--navy); }

/* base.css só estiliza inputs/textarea/botão dentro de ".form-card".
   O Canal de Denúncias usa ".denuncia-card" (classe diferente), então
   os campos ficariam sem borda, sem espaçamento e sem fundo. Reaplicando
   o mesmo padrão visual aqui. */
.denuncia-card input,
.denuncia-card textarea{
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 13px 14px;
  font-family: inherit;
  font-size: 14.5px;
  background: var(--gray-bg);
}
.denuncia-card textarea{
  min-height: 110px;
  resize: vertical;
  margin-bottom: 18px;
}
.denuncia-card .btn-navy{
  width: 100%;
  justify-content: center;
  border: none;
}

/* ------------------------------------------------------------------ */
/* Rodapé: reduz padding/gap padrão do WordPress para um respiro menor  */
/* ------------------------------------------------------------------ */
footer{
  padding: 40px 24px 20px !important;
}
.footer-grid{
  gap: 24px !important;
}
.footer-bottom{
  margin: 20px auto 0 !important;
  padding-top: 16px !important;
}

/* A seção de contato (Home e Atendimento) tem 96px de padding embaixo por
   padrão, o que deixa uma faixa vazia grande antes do rodapé começar. */
.contato{
  padding-top: 80px !important;
  padding-bottom: 48px !important;
}

/* Ícones em todos os itens do rodapé (Navegação, Atendimento, Localização) */
.footer-grid nav ul li a,
.footer-icon-list li{
  display: flex;
  align-items: center;
  gap: 10px;
}
.footer-icon-list li{
  margin-bottom: 12px;
}
.footer-icon-list .ic{
  flex: none;
  display: inline-flex;
  color: var(--lightblue);
}
.footer-icon-list .ic svg{ display:block; }

/* ------------------------------------------------------------------ */
/* Menu do rodapé em lista vertical                                    */
/* ------------------------------------------------------------------ */
/* O seletor global "nav ul{display:flex}" (base.css, feito para o menu
   do cabeçalho) também atinge o <nav> do rodapé, forçando os itens do
   menu em linha (flex) dentro de uma coluna estreita — por isso os
   links quebrariam palavra a palavra e ficariam sobrepostos com as
   colunas ao lado. Aqui forçamos lista vertical, no mesmo padrão já
   usado nas colunas Atendimento/Localização (.footer-icon-list). */
.footer-grid nav ul{
  display: block;
  overflow: visible;
}
.footer-grid nav ul li{
  margin-bottom: 12px;
}
.footer-grid nav ul li:last-child{
  margin-bottom: 0;
}
.footer-grid nav ul li a{
  white-space: normal;
  /* base.css tem "nav a{color:var(--ink)}" (pensado para o menu do
     cabeçalho, sobre fundo branco). Essa regra também bateria no <nav>
     do rodapé e deixaria os links quase pretos sobre o fundo azul-escuro
     do footer — por isso devolvemos a cor clara usada no restante do rodapé. */
  color: #C9C5C2;
}

/* Ícone de seta antes de cada link de Navegação (via CSS mask, sem
   precisar mexer no walker do wp_nav_menu) */
.footer-grid nav ul li a::before{
  content: "";
  width: 10px;
  height: 10px;
  flex: none;
  background-color: var(--lightblue);
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M7 4l6 6-6 6' stroke='%23000' stroke-width='2.4' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M7 4l6 6-6 6' stroke='%23000' stroke-width='2.4' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}