/* ─── Dashboard (/dashboard) — owner: layout ───────────────────────────────────
   Loaded by the shell after app.css. Only theme variables. Prefix: .dash-   */

.dash { max-width: 960px; }

.dash-head { margin-bottom: var(--space-6); }
.dash-head__title { margin: 0 0 var(--space-1); overflow-wrap: anywhere; }
.dash-head__lead  { margin: 0; color: var(--color-text-muted); }

.dash-banner {
    display:     flex;
    flex-wrap:   wrap;
    align-items: center;
    gap:         var(--space-3) var(--space-4);
}
.dash-banner > .icon { flex: none; font-size: 22px; }
.dash-banner__text { flex: 1; min-width: 220px; }
.dash-banner__text strong { display: block; }

.dash-empty { margin-bottom: var(--space-8); }
.dash-empty .empty-state { padding: var(--space-10) var(--space-6); }

.dash-section-title {
    margin:         0 0 var(--space-3);
    color:          var(--color-text-muted);
    font-size:      var(--font-size-xs);
    font-weight:    var(--font-weight-semibold);
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

.dash-cards {
    display:               grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap:                   var(--space-4);
}
.dash-card {
    display:          flex;
    flex-direction:   column;
    gap:              var(--space-3);
    padding:          var(--space-5);
    border:           1px solid var(--color-border);
    border-radius:    var(--radius-lg);
    background-color: var(--color-bg-card);
    color:            var(--color-text);
    box-shadow:       var(--shadow-xs);
    transition:       border-color var(--transition), box-shadow var(--transition);
}
.dash-card:hover { border-color: var(--color-primary); color: var(--color-text); box-shadow: var(--shadow-md); }
.dash-card__icon {
    display:          grid;
    place-items:      center;
    width:            40px;
    height:           40px;
    border-radius:    var(--radius-md);
    background-color: var(--color-primary-lighter);
    color:            var(--color-primary);
    font-size:        22px;
}
.dash-card__body  { display: flex; flex-direction: column; gap: var(--space-1); flex: 1; }
.dash-card__title { font-weight: var(--font-weight-semibold); }
.dash-card__text  { color: var(--color-text-muted); font-size: var(--font-size-sm); line-height: 1.55; }
.dash-card__meta  { margin-top: var(--space-1); color: var(--color-text-light); font-size: var(--font-size-xs); font-weight: var(--font-weight-medium); }
.dash-card__meta--on { color: var(--color-primary); }
.dash-card__action {
    display:     inline-flex;
    align-items: center;
    gap:         var(--space-1);
    color:       var(--color-primary);
    font-size:   var(--font-size-sm);
    font-weight: var(--font-weight-medium);
}
.dash-card__action .icon { transition: transform var(--transition); }
.dash-card:hover .dash-card__action .icon { transform: translateX(3px); }

@media (prefers-reduced-motion: reduce) {
    .dash-card, .dash-card__action .icon { transition: none; }
    .dash-card:hover .dash-card__action .icon { transform: none; }
}
