/**
 * - Styling der Formulare
 * - wird nur auf Seiten, die auch ein Formular besitzen, eingebunden
 */

/* Variablen */
:root {
  --theme-farbe: var(--bricks-color-zgawtj);
  --theme-farbe-hell: var(--bricks-color-ratuba);
  --text-color: var(--bricks-color-fdtzhi);
}

/* Styling & Farben generell */
/* Texte linksbündig */
div.gform_wrapper {
  text-align: left !important;
}

/* Farben */
.gform_wrapper {
  --gf-ctrl-outline-color-focus: var(--theme-farbe) !important;
  --gf-ctrl-border-color-focus: hsl(from var(--theme-farbe) h s calc(l * .70)) !important;
  --gf-ctrl-choice-check-color: hsl(from var(--theme-farbe) h s calc(l * .70)) !important;
  --gf-ctrl-color-focus: var(--text-color) !important;
  --gf-ctrl-radius: 0 !important;
  --gf-ctrl-outline-color: var(--theme-farbe) !important;
  --gf-ctrl-transition: none !important;
}

/* Buttons */
/* Button-Style zurücksetzen, da später von Bricks-Klassen übernommen */
.gform_button.button {
  all: unset !important;
}

/* Pflichtfeld-Markierung */
span.gfield_required {
  color: var(--theme-farbe-hell) !important;
  font-size: 1.2rem !important;
  margin-top: -30px;
}

/* Pflichtfeldhinweis entfernen */
p.gform_required_legend {
  display: none;
}

/* Zustimmungsfeld */
label.gfield_consent_label {
  text-wrap: balance;
}

/* Zustimmungsfeld-Button vertikal zentrieren */
.ginput_container_consent {
  display: flex !important;
  align-items: center !important;
}

/* Zustimmungsfeld-Button quadratisch */
.gform_wrapper input[type="checkbox"] {
  aspect-ratio: 1;
}

/* Formulare auf rotem oder dunklen Hintergrund */
.gform_wrapper .formOnDark legend,
.gform_wrapper .formOnDark label,
.gform_wrapper.formOnDark_wrapper .gform_validation_errors .gform_submission_error,
.gform_wrapper .formOnDark .validation_message {
  color: var(--theme-farbe-hell);
}

.gform_wrapper .formOnDark label a {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.gform_wrapper .formOnDark .brxe-button {
  border-color: var(--theme-farbe-hell);
}

.gform_wrapper .formOnDark .brxe-button:hover input {
  z-index: 1 !important;
}

.gform_wrapper.formOnDark_wrapper .gform_validation_errors,
.gform_wrapper.formOnDark_wrapper .gform_validation_errors:focus {
  border-color: var(--theme-farbe-hell);
  outline: 0;
}

.gform_wrapper.formOnDark_wrapper .gform_validation_errors .gform-icon {
  color: var(--theme-farbe-hell);
  border-color: var(--theme-farbe-hell);
}

/* Commented-out sections preserved */
/*
div.gform_wrapper :not(input, select, option, textarea, .gfield_required) {
  color: var(--farbe-weiss) !important;
}
*/

/*
.gform_button.button {
  border-radius: var(--button-border-radius) !important;
  color: var(--button-font-color) !important;
  background-color: var(--button-background-color) !important;
  border: var(--button-border-strength) var(--button-border-style) var(--button-border-color) !important;
  font-size: var(--button-font-size) !important;
  font-family: var(--button-font-family) !important;
  padding: var(--button-padding-y) var(--button-padding-x) !important;
  transition: var(--button-transition) !important;
}

.gform_button.button:hover {
  color: var(--button-font-color-hover) !important;
  background-color: var(--button-background-color-hover) !important;
  border: var(--button-border-strength) var(--button-border-style) var(--button-border-color-hover) !important;
  font-size: var(--button-font-size-hover) !important;
  padding: var(--button-padding-y) var(--button-padding-x) !important;
}
*/

/* HTML-Elemente ausblenden, da als Platzhalter benutzt */
/*
@media (max-width: 639px) {
  div.gfield--type-html {
    display: none !important;
  }
}
*/