/* ============================================================
   Status-Badges
   ============================================================ */


/* ------------------------------------------------------------
   Grundbadge
   ------------------------------------------------------------ */

.badge {
    display: inline-flex;
    align-items: center;

    min-height: 24px;

    padding:
        2px var(--abstand-2);

    border-radius: 999px;

    font-size: 0.75rem;
    font-weight: 650;
    line-height: 1.2;

    white-space: nowrap;
}


/* ------------------------------------------------------------
   Neutral
   ------------------------------------------------------------ */

.badge-neutral {
    background-color: var(--grau-100);

    color: var(--grau-700);
}


/* ------------------------------------------------------------
   Erfolg
   ------------------------------------------------------------ */

.badge-erfolg {
    background-color: var(--erfolg-hintergrund);

    color: var(--erfolg);
}


/* ------------------------------------------------------------
   Warnung
   ------------------------------------------------------------ */

.badge-warnung {
    background-color: var(--warnung-hintergrund);

    color: var(--warnung);
}


/* ------------------------------------------------------------
   Fehler
   ------------------------------------------------------------ */

.badge-fehler {
    background-color: var(--fehler-hintergrund);

    color: var(--fehler);
}


/* ------------------------------------------------------------
   Information
   ------------------------------------------------------------ */

.badge-info {
    background-color: var(--info-hintergrund);

    color: var(--info);
}


/* ------------------------------------------------------------
   Primärfarbe
   ------------------------------------------------------------ */

.badge-primaer {
    background-color: var(--gruen-100);

    color: var(--gruen-900);
}

.tabelle-wrapper {
    overflow-x: auto;
}