/* ===========================
   Fonte personalizada
   =========================== */
@font-face {
  font-family: "EBGaramond";
  src: url("../fonts/EBGaramond.woff") format("woff"),
       url("../fonts/EBGaramond.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

/* ===========================
   Base / Layout
   =========================== */
:root { --navbar-h: 64px; } /* ajuste caso sua navbar seja mais alta */

html, body {
  font-family: "EBGaramond", sans-serif;
  margin: 0;
  min-height: 100%;
  color: black;
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;
  overflow-x: hidden;
}

/* Compensa a navbar fixed-top, deixando o conteúdo colado sem sobrepor */
body {
  padding-top: var(--navbar-h);
}

@media (max-width: 991.98px) {
  :root { --navbar-h: 56px; }
}

/* ===========================
   NAVBAR (vermelho vivo + branco)
   =========================== */
.navbar-light {
  background-color: white !important;
}
.navbar-light .navbar-nav .nav-link {
  color: black;
}
.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link:focus {
  color: white;
  background-color: black;
}

/* Navbar escura com tema vermelho vivo */
.navbar.navbar-dark {
  background-color: #ff0000 !important; /* vermelho vivo */
}

/* Texto branco nítido (sem opacidade no mobile) */
.navbar.navbar-dark .navbar-brand,
.navbar.navbar-dark .navbar-nav .nav-link {
  color: #ffffff !important;
  opacity: 1 !important;
  font-weight: 700;
  text-shadow: 0 1px 2px rgba(0,0,0,0.4);
  letter-spacing: .2px;
}

/* Estados de foco/hover */
.navbar.navbar-dark .navbar-nav .nav-link:hover,
.navbar.navbar-dark .navbar-nav .nav-link:focus,
.navbar.navbar-dark .navbar-nav .nav-link:active,
.navbar.navbar-dark .navbar-nav .nav-link.show {
  color: #ffffff !important;
  background-color: rgba(0,0,0,0.15);
  border-radius: .375rem;
}

/* Toggler (hambúrguer) nítido */
.navbar.navbar-dark .navbar-toggler {
  border-color: rgba(255,255,255,0.95);
}
.navbar.navbar-dark .navbar-toggler:focus {
  box-shadow: 0 0 0 .2rem rgba(255,255,255,0.4);
}
.navbar.navbar-dark .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255,1)' stroke-width='2' stroke-linecap='round' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

/* Menu colapsado no mobile mantém o vermelho */
@media (max-width: 991.98px) {
  .navbar.navbar-dark .navbar-collapse {
    background-color: #ff0000;
    padding: .5rem 1rem;
  }
  .navbar.navbar-dark .navbar-nav .nav-link {
    padding: .6rem .75rem;
  }
}

/* Dropdowns na navbar */
.navbar.navbar-dark .dropdown-menu {
  background-color: #cc0000;
  border: none;
}
.navbar.navbar-dark .dropdown-item {
  color: #ffffff;
  font-weight: 600;
  opacity: 1;
}
.navbar.navbar-dark .dropdown-item:hover,
.navbar.navbar-dark .dropdown-item:focus {
  background-color: #b30000;
  color: #fff;
}

/* Remove qualquer “vão” extra do próprio nav */
.navbar { margin-bottom: 0 !important; }

/* ===========================
   BOTÕES
   =========================== */
.btn-secondary {
  background-color: #f5f5f5;
  color: #555;
  border: 1px solid #ddd;
}
.btn-primary {
  background-color: #2fa4e7;
  border-color: #178acc;
}
.btn-success {
  background-color: #73a839;
  border-color: #59822c;
}
.btn-info {
  background-color: #033c73;
  border-color: #022241;
}
.btn-warning {
  background-color: #dd5600;
  border-color: #aa4200;
}
.btn-danger {
  background-color: #c71c22;
  border-color: #9a161a;
}

/* Botão de pesquisa (tema escuro) */
.btn-search {
  background-color: #000;
  color: #fff;
  border: none;
}
.btn-search:hover {
  background-color: #333;
  color: #fff;
}

/* ===========================
   CARDS
   =========================== */
.card-header {
  font-weight: bold;
  color: white;
}
.card.border-primary .card-header { background-color: #2fa4e7; }
.card.border-success .card-header { background-color: #73a839; }
.card.border-info .card-header    { background-color: #033c73; }
.card.border-warning .card-header { background-color: #dd5600; }
.card.border-danger  .card-header { background-color: #c71c22; }

/* ===========================
   TABELAS
   =========================== */
.table { color: #030129; }
.table-striped > tbody > tr:nth-of-type(odd) {
  background-color: #424251;
  color: white;
}
.table-hover > tbody > tr:hover {
  background-color: black;
  color: white;
}

/* ===========================
   CARROSSEL + HERO
   =========================== */

/* carrossel colado ao menu, largura total, sem paddings do container */
.container-fluid.p-0 { padding-left: 0 !important; padding-right: 0 !important; }

/* garante que não haja margem acima do carrossel */
#bs-carousel { margin-top: 0 !important; }

/* imagens realmente full width e responsivas */
#bs-carousel .carousel-item img {
  display: block;
  width: 100%;
  height: auto;
}

/* indicadores do carrossel */
.fade-carousel {
  position: relative;
  height: auto;
  margin: 0; /* sem margem superior */
}
.fade-carousel .carousel-inner .carousel-item { height: auto; }
.fade-carousel .carousel-indicators [data-bs-target] {
  margin: 0 2px;
  background-color: #f39c12;
  border-color: #f39c12;
  opacity: .7;
}
.fade-carousel .carousel-indicators .active {
  width: 10px;
  height: 10px;
  opacity: 1;
}

/* hero (legenda sobre a imagem) */
.hero {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
  color: #fff;
  text-align: center;
  text-transform: uppercase;
  text-shadow: 1px 1px 0 rgba(0,0,0,.75);
}
.hero h1 { font-size: 42px; font-weight: bold; margin: 0; }
.hero h3 { font-size: 21px; font-weight: bold; margin: 0; }

/* overlay opcional (se usar) */
.overlay {
  position: absolute;
  width: 100%; height: 100%;
  z-index: 2;
  background-color: #080d15;
  opacity: .4;
}

/* botões hero */
.btn-lg { padding: 10px 40px; }
.btn-hero,
.btn-hero:hover,
.btn-hero:focus {
  color: #f5f5f5;
  background-color: #1abc9c;
  border-color: #1abc9c;
  outline: none;
  margin: 20px auto;
}

/* responsividade do hero */
@media screen and (max-width: 980px){
  .hero { width: 100%; bottom: 0; }
  .hero h1 { font-size: 36px; }
  .hero h3 { font-size: 20px; }
}
@media screen and (max-width: 640px){
  .btn-lg { padding: 5px 20px; }
}

/* ===========================
   OUTRAS SEÇÕES / RODAPÉ
   =========================== */
.card-header h3,
.h3-contato {
  margin-top: 0;
  padding-top: 5px;
  color: white;
}

#rodape {
  position: absolute;
  bottom: 0; left: 0;
  width: 100%; height: 80px;
  background-color: rgba(255,255,255,0.7);
  color: white;
  text-align: center;
  line-height: 80px;
}
#rodape h3, #rodape .text-muted { color: white; }

div#acesso {
  background-color: white;
  margin-top:15px;
  padding: 6px 0;
  box-shadow: 0 4px 8px rgba(0,0,0,.2), 0 6px 20px rgba(0,0,0,.19);
}
div#acesso h3 { color: black; }

div#img_acesso_rapido img {
  border: none;
  border-bottom: 5px solid transparent;
  margin-bottom: 5px;
  background-color: transparent;
}
div#img_acesso_rapido a:hover img {
  border-bottom: 5px solid black;
}

div#tumbnail_noticia {
  margin-bottom:0;
  padding: 0 0 15px 0;
  background-color: rgba(255,255,255,0.1);
}
div#tumbnail_noticia h3 { color: #030129; }

div#data {
  background-color: rgba(255,255,255,0.1);
  color: black;
  text-align: center;
  padding: 15px 0;
}
div#social { color: black; }

