{# Format du module #}
.form-integration{
  font-size: 14px;
  padding: 40px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 25px;
  align-self: stretch;
  background-color: #fff;
  border-radius: 20px;
}

.form-integration .form__title{
  padding:10px;
  margin-bottom: 25px;
  color: var(--hex-violet-hex-violet-500, #31084C);
  font-family: "Plus Jakarta Sans";
  font-size: 18px;
  font-style: normal;
  font-weight: 800;
  line-height: 23px;
}

.hs_cos_wrapper.form-title{
  display: none;
}

.form-integration .form__footer, .form-integration .form__footer a{
  font-family: 'Inter';
  color: #707070;
  font-size: 10px;
  font-style: normal;
  font-weight: 400;
  line-height: 14px;
}

{# Formattage champs du formulaire #}
.hs-form-field{
  border-radius: 4px;
  background-color: #FAFAFA;
}


.form-integration input, .form-integration textarea, .form-integration select{
  background-color: transparent!important;
  border: none!important;
}

.form-integration input:focus{
  border: none!important;
}

body input[type=color]:focus, body input[type=date]:focus, body input[type=datetime-local]:focus, body input[type=datetime]:focus, body input[type=email]:focus, body input[type=file]:focus, body input[type=month]:focus, body input[type=number]:focus, body input[type=password]:focus, body input[type=search]:focus, body input[type=tel]:focus, body input[type=text]:focus, body input[type=time]:focus, body input[type=url]:focus, body input[type=week]:focus, body select:focus, body textarea:focus {
  /*Suppression de l'outline du champ quand on écrit*/
  -moz-box-shadow: inset 0 0 0 2px var(--clr-primary);
  -webkit-box-shadow: none;
  box-shadow: none;
}

body form.hs-form fieldset[class*=form-columns] .hs-input {
  padding: 0;
  font-size: 14px;
}
body form.hs-form fieldset[class*=form-columns] select.hs-input {
  padding: 0 5px;
  font-size: 14px;
}

.input, label{
  line-height: normal;


}

ul.hs-error-msgs li .hs-error-msg {
  font-size: 10px;
}
ul.hs-error-msgs{
  margin:0;
}
body .form-integration form.hs-form fieldset {
  margin-right: auto;
}

::placeholder {
  color: #D2D2D2!important;
  font-family: "Plus Jakarta Sans"!important;
  font-size: 14px!important;
  font-style: normal!important;
  font-weight: 400!important;
  line-height: 22px!important;
  letter-spacing: -0.14px!important;
}

.hs-form-required{
  display: none
}
option{
  width: inherit;
}
/*select:invalid {
  /*color: #D2D2D2;*/
  /*font-family: "Plus Jakarta Sans"!important;
  font-size: 14px!important;
  padding: 10px 5px;
  font-style: normal!important;
  font-weight: 400!important;
  line-height: 22px!important;
  letter-spacing: -0.14px!important;
}*/

.form-integration fieldset.form-columns-2 .hs-form-field{
  padding: 10px 15px;
  height: fit-content;
}

.form-integration .hs-form-field{
  padding: 10px 15px!important;

  display: flex;
  flex-direction: column;
  margin-bottom: 12px;
}

{# Formattage bouton du formulaire #}
.hs_submit.hs-submit{
  width: 100%;
  border-radius: 4px;
  margin-top: 20px;
  margin-bottom: 20px;
}

input.hs-button{
  background-color:#DD179C;
}

input.hs-button:hover{
  background-color:#C9158E;
}

.hs-submit .hs-button {
  padding: 0!important;
  width: 100%;
  text-align: left;
}

.actions {
  display: flex;
  justify-content: space-between;
  padding: 8px 18px;
}


.actions:after {
  /* Ajout de la flèche dans le bouton*/
  content:"→"
}

/* Responsivité */

@media screen and (min-width:576px){
  .form-integration fieldset.form-columns-2 .hs-form-field{
    width: 48%!important;
    padding: 10px 15px;
    height: fit-content;
  }
  fieldset.form-columns-2{
    display: flex;
    justify-content: space-between;
  }
}

@media (max-width: 575px) {
  body form.hs-form fieldset .hs-form-field {
    width: 100% !important;
  }

  fieldset.form-columns-2 {
    display:block;
  }