/* ════════════════════════════════════════════════════════════════════════
   zDash_demo.css — a ONE-OFF CRM-flavoured shell (opt in: zBrush [page, leaf, demo.zDash_demo]).
   Proof for the Dashboards leaf's "Lever 2" lesson: hand the zDash a _zClass
   and restyle the RAIL + FRAME only — the panels inside are untouched, which
   is exactly the point of the two-lever split. Deliberately branded — indigo
   rail, pill items, accent bar on the active tab — so it reads as clearly
   NOT the default shell.
   ════════════════════════════════════════════════════════════════════════ */
/* _zClass lands on the .zDash-container itself, so every rule scopes under
   .demo-shell and targets the canonical .zDash-* parts — never the panel
   content. currentColor-friendly like the defaults. */

.demo-shell.zDash-container {
    border:        1px solid rgba(129, 140, 248, 0.45);
    border-radius: 14px;
    overflow:      hidden;
    box-shadow:    0 8px 28px rgba(99, 102, 241, 0.15);
}
.demo-shell .zDash-sidebar {
    background:  linear-gradient(180deg, rgba(99, 102, 241, 0.18), rgba(30, 27, 75, 0.35));
    padding:     0.9rem 0.6rem;
    min-width:   170px;
}
.demo-shell .zDash-sidebar .zNav-link {
    border-radius: 999px;
    margin-bottom: 0.35rem;
    font-weight:   600;
    letter-spacing: 0.02em;
}
.demo-shell .zDash-sidebar .zNav-link.zActive {
    background: #818cf8;
    color:      #1e1b4b;
    box-shadow: 0 0 12px rgba(129, 140, 248, 0.6);
}