/* =======================================================================
   WWF Split Layout – CLEAN (nur dieses Webform) — NATURE GREEN THEME
   ======================================================================= */

/* -----------------------------------------------------------------------
   Scope / Form Container
   ----------------------------------------------------------------------- */
.webform-submission-form.wwf-split,
.webform-submission-test-spendenformular-nach-samen-form{
  position: relative;
  isolation: isolate;
  box-sizing: border-box;

  width: 100vw;
  min-height: 100vh;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);

  /* vorher gelb -> freundliches Naturgrün */
  background: #8FB37A !important; /* sage green */
  overflow: hidden;

  --split-gutter: 32px;

  padding-left: calc(50vw + var(--split-gutter)) !important;
  padding-right: 48px;
  padding-top: 0;
  padding-bottom: 0;
}

/* Alles sichtbare im Formular über dem Hintergrund */
.webform-submission-form.wwf-split *,
.webform-submission-test-spendenformular-nach-samen-form *{
  position: relative;
  z-index: 2;
}

/* -----------------------------------------------------------------------
   Background Image (Desktop) – endet mit Form
   ----------------------------------------------------------------------- */
.webform-submission-form.wwf-split::before,
.webform-submission-test-spendenformular-nach-samen-form::before{
  content: "";
  position: absolute !important;
  left: 0;
  top: 0;
  width: 50vw;
  height: 100%;
  background: url("https://www.wwf.ch/sites/default/files/styles/tall_small/public/2026-06/image00002.jpg") center/cover no-repeat;
  z-index: 0;
  pointer-events: none;
}


/* -----------------------------------------------------------------------
   Right Column Sizing (Desktop): Progress + Wizard Page + Actions
   - Card/Buttons zentriert im grünen Bereich
   - Breiter (weniger Rand)
   ----------------------------------------------------------------------- */
@media (min-width: 981px){

  .webform-submission-form.wwf-split,
  .webform-submission-test-spendenformular-nach-samen-form{
    /* symmetrisch zum Gutter (statt 48px) */
    padding-right: var(--split-gutter) !important;
  }

  .webform-submission-form.wwf-split .webform-progress-tracker,
  .webform-submission-form.wwf-split .wwf-wizard-page,
  .webform-submission-form.wwf-split .webform-wizard-page, /* Fallback */
  .webform-submission-form.wwf-split .form-actions.form-wrapper,
  .webform-submission-form.wwf-split [data-drupal-selector="edit-actions"].form-actions,
  .webform-submission-test-spendenformular-nach-samen-form .webform-progress-tracker,
  .webform-submission-test-spendenformular-nach-samen-form .wwf-wizard-page,
  .webform-submission-test-spendenformular-nach-samen-form .webform-wizard-page, /* Fallback */
  .webform-submission-test-spendenformular-nach-samen-form .form-actions.form-wrapper,
  .webform-submission-test-spendenformular-nach-samen-form [data-drupal-selector="edit-actions"].form-actions{
    width: 100% !important;
    max-width: min(720px, calc(50vw - (2 * var(--split-gutter)))) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }

  .webform-submission-form.wwf-split .wwf-wizard-page .wwf-card,
  .webform-submission-test-spendenformular-nach-samen-form .wwf-wizard-page .wwf-card{
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }
}

/* -----------------------------------------------------------------------
   Progress: Segment-Leiste (gelb/hellgelb)
   ----------------------------------------------------------------------- */
.webform-submission-form.wwf-split .webform-progress-tracker,
.webform-submission-test-spendenformular-nach-samen-form .webform-progress-tracker{
  display: flex;
  gap: 10px;
  padding: 12px 6px 10px;
  margin: 0 0 14px;
  list-style: none;
}

.webform-submission-form.wwf-split .webform-progress-tracker li,
.webform-submission-test-spendenformular-nach-samen-form .webform-progress-tracker li{
  flex: 1 1 0;
  height: 6px;
  border-radius: 999px;
  background: #FFE9A6; /* hellgelb (inaktiv) */
  overflow: hidden;
  padding: 0;
}

