/* ===========================================
   DASHBOARD
=========================================== */

.dashboard{

display:flex;

flex-direction:column;

gap:28px;

}

/* KPI GRID */

.kpi-grid{

display:grid;

grid-template-columns:repeat(4,1fr);

gap:22px;

}

/* KPI CARD */

.kpi-card{

background:var(--card);

border:1px solid var(--border);

border-radius:18px;

padding:24px;

transition:.25s;

cursor:pointer;

box-shadow:var(--shadow);

}

.kpi-card:hover{

transform:translateY(-6px);

background:var(--card-hover);

}

.kpi-top{

display:flex;

justify-content:space-between;

align-items:center;

margin-bottom:18px;

}

.kpi-top span{

font-size:42px;

color:var(--primary);

}

.kpi-title{

font-size:14px;

color:var(--text-light);

margin-bottom:8px;

}

.kpi-number{

font-size:38px;

font-weight:700;

}

.kpi-change{

margin-top:15px;

display:inline-block;

padding:6px 12px;

background:rgba(34,197,94,.15);

color:var(--success);

border-radius:999px;

font-size:13px;

}

/* SECOND ROW */

.dashboard-grid{

display:grid;

grid-template-columns:2fr 1fr;

gap:24px;

}

/* PANEL */

.panel{

background:var(--card);

border-radius:18px;

border:1px solid var(--border);

padding:24px;

box-shadow:var(--shadow);

}

.panel h3{

font-size:20px;

margin-bottom:20px;

}

/* RECENT CASE */

.case{

display:flex;

justify-content:space-between;

align-items:center;

padding:18px 0;

border-bottom:1px solid var(--border);

}

.case:last-child{

border:none;

}

.case-title{

font-weight:600;

margin-bottom:4px;

}

.case small{

color:var(--text-light);

}

.badge{

padding:6px 12px;

border-radius:999px;

font-size:12px;

font-weight:600;

}

.badge.received{

background:#1E40AF;

color:white;

}

.badge.review{

background:#F59E0B;

color:#111827;

}

.badge.investigating{

background:#EA580C;

color:white;

}

.badge.closed{

background:#16A34A;

color:white;

}

/* ACTIVITY */

.activity{

display:flex;

gap:15px;

margin-bottom:18px;

}

.activity:last-child{

margin-bottom:0;

}

.activity-dot{

width:12px;

height:12px;

background:var(--primary);

border-radius:50%;

margin-top:6px;

}

.activity-content strong{

display:block;

margin-bottom:4px;

}

.activity-content span{

font-size:13px;

color:var(--text-light);

}
