/* =========================================================================
   SAYFA: Rapor görünümü (#reportSection)
   Rapor başlığı, metrik kartları, grafikler ve yıllık tablo.
   Buradaki her kural #reportSection ile başlar.
   ========================================================================= */

#reportSection h2 {
  letter-spacing: -0.03em;
}

/* Metrik kartları ve iç kartlar sırayla belirir */
#reportSection:not(.hidden) .section-card {
  animation: fadeSlideUp 0.6s var(--ease-out) backwards;
}
#reportSection:not(.hidden) .section-card:nth-child(2) { animation-delay: 70ms; }
#reportSection:not(.hidden) .section-card:nth-child(3) { animation-delay: 140ms; }
#reportSection:not(.hidden) .section-card:nth-child(4) { animation-delay: 210ms; }

/* İlerleme çubukları yumuşak dolsun */
#reportSection [id$="ProgressBar"] {
  transition: width 0.9s var(--ease-out);
}

/* Grafik kapsayıcıları taşmasın */
#reportSection canvas {
  max-width: 100% !important;
}

/* Tablolar: telefonda yatay kaydırılabilir, başlık sabit */
#reportSection table {
  font-variant-numeric: tabular-nums;
}

#reportSection thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background-color: var(--card);
}

@media (max-width: 767.98px) {
  /* Yıllık kayıt tablosu: sütunlar ezilmesin, tablo kendi içinde kaysın */
  #reportSection .overflow-x-auto > table {
    min-width: 680px;
  }
  #reportSection .overflow-x-auto > table th,
  #reportSection .overflow-x-auto > table td {
    white-space: nowrap;
  }
}

@media (max-width: 639.98px) {
  /* Aksiyon düğmeleri: iki sütunlu düzgün ızgara */
  #reportSection #reportBackBtn,
  #reportSection #downloadPdfBtn {
    flex: 1 1 calc(50% - 0.25rem);
  }
  #reportSection #printReportBtn,
  #reportSection #exportCsvBtn,
  #reportSection #copyJsonBtn {
    flex: 1 1 calc(33.333% - 0.35rem);
  }
  #reportSection .shadcn-card.p-6 {
    padding: 1.1rem;
  }
}

#reportSection button:not(:disabled):active {
  transform: scale(0.98);
}