/* 220_binaere_klassifikation — Spezialoptik aus sample5.html (Rest deckt assets/css/style.css ab:
   Reset/body/navbar/container/info-box/btn/output/table/input-group). */

/* Fortschrittsbalken beim Training — kein Aequivalent in style.css */
#moduleProgressContainer{margin-top:1rem;background:var(--hk-grau-hell);border-radius:var(--hk-radius);
  overflow:hidden;height:30px;position:relative}
#moduleProgressBar{width:0%;height:100%;background:linear-gradient(90deg,var(--hk-blau) 0%,var(--hk-rot) 100%);
  transition:width .3s ease}
#moduleProgressText{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  font-weight:600;color:var(--hk-text);text-shadow:0 0 3px #fff}

/* Spam/Legitim-Badges in der Trainingsdaten-Tabelle — kein Aequivalent in style.css */
.label-spam{background:var(--hk-rot);color:#fff;padding:.25rem .5rem;border-radius:4px;
  font-weight:700;display:inline-block}
.label-legit{background:var(--hk-gruen);color:#fff;padding:.25rem .5rem;border-radius:4px;
  font-weight:700;display:inline-block}

/* Klassifikations-Ergebnis: Eingabe-Zusammenfassung + grosses Ergebnis-Badge */
.prediction-box{background:var(--hk-grau-hell);padding:1rem;border-radius:6px;
  border:2px solid var(--hk-rahmen);margin-top:1rem}
.prediction-result{font-size:1.5rem;font-weight:700;text-align:center;padding:1rem;
  border-radius:6px;margin-top:1rem}
.result-spam{background:var(--hk-rot-hell);color:var(--hk-rot);border:2px solid var(--hk-rot)}
.result-legit{background:var(--hk-gruen-hell);color:var(--hk-gruen);border:2px solid var(--hk-gruen)}