/* =======================================
  6. Contact Form
======================================= */

.wtoolkit-contact-form .form-row {
  display: flex;
}

.wtoolkit-contact-form .cf7-custom-layout {
  display: flex;
}

.wtoolkit-contact-form .wpcf7-form {
  display: flex;
}

.wtoolkit-contact-form .wpcf7-form span {
  display: flex;
}

.wtoolkit-contact-form .wpcf7-list-item label {
  display: flex;
}

@media (max-width: 768px) {
  .wtoolkit-contact-form .form-row {
    flex-direction: column;
  }
}

.wtoolkit-contact-form .cf7-custom-layout {
  flex-direction: column;
}

.wtoolkit-contact-form .wpcf7-form {
  flex-direction: column;
}

.wtoolkit-contact-form .form-col,
.wtoolkit-contact-form .wpcf7-form label,
.wtoolkit-contact-form p,
.wtoolkit-contact-form span,
.wtoolkit-contact-form input,
.wtoolkit-contact-form textarea,
.wtoolkit-contact-form select,
.wtoolkit-contact-form .form-select-wrapper,
.wtoolkit-contact-form .form-date-wrapper {
  width: 100%;
  margin-bottom: 0;
}

.wtoolkit-contact-form .wpcf7-form-control-wrap {
  display: flex;
  flex-direction: column;
  row-gap: 7px;
}

.wtoolkit-contact-form .form-select-wrapper span::after,
.wtoolkit-contact-form .form-date-wrapper span::after {
  font-family: "Font Awesome 6 Free";
  font-size: 15px;
  font-weight: 900;
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
}

.wtoolkit-contact-form .form-select-wrapper span::after {
  content: "\f078";
}

.wtoolkit-contact-form select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

input[type="date"]::-webkit-calendar-picker-indicator {
  opacity: 0;
  cursor: pointer;
}

.wtoolkit-contact-form .form-date-wrapper span::after {
  content: "\f073";
}

.wtoolkit-contact-form .form-date-wrapper span input[type="date"] {
  padding-right: 30px;
}

.wtoolkit-contact-form select:focus-visible {
  outline: none;
}

.wtoolkit-contact-form span.wpcf7-spinner {
  position: absolute;
  bottom: -60px;
  left: 50%;
  width: 24px;
}

.wtoolkit-contact-form .wpcf7-submit {
  width: auto;
  background-color: var(--theme-color-primary);
  color: var(--theme-color-white);
  border: none;
  font-size: var(--theme-font-size-xsmall);
  font-weight: var(--theme-semi-bold-font-weight);
  line-height: var(--theme-line-height-heading);
}

.wtoolkit-contact-form .wpcf7-submit:hover {
  background-color: var(--theme-color-secondary);
}

.wtoolkit-contact-form .wpcf7-checkbox span,
.wtoolkit-contact-form .wpcf7-radio span,
.wtoolkit-contact-form .wpcf7-acceptance span,
.wtoolkit-contact-form .wpcf7-checkbox span label input,
.wtoolkit-contact-form .wpcf7-radio span label input,
.wtoolkit-contact-form .wpcf7-acceptance span label input {
  width: auto;
}

.wtoolkit-contact-form .wpcf7-list-item {
  margin-left: 0;
  margin-right: 10px;
}

.wtoolkit-contact-form .wpcf7-list-item label {
  margin-bottom: 0;
}