/*
 * Ekran türüne göre otomatik arayüz ölçeği (ui-scale).
 *
 * Amaç: Kullanıcıların laptopta ~%80, 24-27" FHD ekranda ~%90 tarayıcı
 * zoom'u yaparak elde ettiği görünümü kodda otomatik sağlamak.
 *
 * Tek ayar noktası --uiz değişkenidir; kademeleri değiştirmek için sadece
 * bu dosyayı düzenleyip sayfalardaki ?v= sürümünü yükseltmek yeterlidir.
 *
 * Kademeler (viewport genişliğine göre):
 *   < 1280px          → 1.00 (tablet/mobil: responsive tasarım zaten uygun)
 *   1280 - 1599.98px  → 0.80 (tipik laptop: 1366 / 1440 / 1536)
 *   1600 - 1999.98px  → 0.90 (1680 / 1920, 24-27" FHD)
 *   >= 2000px         → 1.00 (QHD/4K: alan zaten geniş)
 */
:root { --uiz: 1; }

@media (min-width: 1280px) and (max-width: 1599.98px) {
  :root { --uiz: 0.8; }
}

@media (min-width: 1600px) and (max-width: 1999.98px) {
  :root { --uiz: 0.9; }
}

html { zoom: var(--uiz); }

/*
 * CSS zoom, vh/dvh birimlerini ölçeklemez: 100vh'lik bir kabuk zoom 0.8'de
 * ekranın yalnızca %80'ini kaplar. Tam yükseklik kaplaması gereken kabuk
 * öğelerini zoom oranına bölerek telafi ediyoruz. max-height türü modal
 * sınırları (calc(100vh - Xpx) vb.) telafi gerektirmez; sadece biraz daha
 * kompakt olurlar ve içerikleri zaten kayar.
 */
@media (min-width: 1280px) and (max-width: 1999.98px) {
  .min-h-screen,
  .signin-container,
  .signup-container,
  .reset-container,
  .osy-page {
    min-height: calc(100vh / var(--uiz));
  }

  .max-h-screen {
    max-height: calc(100vh / var(--uiz));
  }

  /* new-sidebar.css'teki height: calc(100dvh - (--ns-inset * 2)) kuralının
     zoom'a göre düzeltilmiş hali (admin + okul sidebar'ları aynı sınıfı kullanır).
     DİKKAT: new-sidebar.css sayfaya JS ile SONRADAN eklenir (load-new-sidebar.js),
     bu yüzden yükleme sırasından bağımsız kazanması için seçici aside.new-sidebar
     (daha yüksek özgüllük) olmalı. */
  aside.new-sidebar {
    height: calc((100dvh / var(--uiz)) - (var(--ns-inset) * 2));
  }

  /*
   * MUI portalları (React modüllerindeki menü/popover/tooltip/autocomplete):
   * Konumları JS ile getBoundingClientRect (görsel piksel) okunup px olarak
   * yazılır; zoom'lu ağacın içinde bu pikseller ikinci kez ölçeklenir ve
   * menü sola/yukarı kayar. Çözüm: portal kökünü ters zoom'la net 1'e getir
   * (konum pikselleri birebir uygulanır), içeriği tekrar --uiz ile küçült
   * (görsel tutarlılık). Dialog/Snackbar CSS ile konumlanır, dokunulmaz.
   */
  .MuiPopover-root,
  .MuiPopper-root,
  .MuiTooltip-popper,
  .MuiAutocomplete-popper,
  .MuiPickersPopper-root {
    zoom: calc(1 / var(--uiz));
  }
  .MuiPopover-root .MuiPaper-root > *,
  .MuiPopper-root > *,
  .MuiTooltip-popper > *,
  .MuiAutocomplete-popper > *,
  .MuiPickersPopper-root > * {
    zoom: var(--uiz);
  }
}
