<div class="chart-container">
  <div class="chart-header">
    <h3>{{ chartTitle }}</h3>
  </div>
  <div class="chart-wrapper">
    <div class="chart-content" [class.loading]="isLoading">
      <canvas 
        baseChart 
        [datasets]="chartData.datasets"
        [labels]="chartData.labels"
        [options]="donutChartOptions"
        [type]="donutChartType"
        (chartClick)="chartClicked($event)"
        (chartHover)="chartHovered($event)">
      </canvas>
      <div class="loading-overlay" *ngIf="isLoading">
        <div class="shimmer-donut"></div>
      </div>
    </div>
  </div>
</div>