/* Badge Styles - Theme Aware & Reusable */

.badge {
    padding: 2px 10px;
    border-radius: 6px;
    font-weight: 500;
    font-size: 12px;
    display: inline-block;
    white-space: nowrap;
}

.text-nowrap {
    text-wrap-mode: nowrap;
}

.word-nowrap {
    white-space: normal;
    word-break: keep-all;
}

/* Light Theme Badges */
.badge-primary {
    background-color: rgba(48, 168, 167, 0.15);
    color: #30A8A7;
}

.badge-secondary {
    background-color: rgba(156, 163, 175, 0.15);
    color: #6B7280;
}

.badge-success {
    background-color: rgba(34, 197, 94, 0.15);
    color: #16A34A;
}

.badge-error {
    background-color: rgba(239, 68, 68, 0.15);
    color: #DC2626;
}

.badge-warning {
    background-color: rgba(251, 146, 60, 0.15);
    color: #F97316;
}

.badge-info {
    background-color: rgba(59, 130, 246, 0.15);
    color: #3B82F6;
}

/* Dark Theme Badges */
html.dark .badge-primary {
    background-color: rgba(48, 168, 167, 0.2);
    color: #5EEAD4;
}

html.dark .badge-secondary {
    background-color: rgba(156, 163, 175, 0.2);
    color: #D1D5DB;
}

html.dark .badge-success {
    background-color: rgba(34, 197, 94, 0.2);
    color: #4ADE80;
}

html.dark .badge-error {
    background-color: rgba(239, 68, 68, 0.2);
    color: #F87171;
}

html.dark .badge-warning {
    background-color: rgba(251, 146, 60, 0.2);
    color: #FB923C;
}

html.dark .badge-info {
    background-color: rgba(59, 130, 246, 0.2);
    color: #60A5FA;
}