/* CSS for Radio Button Tabs in Drupal Webform */

/* Style the radio buttons as tabs */
#absoluteyou-contact-form .webform-tabs-selector {
  display: flex;
  margin-bottom: 20px;
  border: none;
}

/* Hide the actual radio buttons */
.webform-tabs-selector input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

/* Style the labels as tab buttons */
.webform-tabs-selector label.option {
  background-color: #fffefe;
  color: rgb(12, 12, 12);
  padding: 8px 15px;
  border-radius: 20px;
  margin-right: 10px;
  cursor: pointer;
  font-size: 14px;
  transition: background-color 0.3s;
}

/* Style the selected tab */
.webform-tabs-selector input[type="radio"]:checked + label.option {
  /* background-color: #6a5acd; */

  /* display: inline-flex; */
  background: var(--gradient);
  color: var(--color-white) !important;
  padding: 8px 15px;
  border-radius: 20px;
  margin-right: 10px;
  cursor: pointer;
  font-size: 14px;
  transition: background-color 0.3s;
}

/* Radio options for Aanspreektitel */
.form-radios:not(.webform-tabs-selector) {
  display: flex;
  gap: 15px;
}

.form-radios:not(.webform-tabs-selector) .form-radio {
  display: flex;
  align-items: center;
}

#absoluteyou-contact-form #edit-tabs--wrapper #edit-tabs--wrapper-legend {
  display: none;
}
.fieldset-wrapper #edit-tabs {
  display: flex;
}

#referral_form form,
#i_want_to_work_with_absolutecore form,
#student_or_flexi_jobber_cost form {
  display: flex;
  flex-direction: column;
}

#referral_form .webform-progress,
#i_want_to_work_with_absolutecore .webform-progress,
#student_or_flexi_jobber_cost .webform-progress {
  order: 1;
}

#absoluteyou-contact-partner label[for="edit-tabs-employees"] {
  display: none;
}

.content-ebook-wrapper {
  display: flex;
  flex-direction: column;
  gap: 1.5vw;
}