.badgeStatus {
    padding: var(--padding-xs) var(--padding-sm);
    border-radius: var(--radius-md);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-semibold);
    display: inline-flex;
    align-items: center;
    gap: var(--gap-xs);

    &.success {
        background: var(--success-light);
        color: var(--success);
    }

    &.warning {
        background: var(--warning-light);
        color: var(--warning);
    }

    &.danger {
        background: var(--danger-light);
        color: var(--danger);
    }

    &.info {
        background: var(--info-light);
        color: var(--info);
    }

    .icon {
        display: flex;
        align-items: center;
    }
}