/**
 * TelccFree — shared exercise action bar.
 *
 * One hierarchy for every exercise type:
 *   primary   — Antworten prüfen / Abschicken / Text überprüfen
 *   utility   — Übersetzung, Wiederholen / Zurücksetzen, Markieren
 *   nav       — Weiter, Zurück, Startseite
 *
 * Loaded by all quiz/quizz pages. Class and id hooks are the ones the
 * exercise scripts already rely on, so nothing here renames anything.
 */

:root {
  --telc-act-radius: 10px;
  --telc-act-speed: 180ms;
  --telc-act-ease: cubic-bezier(0.22, 0.61, 0.36, 1);

  --telc-act-primary: #1f4fa6;
  --telc-act-primary-hover: #1a4491;
  --telc-act-primary-ink: #ffffff;
  --telc-act-primary-ring: rgba(31, 79, 166, 0.22);

  --telc-act-util-bg: #ffffff;
  --telc-act-util-bg-hover: #f3f6fb;
  --telc-act-util-border: #d7dee8;
  --telc-act-util-border-hover: #b9c4d4;
  --telc-act-util-ink: #33404f;

  --telc-act-nav-ink: #4a5768;
  --telc-act-nav-ink-hover: #1f2a37;
  --telc-act-nav-bg-hover: #eef1f6;
  --telc-act-accent: #3f6ccf;
}

html.dark {
  --telc-act-primary: #3566be;
  --telc-act-primary-hover: #3d73d2;
  --telc-act-primary-ink: #ffffff;
  --telc-act-primary-ring: rgba(53, 102, 190, 0.3);

  --telc-act-util-bg: rgba(255, 255, 255, 0.045);
  --telc-act-util-bg-hover: rgba(255, 255, 255, 0.09);
  --telc-act-util-border: #343d4a;
  --telc-act-util-border-hover: #4a5563;
  --telc-act-util-ink: #d5dae1;

  --telc-act-nav-ink: #aab3c0;
  --telc-act-nav-ink-hover: #e8ebef;
  --telc-act-nav-bg-hover: rgba(255, 255, 255, 0.07);
  --telc-act-accent: #6f9bea;
}

/* ── primary action ─────────────────────────────────────────── */
.telc-global-check-btn,
.lesen-teil2-check-btn,
.btn-check,
.sb-check-btn,
.schreiben-check-btn,
#check-button,
#checkButton,
#check-btn,
#checkBtn,
#btnCheck,
.t3exp-btn.t3exp-btn--check,
button.quiz-button:not(.secondary):not(.telc-global-reset-btn),
button[onclick*="checkAnswers"]:not(.telc-nav-btn):not(.telc-global-reset-btn):not(.t3exp-btn),
button[onclick*="submitQuiz"]:not(.telc-global-reset-btn),
button[onclick*="checkText"]:not(.telc-global-reset-btn),
input[type="button"][onclick*="checkAnswers"]:not(.telc-global-reset-btn) {
  order: 2;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 9px !important;
  width: auto;
  min-width: 0;
  min-height: 42px;
  margin: 0 !important;
  padding: 11px 22px !important;
  background: var(--telc-act-primary) !important;
  background-image: none !important;
  border: 1px solid var(--telc-act-primary) !important;
  border-radius: var(--telc-act-radius) !important;
  color: var(--telc-act-primary-ink) !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.005em;
  line-height: 1.2;
  text-decoration: none !important;
  cursor: pointer !important;
  box-shadow: 0 1px 2px rgba(16, 24, 40, 0.1) !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-sizing: border-box;
  max-width: 100%;
  transition: background var(--telc-act-speed) var(--telc-act-ease),
    border-color var(--telc-act-speed) var(--telc-act-ease),
    box-shadow var(--telc-act-speed) var(--telc-act-ease) !important;
}

