/* transitions.css — Puntom ekran/panel geçişleri: modern, kısa, göze çarpmayan yumuşak efektler.
   (1) EN-modu: içerik senkron çevrilene kadar cloak → yumuşak fade-in reveal (Türkçe/beyaz flaş YOK).
   (2) Modal/yüzen panel girişi: fade + hafif scale.
   prefers-reduced-motion: reduce → tüm hareket kapatılır (erişilebilirlik).
   NOT: cross-document View Transitions kaldırıldı — i18n cloak ile çakışıp beyaz-flaş + AbortError üretiyordu;
   senkron i18n-boot.js reveal'i + fade-in zaten temiz geçiş veriyor. */

/* ── (0) EN-modu FOUC önleme: içerik çeviri (i18n-boot.js, senkron) BİTENE kadar gizli, sonra yumuşak fade-in ──
   Cloak sırasında arka plan sayfanın KENDİ rengi (beyaz değil). Reveal: i18n-boot.js (parse biter bitmez, hızlı)
   sf-boot'u kaldırır → body 0→1. Güvenlik: head boot script 1sn'de otomatik kaldırır. TR modunda cloak YOK. */
html { background-color: #f9f9f8; }
html.dark { background-color: #121212; }
html.sf-boot body { opacity: 0; }

/* ── ÜST BAR sayfa geçişlerinde SABİT ── kitaplık/kılavuz `min-h-screen` ile dikey
   kayar (::-webkit-scrollbar 7px boşluk ayrılır); pano/biçimlendirici/şablonlar
   `h-screen overflow-hidden` ile kaymaz. Geçişte bu 7px belirir/kaybolur → ortalanmış
   üst bar sağa-sola sıçrar. Kaydırma boşluğunu HER sayfada kalıcı ayır (tüm 17 sayfa
   bu dosyayı yükler) → görünüm-alanı genişliği sabit → üst bar asla kaymaz. */
html { scrollbar-gutter: stable; }

/* ── (1) Sayfalar arası: cross-document View Transitions (Chrome) ──
   i18n-boot.js SENKRON çevirir + cloak'u snapshot'tan ÖNCE kaldırır → VT çevrilmiş sayfayı yakalar (Türkçe/beyaz flaş yok).
   Sidebar'a view-transition-name → app sekmeleri arası geçişte SİDEBAR KAYBOLMAZ (morph ile yerinde kalır),
   yalnız ana içerik crossfade olur. skipTransition YOK → AbortError yok. */
@view-transition { navigation: auto; }
#sf-sidebar { view-transition-name: sf-sidebar; }
/* Pazarlama üst barı geçişte SABİT kalır (morph): sekmeden sekmeye yalnız içerik değişir, bar akmaz. */
#site-nav { view-transition-name: sf-nav; }

@media (prefers-reduced-motion: no-preference) {
  body { transition: opacity .3s ease; } /* sf-boot kalkınca yumuşak fade-in (ilk yükleme) */
  /* Sayfalar arası: SAF hızlı crossfade. translateY/uzun süre YOK — sabit sidebar/nav yanında içerik
     kaydırmak app sekmelerinde "yavaş + kesik" his veriyordu; düz örtüşen solma en akıcısı. */
  ::view-transition-old(root) { animation: sfRootOut .14s ease both; }
  ::view-transition-new(root) { animation: sfRootIn .22s ease both; }
  @keyframes sfRootOut { to { opacity: 0; } }
  @keyframes sfRootIn { from { opacity: 0; } to { opacity: 1; } }

  /* ── (1) Modal / yüzen panel girişi (display:none→flex CSS animasyonunu yeniden başlatır) ── */
  @keyframes sfOverlayIn { from { opacity: 0; } to { opacity: 1; } }
  @keyframes sfPanelIn { from { opacity: 0; transform: translateY(8px) scale(.985); } to { opacity: 1; transform: none; } }
  #sf-overlay, #sf-ai-overlay, #sf-tpl-editor, #sf-paywall, #sf-auth { animation: sfOverlayIn .15s ease both; }
  #sf-panel, #sf-ai-panel,
  #sf-ai-overlay > div, #sf-tpl-editor > div, #sf-paywall > div, #sf-auth > div {
    animation: sfPanelIn .2s cubic-bezier(.16, .8, .3, 1) both;
  }
}