.badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.25em 0.6em;
    font-size: 0.75em;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 50rem;
    color: #fff;
    min-width: 1.5em;
    transition: all var(--transition);
}

/* Sizes */
.badge-sm {
    padding: 0.2em 0.5em;
    font-size: 0.65em;
}

.badge-md {
    padding: 0.25em 0.6em;
    font-size: 0.75em;
}

.badge-lg {
    padding: 0.35em 0.7em;
    font-size: 0.85em;
}

/* Colors */
.badge.bg-primary {
    background-color: #0d6efd;
}

.badge.bg-secondary {
    background-color: #6c757d;
}

.badge.bg-success {
    background-color: #198754;
}

.badge.bg-danger {
    background-color: #dc3545;
}

.badge.bg-warning {
    background-color: #ffc107;
    color: #000;
}

.badge.bg-info {
    background-color: #0dcaf0;
    color: #000;
}

.badge.bg-light {
    background-color: #f8f9fa;
    color: #000;
}

.badge.bg-dark {
    background-color: #212529;
}

/* Position Utilities */
.badge-positioned {
    position: absolute;
}

.badge-top-right {
    top: -0.5em;
    right: -0.5em;
}

.badge-top-left {
    top: -0.5em;
    left: -0.5em;
}

/* Button Integration */
.btn .badge {
    position: relative;
    margin-left: 0.5em;
}