/**
 * Forms
 */
select {
  border: 3px solid var(--font-color-light-background);
  border-radius: var(--border-radius-m);
  height: 48px;
}

.form-item {
  margin-block: var(--spacing-l);
}

.form-item-mitgliedsnummer {
  margin-block-start: 0;
}

.form-item.js-form-type-checkbox {
  margin-block: var(--spacing-m);
}

.form-item:not(last-child) {
  margin-block-end: 0;
}

/* [id*="edit-status-mitgliedschaft"].radios--wrapper {
  margin-bottom: 0;
} */

/* .js-form-item-adresse-address {
  margin-top:0;
}
 */

.form-item:last-child:not(.js-form-type-radio) {
  margin-block-end: 0;
}

.webform-submission-veranstaltungsanmeldung-form .fieldset:not(:first-of-type) {
  margin-top: var(--spacing-l);
}

.form--inline .form-item__label,
form label {
  margin: 20px 0 10px 0;
  font-weight: normal;
}

.form-item__label {
  font-weight: normal;
  font-size: 1rem;
}

.fieldset {
  border: none;
  background: transparent;
}

[type="color"],
[type="date"],
[type="datetime-local"],
[type="email"],
[type="file"],
[type="month"],
[type="number"],
[type="password"],
[type="search"],
[type="tel"],
[type="text"],
[type="time"],
[type="url"],
[type="week"],
textarea {
  color: var(--font-color-light-background);
  border: 3px solid var(--form-border);
  border-radius: var(--border-radius-m);
  width: 100%;
  min-height: 48px;
}
:is(
    [type="color"],
    [type="date"],
    [type="datetime-local"],
    [type="email"],
    [type="file"],
    [type="month"],
    [type="number"],
    [type="password"],
    [type="search"],
    [type="tel"],
    [type="text"],
    [type="time"],
    [type="url"],
    [type="week"],
    textarea
  ):focus {
  border: solid 2px var(--primary-color);
  outline: solid 2px var(--primary-color);
}
/* Legend wenn blueserach in views vorkommt */
#bluesearch .view-header legend {
  color: #fff;
  font-size: 2.25rem;
  line-height: 2.875rem;
  display: block;
  color: var(--font-color-dark-background);
  font-weight: 700;
  margin: 0;
}
.error:is(
    [type="color"],
    [type="date"],
    [type="datetime-local"],
    [type="email"],
    [type="file"],
    [type="month"],
    [type="number"],
    [type="password"],
    [type="search"],
    [type="tel"],
    [type="text"],
    [type="time"],
    [type="url"],
    [type="week"],
    textarea
  ),
select.error,
input.error[type="checkbox"],
input.error[type="radio"] {
  border: solid 2px var(--secondary-color);
  outline: solid 2px var(--secondary-color);
}

[type="date"] {
  min-width: 150px;
}

.fieldset:not(fieldset:first-of-type) {
  margin-top: var(--spacing-m);
}

.fieldset > .fieldset__legend {
  background: transparent;
  color: var(--font-color-light-background);
  width: 100%;
}

.fieldset__legend + .fieldset__wrapper,
[id*="edit-container-organisation-data"],
[id*="edit-veranstaltungsoptionen"] .fieldset__wrapper {
  display: inline-block;
  padding: 0;
  width: unset;
}

legend[id*="edit-art-ihrer-teilnahme"] {
  float: none;
}

.fieldset__legend .fieldset__label {
  color: var(--font-color-light-background);
  padding: 0;
  font-size: var(--font-size-l);
}

.radios--wrapper.form-wrapper .fieldset__label,
.checkboxes--wrapper.form-wrapper .fieldset__label {
  font-size: var(--font-size-base);
  font-weight: normal;
}

.webform-submission-veranstaltungsanmeldung-form .anmeldung_info_wrapper,
.webform-submission-veranstaltungsanmeldung-form .webform-type-fieldset {
  border-top: solid 2px var(--mo-background);
  padding-block: var(--spacing-l);
}

div.js-form-wrapper:last-of-type() {
  border-bottom: solid 2px var(--mo-background);
}

.anmeldung_infolabel {
  display: inline-block;
  width: 150px;
  vertical-align: top;
  font-weight: bold;
}

.anmeldung_text {
  display: inline-block;
  width: calc(100% - 150px - var(--spacing-m));
  padding-left: var(--spacing-m);
}

.radios--wrapper.fieldset--group
  .fieldset__legend--visible
  ~ .fieldset__wrapper,
.checkboxes--wrapper.fieldset--group
  .fieldset__legend--visible
  ~ .fieldset__wrapper {
  border: none;
  width: 100%;
}

.js-webform-radios {
  display: flex;
  gap: var(--spacing-m);
  width: 100%;
}

.js-form-type-radio {
  display: inline-flex;
  align-items: center;
  margin-block: var(--spacing-m);
}

.js-form-type-radio .form-item__label {
  flex: 1;
  margin: 0;
}

[id*="edit-allgemeine-geschaeftsbedingungen-agb"],
[id*="edit-kostenhinweis"],
[id*="edit-container-datenschutz"] {
  width: 100%;
  margin-top: var(--spacing-s);
}

[id*="edit-allgemeine-geschaeftsbedingungen-agb"] .fieldset__legend {
  float: none;
  width: 100%;
}