.webform-submission-form.wwf-split .webform-progress-tracker li.is-active,
.webform-submission-form.wwf-split .webform-progress-tracker li.active,
.webform-submission-test-spendenformular-nach-samen-form .webform-progress-tracker li.is-active,
.webform-submission-test-spendenformular-nach-samen-form .webform-progress-tracker li.active{
  background: #F2C200; /* gelb (aktiv) */
}

/* Progress-Text verstecken (Titel/Labels) */
.webform-submission-form.wwf-split .webform-progress-tracker li a,
.webform-submission-form.wwf-split .webform-progress-tracker li span,
.webform-submission-test-spendenformular-nach-samen-form .webform-progress-tracker li a,
.webform-submission-test-spendenformular-nach-samen-form .webform-progress-tracker li span{
  font-size: 0;
  line-height: 0;
}

.webform-progress__status,
.webform-progress__percent{
  display: none;
}

/* -----------------------------------------------------------------------
   Card / Typography
   ----------------------------------------------------------------------- */
.webform-submission-form.wwf-split .wwf-card,
.webform-submission-test-spendenformular-nach-samen-form .wwf-card{
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 10px 25px rgba(0,0,0,.18);
  padding: 18px 18px 16px;
  box-sizing: border-box;
}

.webform-submission-form.wwf-split .wwf-question-box,
.webform-submission-test-spendenformular-nach-samen-form .wwf-question-box{
  background: transparent;
  padding: 0;
  margin: 0 0 14px;
}

/* vorher orange -> Naturgrün-Akzent */
.wwf-question-kicker{
  color: #2F6B3E;
  font-weight: 700;
  margin-bottom: 10px;
}

.wwf-question-strong{
  font-weight: 800;
  font-size: 1.15rem;
  line-height: 1.25;
  margin-top: 10px;
}
.wwf-question-sub{
  font-size: .95rem;
  opacity: .85;
}

/* -----------------------------------------------------------------------
   Options: Radios/Checkboxes als Buttons
   ----------------------------------------------------------------------- */
