/* ------------------------------ */
/* Reset styles                   */
/* ------------------------------ */
form,
.mktoFormRow,
.mktoFormRow > *,
.mktoFieldDescriptor,
.mktoFieldDescriptor > *,
.mktoOffset,
.mktoOffset > * {
  all: unset !important;
}

.mktoLogicalField {
  padding: 0 !important;
}

/* ------------------------------ */
/* Base form elements             */
/* ------------------------------ */
form,
.mktoFieldDescriptor,
.mktoFieldWrap,
form input,
.mktoForm select.mktoField,
.mktoForm textarea {
  color: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  width: 100% !important;
}

.mktoFieldDescriptor {
  width: 100% !important;
}

.mktoForm {
  margin: 0 auto;
  max-width: 100% !important;
}

.mktoFormCol {
  padding-right: 20px !important;
}

.mktoForm label {
  color: var(--hero-marketo-form-text-label-color) !important;
  font-family: inherit !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  margin-bottom: 2px !important;
}

.mktoForm label.mktoLabel {
  color: var(--hero-marketo-form-text-label-color) !important;
  padding-bottom: 0.25rem !important;
}

.mktoLabel {
  width: auto !important;
}

.mktoForm a {
  color: #000;
}

/* ------------------------------ */
/* Field inputs                   */
/* ------------------------------ */
.mktoField {
  background: #fff !important;
  background-image: none !important;
  border: 1px solid rgb(154, 154, 154) !important;
  border-radius: 4px;
  min-height: 42px !important;
}

.mktoForm input,
.mktoForm select.mktoField,
textarea {
  color: #4d4f53 !important;
  font-size: 1rem !important;
  height: 44px !important;
  margin-bottom: 0.6rem !important;
  padding: 0.4rem !important;
}

.mktoForm select.mktoField {
  background-color: #fff !important;
}

.mktoForm input[type="date"],
.mktoForm input[type="email"],
.mktoForm input[type="number"],
.mktoForm input[type="tel"],
.mktoForm input[type="text"],
.mktoForm input[type="url"],
.mktoForm select.mktoField,
.mktoForm textarea.mktoField {
  font-size: 1rem !important;
  padding: 0.75rem !important;
}

.mktoFieldWrap select:last-of-type {
  margin-bottom: 0.6rem !important;
}

/* ------------------------------ */
/* Input focus / states            */
/* ------------------------------ */
input:focus,
textarea:focus {
  border: 1px solid rgb(120, 120, 120) !important;
  outline: none !important;
}

input[type="checkbox"],
input[type="radio"] {
  cursor: pointer;
}

input[type="radio"]:checked {
  appearance: auto !important;
}

input[type="number"] {
  -moz-appearance: textfield;
}

input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Hide default checkbox */
.mktoForm input[type="checkbox"] {
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  min-height: 16px !important;
  max-width: 16px !important;
  max-height: 16px !important;
  border: 1px solid #000000 !important;
  background-color: transparent !important;
  cursor: pointer !important;
  display: inline-block !important;
  vertical-align: middle !important;
  margin-right: 8px !important;
}

/* Checked state - solid blue square inside */
.mktoForm input[type="checkbox"]:checked {
  background-color: #1174e6 !important;
  box-shadow: inset 0 0 0 3px white !important;
}

/* Focus state for accessibility */
.mktoForm input[type="checkbox"]:focus {
  outline: none !important;
}

.mktoForm .mktoFormRow:has(.mktoCheckboxList input[type="checkbox"]) {
  padding-top: 12px !important;
}

/* ------------------------------ */
/* Select dropdowns                */
/* ------------------------------ */
.mktoForm select {
  appearance: none !important;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'><path d='M297.4 470.6C309.9 483.1 330.2 483.1 342.7 470.6L534.7 278.6C547.2 266.1 547.2 245.8 534.7 233.3C522.2 220.8 501.9 220.8 489.4 233.3L320 402.7L150.6 233.4C138.1 220.9 117.8 220.9 105.3 233.4C92.8 245.9 92.8 266.2 105.3 278.7L297.3 470.7z'/></svg>") !important;
  background-position: right 1rem center !important;
  background-repeat: no-repeat !important;
  background-size: 0.9rem !important;
}

/* ------------------------------ */
/* Checkboxes / Radios             */
/* ------------------------------ */
.mktoCheckboxList,
.mktoForm .mktoRadioList {
  width: 100% !important;
}

.mktoForm .mktoCheckboxList > input,
.mktoForm .mktoRadioList > input {
  height: 16px !important;
  margin-top: 4px !important;
  min-height: auto !important;
  width: 16px !important;
}

.mktoForm .mktoCheckboxList > label,
.mktoForm .mktoRadioList > label {
  font-weight: normal !important;
  line-height: unset !important;
  margin-top: 0 !important;
}

.mktoForm .mktoRadioList > input,
.mktoForm .mktoRadioList label {
  margin-bottom: 4px !important;
}

.mktoRadioList {
  padding-left: 0 !important;
  width: auto !important;
}

.mktoRadioList input {
  margin-top: 0.125rem !important;
}

/* ------------------------------ */
/* Misc hidden elements            */
/* ------------------------------ */
.mktoAsterix,
.mktoGutter {
  display: none !important;
}

/* ------------------------------ */
/* Errors                          */
/* ------------------------------ */
.mktoError {
  bottom: auto !important;
  margin-top: 46px !important;
  right: auto !important;
}

/* ------------------------------ */
/* Text / HTML content             */
/* ------------------------------ */
.mktoHtmlText {
  color: #fff !important;
  margin: auto !important;
  padding: 0 !important;
  width: auto !important;
}

.mktoHtmlText.mktoHasWidth > a,
.mktoHtmlText.mktoHasWidth > a:hover {
  color: #fff !important;
  padding: 0 !important;
  text-decoration: underline !important;
}

/* ------------------------------ */
/* Buttons                         */
/* ------------------------------ */
.mktoButtonRow {
  width: 100% !important;
  display: flex !important;
  justify-content: center !important;
}

.mktoButtonRow span {
  margin-left: 0 !important;
}

.mktoForm .mktoButtonWrap.mktoSimple .mktoButton {
  background: var(--button-primary-bg-color) !important;
  color: var(--global-white) !important;
  padding: 10px 24px !important;
  border: none !important;
  border-radius: 4px !important;
  font-size: 16px !important  ;
  font-weight: 700 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  font-family: var(--font-family-primary) !important;
  margin: auto !important;
  margin-top: 32px !important;
  min-width: 156px !important;
  text-align: center !important;
}

.mktoForm .mktoButtonWrap.mktoSimple .mktoButton:hover {
  background: var(--button-primary-bg-hover-color) !important;
}

/* ------------------------------ */
/* Textareas                       */
/* ------------------------------ */
.mktoForm textarea {
  min-height: 60px !important;
  resize: vertical !important;
}

/* ------------------------------ */
/* Responsive adjustments          */
/* ------------------------------ */
@media only screen and (min-width: 991px) {
  .mktoFormRow {
    display: flex !important;
  }

  .mktoGutter {
    width: 0 !important;
  }

  .mktoRadioList {
    width: auto !important;
  }
}

@media only screen and (max-width: 991px) {
  .mktoForm .mktoButtonWrap.mktoSimple .mktoButton {
    margin-top: 8px !important;
  }
  .mktoForm input,
  .mktoForm select.mktoField,
  textarea {
    margin-bottom: 0rem !important;
  }
}
