@media screen {
  /* contact forms styles used in wp backend with CF7 */
  
  .wpcf7-not-valid:not(:focus) {
    background-color: $color__red;
  }
  .wpcf7-not-valid-tip {
    color: $color__red;
  }
  .wpcf7 form.invalid .wpcf7-response-output,
  .wpcf7 form.unaccepted .wpcf7-response-output,
  .wpcf7 form.payment-required .wpcf7-response-output {
    border-color: $color__yellow;
    background-color: $color__yellow;
    color: $color__white;
    font-family: $font__main;
    font-weight: bold;
    text-align: center;
    margin: 0em;
    padding: 0rem;
  }
  .wpcf7-form {
    .wpcf7-submit {
      margin-left: 1rem;
    }
    .wpcf7-spinner {
      margin: 0 -24px 0 0;
    }
  }
  
  .wpcf7-list-item-label {
    margin: 0 0.3rem;
  }
  .wpcf7-form {
    //text-align: center;
    input:not([type="submit"]),textarea {
      background: transparent;
      border: $border__line; 
      padding: 1em;
    }
  }
  
  /* styles applied if written in wp backend
   * class="contactform contactform-WHATEVER"
   * */
  .contactform {
    margin-bottom: 1rem;
    br {
      display: none;
    }
    p {
      display: block;
      break-inside: avoid-column;
      margin-top: 0;
    }
    .break-after-column, .saltar-columna{
      break-after:column;
    }
  }
  .contactform-consultoria {
    .contactform-name, .contactform-email {
      max-width: 40%;
      display: inline-block;
    }
    .contactform-name {
      float: left;
    }
    .contactform-email {
      float:right;
      margin-bottom: 1rem;
    }
    .contactform-message {
    }
  }
  .contactform-acceptance {
    display: flex;
    align-items: center;
    justify-content: end;
  }
  .contactform-fund-info {
    display: inline-block;
    column-count: 1;
    column-gap: $grid__gap;
    width: 100%;
    .contactform-descripcio textarea {
      display: inline-block;
      min-height: 23.5em;
    }
  }
  .contactform-fund-options {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    p{
      display: inline-block;
    }
    label.oficinasuport-titol-opcions {
      border: $border__line;
      width: 100%;
      display: inline-block;
      margin-bottom: 1em;
    }

    .wpcf7-list-item {
      display:block;
      label {
        display: flex;
        flex-direction: row-reverse;
        justify-content: left;
      }
    }
    .wpcf7-form-control-wrap {
      &[data-name="oferta-data-start"],&[data-name="oferta-data-end"] {
        display: block;
        input[type="date"] {
          width: auto;
          //background-color: $color__white;
        }
        &::before {
          display: inline-block;
          width: 2rem;
        }
      }
      &[data-name="oferta-data-start"]::before {
        content:"inici: ";
      }
      &[data-name="oferta-data-end"]::before {
        content:"fi: ";
      }
    }
  }
}
@media screen and (max-width: 48em) {
  //only smaller than 48em
}
@media screen and (min-width: 48em) {
  //only bigger than 48em
  .wpcf7-form {
    text-align: center;
  }
  .contactform-fund-info {
    column-count: 2;
  }
  .contactform-fund-options {
    flex-direction: row;
  }
}
@media screen and (min-width: 80em) {
  //only bigger than 80rem
}