/* ========================================
   BADGES & PILLS
   ======================================== */

.badge {
	font-weight: 500 !important;
	font-size: 0.75rem !important;
	padding: 0.35rem 0.65rem !important;
	border-radius: var(--radius-sm) !important;
	letter-spacing: 0.02em;
}

.badge.bg-info {
	background: var(--bg-elevated) !important;
	color: var(--accent-secondary) !important;
	border: 1px solid var(--accent-secondary);
}

.badge.bg-success {
	background: rgba(0, 255, 136, 0.15) !important;
	color: var(--accent-primary) !important;
	border: 1px solid var(--accent-primary);
}

.badge.bg-secondary {
	background: var(--bg-elevated) !important;
	color: var(--text-secondary) !important;
	border: 1px solid var(--border-light);
}

.badge.bg-warning {
	background: rgba(255, 170, 0, 0.15) !important;
	color: var(--accent-warning) !important;
}

.badge.bg-danger {
	background: rgba(255, 71, 87, 0.15) !important;
	color: var(--accent-danger) !important;
}

/* Subtle badge for small metadata (assignment counts) */
.badge-soft {
	background: var(--bg-tertiary) !important;
	color: var(--text-secondary) !important;
	border: 1px solid var(--border-light) !important;
	opacity: 0.9;
}

/* ========================================
   ROLE BADGE COLORS
   ======================================== */

/* Role badge colors based on fill state */
.role-badge-empty {
	background: rgba(239, 68, 68, 0.2) !important;
	color: #ef4444 !important;
	border: 1px solid rgba(239, 68, 68, 0.4);
}

.role-badge-partial {
	background: rgba(251, 191, 36, 0.2) !important;
	color: #fbbf24 !important;
	border: 1px solid rgba(251, 191, 36, 0.4);
}

.role-badge-full {
	background: rgba(34, 197, 94, 0.2) !important;
	color: #22c55e !important;
	border: 1px solid rgba(34, 197, 94, 0.4);
}

.role-badge-user {
	background: rgba(0, 255, 136, 0.25) !important;
	color: #00ff88 !important;
	border: 1px solid rgba(0, 255, 136, 0.5);
	font-weight: 600;
}

/* Venue role special colors with fill states */
.role-badge-venue,
.role-badge-venue-partial {
	background: rgba(232, 121, 249, 0.2) !important;
	color: #e879f9 !important;
	border: 1px solid rgba(232, 121, 249, 0.5) !important;
}

.role-badge-venue-empty {
	background: rgba(168, 85, 247, 0.15) !important;
	color: #a855f7 !important;
	border: 1px solid rgba(168, 85, 247, 0.4) !important;
}

.role-badge-venue-full {
	background: rgba(192, 132, 252, 0.25) !important;
	color: #c084fc !important;
	border: 1px solid rgba(192, 132, 252, 0.6) !important;
	font-weight: 600;
}

.badge-venue {
	background: rgba(232, 121, 249, 0.2) !important;
	color: #e879f9 !important;
	border: 1px solid rgba(232, 121, 249, 0.4);
}

.user-role-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.5rem 0.75rem;
	background: rgba(0, 255, 136, 0.1);
	border: 1px solid var(--accent-primary);
	border-radius: var(--radius-sm);
	color: var(--accent-primary);
	font-size: 0.85rem;
}

.user-role-badge strong {
	color: var(--accent-primary);
}