/* UI stability round 3 — overlay dedupe + chart polish + spacing.
   2026-06-05: tm-loader-unify.js zaten #globalLoadingOverlay'e bridge
   ediyor. Sayfa-spesifik dashboard-loading-overlay kalıntı — kullanıcıya
   çift overlay flash veriyor. Buradan kalıcı gizliyoruz. JS API uyumlu
   kalır (TrendmetrikLoader.show/hide aktif). */

/* 1) Dashboard sayfa-özel overlay — global'e yönlendirildi, görünmez kalır. */
#dashboard-loading-overlay,
#dashboard-loading-overlay.show,
body.modal-open #dashboard-loading-overlay,
body.modal-open #dashboard-loading-overlay.show {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* 2) Chart container: smooth fade-in transition, render hazırken animasyon. */
.tm-chart-wrap,
.platform-dist-chart-wrap,
.tm-cost-breakdown__chart-wrap,
[id$="ChartContainer"] {
  transition: opacity 0.25s ease, transform 0.25s ease;
}
.tm-chart-wrap.is-loading,
.platform-dist-chart-wrap.is-loading,
.tm-cost-breakdown__chart-wrap.is-loading {
  opacity: 0;
}

/* 3) Chart canvas: ensure responsive height + crisp paint on retina. */
canvas[id$="Chart"],
canvas[id*="analytics"],
canvas[id*="platform"],
canvas[id*="status"] {
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
}

/* 4) Overview KPI hover micro-animasyon — kullanıcı kart aktif değil hissi. */
.overview-kpi-section .tm-kpi-card,
.overview-kpi-section [class*="kpi-card"] {
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.overview-kpi-section .tm-kpi-card:hover,
.overview-kpi-section [class*="kpi-card"]:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
}

/* 5) Donut/grafik kart spacing dengeleme — büyük boşluklar kaldırıldı. */
.overview-platform-dist,
.tm-cost-breakdown {
  padding: 1rem 1.1rem !important;
}
.platform-dist-body {
  padding-top: 0.4rem;
}

/* 6) Smooth tab switch — tab içeriği değiştirildiğinde ani sıçrama yerine
   kısa fade. */
.tab-content { transition: opacity 0.15s ease; }

/* 7) Chart legend hizalama — uzun label'lar wrap edebilsin, scroll değil. */
.platform-dist-legend,
.tm-cost-breakdown__grid {
  align-items: stretch;
}
.platform-dist-legend__row {
  min-height: 28px;
  padding: 4px 0;
}
