/* ==========================================================================
   cards.css — Cards, KPI stats, wells
   Existing pages use `.card.border-0.shadow-sm`; these rules give every
   instance a consistent bordered enterprise surface.
   ========================================================================== */

.card {
    background: var(--crm-surface);
    border: 1px solid var(--crm-border) !important;   /* wins over .border-0 */
    border-radius: var(--crm-radius);
    box-shadow: var(--crm-shadow-xs) !important;      /* flattens .shadow-sm */
}

.card-header {
    background: var(--crm-surface) !important;
    border-bottom: 1px solid var(--crm-border) !important;
    padding: 0.875rem 1.25rem;
}
.card-header h5, .card-header h6,
.card-header .h5, .card-header .h6 {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--crm-ink);
    margin-bottom: 0;
}

.card-body { padding: 1.25rem; }

.card-footer {
    background: var(--crm-surface-alt) !important;
    border-top: 1px solid var(--crm-border) !important;
}

/* Neutralise legacy gradient stat cards without touching their markup */
.bg-gradient-primary {
    background: var(--crm-surface) !important;
    color: var(--crm-text) !important;
}
.bg-gradient-primary .text-white-50 { color: var(--crm-text-muted) !important; }
.bg-gradient-primary h3, .bg-gradient-primary .h3 { color: var(--crm-ink) !important; }
.bg-gradient-primary.text-white { color: var(--crm-text) !important; }
.bg-gradient-primary .bg-white-20 {
    background: var(--crm-primary-soft) !important;
    color: var(--crm-primary) !important;
}

/* Light wells used inside dashboard cards (.p-3.rounded.bg-light) */
.card .bg-light {
    background: var(--crm-surface-alt) !important;
    border: 1px solid var(--crm-border);
    border-radius: var(--crm-radius-sm) !important;
}
.card .bg-light .h5 {
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.01em;
}

/* Bordered mini-stat tiles (.border.rounded.p-2) */
.card .border.rounded {
    border-color: var(--crm-border) !important;
    border-radius: var(--crm-radius-sm) !important;
}

/* Avatars used in tables/cards */
.avatar-sm, .avatar-xs {
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    background: var(--crm-primary-soft);
    color: var(--crm-primary);
}
.avatar-sm { width: 36px; height: 36px; font-size: 0.8125rem; }
.avatar-xs { width: 24px; height: 24px; font-size: 0.6875rem; }

/* Empty states rendered inside tables/cards */
.empty-state, td .py-5 {
    color: var(--crm-text-muted);
}
.empty-state i, td .py-5 i.fa-3x {
    font-size: 1.75rem !important;
    color: var(--crm-text-faint);
    background: var(--crm-surface-alt);
    border: 1px solid var(--crm-border);
    width: 56px;
    height: 56px;
    line-height: 54px;
    border-radius: 50%;
}