.telc-global-check-btn:hover,
.lesen-teil2-check-btn:hover,
.btn-check:hover,
.sb-check-btn:hover,
.schreiben-check-btn:hover,
#check-button:hover,
#checkButton:hover,
#check-btn:hover,
#checkBtn:hover,
#btnCheck:hover,
.t3exp-btn.t3exp-btn--check:hover,
button.quiz-button:not(.secondary):not(.telc-global-reset-btn):hover,
button[onclick*="checkAnswers"]:not(.telc-nav-btn):not(.telc-global-reset-btn):not(.t3exp-btn):hover,
button[onclick*="submitQuiz"]:not(.telc-global-reset-btn):hover {
  background: var(--telc-act-primary-hover) !important;
  border-color: var(--telc-act-primary-hover) !important;
  box-shadow: 0 4px 12px -4px var(--telc-act-primary-ring) !important;
  transform: none !important;
}

.telc-global-check-btn:active,
.lesen-teil2-check-btn:active,
.btn-check:active,
#check-button:active,
#check-btn:active,
#checkBtn:active,
.t3exp-btn.t3exp-btn--check:active {
  transform: translateY(1px) !important;
  box-shadow: none !important;
}

.telc-global-check-btn:focus-visible,
.btn-check:focus-visible,
#check-button:focus-visible,
#checkBtn:focus-visible {
  outline: 2px solid var(--telc-act-accent);
  outline-offset: 2px;
}

.telc-global-check-btn__icon,
.lesen-teil2-check-btn__icon {
  color: currentColor;
  font-size: 0.9em;
  opacity: 0.92;
  flex-shrink: 0;
  transition: none;
}

.telc-global-check-btn__label {
  line-height: 1.2;
}

.telc-global-check-btn:disabled,
.lesen-teil2-check-btn:disabled,
#check-button:disabled,
#check-btn:disabled,
#checkBtn:disabled,
.t3exp-btn--check:disabled,
.telc-check-locked {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
  transform: none !important;
  box-shadow: none !important;
}

/* ── utility actions: Übersetzung, Wiederholen, Markieren ───── */
#resetQuizButton,
#resetBtn,
#btnRefresh,
#btnNewMixPanel,
button.telc-global-reset-btn,
button.quiz-button.secondary,
.quiz-button.secondary,
.t3exp-btn:not(.t3exp-btn--check):not(.t3exp-btn--primary),
.t3exp-btn.t3exp-btn--retry,
.t3exp-btn.t3exp-btn--uebersetzung {
  order: 1;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  min-height: 40px;
  padding: 10px 16px !important;
  background: var(--telc-act-util-bg) !important;
  background-image: none !important;
  border: 1px solid var(--telc-act-util-border) !important;
  border-radius: var(--telc-act-radius) !important;
  color: var(--telc-act-util-ink) !important;
  font-size: 0.885rem !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  line-height: 1.2;
  text-decoration: none !important;
  cursor: pointer !important;
  box-shadow: none !important;
  box-sizing: border-box;
  transition: background var(--telc-act-speed) var(--telc-act-ease),
    border-color var(--telc-act-speed) var(--telc-act-ease),
    color var(--telc-act-speed) var(--telc-act-ease) !important;
}

#resetQuizButton:hover,
#resetBtn:hover,
#btnRefresh:hover,
#btnNewMixPanel:hover,
button.telc-global-reset-btn:hover,
button.quiz-button.secondary:hover,
.quiz-button.secondary:hover,
.t3exp-btn:not(.t3exp-btn--check):not(.t3exp-btn--primary):hover,
.t3exp-btn.t3exp-btn--retry:hover,
.t3exp-btn.t3exp-btn--uebersetzung:hover {
  background: var(--telc-act-util-bg-hover) !important;
  border-color: var(--telc-act-util-border-hover) !important;
  color: var(--telc-act-util-ink) !important;
  transform: none !important;
  box-shadow: none !important;
}

.t3exp-btn.is-active,
.t3exp-btn[aria-pressed="true"] {
  background: var(--telc-act-util-bg-hover) !important;
  border-color: var(--telc-act-accent) !important;
  color: var(--telc-act-nav-ink-hover) !important;
}

#resetQuizButton .fa-redo,
button.telc-global-reset-btn .fa-redo,
.t3exp-btn__icon {
  font-size: 0.9em;
  opacity: 0.75;
  flex-shrink: 0;
}

