/* radio-field-as-next-buttons    : This class needs to go on any radio button field that should look like buttons. Works best with GF Perks Enable Auto-progression active. */

/* Container setup */
.radio-field-as-next-buttons .gfield_radio {
  flex-direction: row !important;
  flex-wrap: wrap;
  justify-content: center;
}

/* Hide the default radio inputs but keep them accessible */
.radio-field-as-next-buttons .gfield-choice-input {
  position: absolute;
  opacity: 0 !important;
  pointer-events: none;
}

/* Style the labels as buttons */
.radio-field-as-next-buttons .gfield_radio label {
  display: inline-block;
  padding: 1rem 1.5rem;
  font-weight: 500;
  cursor: pointer;
  text-align: center;
  margin: 0;
  min-width: 200px;
  transition: 0.3s all ease-in-out;
}

/* Optional: make text unselectable for a cleaner click feel */
.radio-field-as-next-buttons .gfield_radio label {
  user-select: none;
}

/* ========== */

/* ActiKare theme specific */
.gform_wrapper .gfield,
.gform_wrapper .gfield label,
#gform_confirmation_message_1 {
  color: white;
}
.gf_progressbar_title { color: white !important; }
.radio-field-as-next-buttons .gfield_radio label,
.gform_page_footer .button {
  background-image: linear-gradient(180deg, #ED1C25 0%, #f2295b 100%);
  font-size: 16px !important;
  font-weight: 600 !important;
  border-radius: 4px;
  border: 1px solid transparent;
}
.gform_page_footer .gform_previous_button {
  background-image: none;
  background-color: transparent !important;
  border: 1px solid white !important;
  color: white !important;
}
.radio-field-as-next-buttons .gfield_radio label:hover,
.radio-field-as-next-buttons .gfield_radio label:focus,
.gform_page_footer .button:hover,
.gform_page_footer .button:focus {
  filter: brightness(1.1) !important;
  box-shadow: none !important;
  border: none !important;
}
.gform_page_footer .button.gform_next_button:hover,
.gform_page_footer .button.gform_next_button:focus {
  background-image: linear-gradient(180deg, #ED1C25 0%, #f2295b 100%) !important;
}
.radio-field-as-next-buttons .gfield-choice-input:checked + label {
  background: white !important;
  background-image: none !important;
  color: #ed1c25 !important;
  border: 1px sold #ed1c25 !important;
}
.gform_page_footer .gform_previous_button:hover {
  background-color: white !important;
  color: #ed1c25 !important;
  filter: none !important;
}
.gfield_label .gfield_required { display: none; }
.gform_page_footer .gform_next_button { margin-left: auto !important; }
.gfield_validation_message { border: 1px solid #ED1C25; padding: 4px; background-color: white; }