header{
    background-color: #e66842;
    padding: 15px 20px;
   
}
header img {
    height: 60px;
    width: auto;
    max-height: 70px;
}
h1{
    text-align: center; /*Alineamos el titulo principal de la página*/
    font-size: 2rem;  /* Tamaño de fuente relativo (32px si 1rem=16px) */
    margin-bottom: 1rem; /* Margen inferior para separar del siguiente elemento */
}

/* Estilos generales para formularios */
form {
  max-width: 400px;             /* Máximo ancho del formulario */
  width: 90%;                   /* Ancho relativo al contenedor padre (90%) para flexibilidad */
  margin: auto;                 /* Centra el formulario horizontalmente */
  font-size: 1rem;              /* Tamaño de fuente estándar */
  padding: 1rem;                /* Espacio interno para separar el contenido de los bordes */
  background: rgba(255,255,255,0.8); /* Fondo blanco translúcido para resaltar el formulario */
  border-radius: 8px;           /* Bordes redondeados */
  box-shadow: 0 0 10px rgba(0,0,0,0.1); /* Sombra sutil para dar profundidad */
  display: flex;                /* Flexbox para controlar disposición interna */
  flex-direction: column;       /* Organiza los elementos hijos en columna */
  gap: 0.75rem;                 /* Espacio vertical entre los elementos del formulario */
}

/* Estilos para campos input, select y botones */
input, select, button {
  padding: 8px;                /* Relleno interno cómodo para escribir o clicar */
  border-radius: 24px;         /* Campos y botones con bordes muy redondeados */
  border: 1px solid #96d6f1;  /* Borde azul claro para visibilidad */
  font-size: 1rem;             /* Tamaño de letra estándar */
  width: 100%;                 /* Ocupan todo el ancho del contenedor padre */
  box-sizing: border-box;      /* Incluye borde y padding en el ancho total */
}

/* Estilos específicos para botones submit y generales */
input[type="submit"], button {
  background-color: #d21919;   /* Fondo rojo intenso */
  color: white;                /* Texto blanco para buen contraste */
  font-weight: bold;           /* Texto en negrita */
  cursor: pointer;             /* Cursor cambia a puntero al pasar por encima */
 border-radius: 24px;             
  transition: background-color 0.3s ease; /* Transición suave en hover */
}

/* Cambio de color al pasar el cursor sobre el botón */
input[type="submit"]:hover, button:hover {
  background-color: #0a0808; /* Negro al hover */
}