/* ── navigation: Weiter / Zurück / Startseite ─────────────────
   body-prefixed so page-level <style> blocks (many exercises set
   .auto-nav-btn { background:#667eea; color:#fff !important })
   cannot leave white text on a now-transparent button. */
body .auto-nav-btn,
body #autoPrevBtn,
body #autoNextBtn,
body #telcHoerenPrevBtn,
body #telcHoerenNextBtn,
body #t3exp-weiter,
body .t3exp-btn.t3exp-btn--primary,
body .quiz-button-link {
  order: 3;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-height: 38px;
  padding: 9px 14px !important;
  background: transparent !important;
  background-image: none !important;
  border: 1px solid transparent !important;
  border-radius: var(--telc-act-radius) !important;
  color: var(--telc-act-nav-ink) !important;
  font-size: 0.885rem !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  box-shadow: none !important;
  cursor: pointer;
  transition: background var(--telc-act-speed) var(--telc-act-ease),
    color var(--telc-act-speed) var(--telc-act-ease),
    border-color var(--telc-act-speed) var(--telc-act-ease) !important;
}

body .auto-nav-btn:hover,
body #autoPrevBtn:hover,
body #autoNextBtn:hover,
body #telcHoerenPrevBtn:hover,
body #telcHoerenNextBtn:hover,
body #t3exp-weiter:hover,
body .t3exp-btn.t3exp-btn--primary:hover,
body .quiz-button-link:hover {
  background: var(--telc-act-nav-bg-hover) !important;
  border-color: var(--telc-act-util-border) !important;
  color: var(--telc-act-nav-ink-hover) !important;
  transform: none !important;
  box-shadow: none !important;
}

.auto-nav-btn .fa,
.auto-nav-btn .fas,
#t3exp-weiter .t3exp-btn__icon {
  color: var(--telc-act-accent);
  opacity: 1;
}

.auto-nav-btn.auto-nav-disabled,
.auto-nav-btn[aria-disabled="true"] {
  opacity: 0.4 !important;
  pointer-events: none !important;
}

/* Home link keeps its own identity in the top bar, but inside an
   exercise action bar it reads as navigation like Weiter / Zurück. */
.button-container a.quiz-button-link.telc-home-btn,
.button-container a.quiz-button.telc-home-btn,
.telc-check-action-zone a.quiz-button-link.telc-home-btn,
.auto-nav-wrap a.auto-nav-btn.telc-home-btn,
.auto-nav-wrap a.auto-nav-btn.telc-dash-home.telc-home-btn {
  padding: 9px 14px !important;
  min-height: 38px;
  font-size: 0.885rem !important;
  font-weight: 600 !important;
  border-radius: var(--telc-act-radius) !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  color: var(--telc-act-nav-ink) !important;
  box-shadow: none !important;
}

.button-container a.quiz-button-link.telc-home-btn:hover,
.button-container a.quiz-button.telc-home-btn:hover,
.telc-check-action-zone a.quiz-button-link.telc-home-btn:hover,
.auto-nav-wrap a.auto-nav-btn.telc-home-btn:hover,
.auto-nav-wrap a.auto-nav-btn.telc-dash-home.telc-home-btn:hover {
  background: var(--telc-act-nav-bg-hover) !important;
  border-color: var(--telc-act-util-border) !important;
  color: var(--telc-act-nav-ink-hover) !important;
  box-shadow: none !important;
  transform: none !important;
}

.button-container a.telc-home-btn .fa-house,
.button-container a.telc-home-btn i[class*="fa-house"],
.auto-nav-wrap a.telc-home-btn .fa-house,
.auto-nav-wrap a.telc-home-btn i[class*="fa-house"] {
  color: var(--telc-act-accent);
}

/* ── action bar layout ──────────────────────────────────────── */
.telc-check-action-zone,
.button-container,
.button-container.telc-check-action-zone,
.button-container.telc-action-button-container {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 12px;
  width: 100%;
  margin: 20px 0;
  padding: 0;
}

