/*------------------------------------*\
    
    WebFX CF7 Customizations - Global styling for all CF7 Forms

    Add custom CF7 form styling to this file if it should be applied to all CF7 forms on the site
    Otherwise, put your block-specific styles in individual block stylesheets so that various block-specific styles aren't loaded on every CF7 form

\*------------------------------------*/

/* Default Radio/Checkbox Style (if using CF7) */
.wpcf7-radio .wpcf7-list-item,
.wpcf7-checkbox .wpcf7-list-item {
  display: inline-block;
  margin-right: 15px;
  margin-bottom: 10px;
  /* incase items go to 2 lines */
}

.wpcf7-radio .wpcf7-list-item-label,
.wpcf7-checkbox .wpcf7-list-item-label {
  margin-left: 5px;
}

/* CF7 Validation (Remove if not using CF7) */

/* Individual field error messages */
.wpcf7-not-valid-tip {
  font-size: 10px;
  font-weight: 700;
  color: #2b3139;
  position: absolute;
  right: 11px;
  top: 50%;
  transform: translate(0, -50%);
  text-transform: uppercase;

  &:after {
    content: "";
    display: inline-block;
    vertical-align: middle;
    width: 20px;
    height: 20px;
    background-image: url("/wp-content/themes/ingstrup/assets/img/error-icon.svg");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin-left: 4px;
  }
}

.wpcf7-not-valid-tip img {
  margin-left: 4px;
}

/* Entire form error message */
.wpcf7-response-output {
}

/* Styling for fields that have errors */
select.wpcf7-not-valid,
textarea.wpcf7-not-valid,
input.wpcf7-not-valid,
.wpcf7-not-valid .choices {
}

/* input.wpcf7-not-valid + label,
textarea.wpcf7-not-valid + label,
span:has(input.input-email) + label {
  background-color: #c05131;
} */

.wpcf7-form-control-wrap.has-validation-error:not(.input-has-value) + label,
.wpcf7-form-control-wrap.has-validation-error.input-has-value + label {
  background-color: #c05131;
}

.wpcf7-form-control-wrap.input-has-value:not(.has-validation-error) + label {
  background-color: #78be20;
}