.webform-submission-form.wwf-split .wwf-options input[type="radio"],
.webform-submission-form.wwf-split .wwf-options input[type="checkbox"],
.webform-submission-test-spendenformular-nach-samen-form .wwf-options input[type="radio"],
.webform-submission-test-spendenformular-nach-samen-form .wwf-options input[type="checkbox"]{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* Theme-Pseudo-Icons entfernen */
.webform-submission-form.wwf-split .wwf-options label::before,
.webform-submission-form.wwf-split .wwf-options label::after,
.webform-submission-test-spendenformular-nach-samen-form .wwf-options label::before,
.webform-submission-test-spendenformular-nach-samen-form .wwf-options label::after{
  content: none !important;
}

.webform-submission-form.wwf-split .wwf-options .form-item,
.webform-submission-form.wwf-split .wwf-options .form-type-radio,
.webform-submission-form.wwf-split .wwf-options .form-type-checkbox,
.webform-submission-test-spendenformular-nach-samen-form .wwf-options .form-item,
.webform-submission-test-spendenformular-nach-samen-form .wwf-options .form-type-radio,
.webform-submission-test-spendenformular-nach-samen-form .wwf-options .form-type-checkbox{
  position: relative;
  margin: 0 0 10px;
  width: 100%;
  box-sizing: border-box;
}

.webform-submission-form.wwf-split .wwf-options .form-type-radio > label,
.webform-submission-form.wwf-split .wwf-options .form-type-checkbox > label,
.webform-submission-form.wwf-split .wwf-options .form-item > label,
.webform-submission-form.wwf-split .wwf-options label.option,
.webform-submission-test-spendenformular-nach-samen-form .wwf-options .form-type-radio > label,
.webform-submission-test-spendenformular-nach-samen-form .wwf-options .form-type-checkbox > label,
.webform-submission-test-spendenformular-nach-samen-form .wwf-options .form-item > label,
.webform-submission-test-spendenformular-nach-samen-form .wwf-options label.option{
  display: block;
  width: 100%;
  background: #fff;
  color: #000;
  padding: 14px 16px;
  border: 2px solid #000;
  border-radius: 0;

  text-transform: none;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.3;
  white-space: normal;
  overflow-wrap: anywhere;
  font-size: 1rem;

  cursor: pointer;
  user-select: none;
  box-sizing: border-box;
}

.webform-submission-form.wwf-split .wwf-options label:hover,
.webform-submission-test-spendenformular-nach-samen-form .wwf-options label:hover{
  background: #f5f5f5;
}

/* vorher orange -> Naturgrün bei Auswahl */
.webform-submission-form.wwf-split .wwf-options input:checked + label,
.webform-submission-test-spendenformular-nach-samen-form .wwf-options input:checked + label{
  border-color: #2F6B3E;
  box-shadow: inset 0 0 0 1px #2F6B3E;
}

.webform-submission-form.wwf-split .wwf-options label.option:has(input:checked),
.webform-submission-test-spendenformular-nach-samen-form .wwf-options label.option:has(input:checked){
  border-color: #2F6B3E;
  box-shadow: inset 0 0 0 1px #2F6B3E;
}

/* -----------------------------------------------------------------------
   Buttons – Grundstyle (nur dieses Formular)
   ----------------------------------------------------------------------- */
.webform-submission-form.wwf-split .webform-button--next,
.webform-submission-form.wwf-split .webform-button--previous,
.webform-submission-form.wwf-split .webform-button--submit,
.webform-submission-form.wwf-split input.form-submit,
.webform-submission-form.wwf-split button.form-submit,
.webform-submission-form.wwf-split a.button,
.webform-submission-test-spendenformular-nach-samen-form .webform-button--next,
.webform-submission-test-spendenformular-nach-samen-form .webform-button--previous,
.webform-submission-test-spendenformular-nach-samen-form .webform-button--submit,
.webform-submission-test-spendenformular-nach-samen-form input.form-submit,
.webform-submission-test-spendenformular-nach-samen-form button.form-submit,
.webform-submission-test-spendenformular-nach-samen-form a.button{
  /* vorher orange -> Naturgrün */
  background: #2F6B3E;
  color: #fff;
  border: 0;
  box-shadow: none;
  cursor: pointer;
  text-decoration: none;
}

.webform-submission-form.wwf-split .webform-button--next:hover,
.webform-submission-form.wwf-split .webform-button--previous:hover,
.webform-submission-form.wwf-split .webform-button--submit:hover,
.webform-submission-test-spendenformular-nach-samen-form .webform-button--next:hover,
.webform-submission-test-spendenformular-nach-samen-form .webform-button--previous:hover,
.webform-submission-test-spendenformular-nach-samen-form .webform-button--submit:hover{
  filter: brightness(1.04);
}

/* -----------------------------------------------------------------------
   Actions Wrapper + Buttons (Breite, Abstände, Optik)
   ----------------------------------------------------------------------- */
.webform-submission-form.wwf-split [data-drupal-selector="edit-actions"].form-actions,
.webform-submission-test-spendenformular-nach-samen-form [data-drupal-selector="edit-actions"].form-actions,
.webform-submission-form.wwf-split .form-actions.form-wrapper,
.webform-submission-test-spendenformular-nach-samen-form .form-actions.form-wrapper{
  padding: 0 !important;
  margin-top: 16px !important;
  margin-bottom: 22px !important;

  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 12px !important;
  box-sizing: border-box !important;
}

/* Weiter + Absenden: 100% */
.webform-submission-form.wwf-split [data-drupal-selector="edit-actions"].form-actions > input.webform-button--next.form-submit,
.webform-submission-form.wwf-split [data-drupal-selector="edit-actions"].form-actions > input.webform-button--submit.form-submit,
.webform-submission-test-spendenformular-nach-samen-form [data-drupal-selector="edit-actions"].form-actions > input.webform-button--next.form-submit,
.webform-submission-test-spendenformular-nach-samen-form [data-drupal-selector="edit-actions"].form-actions > input.webform-button--submit.form-submit,
.webform-submission-form.wwf-split .form-actions.form-wrapper > #edit-wizard-next,
.webform-submission-form.wwf-split .form-actions.form-wrapper > #edit-actions-submit,
.webform-submission-test-spendenformular-nach-samen-form .form-actions.form-wrapper > #edit-wizard-next,
.webform-submission-test-spendenformular-nach-samen-form .form-actions.form-wrapper > #edit-actions-submit{
  display: block !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  box-sizing: border-box !important;

  font-family: WWFRegular, "Helvetica Neue", Arial, sans-serif !important;
  font-size: 24px !important;
  font-weight: 400 !important;
  letter-spacing: 1.2px !important;
  line-height: 24px !important;
  text-transform: uppercase !important;

  height: 49.3333px !important;
  padding: 11px 25px 9px !important;
  border-radius: 0 !important;

  /* vorher orange -> Naturgrün */
  background: #2F6B3E !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Zurück: 100% (damit nichts “im Raum hängt”) */
.webform-submission-form.wwf-split [data-drupal-selector="edit-actions"].form-actions > .webform-button--previous,
.webform-submission-test-spendenformular-nach-samen-form [data-drupal-selector="edit-actions"].form-actions > .webform-button--previous,
.webform-submission-form.wwf-split .form-actions.form-wrapper > .webform-button--previous,
.webform-submission-test-spendenformular-nach-samen-form .form-actions.form-wrapper > .webform-button--previous{
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  box-sizing: border-box !important;

  background: #fff !important;
  color: #000 !important;
  border: 0 !important;
  box-shadow: none !important;

  font-family: WWFRegular, "Helvetica Neue", Arial, sans-serif !important;
  font-size: 24px !important;
  font-weight: 400 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;

  height: 49.3333px !important;
  padding: 11px 25px 9px !important;
  border-radius: 0 !important;
}

/* -----------------------------------------------------------------------
   Mobile
   ----------------------------------------------------------------------- */
@media (max-width: 980px){
  .webform-submission-form.wwf-split,
  .webform-submission-test-spendenformular-nach-samen-form{
    padding-left: 0 !important;
    padding-right: 0 !important;
    background: #fff !important;
    min-height: auto !important;
    padding-top: 12px !important;

    --mobile-image-height: 35vh;
    --mobile-image-gap: 18px;
    padding-bottom: calc(var(--mobile-image-height) + var(--mobile-image-gap)) !important;
  }

  .webform-submission-form.wwf-split::before,
  .webform-submission-test-spendenformular-nach-samen-form::before{
    position: absolute !important;
    left: 0;
    top: auto !important;
    bottom: 0;
    width: 100vw;
    height: var(--mobile-image-height);
    background-position: center;
  }

  .webform-submission-form.wwf-split .webform-progress-tracker,
  .webform-submission-test-spendenformular-nach-samen-form .webform-progress-tracker{
    margin: 0 18px 10px !important;
    padding: 12px 6px 10px !important;
    max-width: 640px !important;
  }

  .webform-submission-form.wwf-split .wwf-wizard-page,
  .webform-submission-test-spendenformular-nach-samen-form .wwf-wizard-page,
  .webform-submission-form.wwf-split .webform-wizard-page,
  .webform-submission-test-spendenformular-nach-samen-form .webform-wizard-page{
    margin: 0 18px 18px !important;
    max-width: 640px !important;
  }

  .webform-submission-form.wwf-split [data-drupal-selector="edit-actions"].form-actions,
  .webform-submission-test-spendenformular-nach-samen-form [data-drupal-selector="edit-actions"].form-actions,
  .webform-submission-form.wwf-split .form-actions.form-wrapper,
  .webform-submission-test-spendenformular-nach-samen-form .form-actions.form-wrapper{
    max-width: 640px !important;
    margin: 12px 18px 18px !important;
  }

  /* Tablet/Mobile: Zurück unter Weiter (falls DOM-Reihenfolge anders ist) */
  .webform-submission-form.wwf-split [data-drupal-selector="edit-actions"].form-actions > input.webform-button--next.form-submit,
  .webform-submission-form.wwf-split [data-drupal-selector="edit-actions"].form-actions > input.webform-button--submit.form-submit,
  .webform-submission-test-spendenformular-nach-samen-form [data-drupal-selector="edit-actions"].form-actions > input.webform-button--next.form-submit,
  .webform-submission-test-spendenformular-nach-samen-form [data-drupal-selector="edit-actions"].form-actions > input.webform-button--submit.form-submit{
    order: 1 !important;
  }

  .webform-submission-form.wwf-split [data-drupal-selector="edit-actions"].form-actions > .webform-button--previous,
  .webform-submission-test-spendenformular-nach-samen-form [data-drupal-selector="edit-actions"].form-actions > .webform-button--previous{
    order: 2 !important;
  }
}

/* ============================================================
   Reihenfolge überall erzwingen: Weiter oben, Zurück unten
   (Desktop + Tablet + Mobile)
   ============================================================ */

.webform-submission-form.wwf-split [data-drupal-selector="edit-actions"].form-actions > input.webform-button--next.form-submit,
.webform-submission-form.wwf-split [data-drupal-selector="edit-actions"].form-actions > input.webform-button--submit.form-submit,
.webform-submission-test-spendenformular-nach-samen-form [data-drupal-selector="edit-actions"].form-actions > input.webform-button--next.form-submit,
.webform-submission-test-spendenformular-nach-samen-form [data-drupal-selector="edit-actions"].form-actions > input.webform-button--submit.form-submit,
.webform-submission-form.wwf-split .form-actions.form-wrapper > #edit-wizard-next,
.webform-submission-form.wwf-split .form-actions.form-wrapper > #edit-actions-submit,
.webform-submission-test-spendenformular-nach-samen-form .form-actions.form-wrapper > #edit-wizard-next,
.webform-submission-test-spendenformular-nach-samen-form .form-actions.form-wrapper > #edit-actions-submit{
  order: 1 !important;
}