@media (max-width: 560px) {
  .telc-check-action-zone,
  .button-container,
  .button-container.telc-action-button-container {
    gap: 10px;
  }

  .telc-global-check-btn,
  .lesen-teil2-check-btn,
  .btn-check,
  #check-button,
  #check-btn,
  #checkBtn,
  button.quiz-button:not(.secondary):not(.telc-global-reset-btn) {
    flex: 1 1 100%;
    min-height: 46px;
  }

  #resetQuizButton,
  #resetBtn,
  button.telc-global-reset-btn,
  button.quiz-button.secondary,
  .t3exp-btn {
    flex: 1 1 auto;
    min-height: 44px;
  }

  .auto-nav-btn,
  .quiz-button-link {
    min-height: 42px;
  }
}

/* ── dark mode ──────────────────────────────────────────────
   Prefixed with html.dark body to outrank the older exercise dark
   themes, which paint every button as glass with a blue glow. */
html.dark body .telc-global-check-btn,
html.dark body .lesen-teil2-check-btn,
html.dark body .btn-check,
html.dark body .sb-check-btn,
html.dark body .schreiben-check-btn,
html.dark body #check-button,
html.dark body #checkButton,
html.dark body #check-btn,
html.dark body #checkBtn,
html.dark body #btnCheck,
html.dark body .t3exp-btn.t3exp-btn--check,
html.dark body button.quiz-button:not(.secondary):not(.telc-global-reset-btn),
html.dark body button[onclick*="checkAnswers"]:not(.telc-nav-btn):not(.telc-global-reset-btn):not(.t3exp-btn),
html.dark body button[onclick*="submitQuiz"]:not(.telc-global-reset-btn),
html.dark body input[type="button"][onclick*="checkAnswers"] {
  background: var(--telc-act-primary) !important;
  background-image: none !important;
  border-color: var(--telc-act-primary) !important;
  color: var(--telc-act-primary-ink) !important;
  box-shadow: none !important;
}

html.dark body .telc-global-check-btn:hover,
html.dark body .lesen-teil2-check-btn:hover,
html.dark body .btn-check:hover,
html.dark body #check-button:hover,
html.dark body #checkBtn:hover,
html.dark body #btnCheck:hover,
html.dark body .t3exp-btn.t3exp-btn--check:hover,
html.dark body button.quiz-button:not(.secondary):not(.telc-global-reset-btn):hover {
  background: var(--telc-act-primary-hover) !important;
  border-color: var(--telc-act-primary-hover) !important;
  box-shadow: none !important;
}

html.dark body #resetQuizButton,
html.dark body #resetBtn,
html.dark body #btnRefresh,
html.dark body #btnNewMixPanel,
html.dark body button.telc-global-reset-btn,
html.dark body button.quiz-button.secondary,
html.dark body .quiz-button.secondary,
html.dark body .t3exp-btn:not(.t3exp-btn--check):not(.t3exp-btn--primary),
html.dark body .t3exp-btn.t3exp-btn--retry,
html.dark body .t3exp-btn.t3exp-btn--uebersetzung {
  background: var(--telc-act-util-bg) !important;
  background-image: none !important;
  border: 1px solid var(--telc-act-util-border) !important;
  color: var(--telc-act-util-ink) !important;
  box-shadow: none !important;
}

html.dark body #resetQuizButton:hover,
html.dark body #resetBtn:hover,
html.dark body #btnRefresh:hover,
html.dark body #btnNewMixPanel:hover,
html.dark body button.telc-global-reset-btn:hover,
html.dark body button.quiz-button.secondary:hover,
html.dark body .quiz-button.secondary:hover,
html.dark body .t3exp-btn:not(.t3exp-btn--check):not(.t3exp-btn--primary):hover,
html.dark body .t3exp-btn.t3exp-btn--retry:hover,
html.dark body .t3exp-btn.t3exp-btn--uebersetzung:hover {
  background: var(--telc-act-util-bg-hover) !important;
  border-color: var(--telc-act-util-border-hover) !important;
  color: var(--telc-act-util-ink) !important;
  box-shadow: none !important;
}

html.dark body .auto-nav-btn,
html.dark body #autoPrevBtn,
html.dark body #autoNextBtn,
html.dark body #telcHoerenPrevBtn,
html.dark body #telcHoerenNextBtn,
html.dark body #t3exp-weiter,
html.dark body .t3exp-btn.t3exp-btn--primary,
html.dark body .quiz-button-link,
html.dark body a.quiz-button-link,
html.dark body .quiz-button-link.secondary,
html.dark body #homeBtn,
html.dark body .btn-blue {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid transparent !important;
  color: var(--telc-act-nav-ink) !important;
  box-shadow: none !important;
}

