/* Estilos básicos e fontes */
body, h1, p, a {
  font-family: 'Open Sans', sans-serif;
  color: #333; /* Cor padrão para texto mais escuro para melhor leitura */
}

/* Container principal */
.container {
  max-width: 400px;
  margin: 2rem auto;
  padding: 2rem;
  background-color: #fff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1); /* Sombra mais suave */
  border-radius: 8px;
  text-align: center;
}

/* Títulos e parágrafos */
h1 {
  color: #333;
  font-weight: 600;
  margin-bottom: 1rem; /* Espaço adicional abaixo do título */
}

p {
  line-height: 1.6;
  margin-bottom: 1rem; /* Consistência no espaçamento abaixo dos parágrafos */
}

/* Estilização dos campos de entrada e botões */
input[type="text"], input[type="email"], input[type="date"], select {
  width: 100%; /* Uso de 100% para melhor responsividade */
  padding: 12px; /* Padding maior para melhor tato */
  margin: 10px 0; /* Espaçamento uniforme */
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box; /* Para incluir padding e borda na largura total */
}

button {
  width: 100%; /* Para corresponder à largura dos campos de entrada */
  padding: 12px; /* Alinhado com o padding dos campos de entrada */
  background-color: #ff9393;
  color: #fff;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  font-weight: 600; /* Tornar o texto do botão mais bold */
  margin-top: 1rem; /* Espaçamento acima do botão */
}

button:hover {
  background-color: #ff9393; /* Uma cor ligeiramente mais escura ao passar o mouse */
}

/* Rodapé */
footer {
  background-color: #f8f9fa;
  color: #333;
  text-align: center;
  padding: 20px 0;
  border-top: 1px solid #e4e5e7;
  position: relative; /* Alterado para 'relative' para melhor posicionamento */
}

footer a {
  color: #034b8f;
}

footer a:hover {
  text-decoration: underline;
}

/* Responsividade */
@media (max-width: 480px) {
  .container, input[type="text"], input[type="email"], button {
    padding: 1rem; /* Padding uniforme para um visual limpo em dispositivos móveis */
    margin: 1rem 0; /* Espaçamento vertical aumentado */
  }

  h1 {
    font-size: 1.5rem; /* Tamanho de fonte maior para legibilidade */
  }

  p {
    font-size: 1rem; /* Tamanho de fonte ajustado para dispositivos móveis */
  }
}


/* Estilização dos campos de entrada e botões */
input[type="text"], input[type="email"], input[type="date"], select {
  width: 100%;
  padding: 12px;
  margin: 7px 0; /* Reduzindo o espaçamento entre os campos */
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;  
}



select {
  background-color: white; /* Define o fundo como branco */
  color: black; /* Define o texto como preto */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url('path-to-your-custom-dropdown-arrow.png');
  background-repeat: no-repeat;
  background-position: right center;
  background-size: 12px 12px;
  /* Ajustes adicionais */
}

select {
  padding-right: 15px; /* Ajuste conforme necessário para não sobrepor a seta customizada */
  /* Outros estilos */
}

select {
  /* Seus estilos já existentes */
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="black" d="M7 10l5 5 5-5z"/></svg>');
  background-repeat: no-repeat;
  background-position: right 0.5em top 50%; /* Ajusta a posição da seta */
  background-size: 1em; /* Tamanho da seta */
  padding-right: 1.5em; /* Espaço suficiente para mostrar a seta */
}
