body { background-color: #f4f6f9; }
.navbar-brand span { color: #ffc107; }
.card { border: none; box-shadow: 0 2px 6px rgba(0,0,0,.08); }
.kpi-value { font-size: 1.6rem; font-weight: 700; }
.kpi-label { font-size: .8rem; color: #6c757d; }
/* Prognose: Ampelfarben nach freien Plaetzen */
.badge-free-high { background-color: #198754; }
.badge-free-mid  { background-color: #fd7e14; }
.badge-free-low  { background-color: #dc3545; }

/* Rueckblick: nur die Veraenderung, als farbiger Text statt Badge.
   gruen = Plaetze wurden frei (Autos weggefahren)
   rot   = Plaetze wurden belegt (Autos dazugekommen) */
.delta-up   { color: #198754; font-weight: 600; }
.delta-down { color: #dc3545; font-weight: 600; }
.table-hover tbody tr { cursor: pointer; }
.skill-pos { color: #198754; font-weight: 600; }
.skill-neg { color: #dc3545; font-weight: 600; }

/* Chat */
#chat-window { height: 60vh; overflow-y: auto; background: #fff; border-radius: 8px;
               padding: 1rem; }
.chat-bubble { max-width: 80%; padding: .6rem .9rem; border-radius: 1rem;
               margin-bottom: .5rem; white-space: pre-wrap; }
.chat-user { background: #0d6efd; color: #fff; margin-left: auto;
             border-bottom-right-radius: .2rem; }
.chat-bot  { background: #e9ecef; color: #212529; margin-right: auto;
             border-bottom-left-radius: .2rem; }
.chat-chip { cursor: pointer; }
.payload-card { font-size: .85rem; }