.webform-submission-form.wwf-split [data-drupal-selector="edit-actions"].form-actions > .webform-button--previous,
.webform-submission-test-spendenformular-nach-samen-form [data-drupal-selector="edit-actions"].form-actions > .webform-button--previous,
.webform-submission-form.wwf-split .form-actions.form-wrapper > .webform-button--previous,
.webform-submission-test-spendenformular-nach-samen-form .form-actions.form-wrapper > .webform-button--previous{
  order: 2 !important;
}

/* ============================================================
   Footer / Datenschutz
   ============================================================ */
.wwf-footer-privacy{
  font-size: 12px;
  line-height: 1.35;
  color: rgba(0,0,0,.75);
  margin-top: 10px;
}
.wwf-footer-privacy a{
  text-decoration: underline;
}

/* ============================================================
   WWF Logo oben links auf dem Bild (nur Desktop)
   ============================================================ */

@media (min-width: 981px){

  .webform-submission-form.wwf-split::after,
  .webform-submission-test-spendenformular-nach-samen-form::after{
    content: "" !important;
    position: absolute !important;

    /* oben links im linken Bildbereich */
    left: 16px;
    top: 16px;

    /* Logo-Grösse */
    width: 84px;
    height: 84px;

    background: url("https://www.wwf.ch/themes/custom/wwf_main_theme/images/wwf-logo-free-tab.svg")
                no-repeat center / contain;

    /* über dem Bild, unter dem Formular-Inhalt */
    z-index: 1;
    pointer-events: none;
  }
}

