/* Importa a fonte 'Inter' do Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap');

/* Define a fonte padrão para todo o corpo da página */
body {
    font-family: 'Inter', sans-serif;
}

/* DEFINIÇÕES DE CLASSES DE CORES PERSONALIZADAS
  Estas classes são usadas no HTML para manter a consistência com a identidade visual do seu site.
*/
.bg-oliva-fundo {
    background-image: url('/images/aa460dddc74f394d.jpg');
    background-color: #3D5537; /* Cor de fallback caso a imagem não carregue */
    background-size: cover; /* Faz a imagem cobrir toda a área */
    background-position: center center; /* Centraliza a imagem */
    background-attachment: fixed; /* Mantém a imagem fixa durante a rolagem */
    background-repeat: no-repeat; /* Evita que a imagem se repita */
}

.bg-oliva-card { background-color: #4F6A48; }
.bg-verde-acao { background-color: #6B8E23; }
.hover\:bg-verde-acao-hover:hover { background-color: #5A7D1B; }

/* Ajusta a cor do anel de foco para elementos de formulário, mantendo a consistência */
.focus\:ring-verde-acao:focus {
    --tw-ring-color: #6B8E23;
}

.border-verde-acao { border-color: #6B8E23; }

/* ESTILIZAÇÃO CUSTOMIZADA PARA O INPUT RANGE (BARRA DE INTENSIDADE)
  O input 'range' precisa de regras específicas para ter uma aparência consistente entre navegadores.
*/
input[type="range"] {
    -webkit-appearance: none; /* Remove o estilo padrão do WebKit (Chrome, Safari) */
    appearance: none; /* Remove o estilo padrão de outros navegadores */
    width: 100%;
    height: 8px;
    background: #374151; /* Cor de fundo da barra (equivalente a bg-gray-700 do Tailwind) */
    border-radius: 5px;
    outline: none; /* Remove a borda de foco padrão */
}

/* Estilo para o "polegar" (a bolinha que se move) no Chrome e Safari */
input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    background: #6B8E23; /* Cor da bolinha (bg-verde-acao) */
    cursor: pointer;
    border-radius: 50%;
}

/* Estilo para o "polegar" no Firefox */
input[type="range"]::-moz-range-thumb {
    width: 20px;
    height: 20px;
    background: #6B8E23; /* Cor da bolinha (bg-verde-acao) */
    cursor: pointer;
    border-radius: 50%;
    border: 0; /* Remove a borda padrão do Firefox */
}