<!-- Dashboard Summary Bar — Fleet-wide health at a glance -->
<section class="dashboard-summary" role="status" aria-label="Dashboard summary">

  <!-- System Health Indicator -->
  <div class="summary-item health-indicator"
       [class.healthy]="health().status === 'healthy'"
       [class.degraded]="isDegraded()"
       [class.down]="isDown()"
       [matTooltip]="statusLabel()"
       matTooltipPosition="below">
    <span class="connection-dot" [class.connected]="health().connected"></span>
    <span class="health-label">{{ statusLabel() }}</span>
  </div>

  <!-- Total Active Agents -->
  <div class="summary-item" matTooltip="Total active agents" matTooltipPosition="below">
    <mat-icon aria-hidden="true">smart_toy</mat-icon>
    <span class="metric-value">{{ summary().active }} / {{ summary().total }}</span>
    <span class="metric-label">Active</span>
  </div>

  <!-- Status Breakdown -->
  <div class="summary-item status-breakdown">
    <mat-chip-set aria-label="Agent status breakdown">
      <mat-chip
        class="status-chip chip-active"
        [class.has-count]="summary().active > 0"
        matTooltip="Active agents">
        <mat-icon matChipStart>check_circle</mat-icon>
        <span class="chip-count">{{ summary().active }}</span>
        <span class="chip-label">Active</span>
      </mat-chip>

      <mat-chip
        class="status-chip chip-idle"
        [class.has-count]="summary().idle > 0"
        matTooltip="Idle agents">
        <mat-icon matChipStart>pause_circle</mat-icon>
        <span class="chip-count">{{ summary().idle }}</span>
        <span class="chip-label">Idle</span>
      </mat-chip>

      <mat-chip
        class="status-chip chip-thinking"
        [class.has-count]="summary().thinking > 0"
        matTooltip="Thinking agents">
        <mat-icon matChipStart>psychology</mat-icon>
        <span class="chip-count">{{ summary().thinking }}</span>
        <span class="chip-label">Thinking</span>
      </mat-chip>

      <mat-chip
        class="status-chip chip-error"
        [class.has-count]="hasErrors()"
        matTooltip="Agents in error">
        <mat-icon matChipStart>error</mat-icon>
        <span class="chip-count">{{ summary().error }}</span>
        <span class="chip-label">Error</span>
      </mat-chip>
    </mat-chip-set>
  </div>

</section>