/* Sayfalar arası geçişler. Adları gecis.js yalnız gezinme sırasında verir; burada yalnız hareket var.
   Apple'ın zoom gezinmesi gibi: karttan kurs sayfasına görsel büyüyerek geçer, geri dönünce karta iner;
   üst çubuk yerinde kalır, menüdeki seçili hap bir sayfadan ötekine kayar.
   Yay kritik sönümlü (taşmaz, yaylanmaz). Çapraz belge View Transitions'ı desteklemeyen tarayıcıda sayfa düz açılır. */

@view-transition { navigation: auto; }

:root {
  /* kritik sönümlü yay (SwiftUI "smooth"), tepki .42 sn: ~620 ms'de yerleşir */
  --gecis-yay: linear(0, .023, .0791, .1536, .2367, .3215, .4039, .4811, .5519, .6156, .672, .7216, .7646, .8018, .8336, .8608, .8838, .9033, .9196, .9334, .9449, .9544, .9624, .969, .9745, .9791, .9828, .9859, .9885, .9906, .9923, .9937, .9949, .9958, .9966, .9972, .9977, .9982, .9985, .9988, 1);
  --gecis-sure: .62s;
  --gecis-cik: cubic-bezier(.4, 0, 1, 1);
  --gecis-gir: cubic-bezier(0, 0, .2, 1);
}

/* geçiş sürerken yeni sayfa tıklanabilir kalsın */
::view-transition { pointer-events: none; }
::view-transition-group(*) { animation-duration: var(--gecis-sure); animation-timing-function: var(--gecis-yay); }

/* süzgeçteki satır adları sayfa geçişinde yakalanmasın (ortak.js satırlara kalıcı ad veriyor) */
.vt-sayfa .liste li { view-transition-name: none !important; }

/* ---------- Kök ---------- */
/* İki sayfa aynı anda yarı saydam kalmasın (kâğıt aynı renk, metinler üst üste biner): eski önce söner, yeni ardından belirir.
   Uçan görsel ve başlık bu boşluğu taşır. */
/* yan: aynı derinlikte iki sayfa (Kurslar → Duyurular): sekme değişir gibi kısa */
::view-transition-old(root) { animation: vt-sol .14s var(--gecis-cik) both; }
::view-transition-new(root) { animation: vt-gel .24s .08s var(--gecis-gir) both; }
/* ileri: eski sayfa biraz geri çekilip söner, yenisi önünde belirir */
.vt-ileri::view-transition-old(root) { animation: vt-cekil .2s var(--gecis-cik) both; }
.vt-ileri::view-transition-new(root) { animation: vt-gel .3s .14s var(--gecis-gir) both; }
/* geri: ayrıntı söner, liste geri çekildiği yerden öne gelir */
.vt-geri::view-transition-old(root) { animation: vt-sol .16s var(--gecis-cik) both; }
.vt-geri::view-transition-new(root) { animation: vt-one .52s var(--gecis-yay) both, vt-gel .28s .08s var(--gecis-gir) both; }

@keyframes vt-sol { to { opacity: 0; } }
@keyframes vt-gel { from { opacity: 0; } }
@keyframes vt-cekil { to { opacity: 0; scale: .965; } }
@keyframes vt-one { from { scale: .965; } }

/* ---------- Görsel: kart ↔ kurs sayfası (aynı resim, köşeler de dönüşür) ---------- */
::view-transition-image-pair(vt-gorsel) {
  overflow: clip;
  border-radius: var(--vt-r1, 0);
  animation: vt-kose var(--gecis-sure) var(--gecis-yay) both;
}
@keyframes vt-kose { from { border-radius: var(--vt-r0, 0); } to { border-radius: var(--vt-r1, 0); } }
/* eşi olmayan görsel ve başlık kökle birlikte söner ya da belirir; uçuşa kalkmaz */
::view-transition-old(vt-gorsel):only-child, ::view-transition-old(vt-baslik):only-child { animation: vt-sol .16s var(--gecis-cik) both; }
::view-transition-new(vt-gorsel):only-child, ::view-transition-new(vt-baslik):only-child { animation: vt-gel .3s .14s var(--gecis-gir) both; }

