.dashboard-kpi-card {
    padding: 1rem 1.1rem;
    border-radius: var(--sp-radius-lg);
    height: 100%;
    background-color: var(--sp-surface);
    border: 1px solid var(--sp-border);
    border-left: 4px solid var(--sp-border-strong);
    box-shadow: var(--sp-shadow-sm);
}

    .dashboard-kpi-card .mud-typography-caption {
        color: var(--sp-muted);
        text-transform: uppercase;
        letter-spacing: .04em;
        font-size: .7rem;
        font-weight: 600;
    }

/* Semantic left-border accents so each KPI reads at a glance */
.dashboard-kpi-card--brand { border-left-color: var(--sp-brand-1); }
.dashboard-kpi-card--gold { border-left-color: var(--sp-brand-2); }
.dashboard-kpi-card--success { border-left-color: var(--sp-success); }
.dashboard-kpi-card--warning { border-left-color: var(--sp-warning); }
.dashboard-kpi-card--info { border-left-color: #2f80ed; }
.dashboard-kpi-card--error { border-left-color: var(--sp-error); }

.dashboard-kpi-card--clickable {
    cursor: pointer;
    transition: box-shadow .15s ease, transform .15s ease;
}

    .dashboard-kpi-card--clickable:hover {
        box-shadow: var(--sp-shadow-md);
        transform: translateY(-2px);
    }

.dashboard-panel {
    padding: 1.25rem;
    border-radius: var(--sp-radius-lg);
    background-color: var(--sp-surface);
    border: 1px solid var(--sp-border);
    box-shadow: var(--sp-shadow-sm);
    height: 100%;
}

.dashboard-empty {
    opacity: 0.7;
    padding: 2rem 0;
    text-align: center;
}

.dashboard-table {
    margin-top: 0.5rem;
}

.dashboard-clickable-row {
    cursor: pointer;
}

    .dashboard-clickable-row:hover td {
        background-color: var(--sp-hover-soft);
    }

.dashboard-row-error td {
    border-left: 4px solid var(--mud-palette-error);
}

.dashboard-row-warning td {
    border-left: 4px solid var(--mud-palette-warning);
}

.dashboard-truncate {
    max-width: 320px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}