/* Mobile/Tablet: Logo ausblenden */
@media (max-width: 980px){
  .webform-submission-form.wwf-split::after,
  .webform-submission-test-spendenformular-nach-samen-form::after{
    content: none !important;
    background: none !important;
  }
}
/* ============================================================
   WWF Brand Colors Override
   ============================================================ */

.webform-submission-form.wwf-split,
.webform-submission-test-spendenformular-nach-samen-form{
  background: #d1d4b3  !important; /* WWF Olive 35% */
}

/* Progress */
.webform-submission-form.wwf-split .webform-progress-tracker li,
.webform-submission-test-spendenformular-nach-samen-form .webform-progress-tracker li{
  background: #fcefa6 !important; /* WWF Yellow 35% */
}

.webform-submission-form.wwf-split .webform-progress-tracker li.is-active,
.webform-submission-form.wwf-split .webform-progress-tracker li.active,
.webform-submission-test-spendenformular-nach-samen-form .webform-progress-tracker li.is-active,
.webform-submission-test-spendenformular-nach-samen-form .webform-progress-tracker li.active{
  background: #f5d200 !important; /* WWF Yellow 100% */
}

/* Kicker / Frage-Nr. */
.wwf-question-kicker{
  color: #007932 !important; /* WWF Green 100% */
}