/* masa nesnesi → kurs sayfası: görsel nesnenin kutusundan açılır (simgeden uygulama açılır gibi) */
.vt-firlat::view-transition-new(vt-gorsel) {
  transform-origin: 50% 50%;
  animation: vt-firlat var(--gecis-sure) var(--gecis-yay) both, vt-gel .2s var(--gecis-gir) both;
}
@keyframes vt-firlat {
  from { transform: translate(var(--vt-fx), var(--vt-fy)) scale(var(--vt-fs)); border-radius: var(--vt-fr); }
  to { border-radius: var(--vt-r1, 0); }
}
/* geri dönüşte nesneye iner */
.vt-firlat-geri::view-transition-old(vt-gorsel) {
  transform-origin: 50% 50%;
  animation: vt-don .52s var(--gecis-yay) both, vt-sol .2s .24s var(--gecis-cik) both;
}
@keyframes vt-don {
  from { border-radius: var(--vt-r0, 0); }
  to { transform: translate(var(--vt-fx), var(--vt-fy)) scale(var(--vt-fs)); border-radius: var(--vt-fr); }
}

/* ---------- Başlık: büyüyüp yerine oturur; küçük hâli çabuk söner ki bulanık görünmesin ---------- */
::view-transition-old(vt-baslik) { animation: vt-sol .16s var(--gecis-cik) both; }
::view-transition-new(vt-baslik) { animation: vt-gel .28s .04s var(--gecis-gir) both; }

/* ---------- Üst çubuk yerinde kalır; menüdeki hap kayar ---------- */
/* hap metnin altında kalsın: grupların sırası yakalama sırasıdır, hap üst çubuktan sonra gelir */
::view-transition-group(vt-menu-hap) { z-index: 0; }
::view-transition-group(vt-ust) { z-index: 1; animation-duration: .5s; }
::view-transition-old(vt-ust) { animation: vt-sol .2s var(--gecis-cik) both; }
::view-transition-new(vt-ust) { animation: vt-gel .2s var(--gecis-gir) both; }
/* iki ucu da varsa hap yolda damla gibi uzar, varınca toplanır (iOS 26 sekme çubuğu); eski ve yeni hap aynı, biri yeter */
::view-transition-old(vt-menu-hap):not(:only-child) { animation: none; opacity: 0; }
::view-transition-new(vt-menu-hap):not(:only-child) { animation: vt-hap-esne var(--gecis-sure) var(--gecis-gir) both; }
@keyframes vt-hap-esne { 35% { scale: 1.22 .86; } }
::view-transition-new(vt-menu-hap):only-child { animation: vt-hap-gel .36s var(--gecis-yay) both; }
::view-transition-old(vt-menu-hap):only-child { animation: vt-hap-git .2s var(--gecis-cik) both; }
@keyframes vt-hap-gel { from { opacity: 0; scale: .7; } }
@keyframes vt-hap-git { to { opacity: 0; scale: .7; } }

/* menüde bulunulan sayfanın hapı: geçişte bir bağlantıdan ötekine kayan parça (gecis.js ekler) */
.ust-menu a[aria-current="page"]:not(.dolu) { position: relative; isolation: isolate; }
.ust-menu a[aria-current="page"]:not(.dolu):hover { background: none; }
.menu-hap { position: absolute; inset: 0; z-index: -1; border-radius: 999px; background: rgba(52, 71, 80, .06); pointer-events: none; }

/* ---------- Hareketi azalt: yalnız kısa çözülme ---------- */
@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*) { animation-duration: 0s !important; }
  ::view-transition-old(*) { animation: vt-sol .16s linear both !important; }
  ::view-transition-new(*) { animation: vt-gel .18s linear both !important; }
}
