/**
 * pages/dashboard.css
 */
.dashboard-body { background: var(--color-sky); }

.dashboard-main { display: grid; grid-template-columns: 280px 1fr; gap: var(--space-6); max-width: 1280px; margin: 0 auto; padding: var(--space-6); align-items: start; }

.dashboard-sidebar { position: sticky; top: var(--space-6); display: flex; flex-direction: column; gap: var(--space-5); }

.sidebar-progress-card__header { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--space-3); }
.sidebar-progress-card__eyebrow { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: var(--tracking-wide); color: var(--color-muted); }
.sidebar-progress-card__pct { font-family: var(--font-display); font-weight: 700; color: var(--color-primary); font-size: var(--text-lg); }
.sidebar-progress-card__stats { margin-top: var(--space-3); font-size: var(--text-xs); color: var(--color-muted); }

.sidebar-nav { display: flex; flex-direction: column; gap: 4px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-2); }
.sidebar-nav__item { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: var(--radius-md); border: none; background: none; text-align: left; font-size: var(--text-sm); color: var(--color-muted); cursor: pointer; }
.sidebar-nav__item.is-active { background: var(--color-sky); color: var(--color-primary); font-weight: var(--weight-semibold); }
.sidebar-nav__item svg { flex-shrink: 0; }

.sidebar-support-link { display: flex; align-items: center; gap: 8px; font-size: var(--text-sm); color: var(--color-muted); text-decoration: none; padding: var(--space-3); }

.dashboard-content { min-width: 0; }

.dashboard-welcome { display: flex; justify-content: space-between; align-items: center; margin-bottom: var(--space-8); }
.dashboard-welcome__greeting { color: var(--color-muted); font-size: var(--text-sm); margin: 0; }
.dashboard-welcome__name { font-size: var(--text-2xl); margin: 4px 0; }
.dashboard-welcome__subtitle { color: var(--color-muted); font-size: var(--text-sm); margin: 0; }
.welcome-badge__ring { position: relative; }
.welcome-badge__pct { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: var(--text-sm); color: var(--color-primary); }

.dashboard-section[hidden] { display: none; }
.section-header { margin-bottom: var(--space-5); }
.section-title { font-size: var(--text-xl); margin-bottom: 4px; }
.section-subtitle { color: var(--color-muted); font-size: var(--text-sm); }

.modules-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--space-5); }
.module-card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-5); }
.module-card.is-done { border-color: var(--color-success); }
.module-card__eyebrow { font-size: var(--text-xs); color: var(--color-muted); text-transform: uppercase; letter-spacing: var(--tracking-wide); }

.evals-list, .materials-list { list-style: none; padding: 0; margin: 0; }
.material-list a { display: flex; align-items: center; gap: 8px; padding: 8px 0; text-decoration: none; color: var(--color-text); font-size: var(--text-sm); }
.material-list a:hover { color: var(--color-primary); }

@media (max-width: 900px) {
  .dashboard-main { grid-template-columns: 1fr; }
  .dashboard-sidebar { position: static; }
}
