.StatusBadge {
    height: 100%;
    width: 100%;
    display: inline-block;
    text-align: center;
    padding: var(--slds-g-spacing-1);
    border-radius: var(--slds-g-radius-border-1); /* Figma: 5px, nearest token: 4px */
    font-family: var(--slds-g-font-family-base);
    font-size: var(--slds-g-font-scale-neg-1);
    font-weight: var(--slds-g-font-weight-5);
    line-height: var(--slds-g-font-line-height-2); /* Figma: 1.19, nearest token: 1.25 */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--slds-g-color-on-surface-2);
}

.StatusBadge--default {
    background-color: var(--slds-g-color-surface-container-1);
}

.StatusBadge--warning {
    background-color: var(--slds-g-color-warning-container-1);
}

.StatusBadge--info {
    background-color: var(--slds-g-color-info-container-1);
}

.StatusBadge--error {
    background-color: var(--slds-g-color-error-container-1);
}

.StatusBadge--neutral {
    background-color: var(--slds-g-color-surface-container-3);
}

.StatusBadge--success {
    background-color: var(--slds-g-color-success-container-1);
}