/*
 * Formularios da Hospedaria (contato e newsletter).
 *
 * O CSS custom do tema deixa os campos com fundo transparente mas mantem a cor
 * do texto em #626262, o que fica ilegivel sobre as secoes escuras. Só o
 * :focus clareava o fundo, entao o texto "desaparecia" ao sair do campo.
 */

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea,
.dark .wpcf7 input[type="text"],
.dark .wpcf7 input[type="email"],
.dark .wpcf7 input[type="tel"],
.dark .wpcf7 textarea {
  color: #ffffff;
  border-color: rgba(255, 255, 255, 0.45);
  -webkit-text-fill-color: #ffffff;
}

.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 input[type="tel"]:focus,
.wpcf7 textarea:focus {
  /* O tema aplica background-color com !important no :focus; sem repetir aqui
     o campo volta a ficar claro e o texto branco desaparece. */
  color: #ffffff;
  background-color: rgba(255, 255, 255, 0.12) !important;
  border-color: #ffffff;
  -webkit-text-fill-color: #ffffff;
}

.wpcf7 input::placeholder,
.wpcf7 textarea::placeholder {
  color: rgba(255, 255, 255, 0.72);
  opacity: 1;
}

/* Autofill do Chrome forca fundo branco e texto escuro */
.wpcf7 input:-webkit-autofill,
.wpcf7 input:-webkit-autofill:focus {
  -webkit-text-fill-color: #ffffff;
  -webkit-box-shadow: 0 0 0 1000px rgba(255, 255, 255, 0.12) inset;
  caret-color: #ffffff;
}

/* Campo reprovado na validacao do proprio site */
.wpcf7 .hospedaria-campo-invalido {
  border-color: #ff8a80 !important;
}

.wpcf7 .hospedaria-erro-campo {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  line-height: 1.4;
  color: #ffd0cb;
  text-align: left;
}

/* Mensagem geral de sucesso/erro do formulario */
.wpcf7 .hospedaria-mensagem {
  display: none;
  clear: both;
  margin: 12px 0 0;
  padding: 10px 14px;
  border-radius: 5px;
  font-size: 14px;
  line-height: 1.45;
  text-align: center;
}

.wpcf7 .hospedaria-mensagem--visivel {
  display: block;
}

.wpcf7 .hospedaria-mensagem--ok {
  color: #ffffff;
  background-color: rgba(76, 175, 80, 0.22);
  border: 1px solid rgba(129, 199, 132, 0.9);
}

.wpcf7 .hospedaria-mensagem--erro {
  color: #ffffff;
  background-color: rgba(244, 67, 54, 0.18);
  border: 1px solid rgba(255, 138, 128, 0.9);
}