#contato { color: #424251; }
#contato h3 { padding-top: 10px; }

#bombeiros { color: #f50202; }

.quebra tr td { white-space: pre-wrap; }

/* Indicadores redondos personalizados */
.carousel-indicators.rounded-indicators [data-bs-target] {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: rgba(255,255,255,0.8);
  border: 1px solid #fff;
  margin: 5px 6px;
  opacity: 0.7;
  transition: all 0.3s ease;
}

.carousel-indicators.rounded-indicators .active {
  background-color: #fff;
  opacity: 1;
  transform: scale(1.2);
}

/* Indicadores do carrossel redondos (BS5) */
#bs-carousel .carousel-indicators [data-bs-target] {
  width: .75rem;              /* ~12px */
  height: .75rem;
  border-radius: 50%;
  padding: 0;                 /* evita “barrinha” */
  margin: 0 .5rem;
  background-color: rgba(255,255,255,.8);
  border: 1px solid #fff;
  opacity: .7;
  box-sizing: content-box;
}

#bs-carousel .carousel-indicators .active {
  background-color: #fff;
  opacity: 1;
  transform: scale(1.12);
}

/* Se você mantiver regras antigas, neutralize-as aqui */
.fade-carousel .carousel-indicators [data-bs-target] {
  /* mantenha a cor se quiser, mas padronize o formato também */
  width: .75rem;
  height: .75rem;
  border-radius: 50%;
}
