/* Definindo Variáveis de Cores */
:root {
  --bg-color: #f8f9fa; /* Cor de fundo */
  --text-color: #343a40; /* Cor do texto principal */
  --card-bg: #ffffff; /* Cor de fundo do card */
  --card-shadow: rgba(0, 0, 0, 0.1); /* Sombra do card */
  --btn-primary-bg: #007bff; /* Cor de fundo do botão primário */
  --btn-primary-bg-hover: #0056b3; /* Cor de fundo do botão primário no hover */
  --alert-bg: #d1ecf1; /* Cor de fundo do alerta */
  --alert-text: #0c5460; /* Cor do texto do alerta */
  --border-radius: 8px; /* Raio de borda comum */
  --spacing: 1rem; /* Espaçamento padrão */
  --font-family: Arial, sans-serif; /* Fonte padrão */
  --font-size-base: 1rem; /* Tamanho de fonte base */
  --font-size-heading: 2.5rem; /* Tamanho de fonte para título */
}

/* Estilo global */
html {
  background-color: var(--bg-color);
  height: 100%;
  max-width: 100%;
  overflow-x: hidden;
  margin: 0;
}

body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  font-family: var(--font-family);
}

/* Container principal ocupa o restante do espaço */
.container {
  flex: 1;
}

/* div map */
#map {
  width: 100%;
  height: 32rem;
}

/* Estilo do menu no topo */
nav.navbar {
  margin-bottom: 30px; /* Espaço abaixo do menu */
}

/* Abre o dropdown ao passar o mouse */
.nav-item.dropdown:hover .dropdown-menu {
  display: block;
}

/* Estilo do título principal */
h1.text-center {
  font-size: var(--font-size-heading);
  font-weight: bold;
  color: var(--text-color);
}

/* Estilização dos cards para os resultados */
.card {
  background-color: var(--card-bg);
  border-radius: var(--border-radius);
  box-shadow: 0 2px 10px var(--card-shadow);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card:hover {
  transform: translateY(-10px);
  box-shadow: 0 5px 20px var(--card-shadow);
}

.card-title {
  font-size: 1.25rem;
  font-weight: bold;
}

.card-text {
  font-size: var(--font-size-base);
  color: #495057;
}

/* Estilização do rodapé */
footer.bg-dark {
  width: 100%;
  padding: 15px;
  margin-top: auto; /* Garante que o rodapé fique no fundo */
}

footer p {
  margin: 0;
  font-size: var(--font-size-base);
}

/* Estilo do alerta de boas-vindas */
.alert-info {
  background-color: var(--alert-bg);
  color: var(--alert-text);
  border-color: #bee5eb;
  border-radius: var(--border-radius);
  padding: 15px;
}

/* Estilização do botão de busca */
.btn-primary {
  background-color: var(--btn-primary-bg);
  border-color: var(--btn-primary-bg);
}

.btn-primary:hover {
  background-color: var(--btn-primary-bg-hover);
  border-color: var(--btn-primary-bg-hover);
}

/* Ajuste do layout do formulário de busca */
.row {
  margin-bottom: 20px;
}

/* Customização do texto no card */
.card-body {
  padding: 1.5rem;
}

/* CSP inline styles */

/* home */
.home-max-width-600 {
  max-width: 600px;
}

.home-max-width-400 {
  max-width: 400px;
  width: 100%;
  padding: 20px;
}

/* ajuda */
.ajuda-text-justify {
  text-align: justify;
}

/* mapa controls */
.map-control-input-small {
  max-width: 200px;
  width: 100%;
}

.map-control-input-date-small {
  max-width: 150px;
  width: 100%;
}

/* mapa base */
.map-base-map-container {
  min-height: 600px;
}

.map-base-hidden {
  display: none;
}

/* tabelas */
.tabela-min-width {
  min-width: 1200px;
}

/* atribuir grupos e atualizar tipo */
.form-atribuir-grupo-min-width {
  min-width: 300px;
}