/* Shared visual theme for Dashboard PMB - IAIN Curup.
   Categorical palette validated for CVD-safety via the dataviz skill's
   validate_palette.js (light mode, 8 slots, worst adjacent ΔE 24.2). */

:root {
    --pmb-blue:    #2a78d6;
    --pmb-aqua:    #1baf7a;
    --pmb-yellow:  #eda100;
    --pmb-green:   #008300;
    --pmb-violet:  #4a3aa7;
    --pmb-red:     #e34948;
    --pmb-magenta: #e87ba4;
    --pmb-orange:  #eb6834;

    --ink-primary:   #0b0b0b;
    --ink-secondary: #52514e;
    --ink-muted:     #898781;
    --page-plane:    #f7f8fa;
    --hairline:      rgba(11, 11, 11, 0.10);

    --brand: var(--pmb-green);
}

body {
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, "Segoe UI", sans-serif;
    background: var(--page-plane);
    color: var(--ink-primary);
}

.card-stat {
    border: none;
    border-radius: 14px;
    box-shadow: 0 2px 10px rgba(11, 11, 11, 0.06);
}

/* ===== Stat tile (replaces solid-color summary cards) ===== */
.stat-tile {
    background: #fff;
    border-radius: 14px;
    border: 1px solid var(--hairline);
    border-left: 4px solid var(--tile-color, var(--pmb-blue));
    padding: .9rem 1.1rem;
    display: flex;
    align-items: center;
    gap: .85rem;
    height: 100%;
}

.stat-tile .icon-badge {
    width: 42px;
    height: 42px;
    border-radius: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--tile-color, var(--pmb-blue)) 14%, white);
    color: var(--tile-color, var(--pmb-blue));
    font-size: 1.15rem;
    flex-shrink: 0;
}

.stat-tile .stat-label {
    color: var(--ink-muted);
    font-size: .74rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    font-weight: 600;
    margin-bottom: .1rem;
}

.stat-tile .stat-value {
    color: var(--ink-primary);
    font-weight: 700;
    font-size: 1.5rem;
    line-height: 1.2;
    margin: 0;
}

.stat-tile.stat-tile-compact {
    padding: .7rem .9rem;
}
.stat-tile.stat-tile-compact .icon-badge {
    width: 36px;
    height: 36px;
    font-size: 1rem;
}
.stat-tile.stat-tile-compact .stat-value {
    font-size: 1.25rem;
}

h4, h5, h6 {
    color: var(--ink-primary);
}

.text-muted {
    color: var(--ink-muted) !important;
}