.webform-submission-veranstaltungsanmeldung-form .form-actions {
  justify-content: space-between;
}

.webform-submission-veranstaltungsanmeldung-form
  .form-actions
  .form-submit:last-of-type {
  margin-right: 0;
}

.webform-button--next {
  background-image: url(../images/icons/pfeil-gross-rechts-icon.svg);
  background-color: transparent;
  background-repeat: no-repeat;
  background-position: calc(100% - 25px) center;
  background-size: 1rem;
  padding-right: 50px;
  margin-left: auto;
  color: var(--font-color-light-background);
}

.webform-button--next:hover {
  background-image: url(../images/icons/pfeil-gross-rechts-icon.svg);
  background-color: var(--button-background-color-hover);
  background-position: calc(100% - 25px) center;
  background-repeat: no-repeat;
  background-size: 1rem;
  padding-right: 50px;
  color: var(--font-color-light-background);
}

.webform-button--previous {
  background: transparent url(../images/icons/pfeil-gross-links-icon.svg)
    no-repeat;
  background-position: 25px center;
  background-size: 1rem;
  padding-left: 50px;
  color: var(--font-color-light-background);
}

.webform-button--previous:hover {
  background-image: url(../images/icons/pfeil-gross-links-icon.svg);
  background-color: var(--button-background-color-hover);
  background-position: 25px center;
  background-repeat: no-repeat;
  background-size: 1rem;
  padding-left: 50px;
  color: var(--font-color-light-background);
}

input[type="checkbox"],
input[type="radio"] {
  cursor: pointer;
  border: 3px solid var(--form-border);
}

input[type="checkbox"]:checked {
  background-color: var(--primary-color);
  background-image: url("data:image/svg+xml,%3Csvg width='17px' height='13px' viewBox='0 0 17 13' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cpath d='M14.8232,0.176777 C14.9209,0.0791457 15.0791,0.0791455 15.1768,0.176777 L16.9445,1.94454 C17.0422,2.04217 17.0422,2.20047 16.9445,2.2981 L6.23744,13.0052 C6.13981,13.1028 5.98151,13.1028 5.88388,13.0052 L0.176777,7.2981 C0.0791456,7.20047 0.0791456,7.04218 0.176777,6.94454 L1.94454,5.17678 C2.04217,5.07915 2.20047,5.07915 2.2981,5.17678 L5.88388,8.76256 C5.98151,8.86019 6.13981,8.86019 6.23744,8.76256 L14.8232,0.176777 Z' id='Path' fill=' %23FFFFFF' fill-rule='nonzero'%3E%3C/path%3E%3C/svg%3E");
}

input[type="radio"]:checked {
  background-color: var(--primary-color);
  background-image: url("data:image/svg+xml,%3Csvg width='17' height='17' viewBox='0 0 17 17' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='8.5' cy='8.5' r='8.5' fill=' %23FFFFFF'/%3E%3C/svg%3E%0A");
  background-size: 50%;
  background-position: center;
}

.field--name-field-link .field__label,
.field--name-field-file .field__label {
  font-size: 2rem;
  font-weight: bold;
  margin-block-end: var(--sp2);
}

@media (min-width: 1000px) {
  .fieldset:not(
      .radios--wrapper,
      [id*="edit-allgemeine-geschaeftsbedingungen-agb"]
    )
    > .fieldset__legend {
    width: 30%;
    padding-right: var(--spacing-m);
  }

  [id*="edit-veranstaltungsoptionen"] .fieldset__wrapper,
  [id*="edit-adress-und-kontaktdaten"] > .fieldset__wrapper,
  [id*="edit-persoenliche-daten"] .fieldset__wrapper,
  [id*="edit-organisationsdaten"] .fieldset__wrapper,
  [id*="edit-datenschutz"] > .fieldset__wrapper {
    width: 70%;
  }

  [id*="edit-adress-und-kontaktdaten"] .fieldset__wrapper--group {
    width: 100%;
  }

  #edit-container-datenschutz {
    margin-top: 0;
  }

  .webform-submission-veranstaltungsanmeldung-form
    .form-item:not(.js-form-type-radio, .js-form-type-checkbox):first-child {
    margin-top: 0;
  }

  .webform-submission-veranstaltungsanmeldung-form .form-item__label {
    margin-top: 0;
  }
  .webform-submission-veranstaltungsanmeldung-form .fieldset {
    margin-top: var(--spacing-l);
  }

  [id*="edit-veranstaltungsoptionen"] .form-item-kommentar-hinweis {
    margin-top: 0;
  }

  [id*="edit-art-ihrer-teilnahme"].js-webform-states-hidden + .js-form-item {
    margin-top: 0;
  }
}

/**** Messages ****/

.messages {
  background: var(--background-light);
  box-shadow: var(--box-shadow-more);
  border-radius: var(--border-radius-m);
  color: var(--font-color-background-light);
}

.messages--warning .messages__icon svg {
  fill: var(--primary-color);
}

.messages__header {
  flex-shrink: 0;
  margin-inline-end: var(--spacing-m);
}

.messages__icon {
  height: 20px;
  width: 20px;
  margin-top: 0.4rem;
}

.messages__icon svg {
  height: 100%;
  width: 100%;
}

.messages--error {
  color: var(--button-background-color);
}

.messages--error .messages__icon svg {
  fill: var(--button-background-color);
}
