/* Fallback styling for old gravity form version */
.gform_wrapper.gravity-theme .gform_fields {
  grid-gap: 22px !important;
}

@media (max-width: 767.98px) {
  .gform_wrapper.gravity-theme .ginput_complex {
    row-gap: 22px;
  }

  .gform_wrapper.gravity-theme .ginput_complex span {
    margin-bottom: 0 !important;
  }
}

/* Input styles */
.gform_wrapper.gravity-theme input[type=color],
.gform_wrapper.gravity-theme input[type=date],
.gform_wrapper.gravity-theme input[type=datetime-local],
.gform_wrapper.gravity-theme input[type=datetime],
.gform_wrapper.gravity-theme input[type=email],
.gform_wrapper.gravity-theme input[type=month],
.gform_wrapper.gravity-theme input[type=number],
.gform_wrapper.gravity-theme input[type=password],
.gform_wrapper.gravity-theme input[type=search],
.gform_wrapper.gravity-theme input[type=tel],
.gform_wrapper.gravity-theme input[type=text],
.gform_wrapper.gravity-theme input[type=time],
.gform_wrapper.gravity-theme input[type=url],
.gform_wrapper.gravity-theme input[type=week],
.gform_wrapper.gravity-theme select,
.gform_wrapper.gravity-theme textarea {
  font-size: 15px;
  block-size: 47px;
  margin: 0;
  border-radius: 4px;
  padding: var(--wp--preset--spacing--20) !important;
  border: 1px solid #CCC;
  font-family: inherit;
}

.gform_wrapper.gravity-theme .gfield textarea {
  width: 100%;
  border-radius: 5px;
  font-family: inherit;
  padding: var(--wp--preset--spacing--10);
}

.gform_wrapper.gravity-theme .gform_footer {
  justify-content: center;
}

.gform_wrapper.gravity-theme .gform_footer button,
.gform_wrapper.gravity-theme .gform_footer input,
.gform_wrapper.gravity-theme .gform_footer .gform_page_footer button,
.gform_wrapper.gravity-theme .gform_footer .gform_page_footer input {
  cursor: pointer;
  background-color: var(--wp--preset--color--button-bg);
  color: var(--wp--preset--color--button-text);
  border-radius: 5px;
  border: 0;
  font-family: inherit;
  font-size: var(--wp--preset--font-size--medium);
  font-style: normal;
  font-weight: 500;
  line-height: inherit;
  padding: 0.625rem 1.5rem;
  text-decoration: none;
}

.gform_wrapper.gravity-theme .field_description_above .description,
.gform_wrapper.gravity-theme .field_description_above .gfield_description,
.gform_wrapper.gravity-theme .field_description_above .gsection_description,
.gform_wrapper.gravity-theme .field_description_above .instruction {
  padding: 0;
  font-size: 13.2px;
}

.gform_wrapper.gravity-theme .gfield_validation_message,
.gform_wrapper.gravity-theme .validation_message {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
}

.gform_wrapper.gravity-theme .gform_validation_errors {
  margin-block-end: var(--wp--preset--spacing--40)!important;
}

.gform_wrapper.gravity-theme .gform_validation_errors > ol {
  margin: 0;
}

.gform_wrapper.gravity-theme .gform_validation_errors > h2 {
  font-family: var(--wp--preset--font-family--body);
}

.gform_wrapper.gravity-theme .ginput_container_date input {
  width: 100%;
}

/* Hide the "*" indicates required fields */
.gform_wrapper .gform_heading .gform_required_legend {
  display: none;
}

/* Styling for when the user chooses the updated version of gravity forms
* This is to ensure that the form looks consistent with the rest of the site
*/
.gform-theme--foundation .gform_fields {
  --gf-form-gap-x: 22px;
  --gf-form-gap-y: 22px;
}

@media (max-width: 767.98px) {
  .gform-theme--foundation .gform_fields .ginput_container > :where(input, textarea) {
    /*
     * A fix for the iOS device to avoid zooming in when the user focuses on an input field.
     * This is a common issue with iOS devices and can be fixed by setting the font-size to 16px.
     */
    --gf-font-size-primary: 16px;
    --gf-ctrl-font-size: 16px;
  }
}

.gform-theme--foundation .gform_fields .ginput_container > :where(input, textarea)::placeholder {
  --alpha: 0.5;
  color: color-mix(in srgb, currentColor, rgba(0, 0, 0, 0) calc((1 - var(--alpha)) * 100%));
  font-weight: 500;
}

/*
 * The default z-index value for a datepicker is `9999`
 * which can overlap other elements such as the header.
 * This fix ensures that the datepicker is always on top of other elements,
 * but not the header.
*/
body.page :is(.gform-theme--foundation.ui-datepicker, .gravity-theme.ui-datepicker[style]) {
  z-index: 5!important;
}