/* Ausgewählte Optionen */
.webform-submission-form.wwf-split .wwf-options input:checked + label,
.webform-submission-test-spendenformular-nach-samen-form .wwf-options input:checked + label{
  border-color: #007932 !important;
  box-shadow: inset 0 0 0 1px #007932 !important;
}

.webform-submission-form.wwf-split .wwf-options label.option:has(input:checked),
.webform-submission-test-spendenformular-nach-samen-form .wwf-options label.option:has(input:checked){
  border-color: #007932 !important;
  box-shadow: inset 0 0 0 1px #007932 !important;
}

/* Buttons */
.webform-submission-form.wwf-split .webform-button--next,
.webform-submission-form.wwf-split .webform-button--previous,
.webform-submission-form.wwf-split .webform-button--submit,
.webform-submission-form.wwf-split input.form-submit,
.webform-submission-form.wwf-split button.form-submit,
.webform-submission-form.wwf-split a.button,
.webform-submission-test-spendenformular-nach-samen-form .webform-button--next,
.webform-submission-test-spendenformular-nach-samen-form .webform-button--previous,
.webform-submission-test-spendenformular-nach-samen-form .webform-button--submit,
.webform-submission-test-spendenformular-nach-samen-form input.form-submit,
.webform-submission-test-spendenformular-nach-samen-form button.form-submit,
.webform-submission-test-spendenformular-nach-samen-form a.button{
  background: #007932 !important; /* WWF Green 100% */
  color: #ffffff !important;
}

/* Weiter + Absenden */
.webform-submission-form.wwf-split [data-drupal-selector="edit-actions"].form-actions > input.webform-button--next.form-submit,
.webform-submission-form.wwf-split [data-drupal-selector="edit-actions"].form-actions > input.webform-button--submit.form-submit,
.webform-submission-test-spendenformular-nach-samen-form [data-drupal-selector="edit-actions"].form-actions > input.webform-button--next.form-submit,
.webform-submission-test-spendenformular-nach-samen-form [data-drupal-selector="edit-actions"].form-actions > input.webform-button--submit.form-submit,
.webform-submission-form.wwf-split .form-actions.form-wrapper > #edit-wizard-next,
.webform-submission-form.wwf-split .form-actions.form-wrapper > #edit-actions-submit,
.webform-submission-test-spendenformular-nach-samen-form .form-actions.form-wrapper > #edit-wizard-next,
.webform-submission-test-spendenformular-nach-samen-form .form-actions.form-wrapper > #edit-actions-submit{
  background: #007932 !important; /* WWF Green 100% */
  color: #ffffff !important;
}

