/************************************
 * User Custom CSS (Modularisiert)
 * -------------------------------
 * Farbvariablen & Schriftarten zentral
 * Bessere Wartbarkeit und Konsistenz
 ************************************/

/* Farbvariablen zentral definieren */
:root {
  --color-primary: #00403A;     /* BGP Dunkelgrün */
  --color-accent: #87F53D;      /* BGP Hellgrün */
  --color-grey-light:#e0e0e0;   /* Hellgrau */
  --color-white: #ffffff;       /* Weiß */  
  --color-highlight: ##00403A;   /* Haupttextfarbe in body */
}

/************************************
 * Schriftarten (benutzerdefiniert)
 ************************************/

/* bgpHeveria */
@font-face {
  font-family: "bgpHeveria";
  src: url("https://info.bad-gmbh.de/hubfs/BG%20prevent/fonts/bgpHeveria-Variable.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 800;
}

/* bgpGilmer */
@font-face {
  font-family: "bgpGilmer";
  src: url("https://info.bad-gmbh.de/hubfs/BG%20prevent/fonts/bgpGilmer-Variable.woff2") format("woff2");
  font-style: normal;
  font-weight: 300 800;
}

/************************************
 * Grundstruktur und Typografie
 ************************************/

body {
  color: var(--color-highlight) !important;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "bgpHeveria", ui-serif, serif;
  color: var(--color-primary) !important;
}

p, span, div, a {
  font-family: "bgpGilmer", ui-serif, serif;
  color: var(--color-primary) !important;
}

/* Hinweis: "text-primary" fehlt ein Punkt (Klassen-Selektor?) → korrigiert: */
.text-primary {
  color: var(--color-primary) !important;
}

/************************************
 * Buttons und Komponenten
 ************************************/

.btn-primary {
  background-color: var(--color-primary) !important;
  border-color: var(--color-primary) !important;
  color: var(--color-white) !important;
}

/************************************
 * Fortschrittsbalken
 ************************************/

/* Leerer Bereich */
.progress {
  background-color: var(--color-grey-light) !important;
  border-radius: 10px;
}

/* Gefüllter Bereich */
.progress-bar {
  background-color: var(--color-accent) !important;
  color: var(--color-primary) !important;
  transition: width 0.6s ease;
  border-radius: 10px;
}