.tm-dashboard-ch-grid {
  margin: 14px 0 18px;
}

.tm-dashboard-ch-grid .ch-mount {
  min-width: 0;
}

.tm-dashboard-ch-grid .ch-panel {
  border-radius: 8px;
}

.tm-dashboard-ch-grid--live {
  grid-auto-flow: dense;
}

.tm-dashboard-ch-grid--live .ch-panel {
  min-height: 0;
}

.tm-dashboard-ch-grid--live .ch-panel.span-6 {
  grid-column: span 6;
}

.tm-dashboard-ch-grid--live .ch-panel.span-3 {
  grid-column: span 3;
}

.tm-dashboard-ch-grid--live .ch-mount {
  max-height: 300px;
}

.tm-dashboard-ch-grid .ch-seg button {
  cursor: default;
}

.tm-analytics-gauge-pair {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  align-items: start;
}

.tm-legacy-chart-fallback[hidden],
.tm-live-charts[hidden],
.overview-charts-row[hidden] {
  display: none !important;
}

/* ============================================================================
   PR-A 2026-06-11 — Layout stability reservations (perf program)
   Overview chart mount'ları TMCharts JS mount edene kadar (~cold load 3-4sn)
   boş div'ler; geç mount .tm-dashboard-ch-grid--overview'i 198px→730px
   patlatıyordu (runtime audit 2026-06-11: tek shift CLS 0.29, kaynak
   section.ch-panel.span-3/.span-4). Ölçülen nihai mount yükseklikleri yalnız
   :empty (henüz mount edilmemiş) durumda rezerve edilir — içerik gelince
   kural düşer, nihai layout her viewport'ta bugünkü ile birebir aynı kalır.
   Değerler TEST demo hesabında ölçüldü (@1600 / @1366 / @390, 2026-06-11). */
#tmOvPlatform:empty { min-height: 170px; }
#tmOvStatus:empty   { min-height: 168px; }
#tmOvWeek:empty     { min-height: 248px; }
#tmOvTop:empty      { min-height: 363px; }

@media (max-width: 1499px) {
  #tmOvWeek:empty { min-height: 198px; }
}

@media (max-width: 767px) {
  #tmOvPlatform:empty { min-height: 352px; }
  #tmOvStatus:empty   { min-height: 262px; }
  #tmOvWeek:empty     { min-height: 102px; }
}
/* === /PR-A reservations === */

/* ============================================================================
   2026-07-17 — Canlı (live) chart mount CLS rezervasyonu (loading polish)
   Canlı sayfa donut (#tmLivePlatformVanilla) + Top5 (#tmLiveTopProducts)
   mount edilene kadar 0px yükseklikli boş div'lerdi; SSR verisi varken bile
   TMCharts JS mount'u ilk paint'ten sonra çalışıp ~300px'e "pop" ediyordu
   (ölçülen runtime CLS ~0.048, kaynak bu iki mount + geç reveal). PR-A ile
   birebir aynı yaklaşım: yalnız :empty (henüz mount edilmemiş) durumda nihai
   mount yüksekliğini rezerve et — içerik gelince kural düşer, layout birebir
   aynı kalır (yeni CLS getirmez). Ölçüm: TEST demo (id=15), @1440, 300px.
   .ch-panel'in stretch/height:100% zinciri bu mount'u içerdiği için değer
   panelin nihai satır yüksekliğiyle uyumludur.
   ÖZGÜLLÜK NOTU: live-dashboard.css'te
   `#tmLivePerformancePage .tm-dashboard-ch-grid--live > .ch-panel > .ch-mount
    { min-height: 0 }` (1,3,0) kuralı var; onu geçmek için rezervasyon
   `#tmLivePerformancePage #<id>` (2,1,0) ile scope'lanır. */
#tmLivePerformancePage #tmLivePlatformVanilla:empty,
#tmLivePerformancePage #tmLiveTopProducts:empty { min-height: 300px; }

@media (max-width: 1099px) {
  /* Tek kolona düşünce donut+legend dikeyde büyür; Top5 5 satır ~ aynı. */
  #tmLivePerformancePage #tmLivePlatformVanilla:empty,
  #tmLivePerformancePage #tmLiveTopProducts:empty { min-height: 264px; }
}

@media (max-width: 640px) {
  /* Donut mobilde dikey istif (donut-wrap column) → daha uzun; Top5 benzer. */
  #tmLivePerformancePage #tmLivePlatformVanilla:empty { min-height: 360px; }
  #tmLivePerformancePage #tmLiveTopProducts:empty { min-height: 300px; }
}
/* === /canlı mount reservations === */

@media (max-width: 640px) {
  .tm-dashboard-ch-grid {
    margin-top: 10px;
  }

  .tm-dashboard-ch-grid .ch-donut-wrap {
    align-items: stretch;
    flex-direction: column;
    gap: 14px;
  }

  .tm-dashboard-ch-grid .ch-donut {
    align-self: center;
  }

  .tm-dashboard-ch-grid .ch-legend li {
    grid-template-columns: 10px minmax(0, 1fr) auto;
    gap: 8px;
  }

  .tm-dashboard-ch-grid .ch-legend .nm {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .tm-dashboard-ch-grid .ch-legend .sh {
    display: none;
  }

  .tm-analytics-gauge-pair {
    grid-template-columns: 1fr;
  }
}