html.dark body .auto-nav-btn:hover,
html.dark body #telcHoerenPrevBtn:hover,
html.dark body #telcHoerenNextBtn:hover,
html.dark body #t3exp-weiter:hover,
html.dark body .t3exp-btn.t3exp-btn--primary:hover,
html.dark body .quiz-button-link:hover,
html.dark body a.quiz-button-link:hover,
html.dark body #homeBtn:hover,
html.dark body .btn-blue:hover {
  background: var(--telc-act-nav-bg-hover) !important;
  border-color: var(--telc-act-util-border) !important;
  color: var(--telc-act-nav-ink-hover) !important;
  box-shadow: none !important;
}

.ex-btn.telc-return-focus {
  outline: 2px solid rgba(233, 30, 140, 0.45);
  outline-offset: 2px;
}

/* Hören: Antworten prüfen + Erneut versuchen — black & white, no blue */
html.telc-hoeren-quiz-page .hoeren-action-row,
body[data-section^="Hören Teil"] .hoeren-action-row {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  margin: 28px auto 0 !important;
}

/* Shared exam tokens: Antworten prüfen = black/white, Wiederholen = white/black.
   Scoped to Hören + Lesen 1/2/3 + Sprachbausteine. Leaves Schreiben/other primaries alone. */
html.telc-hoeren-quiz-page,
body.lesen-teil1-page,
body.lesen-teil2-page,
body.teil3-experiment-der-hund,
body.sb-exam,
body.sprachbausteine-page {
  --telc-act-primary: #111111;
  --telc-act-primary-hover: #2a2a2a;
  --telc-act-primary-ink: #ffffff;
  --telc-act-primary-ring: rgba(17, 17, 17, 0.18);
  --telc-act-util-bg: #ffffff;
  --telc-act-util-bg-hover: #f3f4f6;
  --telc-act-util-border: #c5ccd6;
  --telc-act-util-border-hover: #111111;
  --telc-act-util-ink: #111111;
}

html.dark.telc-hoeren-quiz-page,
html.dark body.lesen-teil1-page,
html.dark body.lesen-teil2-page,
html.dark body.teil3-experiment-der-hund,
html.dark body.sb-exam,
html.dark body.sprachbausteine-page {
  --telc-act-primary: #111111;
  --telc-act-primary-hover: #2a2a2a;
  --telc-act-primary-ink: #ffffff;
  --telc-act-primary-ring: rgba(17, 17, 17, 0.18);
  --telc-act-util-bg: #ffffff;
  --telc-act-util-bg-hover: #f3f4f6;
  --telc-act-util-border: #c5ccd6;
  --telc-act-util-border-hover: #111111;
  --telc-act-util-ink: #111111;
}

html.telc-hoeren-quiz-page .quiz-container button.btn-check,
html.telc-hoeren-quiz-page .quiz-container button.btn-check.telc-global-check-btn,
html.telc-hoeren-quiz-page .quiz-container button.btn-check.lesen-teil2-check-btn,
html.telc-hoeren-quiz-page .quiz-container button#check-button,
html.telc-hoeren-quiz-page .quiz-container button#check-button.btn-check,
html.telc-hoeren-quiz-page .quiz-container button#check-button.telc-global-check-btn,
body[data-section^="Hören Teil"] .quiz-container button.btn-check,
body[data-section^="Hören Teil"] .quiz-container button#check-button,
body.lesen-teil1-page #checkBtn,
body.lesen-teil1-page #check-btn,
body.lesen-teil1-page button#check-button,
body.lesen-teil1-page #check-button.telc-global-check-btn,
body.lesen-teil2-page button.lesen-teil2-check-btn,
body.lesen-teil2-page button#check-button,
body.teil3-experiment-der-hund #t3exp-antworten,
body.sb-exam #checkBtn,
body.sprachbausteine-page #checkBtn,
body.sprachbausteine-page .sb-check-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: auto !important;
  margin: 0 !important;
  padding: 11px 18px !important;
  min-height: 42px;
  height: 42px;
  box-sizing: border-box;
  background: #111111 !important;
  background-image: none !important;
  border: 1px solid #111111 !important;
  border-radius: 10px !important;
  color: #ffffff !important;
  box-shadow: none !important;
  filter: none !important;
}

