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

/* Variablen */
:root {
  --theme-farbe: var(--color-burgunder);
  --text-color: black;
}

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

/* Farben */
.gform_wrapper {
  --gf-ctrl-outline-color-focus: var(--color-grey60) !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-label-color-primary: black !important;
  --gf-ctrl-color: black !important;
  --gf-ctrl-color-focus: black !important;
  --gf-ctrl-radius: var(--box-border-radius) !important;
  --gf-ctrl-outline-color: var(--color-grey20) !important;
  --gf-ctrl-transition: none !important;
  --gf-ctrl-label-font-weight-primary: 400 !important;

  --gf-ctrl-outline-style: none !important;
  --gf-ctrl-label-font-size-primary: 1.6rem !important;
  --gf-ctrl-border-color: var(--color-grey20) !important;

  --gf-ctrl-padding-x: 15px !important;
  --gf-ctrl-padding-y: 20px !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);
  font-size: 1.6rem !important;
}

/* 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;
}

/* 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;
  }
}
*/
.gform-theme--framework .gfield .gfield_label  {
  translate: 0px 33px;
  margin: 0 15px;
  transition: all 0.1s ease-out;
}
.gform-theme--framework .gfield:has(:is(input, textarea):focus) .gfield_label,
.gform-theme--framework .gfield:has(:is(input, textarea):not(:placeholder-shown)) .gfield_label {
  translate: 0px -10px;
  font-size: 1.4rem !important;
  color: var(--color-grey40) !important;
}