.umb-badge {
    padding: 6px 8px;
    margin: 0 5px 0 0;
    color: @black;
    background-color: @turquoise-washed;
    border-width: 1px;
    border-style: solid;
    border-color: @turquoise;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-transform: capitalize;
}

// Colors
.umb-badge--primary {
    background-color: @turquoise-washed;
    border-color: @turquoise;
}

.umb-badge--seconday {
    background-color: @purple-washed;
    border-color: @purple;
}

.umb-badge--danger {
    background-color: @red-washed;
    border-color: @red;
}

.umb-badge--warning {
    background-color: @yellow-washed;
    border-color: @yellow;
}

.umb-badge--success {
    background-color: @green-washed;
    border-color: @green;
}

// Size
.umb-badge--xs {
    font-size: 13px;
    padding: 1px 6px;
}

.umb-badge--s {
    font-size: 14px;
    padding: 3px 6px;
}

.umb-badge--m {
    font-size: 16px;
    padding: 6px 8px;
}

.umb-badge--l {
    font-size: 18px;
    padding: 6px 8px;
}

.umb-badge--xl {
    font-size: 20px;
    padding: 6px 8px;
}