form input,
form textarea,
form .btn {
  outline: 2px solid var(--couleur-outline);
  font-family: var(--font-texte);
  font-weight: 100;
  padding: 0.5rem 0.75rem;
  line-height: 1.1;
}

form input[type="text"],
form input[type="number"],
form input[type="email"],
form input[type="date"],
form input[type="tel"],
form textarea,
form select {
  color: #000;
  font-family: var(--font-texte);
  padding: 0.5rem;
  border: 1px solid #ccc;
  width: 100%;
  border-radius: var(--arrondi-form-field);
}

form input[type="submit"] {
  background: var(--couleur-liens);
  color: var(--couleur-fond);
  font-weight: 100;
  cursor: pointer;
  transition: var(--transition-basic);
  padding: 0.5rem 1rem;
}

form input[type="submit"]:hover {
  background: var(--couleur-fond);
  color: var(--couleur-liens);
}

form input[type="submit"]:active {
  background: var(--couleur-liens);
  color: var(--couleur-fond);
}

input {
  border: 1px solid var(--couleur-liens);
}

/******************/
/* Contact Form 7 */
/******************/

.wpcf7-form {
  padding: 1rem;
  position: relative;
  padding-bottom: 2rem;
  user-select: none;
}

::placeholder {
  transition: 0.15s all ease;
}

*:focus::placeholder {
  opacity: 0;
}

.wpcf7-form label {
  width: 100%;
  font-size: var(--font-size-large);
  font-weight: 400;
}

span.wpcf7-form-control-wrap {
  display: block;
}

span.wpcf7-not-valid-tip {
  position: absolute;
  left: 0;
  bottom: 0;
  top: 0;
  right: 0;
  background: red;
  text-align: right;
  line-height: 1rem;
  font-size: 0.8rem;
  cursor: default;
  color: #fff;
  overflow: hidden;
  padding: 5px;
  opacity: 0.7;
  height: 100%;
}

.wpcf7-form br {
  display: none;
}

.wpcf7 form .wpcf7-response-output {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  min-height: 70px;
  width: 50%;
  margin-left: 0;
  border-radius: var(--arrondi-small);
}

.wpcf7 form.invalid .wpcf7-response-output,
div.wpcf7-validation-errors,
div.wpcf7-acceptance-missing {
  border-color: #cc0000;
}

.wpcf7-form label.required::after {
  content: "*";
  color: red;
  margin-left: 0.3rem;
}

.wpcf7-form::after {
  content: "* Champs obligatoires";
  font-size: 0.85rem;
  display: block;
  text-align: right;
}

input#acceptance:hover {
  cursor: pointer;
}

html[lang="en-GB"] .wpcf7-form::after,
html[lang="en-US"] .wpcf7-form::after {
  content: "* Required fields";
}