html.telc-hoeren-quiz-page .quiz-container button.hoeren-retry-btn,
html.telc-hoeren-quiz-page .quiz-container button.hoeren-retry-btn.telc-global-reset-btn,
html.telc-hoeren-quiz-page #hoeren-retry-btn,
body[data-section^="Hören Teil"] .quiz-container button.hoeren-retry-btn,
body.lesen-teil1-page #resetQuizButton,
body.lesen-teil1-page button.telc-global-reset-btn,
body.lesen-teil2-page button#lesen-teil2-retry,
body.lesen-teil2-page button.lesen-teil2-retry-btn,
body.teil3-experiment-der-hund #t3exp-wiederholen,
body.sb-exam #resetBtn,
body.sprachbausteine-page #resetBtn,
body.sprachbausteine-page .sb-reset-btn,
body.sprachbausteine-page #resetQuizButton {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  width: auto !important;
  margin: 0 !important;
  padding: 11px 16px !important;
  min-height: 42px;
  height: 42px;
  box-sizing: border-box;
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid #c5ccd6 !important;
  border-radius: 10px !important;
  color: #111111 !important;
  box-shadow: none !important;
  filter: none !important;
}

html.telc-hoeren-quiz-page .quiz-container button.btn-check:hover,
html.telc-hoeren-quiz-page .quiz-container button#check-button:hover,
body[data-section^="Hören Teil"] .quiz-container button.btn-check:hover,
body[data-section^="Hören Teil"] .quiz-container button#check-button:hover,
body.lesen-teil1-page button#check-button:hover,
body.lesen-teil2-page button.lesen-teil2-check-btn:hover,
body.teil3-experiment-der-hund #t3exp-antworten:hover,
body.sb-exam #checkBtn:hover,
body.sprachbausteine-page #checkBtn:hover {
  background: #2a2a2a !important;
  background-image: none !important;
  border-color: #2a2a2a !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

html.telc-hoeren-quiz-page .quiz-container button.hoeren-retry-btn:hover,
html.telc-hoeren-quiz-page #hoeren-retry-btn:hover,
body[data-section^="Hören Teil"] .quiz-container button.hoeren-retry-btn:hover,
body.lesen-teil1-page #resetQuizButton:hover,
body.lesen-teil2-page button.lesen-teil2-retry-btn:hover,
body.teil3-experiment-der-hund #t3exp-wiederholen:hover,
body.sb-exam #resetBtn:hover,
body.sprachbausteine-page #resetBtn:hover {
  background: #f3f4f6 !important;
  background-image: none !important;
  border-color: #111111 !important;
  color: #111111 !important;
  box-shadow: none !important;
}

html.telc-hoeren-quiz-page .quiz-container .btn-check .telc-global-check-btn__icon,
html.telc-hoeren-quiz-page .quiz-container .btn-check .lesen-teil2-check-btn__icon,
body.lesen-teil1-page .telc-global-check-btn__icon,
body.lesen-teil2-page .lesen-teil2-check-btn__icon,
body.teil3-experiment-der-hund #t3exp-antworten .t3exp-btn__icon,
body.sb-exam #checkBtn .sb-exam-btn-icon,
body.sprachbausteine-page #checkBtn .sb-exam-btn-icon {
  color: #ffffff !important;
}

html.telc-hoeren-quiz-page .quiz-container .hoeren-retry-btn__icon,
body.lesen-teil1-page #resetQuizButton .fa-redo,
body.lesen-teil2-page .lesen-teil2-retry-btn__icon,
body.teil3-experiment-der-hund #t3exp-wiederholen .t3exp-btn__icon,
body.sb-exam #resetBtn .sb-exam-btn-icon,
body.sprachbausteine-page #resetBtn .sb-exam-btn-icon {
  color: #111111 !important;
}