/* Zurück-Button: schwarz/weiss, markennäher */
.webform-submission-form.wwf-split [data-drupal-selector="edit-actions"].form-actions > .webform-button--previous,
.webform-submission-test-spendenformular-nach-samen-form [data-drupal-selector="edit-actions"].form-actions > .webform-button--previous,
.webform-submission-form.wwf-split .form-actions.form-wrapper > .webform-button--previous,
.webform-submission-test-spendenformular-nach-samen-form .form-actions.form-wrapper > .webform-button--previous{
  background: #ffffff !important;
  color: #000000 !important;
  border: 2px solid #000000 !important;
}

/* Mobile bleibt weiss – nur wenn du auch dort Brand-Grün möchtest, auskommentieren */
/*
@media (max-width: 980px){
  .webform-submission-form.wwf-split,
  .webform-submission-test-spendenformular-nach-samen-form{
    background: #ffffff !important;
  }
}
*/
/* Progress: WWF Black / neutral auf Olive-Hintergrund */
.webform-submission-form.wwf-split .webform-progress-tracker li,
.webform-submission-test-spendenformular-nach-samen-form .webform-progress-tracker li{
  background: rgba(0,0,0,.22) !important;
}

.webform-submission-form.wwf-split .webform-progress-tracker li.is-active,
.webform-submission-form.wwf-split .webform-progress-tracker li.active,
.webform-submission-test-spendenformular-nach-samen-form .webform-progress-tracker li.is-active,
.webform-submission-test-spendenformular-nach-samen-form .webform-progress-tracker li.active{
  background: #000000 !important;
}
/* ============================================================
   Rezept-Downloads
   ============================================================ */

.webform-submission-form.wwf-split .wwf-recipe-downloads,
.webform-submission-test-spendenformular-nach-samen-form .wwf-recipe-downloads{
  margin: 18px 0 22px;
}

.webform-submission-form.wwf-split .wwf-recipe-downloads__title,
.webform-submission-test-spendenformular-nach-samen-form .wwf-recipe-downloads__title{
  margin: 0 0 10px;
  font-weight: 700;
}

.webform-submission-form.wwf-split .wwf-recipe-link,
.webform-submission-test-spendenformular-nach-samen-form .wwf-recipe-link{
  display: flex;
  align-items: center;
  gap: 12px;

  width: 100%;
  margin: 0 0 8px;
  padding: 12px 14px;

  background: #f7f7f2;
  color: #000 !important;
  border: 2px solid rgba(0,0,0,.18);
  border-radius: 0;

  text-decoration: none !important;
  line-height: 1.25;
  box-sizing: border-box;
}

.webform-submission-form.wwf-split .wwf-recipe-link:hover,
.webform-submission-test-spendenformular-nach-samen-form .wwf-recipe-link:hover{
  background: #ffffff;
  border-color: #007932;
  box-shadow: inset 0 0 0 1px #007932;
}

.webform-submission-form.wwf-split .wwf-recipe-link__icon,
.webform-submission-test-spendenformular-nach-samen-form .wwf-recipe-link__icon{
  flex: 0 0 auto;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 26px;
  height: 26px;

  background: #007932;
  color: #ffffff;

  font-size: 20px;
  font-weight: 700;
  line-height: 1;
}

.webform-submission-form.wwf-split .wwf-recipe-link__text,
.webform-submission-test-spendenformular-nach-samen-form .wwf-recipe-link__text{
  font-weight: 700;
}

.webform-submission-form.wwf-split .wwf-recipe-link__text span,
.webform-submission-test-spendenformular-nach-samen-form .wwf-recipe-link__text span{
  font-weight: 400;
}