/* Demo 5 — Mini dashboard mixing profile, stats, and a listing, showcased in its own board */

.l15-dash-card {
    background: #fff;
    border: 3px solid #000;
    box-shadow: 6px 6px 0 #000;
    width: 100%;
    max-width: 400px;
    padding: 24px;
    box-sizing: border-box;
}

.l15-dash-top { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }

.l15-avatar {
    width: 52px;
    height: 52px;
    border-radius: 50%;
    border: 2px solid #000;
    flex-shrink: 0;
    background: #0d2b52;
    color: #EFDC75;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 15px;
    object-fit: cover;
}

.l15-dash-name { font-size: 15px; font-weight: 700; }
.l15-dash-type { font-size: 11px; color: #666; margin-top: 2px; }

.l15-dash-stats { display: flex; justify-content: space-between; background: #000; color: #fff; padding: 12px 16px; margin-bottom: 18px; }
.l15-dash-stats div { display: flex; flex-direction: column; align-items: center; font-size: 9px; text-transform: uppercase; letter-spacing: 1px; opacity: 0.7; }
.l15-dash-stats span { font-size: 16px; font-weight: 900; color: #fff; opacity: 1; margin-bottom: 2px; letter-spacing: 0; text-transform: none; }

.l15-dash-listing { border: 2px solid #000; padding: 12px 16px; }
.l15-dash-listing + .l15-dash-listing { margin-top: 10px; }
.l15-dash-listing-top { display: flex; justify-content: space-between; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: #0d2b52; margin-bottom: 6px; }
.l15-dash-listing p { margin: 0; font-size: 13px; }

@media (max-width: 700px) {
    .l15-dash-card { width: 100%; max-width: 380px; }
}