/* ==========================================================================
   components/badges.css
   Soft tinted status chips — 4px radius, no pills, color communicates state.
   Covers both Bootstrap solid badges and the -subtle variants that the
   lead lock poller renders from JavaScript.
   ========================================================================== */

.badge {
    font-size: 0.6875rem;
    font-weight: 500;
    letter-spacing: 0.01em;
    padding: 0.25em 0.5em;
    border-radius: 4px;
    line-height: 1.35;
    vertical-align: middle;
}

/* Solid → tinted remaps (keeps class names, changes rendering) */
.badge.bg-primary   { background: var(--crm-primary-soft) !important; color: var(--crm-primary) !important; border: 1px solid var(--crm-primary-border); }
.badge.bg-secondary { background: var(--crm-surface-alt) !important;  color: var(--crm-text-secondary) !important; border: 1px solid var(--crm-border); }
.badge.bg-success   { background: var(--crm-success-bg) !important;   color: var(--crm-success) !important; border: 1px solid var(--crm-success-border); }
.badge.bg-danger    { background: var(--crm-danger-bg) !important;    color: var(--crm-danger) !important; border: 1px solid var(--crm-danger-border); }
.badge.bg-info      { background: var(--crm-info-bg) !important;      color: var(--crm-info) !important; border: 1px solid var(--crm-info-border); }
.badge.bg-dark      { background: var(--crm-ink) !important;          color: #fff !important; }

.badge.bg-warning,
.badge.bg-warning.text-dark {
    background: var(--crm-warning-bg) !important;
    color: var(--crm-warning) !important;
    border: 1px solid var(--crm-warning-border);
}

/* Subtle variants (server + JS rendered lock badges) */
.badge.bg-primary-subtle   { background: var(--crm-primary-soft) !important; }
.badge.bg-secondary-subtle { background: var(--crm-surface-alt) !important; }
.badge.bg-success-subtle   { background: var(--crm-success-bg) !important; }
.badge.bg-danger-subtle    { background: var(--crm-danger-bg) !important; }
.badge.bg-warning-subtle   { background: var(--crm-warning-bg) !important; }
.badge.bg-info-subtle      { background: var(--crm-info-bg) !important; }

.badge.text-primary-emphasis   { color: var(--crm-primary) !important; }
.badge.text-secondary-emphasis { color: var(--crm-text-secondary) !important; }
.badge.text-success-emphasis   { color: var(--crm-success) !important; }
.badge.text-danger-emphasis    { color: var(--crm-danger) !important; }
.badge.text-warning-emphasis   { color: var(--crm-warning) !important; }
.badge.text-info-emphasis      { color: var(--crm-info) !important; }

/* Neutral light chips ("Owner: …", "via email", timestamps) */
.badge.bg-light {
    background: var(--crm-surface) !important;
    color: var(--crm-text-secondary) !important;
}
.badge.bg-light.text-muted { color: var(--crm-text-muted) !important; }
.badge.bg-light.text-dark  { color: var(--crm-text-secondary) !important; }

/* Generic border harmonisation on chips */
.badge.border { border-color: var(--crm-border) !important; }
.badge.bg-success-subtle.border { border-color: var(--crm-success-border) !important; }
.badge.bg-danger-subtle.border  { border-color: var(--crm-danger-border) !important; }
.badge.bg-warning-subtle.border { border-color: var(--crm-warning-border) !important; }
.badge.bg-primary-subtle.border { border-color: var(--crm-primary-border) !important; }

/* Kill legacy pill status badges */
.status-badge { border-radius: 4px !important; padding: 0.25em 0.5em !important; font-weight: 500; }

/* Count badges inside tabs/nav */
.nav .badge {
    font-size: 0.6563rem;
    background: var(--crm-surface-alt) !important;
    color: var(--crm-text-muted) !important;
    border: 1px solid var(--crm-border);
}