/* SAHNE · BİREBİR DERS RANDEVUSU (includes/scenes/private-lesson.php) — adımlar:
   s1 Burak Yalçın seçilir → «2 Tarih ve saat seç» açılır, sayfa takvime kayar · s2 30 Ekim → saatler (16:40 dolu) ·
   s3 16:00 → «3 Ders detayları» + Özet, sayfa aşağı kayar · s4 «Soru Çözümü» + konu yazılır · s5 «HEMEN BAŞVUR» → sayfa yenilenir,
   «Başarılı» penceresi, sayaçlar 1/3 · 1/10 · s6 «Tamam» (pencere kapanır), öğretmenin telefonu: «Yeni ders planlandı»
   (dokunuşa kadar ekranda), Bekleyen 2 · s7 «Onayla» → «Güncelleniyor…» · s8 «Randevu güncellendi.» sekmelerin üstünde,
   Bekleyen 1 + öğrenciye ve veliye «Ders onaylandı» (sonuç).
   Sayfa kaydırması ölçülü: blok yükseklikleri sabit (--pvl-*), kaydırma miktarı o yüksekliklerden hesaplanmış px. */
.pvl { container-type: inline-size; --pvl-spring: cubic-bezier(.34, 1.56, .64, 1); --pvl-scroll: cubic-bezier(.32, .12, .2, 1);
  --pvl-z100: #f4f4f5; --pvl-z200: #e4e4e7; --pvl-z300: #d4d4d8; --pvl-z500: #71717a; --pvl-z700: #3f3f46;
  --pvl-b50: #eef3fa; --pvl-b100: #dfe8f4; --pvl-ring: rgba(29, 79, 134, .16); }
.pvl svg { display: block; }
.pvl-i { width: 14px; height: 14px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* ölçüler (geniş kap): sahne 452 · üst şerit 40 · görüntü alanı 412; açılan bölümler 266 / 242 (5 tür tek satır); kaydırma s1 253, s3 503 (kesim satır aralığına düşer) */
.pvl-st { position: relative; height: 452px;
  --pvl-top: 40px; --pvl-h2: 266px; --pvl-h3: 242px; --pvl-o1: 253px; --pvl-o3: 503px; --pvl-px: 16px; }

/* çapraz geçiş katmanları: lAB = A. adımdan B. adıma kadar görünür */
.pvl-x { display: inline-grid; min-width: 0; }
.pvl-x > * { grid-area: 1 / 1; min-width: 0; }
.pvl-l { opacity: 0; translate: 0 3px; transition: opacity .28s var(--ui-ease) var(--ld, 0s), translate .34s var(--ui-ease) var(--ld, 0s); }
.pvl:not(.s5) .l05, .pvl.s5 .l5, .pvl:not(.s8) .l07, .pvl.s8 .l8 { opacity: 1; translate: 0 0; }
.pvl.s5 .pvl-lim .pvl-l { --ld: .7s; }

/* imleç: .pvl-hit tıklama noktası */
.pvl-hit { position: absolute; z-index: 7; width: 0; height: 0; pointer-events: none; }
.pvl-hit .ui-cur { left: -5px; top: -3px; transform: translate(14px, 12px); transition: opacity .2s var(--ui-ease); }
.pvl-rip { position: absolute; left: -11px; top: -11px; width: 22px; height: 22px; border-radius: 50%; box-shadow: 0 0 0 2px rgba(29, 79, 134, .55); opacity: 0; }
@keyframes pvl-cur { 0% { opacity: 0; transform: translate(14px, 12px); } 34% { opacity: 1; transform: none; scale: 1; } 50% { scale: .8; } 64%, 100% { opacity: 1; transform: none; scale: 1; } }
@keyframes pvl-cur-out { 0% { opacity: 0; transform: translate(14px, 12px); } 30% { opacity: 1; transform: none; scale: 1; } 44% { scale: .8; } 56% { scale: 1; } 78% { opacity: 1; transform: none; } 100% { opacity: 0; transform: none; } }
@keyframes pvl-rip { 0% { opacity: 0; scale: .25; } 12% { opacity: .9; } 100% { opacity: 0; scale: 1.7; } }
@keyframes pvl-push { 50% { scale: .95; } }

/* ══ ÖĞRENCİ PENCERESİ ══ */
.pvl-win { position: absolute; inset: 0; display: flex; flex-direction: column; border-radius: 14px; transform-origin: 0 50%;
  transition: scale .7s var(--ui-ease), translate .7s var(--ui-ease), filter .5s var(--ui-ease); }
.pvl-top { flex: none; display: flex; align-items: center; gap: 12px; height: var(--pvl-top); padding: 0 14px; border-bottom: 1px solid var(--ui-line); background: #fff; }
.pvl-burger { display: none; color: #27272a; }
.pvl-burger .pvl-i { width: 17px; height: 17px; }
.pvl-crumb { flex: 1; min-width: 0; display: flex; align-items: center; font-size: 11.5px; font-weight: 600; color: var(--ui-muted); white-space: nowrap; }
.pvl-crumb i { font-style: normal; margin: 0 6px; color: #a1a1aa; }
.pvl-crumb b { font-weight: 800; color: #18181b; }
.pvl-bell { position: relative; flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; color: #3f3f46; }
.pvl-bell .pvl-i { width: 16px; height: 16px; }
.pvl-bell em { position: absolute; top: -2px; right: -4px; min-width: 17px; height: 15px; padding: 0 4px; border-radius: 999px; background: #dc2626; color: #fff; font-style: normal; font-size: 10px; font-weight: 800; line-height: 15px; text-align: center; box-shadow: 0 0 0 1.5px #fff; font-variant-numeric: tabular-nums; }
.pvl-me { flex: none; display: flex; align-items: center; gap: 7px; }
.pvl-av { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 8px; background: linear-gradient(135deg, var(--navy-soft), var(--navy)); color: #fff; font-size: 11.5px; font-weight: 800; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18); }
.pvl-me b { font-size: 11.5px; font-weight: 800; color: #18181b; white-space: nowrap; }

.pvl-vp { position: relative; flex: 1; min-height: 0; overflow: hidden; background: #fafafa; }
/* kaydırılmış sayfanın üst kenarı: ince solma (kesilen satır sert görünmesin) */
.pvl-vp::before { content: ""; position: absolute; z-index: 3; inset: 0 0 auto; height: 14px; background: linear-gradient(#fafafa, rgba(250, 250, 250, 0)); opacity: 0; transition: opacity .3s var(--ui-ease) .9s; pointer-events: none; }
.pvl.s1:not(.s5) .pvl-vp::before { opacity: 1; }
.pvl.s5 .pvl-vp::before { transition-delay: .5s; }
.pvl-pg { --y: 0px; padding: 12px var(--pvl-px) 12px; translate: 0 calc(-1 * var(--y)); transition: translate .75s var(--pvl-scroll) .55s; }
.pvl.s1 .pvl-pg { --y: var(--pvl-o1); }
.pvl.s3 .pvl-pg { --y: var(--pvl-o3); transition-delay: .6s; }
.pvl.s5 .pvl-pg { --y: 0px; transition: translate 0s .62s; animation: pvl-reload .9s ease .3s both; }
@keyframes pvl-reload { 0% { opacity: 1; } 30%, 58% { opacity: 0; } 100% { opacity: 1; } }

/* rozetler + başlık + sayaçlar */
.pvl-chips { display: flex; gap: 8px; height: 22px; margin-bottom: 10px; }
.pvl-chip { flex: none; display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 9px; border-radius: 999px; font-size: 10.5px; font-weight: 800; white-space: nowrap; }
.pvl-chip .pvl-i { width: 12px; height: 12px; }
.pvl-chip--b { background: var(--pvl-b50); color: var(--navy-soft); box-shadow: inset 0 0 0 1px #c9d7ea; }
.pvl-chip--g { background: #ecfdf5; color: #047857; box-shadow: inset 0 0 0 1px #a7f3d0; }
.pvl-hd { height: 52px; margin-bottom: 10px; }
.pvl-hd b { display: block; font-size: 18px; font-weight: 800; line-height: 22px; letter-spacing: -.02em; color: #18181b; }
.pvl-hd span { display: block; margin-top: 2px; font-size: 11px; font-weight: 600; line-height: 14px; color: #52525b; }
.pvl-lim { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; height: 46px; margin-bottom: 12px; }
.pvl-tile { display: block; padding: 7px 12px 0; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1px var(--pvl-z200), 0 1px 2px rgba(16, 37, 64, .04), inset 0 1px 0 rgba(255, 255, 255, .6); }
.pvl-tile small { display: block; font-size: 10px; font-weight: 800; line-height: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--pvl-z500); }
.pvl-tile__v { display: flex; align-items: baseline; gap: 4px; margin-top: 3px; font-size: 17px; font-weight: 900; line-height: 20px; letter-spacing: -.02em; color: #18181b; font-variant-numeric: tabular-nums; }
.pvl-tile__v em { font-style: normal; font-size: 11px; font-weight: 700; letter-spacing: 0; color: var(--pvl-z500); }

/* başvuru formu */
.pvl-form { padding: 14px; border-radius: 16px; background: #fff; box-shadow: inset 0 0 0 1px var(--pvl-z200), 0 1px 2px rgba(16, 37, 64, .05), 0 14px 30px -24px rgba(16, 37, 64, .45); }
.pvl-lg { display: flex; align-items: center; gap: 7px; height: 22px; margin-bottom: 8px; font-size: 12.5px; font-weight: 800; color: #18181b; white-space: nowrap; }
.pvl-lg i { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--navy); color: #fff; font-style: normal; font-size: 10.5px; font-weight: 900; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16); }
.pvl-lg small { margin-left: 4px; font-size: 10.5px; font-weight: 700; color: var(--pvl-z500); }

/* 1 · öğretmen kartları */
.pvl-tg { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: 44px; gap: 6px; }
.pvl-tc { position: relative; display: flex; align-items: center; gap: 9px; min-width: 0; padding: 0 10px 0 7px; border-radius: 12px; background: #fff;
  box-shadow: inset 0 0 0 1px var(--pvl-z200); transition: box-shadow .25s var(--ui-ease) .42s, background-color .25s var(--ui-ease) .42s; }
.pvl-tc__i { flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: var(--pvl-z100); color: var(--pvl-z700); }
.pvl-tc__i .pvl-i { width: 15px; height: 15px; stroke-width: 1.8; }
.pvl-tc__t { flex: 1; min-width: 0; line-height: 14px; }
.pvl-tc__t b { display: block; font-size: 12px; font-weight: 800; color: #18181b; white-space: nowrap; }
.pvl-tc__t small { display: block; font-size: 10.5px; font-weight: 700; color: var(--pvl-z500); white-space: nowrap; }
.pvl-tc__ok { flex: none; color: var(--navy-soft); opacity: 0; scale: .5; transition: opacity .2s var(--ui-ease) .45s, scale .4s var(--pvl-spring) .45s; }
.pvl-tc__ok .pvl-i { width: 15px; height: 15px; stroke-width: 2.6; }
.pvl.s1:not(.s5) .pvl-tc--bu { background: var(--pvl-b50); box-shadow: inset 0 0 0 1.5px var(--navy-soft), 0 0 0 3px var(--pvl-ring); }
.pvl.s1:not(.s5) .pvl-tc--bu .pvl-tc__ok { opacity: 1; scale: 1; }
.pvl.s5 .pvl-tc--bu, .pvl.s5 .pvl-tc__ok { transition-duration: 0s; transition-delay: .62s; }
.pvl-tc .pvl-hit { left: 52%; top: 26px; }
.pvl.s1:not(.s2) .pvl-hit--tc .ui-cur { animation: pvl-cur .9s var(--ui-ease) both; }
.pvl.s1:not(.s2) .pvl-hit--tc .pvl-rip { animation: pvl-rip .55s ease-out .4s both; }
.pvl.s1:not(.s2) .pvl-tc--bu { animation: pvl-push .3s var(--ui-ease) .36s; }

/* açılan bölümler (öğretmen / saat seçilince): yükseklik 0 → ölçülü değer, içerik solarak gelir */
.pvl-c { height: 0; overflow: hidden; transition: height .5s var(--ui-ease) .45s; }
.pvl-ci { padding-top: 18px; opacity: 0; translate: 0 8px; transition: opacity .35s var(--ui-ease) .6s, translate .45s var(--ui-ease) .6s; }
.pvl.s1:not(.s5) .pvl-c2 { height: var(--pvl-h2); }
.pvl.s3:not(.s5) .pvl-c3 { height: var(--pvl-h3); }
.pvl.s1:not(.s5) .pvl-c2 .pvl-ci, .pvl.s3:not(.s5) .pvl-c3 .pvl-ci { opacity: 1; translate: 0 0; }
.pvl.s3:not(.s5) .pvl-c3 .pvl-ci { transition-delay: .55s; }
.pvl.s5 .pvl-c, .pvl.s5 .pvl-ci { transition-duration: 0s; transition-delay: .62s; }

/* 2 · takvim + saat paneli */
.pvl-dt { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 12px; height: 218px; }
.pvl-mn { display: flex; align-items: center; justify-content: space-between; height: 28px; padding: 0 4px; border-radius: 9px; background: #fff; box-shadow: inset 0 0 0 1px var(--pvl-z200); }
.pvl-mn b { font-size: 12px; font-weight: 800; letter-spacing: -.01em; color: #18181b; }
.pvl-mn__b { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 6px; color: #3f3f46; }
.pvl-mn__b.is-off { opacity: .3; }
.pvl-wd { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; height: 14px; margin: 6px 0 4px; font-size: 10px; font-weight: 800; line-height: 14px; letter-spacing: .04em; text-align: center; text-transform: uppercase; color: var(--pvl-z500); }
.pvl-wd .we { color: #e5536b; }
.pvl-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); grid-auto-rows: 30px; gap: 4px; }
.pvl-d { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; min-width: 0; border-radius: 7px; transition: box-shadow .25s var(--ui-ease) .4s, background-color .25s var(--ui-ease) .4s; }
.pvl-d b { font-size: 12px; font-weight: 800; line-height: 13px; color: #18181b; font-variant-numeric: tabular-nums; transition: color .25s var(--ui-ease) .4s; }
.pvl-d small { font-size: 10px; font-weight: 700; line-height: 11px; letter-spacing: -.02em; white-space: nowrap; }
.pvl-d small:empty { display: none; }
.pvl-d--p, .pvl-d--k { background: #f7f7f8; }
.pvl-d--p b { color: #c9c9cf; }
.pvl-d--k small { color: var(--pvl-z500); }
.pvl-d--h { background: #fffbeb; box-shadow: inset 0 0 0 1px #fde68a; }
.pvl-d--h small { color: #b45309; }
.pvl-d--o { background: #fff; box-shadow: inset 0 0 0 1px var(--pvl-z200); }
.pvl-d--o small { color: #059669; }
.pvl-d--now::after { content: ""; position: absolute; top: 4px; right: 4px; width: 5px; height: 5px; border-radius: 50%; background: var(--navy-soft); }
.pvl.s2:not(.s5) .pvl-d--o { background: var(--pvl-b50); box-shadow: inset 0 0 0 1.5px var(--navy-soft), 0 0 0 3px var(--pvl-ring); }
.pvl.s2:not(.s5) .pvl-d--o b { color: var(--navy-soft); }
.pvl-d .pvl-hit { left: 62%; top: 62%; }
.pvl.s2:not(.s3) .pvl-hit--day .ui-cur { animation: pvl-cur .85s var(--ui-ease) both; }
.pvl.s2:not(.s3) .pvl-hit--day .pvl-rip { animation: pvl-rip .55s ease-out .38s both; }

.pvl-sp { display: grid; padding: 12px; border-radius: 12px; background: #fcfcfd; box-shadow: inset 0 0 0 1px var(--pvl-z200); }
.pvl-sp > * { grid-area: 1 / 1; min-width: 0; transition: opacity .3s var(--ui-ease) .5s, translate .4s var(--ui-ease) .5s; }
.pvl-sp__e { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.pvl-sp__ic { display: grid; place-items: center; width: 34px; height: 34px; margin-bottom: 8px; border-radius: 11px; background: #fff; color: var(--pvl-z500); box-shadow: 0 1px 2px rgba(16, 37, 64, .08), 0 0 0 1px rgba(16, 37, 64, .04); }
.pvl-sp__ic .pvl-i { width: 16px; height: 16px; }
.pvl-sp__e b { font-size: 11.5px; font-weight: 800; color: #3f3f46; }
.pvl-sp__e small { margin-top: 2px; font-size: 10px; font-weight: 700; line-height: 13px; color: var(--pvl-z500); }
.pvl-sp__p { opacity: 0; translate: 0 6px; }
.pvl.s2:not(.s5) .pvl-sp__e { opacity: 0; transition-delay: .4s; }
.pvl.s2:not(.s5) .pvl-sp__p { opacity: 1; translate: 0 0; }
.pvl-sp__h { display: flex; align-items: baseline; justify-content: space-between; gap: 6px; height: 16px; margin-bottom: 10px; }
.pvl-sp__h b { font-size: 12px; font-weight: 800; letter-spacing: -.01em; color: #18181b; white-space: nowrap; }
.pvl-sp__h small { font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; color: var(--pvl-z500); }
.pvl-sl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.pvl-s { position: relative; display: grid; place-items: center; height: 30px; border-radius: 8px; background: #fff; font-size: 11.5px; font-weight: 800; color: #18181b; font-variant-numeric: tabular-nums;
  box-shadow: inset 0 0 0 1.5px var(--pvl-z200); opacity: 0; translate: 0 5px; transition: opacity .3s var(--ui-ease), translate .4s var(--ui-ease), background-color .2s var(--ui-ease) .42s, color .2s var(--ui-ease) .42s, box-shadow .2s var(--ui-ease) .42s; }
.pvl-s:nth-child(2) { transition-delay: 60ms, 60ms, .42s, .42s, .42s; }
.pvl-s:nth-child(3) { transition-delay: 120ms, 120ms, .42s, .42s, .42s; }
.pvl.s2:not(.s5) .pvl-s { opacity: 1; translate: 0 0; }
.pvl.s2:not(.s5) .pvl-s:nth-child(1) { transition-delay: .62s, .62s, .42s, .42s, .42s; }
.pvl.s2:not(.s5) .pvl-s:nth-child(2) { transition-delay: .68s, .68s, .42s, .42s, .42s; }
.pvl.s2:not(.s5) .pvl-s:nth-child(3) { transition-delay: .74s, .74s, .42s, .42s, .42s; }
.pvl-s--t { background: var(--pvl-z100); color: var(--pvl-z500); text-decoration: line-through; text-decoration-thickness: 1.5px; }
.pvl.s3:not(.s5) .pvl-s--a { background: var(--navy-soft); color: #fff; box-shadow: inset 0 0 0 1.5px var(--navy-soft), 0 4px 10px -5px rgba(20, 61, 107, .7); }
.pvl-s .pvl-hit { left: 58%; top: 62%; }
.pvl.s3:not(.s4) .pvl-hit--slot .ui-cur { animation: pvl-cur-out 1.1s var(--ui-ease) both; }
.pvl.s3:not(.s4) .pvl-hit--slot .pvl-rip { animation: pvl-rip .55s ease-out .38s both; }
.pvl-key { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 10px; font-size: 10px; font-weight: 700; color: var(--pvl-z500); }
.pvl-key span { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.pvl-key i { width: 9px; height: 9px; border-radius: 3px; background: #fff; box-shadow: inset 0 0 0 1.5px var(--pvl-z200); }
.pvl-key i.s { background: var(--navy-soft); box-shadow: none; }
.pvl-key i.t { background: var(--pvl-z100); }

/* 3 · ders detayları */
.pvl-lbl { height: 14px; margin-bottom: 5px; font-size: 10px; font-weight: 800; line-height: 14px; letter-spacing: .06em; text-transform: uppercase; color: #52525b; white-space: nowrap; }
.pvl-lbl small { font-size: 10px; font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--pvl-z500); }
.pvl-ty { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); grid-auto-rows: 50px; gap: 6px; margin-bottom: 10px; }
.pvl-to { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; min-width: 0; border-radius: 12px; background: #fff;
  box-shadow: inset 0 0 0 1px var(--pvl-z200); color: var(--pvl-z500); transition: box-shadow .22s var(--ui-ease) .42s, background-color .22s var(--ui-ease) .42s, color .22s var(--ui-ease) .42s; }
.pvl-to .pvl-i { width: 16px; height: 16px; }
.pvl-to b { font-size: 10.5px; font-weight: 800; color: #27272a; white-space: nowrap; }
.pvl.s3:not(.s4) .pvl-to--ka, .pvl.s4:not(.s5) .pvl-to--sc { background: var(--pvl-b50); box-shadow: inset 0 0 0 1.5px var(--navy-soft); color: var(--navy-soft); }
.pvl-to .pvl-hit { left: 56%; top: 62%; }
.pvl.s4:not(.s5) .pvl-hit--ty .ui-cur { animation: pvl-cur-out 1.15s var(--ui-ease) both; }
.pvl.s4:not(.s5) .pvl-hit--ty .pvl-rip { animation: pvl-rip .55s ease-out .38s both; }
.pvl-ta { position: relative; display: flex; align-items: flex-start; height: 40px; margin-bottom: 12px; padding: 8px 10px; border-radius: 12px; background: #fff; font-size: 11.5px; font-weight: 700; line-height: 16px;
  box-shadow: inset 0 0 0 1.5px var(--pvl-z300); transition: box-shadow .25s var(--ui-ease) .7s; }
.pvl-ta__ph { position: absolute; left: 10px; top: 8px; color: var(--pvl-z500); white-space: nowrap; transition: opacity .15s linear .72s; }
.pvl-ta__v { display: inline-block; max-width: 0; overflow: hidden; white-space: nowrap; color: #18181b; transition: max-width .8s steps(18, end) .78s; }
.pvl-caret { flex: none; width: 1.5px; height: 15px; margin: 1px 0 0 1px; border-radius: 1px; background: var(--navy-soft); opacity: 0; }
.pvl.s4:not(.s5) .pvl-ta { box-shadow: inset 0 0 0 1.5px var(--navy-soft), 0 0 0 3px var(--pvl-ring); }
.pvl.s4:not(.s5) .pvl-ta__ph { opacity: 0; }
.pvl.s4:not(.s5) .pvl-ta__v { max-width: 12em; }
.pvl.s4:not(.s5) .pvl-caret { animation: pvl-blink 1s steps(1) .72s infinite; }
@keyframes pvl-blink { 0% { opacity: 1; } 50% { opacity: 0; } }
.pvl-sum { height: 44px; padding: 7px 12px 0; border-radius: 12px; background: linear-gradient(90deg, var(--pvl-b50), #f6f8fc); box-shadow: inset 0 0 0 1px #c9d7ea; }
.pvl-sum small { display: block; font-size: 10px; font-weight: 800; line-height: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--navy-soft); }
.pvl-sum span { display: block; margin-top: 3px; font-size: 11.5px; font-weight: 700; line-height: 15px; color: #1e3352; font-variant-numeric: tabular-nums; }
.pvl-sum b { font-weight: 900; color: #0f2a4a; }

/* alt düğmeler */
.pvl-ft { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 18px; padding-top: 10px; border-top: 1px solid #f1f1f3; }
.pvl-cancel, .pvl-go { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 6px; height: 32px; padding: 0 14px; border-radius: 10px; font-size: 11.5px; font-weight: 800; white-space: nowrap; }
.pvl-cancel { background: #fff; color: #3f3f46; box-shadow: inset 0 0 0 1.5px var(--pvl-z200); }
.pvl-go { color: #fff; background: var(--navy-soft); letter-spacing: .01em; opacity: .5; box-shadow: 0 3px 0 0 var(--navy-night), inset 0 1px 0 rgba(255, 255, 255, .16); transition: opacity .25s var(--ui-ease) .62s; }
.pvl-go .pvl-i { width: 13px; height: 13px; }
.pvl.s3:not(.s5) .pvl-go { opacity: 1; }
.pvl.s5 .pvl-go { transition-delay: .62s; transition-duration: 0s; }
.pvl-go .pvl-hit { left: 62%; top: 20px; }
.pvl.s5:not(.s6) .pvl-hit--go .ui-cur { animation: pvl-cur-out .95s var(--ui-ease) both; }
.pvl.s5:not(.s6) .pvl-hit--go .pvl-rip { animation: pvl-rip .55s ease-out .32s both; }
.pvl.s5:not(.s6) .pvl-go { animation: pvl-go .3s var(--ui-ease) .3s; }
@keyframes pvl-go { 50% { translate: 0 2px; box-shadow: 0 1px 0 0 var(--navy-night), inset 0 1px 0 rgba(255, 255, 255, .16); } }

/* «Başarılı» penceresi (SweetAlert) */
.pvl-dim { position: absolute; inset: 0; z-index: 4; border-radius: inherit; background: rgba(9, 12, 20, .42); opacity: 0; transition: opacity .3s var(--ui-ease) .85s; }
.pvl-swal { position: absolute; z-index: 5; left: 50%; top: 50%; display: flex; flex-direction: column; align-items: center; width: 252px; margin: -92px 0 0 -126px; padding: 18px 18px 16px; border-radius: 14px; background: #fff; text-align: center;
  box-shadow: 0 0 0 1px rgba(16, 37, 64, .06), 0 2px 4px rgba(0, 0, 0, .06), 0 24px 48px -18px rgba(0, 0, 0, .55); opacity: 0; scale: .7; transition: opacity .2s var(--ui-ease) .85s, scale .45s var(--pvl-spring) .85s; }
.pvl-swal__ic { width: 46px; height: 46px; margin-bottom: 9px; fill: none; }
.pvl-swal__ic .r { stroke: rgba(165, 220, 134, .35); stroke-width: 3.5; }
.pvl-swal__ic .k { stroke: #7cc35a; stroke-width: 3.5; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 32; stroke-dashoffset: 32; transition: stroke-dashoffset .4s var(--ui-ease) 1.05s; }
.pvl-swal b { font-size: 16px; font-weight: 800; line-height: 20px; letter-spacing: -.01em; color: #18181b; }
.pvl-swal > span:not(.pvl-swal__ok) { margin-top: 5px; font-size: 11.5px; font-weight: 600; line-height: 16px; color: #3f3f46; text-wrap: balance; }
.pvl-swal__ok { display: grid; place-items: center; height: 30px; margin-top: 13px; padding: 0 18px; border-radius: 8px; background: #18181b; color: #fff; font-size: 11.5px; font-weight: 700; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12); }
.pvl.s5 .pvl-dim, .pvl.s5 .pvl-swal { opacity: 1; }
.pvl.s5 .pvl-swal { scale: 1; }
.pvl.s5 .pvl-swal__ic .k { stroke-dashoffset: 0; }
/* s6: «Tamam»a basılmış sayılır — pencere ve karartma kapanır, arkada 1/3 · 1/10 sayaçlı sayfa kalır (son adım da temiz) */
.pvl.s6 .pvl-dim { opacity: 0; transition-delay: 0s; }
.pvl.s6 .pvl-swal { opacity: 0; scale: .96; transition: opacity .2s var(--ui-ease), scale .2s var(--ui-ease); }

/* ══ ÖĞRETMENİN TELEFONU ══ */
.pvl-ph { position: absolute; z-index: 8; right: 14px; top: 10px; width: 240px; height: 432px; padding: 6px; border-radius: 36px; background: linear-gradient(160deg, #24344d, #0b1424 40%, #0b1424);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14), 0 0 0 1px rgba(11, 20, 36, .5), 0 4px 10px rgba(11, 20, 36, .22), 0 34px 60px -24px rgba(11, 20, 36, .7);
  opacity: 0; translate: 0 70px; transition: opacity .35s var(--ui-ease) .1s, translate .8s cubic-bezier(.3, 1.25, .5, 1) .1s; }
.pvl.s6 .pvl-ph { opacity: 1; translate: 0 0; }
.pvl.s6 .pvl-win { scale: .86; filter: saturate(.8); }
.pvl-sc { position: relative; height: 100%; overflow: hidden; border-radius: 30px; background: #f6f6f3; font-size: 11px; color: #1b1c19; }
.pvl-sb { position: absolute; z-index: 6; inset: 0 0 auto; display: flex; align-items: center; justify-content: space-between; height: 26px; padding: 0 16px 0 20px; pointer-events: none; }
.pvl-sb > b { font-size: 11px; font-weight: 800; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.pvl-isl { position: absolute; left: 50%; top: 6px; width: 60px; height: 17px; margin-left: -30px; border-radius: 999px; background: #05070b; }
.pvl-sbi { display: flex; align-items: center; gap: 3px; }
.pvl-sbi .pvl-i { width: 12px; height: 12px; stroke-width: 2.4; }
.pvl-sbi .pvl-bat { width: 17px; height: 13px; }
.pvl-ah { position: absolute; z-index: 2; inset: 0 0 auto; display: flex; align-items: center; gap: 6px; height: 74px; padding: 26px 10px 0; background: linear-gradient(180deg, #e3eaf4, #eef2f8 75%, #f1f4f8); box-shadow: inset 0 -1px 0 #dde3ec; }
.pvl-ib { position: relative; flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #fff; color: #273246; box-shadow: 0 0 0 1px rgba(16, 37, 64, .06), 0 1px 2px rgba(16, 37, 64, .08); }
.pvl-ib .pvl-i { width: 15px; height: 15px; }
.pvl-ib--bell::after { content: ""; position: absolute; top: 5px; right: 6px; width: 7px; height: 7px; border-radius: 50%; background: #e0352b; box-shadow: 0 0 0 1.5px #fff; }
.pvl-at { flex: 1; min-width: 0; line-height: 1.15; }
.pvl-at > b { display: block; font-size: 12.5px; font-weight: 800; letter-spacing: -.015em; white-space: nowrap; }
.pvl-at .pvl-x { display: grid; margin-top: 2px; font-size: 10px; font-weight: 700; color: #4d534f; white-space: nowrap; }
.pvl-av2 { flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--navy); color: #fff; font-size: 10.5px; font-weight: 800; letter-spacing: .03em; box-shadow: 0 0 0 2px #fff, 0 2px 6px -2px rgba(16, 37, 64, .55); }
.pvl-ab { position: absolute; left: 0; right: 0; top: 74px; bottom: 48px; padding: 10px 10px 0; overflow: hidden; }
.pvl-sg { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; height: 30px; margin-bottom: 8px; }
.pvl-sg > span { display: flex; align-items: center; justify-content: center; gap: 4px; border-radius: 10px; background: #fff; font-size: 10.5px; font-weight: 800; color: #4d534f; white-space: nowrap; box-shadow: inset 0 0 0 1px #e5e4dd; }
.pvl-sg em { font-style: normal; font-size: 10px; font-weight: 900; opacity: .7; font-variant-numeric: tabular-nums; }
.pvl-sg .is-on { background: var(--pvl-b50); color: var(--navy); box-shadow: inset 0 0 0 1.5px var(--navy-soft); }
.pvl-sg .is-on em { display: inline-grid; }
.pvl-lsx { display: grid; width: 100%; }
.pvl-ls { border-radius: 16px; background: #fff; overflow: hidden; box-shadow: 0 0 0 1px rgba(191, 201, 195, .55), 0 1px 2px rgba(27, 28, 25, .04), 0 10px 22px -18px rgba(27, 28, 25, .35); }
.pvl-it { position: relative; padding: 9px 10px 10px; }
.pvl-it + .pvl-it { box-shadow: inset 0 1px 0 #efeee8; }
.pvl-it__r { display: flex; align-items: flex-start; gap: 9px; }
.pvl-it__ic { flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 10px; background: #fffbeb; color: #92400e; }
.pvl-it__ic .pvl-i { width: 15px; height: 15px; }
.pvl-it__t { flex: 1; min-width: 0; }
.pvl-it__t small { display: block; padding-right: 58px; font-size: 10px; font-weight: 800; line-height: 13px; letter-spacing: .05em; text-transform: uppercase; color: #6b706b; white-space: nowrap; }
.pvl-it__t b { display: block; font-size: 12.5px; font-weight: 700; line-height: 16px; letter-spacing: -.01em; white-space: nowrap; }
.pvl-it__t > span { display: block; margin-top: 1px; font-size: 10px; font-weight: 600; line-height: 13px; color: #6b706b; font-variant-numeric: tabular-nums; }
.pvl-it em { position: absolute; top: 9px; right: 10px; padding: 1px 7px; border-radius: 999px; background: #fffbeb; color: #92400e; font-style: normal; font-size: 10px; font-weight: 700; line-height: 14px; letter-spacing: .02em; box-shadow: inset 0 0 0 1px #fde9b8; }
.pvl-it__a { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 8px; }
.pvl-ok, .pvl-no { position: relative; display: flex; align-items: center; justify-content: center; gap: 5px; height: 30px; border-radius: 9px; color: #fff; font-size: 11.5px; font-weight: 700; }
.pvl-ok .pvl-i, .pvl-no .pvl-i { width: 13px; height: 13px; stroke-width: 2.4; }
.pvl-ok { background: var(--navy); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 2px 6px -2px rgba(20, 61, 107, .6); }
.pvl-no { background: #dc2626; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), 0 2px 6px -2px rgba(220, 38, 38, .55); }
/* «Randevu güncellendi.» (oFlash) main'in en üstünde: şerit 29 + 8 boşluk = 37 px; s8'de sekmeler ve liste bu kadar iner */
.pvl-fl { position: absolute; z-index: 1; left: 10px; right: 10px; top: 10px; display: flex; align-items: flex-start; gap: 6px; height: 29px; padding: 7px 10px; border-radius: 11px; background: #ecfdf5; color: #047857; font-size: 11px; font-weight: 700; line-height: 15px; white-space: nowrap; box-shadow: inset 0 0 0 1px rgba(4, 120, 87, .12);
  opacity: 0; translate: 0 -6px; transition: opacity .28s var(--ui-ease), translate .34s var(--ui-ease); }
.pvl-fl .pvl-i { width: 14px; height: 14px; margin-top: .5px; }
.pvl-mv { transition: translate .4s var(--ui-ease); }
.pvl.s8 .pvl-mv { translate: 0 37px; transition-delay: .1s; }
.pvl.s8 .pvl-fl { opacity: 1; translate: 0 0; transition-delay: .3s; }
.pvl-brand { display: none; margin-top: 14px; text-align: center; line-height: 13px; }
.pvl-brand b { display: block; font-size: 10px; font-weight: 800; color: #4d534f; }
.pvl-brand small { display: block; font-size: 10px; font-weight: 600; color: #6b706b; }
.pvl-tb { position: absolute; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); height: 48px; padding: 4px 4px 6px; background: #fff; box-shadow: inset 0 1px 0 #e5e4dd; }
.pvl-tb > span { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; color: #4d534f; font-size: 10px; font-weight: 700; white-space: nowrap; }
.pvl-tb small { display: none; font-size: 10px; font-weight: 700; }
.pvl-tb .pvl-i { width: 18px; height: 18px; stroke-width: 1.9; }
.pvl-tb em { position: absolute; top: 5px; left: calc(50% + 4px); min-width: 15px; height: 14px; padding: 0 3px; border-radius: 999px; background: #dc2626; color: #fff; font-style: normal; font-size: 10px; font-weight: 800; line-height: 14px; text-align: center; box-shadow: 0 0 0 1.5px #fff; }

/* telefona düşen anlık bildirim (öğretmene) */
.pvl-push, .pvl-nt { display: grid; gap: 8px; border-radius: 15px; background: rgba(255, 255, 255, .95); -webkit-backdrop-filter: blur(10px) saturate(1.3); backdrop-filter: blur(10px) saturate(1.3);
  box-shadow: 0 0 0 1px rgba(16, 37, 64, .08), 0 2px 4px rgba(16, 37, 64, .08), 0 20px 36px -14px rgba(16, 37, 64, .55), inset 0 1px 0 rgba(255, 255, 255, .7);
  font-size: 10.5px; font-weight: 500; line-height: 14px; color: var(--ui-text-2); }
.pvl-push { position: absolute; z-index: 7; left: 6px; right: 6px; top: 30px; grid-template-columns: 22px minmax(0, 1fr); padding: 8px 9px 9px 8px;
  opacity: 0; translate: 0 -150%; transition: opacity .3s var(--ui-ease), translate .6s cubic-bezier(.34, 1.4, .64, 1); }
.pvl-push img { width: 22px; height: 22px; border-radius: 6px; box-shadow: 0 0 0 1px rgba(16, 37, 64, .08); }
/* geniş düzende telefon 240 px: özet iki satıra sığsın (metin alanı 181 px ≥ 177 px «Öğr: … Can Kılınç»; alt kenar sekme yazısının üstünde kalır, ad bölünmez) */
@container (min-width: 561px) { .pvl-push { left: 3px; right: 3px; gap: 7px; padding: 8px 6px 9px; font-size: 10px; } }
.pvl-nh { display: flex; align-items: baseline; gap: 6px; margin-bottom: 1px; }
.pvl-nh b { flex: 1; min-width: 0; font-size: 11px; font-weight: 800; color: var(--ui-text); white-space: nowrap; }
.pvl-nh em { flex: none; font-style: normal; font-size: 10px; color: var(--ui-muted); }
/* s6 (2,6 sn): telefon yerine otururken iner; s7'de «Onayla» dokunuşuna kadar durur, sonra yukarı çekilir */
.pvl.s6 .pvl-push { opacity: 1; translate: 0 0; transition-delay: .55s; }
.pvl.s7 .pvl-push { opacity: 0; translate: 0 -120%; transition: opacity .25s var(--ui-ease) .38s, translate .4s cubic-bezier(.5, 0, .75, 0) .38s; }

/* «Onayla»ya dokunuş → «Güncelleniyor…» */
.pvl-touch { position: absolute; z-index: 4; left: 58%; top: 60%; width: 26px; height: 26px; margin: -13px 0 0 -13px; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle at 50% 42%, rgba(255, 255, 255, .8), rgba(226, 233, 243, .55) 70%);
  box-shadow: 0 0 0 1px rgba(16, 37, 64, .3), 0 2px 5px rgba(16, 37, 64, .25), 0 10px 18px -8px rgba(16, 37, 64, .45); opacity: 0; translate: 14px 18px; }
.pvl-touch i { position: absolute; inset: -1px; border-radius: 50%; border: 2px solid rgba(255, 255, 255, .95); box-shadow: 0 0 0 1px rgba(16, 37, 64, .28); opacity: 0; }
.pvl.s7:not(.s8) .pvl-touch { animation: pvl-dokun .9s var(--ui-ease) .1s both; }
.pvl.s7:not(.s8) .pvl-touch i { animation: pvl-dalga .55s ease-out .45s both; }
@keyframes pvl-dokun { 0% { opacity: 0; translate: 14px 18px; } 35% { opacity: 1; translate: 0 0; scale: 1; } 50% { scale: .76; } 66% { scale: 1; } 100% { opacity: 1; translate: 0 0; } }
@keyframes pvl-dalga { 0% { opacity: .95; scale: .7; } 100% { opacity: 0; scale: 2.3; } }
.pvl.s7:not(.s8) .pvl-it--can .pvl-ok { animation: pvl-push .3s var(--ui-ease) .4s; filter: brightness(.88); transition: filter .2s .45s; }
.pvl-busy { position: absolute; inset: 0; z-index: 5; display: grid; place-items: center; padding: 0 16px; background: rgba(24, 24, 27, .7); opacity: 0; transition: opacity .25s var(--ui-ease); }
.pvl-busy__c { display: flex; flex-direction: column; align-items: center; width: 100%; padding: 14px 12px 13px; border-radius: 16px; background: #fff; text-align: center;
  box-shadow: 0 0 0 1px rgba(16, 37, 64, .06), 0 24px 40px -16px rgba(0, 0, 0, .55); scale: .9; transition: scale .45s var(--pvl-spring); }
.pvl-busy__c b { margin-top: 9px; font-size: 12.5px; font-weight: 800; color: var(--ui-text); }
.pvl-busy__c span { margin-top: 3px; font-size: 10px; font-weight: 700; line-height: 1.35; color: var(--ui-muted); text-wrap: balance; }
.pvl-spin { width: 26px; height: 26px; fill: none; stroke: var(--navy-soft); stroke-width: 3; stroke-linecap: round; }
.pvl-spin circle { opacity: .2; }
.pvl.s7:not(.s8) .pvl-busy { opacity: 1; transition-delay: .62s; }
.pvl.s7:not(.s8) .pvl-busy__c { scale: 1; transition-delay: .62s; }
.pvl.s7:not(.s8) .pvl-spin { animation: pvl-don .8s linear infinite; }
@keyframes pvl-don { to { rotate: 360deg; } }
.pvl.s8 .pvl-lsx .pvl-l, .pvl.s8 .pvl-ah .pvl-l, .pvl.s8 .pvl-sg .pvl-l { --ld: .1s; }

/* öğrenciye ve veliye giden bildirim (sonuç) */
.pvl-nt { position: absolute; z-index: 9; left: 8px; top: 2px; width: min(330px, calc(100% - 290px)); grid-template-columns: 26px minmax(0, 1fr); gap: 9px; padding: 10px 11px 12px 10px;
  opacity: 0; translate: 0 -24px; transition: opacity .3s var(--ui-ease), translate .7s cubic-bezier(.34, 1.4, .64, 1); }
.pvl-nt img { width: 26px; height: 26px; border-radius: 7px; box-shadow: 0 0 0 1px rgba(16, 37, 64, .08); }
.pvl-nt__tag { position: absolute; right: 10px; bottom: -10px; display: inline-flex; align-items: center; gap: 4px; height: 19px; padding: 0 8px 0 6px; border-radius: 999px;
  background: var(--sun); color: var(--sun-ink, #2a1c00); font-size: 10px; font-weight: 800; white-space: nowrap; box-shadow: 0 0 0 1.5px #fff, 0 4px 10px -4px rgba(16, 37, 64, .45);
  opacity: 0; scale: .7; transition: opacity .3s var(--ui-ease), scale .45s var(--pvl-spring); }
.pvl-nt__tag .pvl-i { width: 11px; height: 11px; stroke-width: 2.4; }
.pvl.s8 .pvl-nt { opacity: 1; translate: 0 0; transition-delay: .55s; }
.pvl.s8 .pvl-nt__tag { opacity: 1; scale: 1; transition-delay: 1.1s; }

/* ══ DAR KAPLAR ══ */
@container (max-width: 640px) {
  .pvl-crumb__p:first-child, .pvl-crumb__p:first-child + i { display: none; }
}
/* telefon düzeni: üst şerit uygulamanın telefon başlığı, rozetler alt alta, öğretmenler iki sütun, takvimin altında saat paneli */
@container (max-width: 560px) {
  /* --pvl-h3: tür ızgarası 3 satır (Danışmanlık 3. satırın sol hücresinde, uygulamadaki grid-cols-2 gibi) → 282 + 44 = 326;
     --pvl-o3: başlık üst şeridin 10 px altında, form altı pencerenin 9 px üstünde (alt düğmelerin üst boşluğu 14 px) */
  .pvl-st { height: 480px; --pvl-top: 44px; --pvl-h2: 380px; --pvl-h3: 326px; --pvl-o1: 213px; --pvl-o3: 654px; --pvl-px: 12px; }
  .pvl-top { gap: 10px; padding: 0 12px; }
  .pvl-burger { display: block; }
  .pvl-crumb { font-size: 14px; }
  .pvl-crumb__p, .pvl-crumb i, .pvl-me b { display: none; }
  .pvl-av { width: 28px; height: 28px; border-radius: 50%; }
  .pvl-chips { flex-direction: column; align-items: flex-start; gap: 6px; height: 50px; }
  .pvl-hd { display: none; }
  .pvl-form { padding: 12px; }
  .pvl-tg { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pvl-tc--w { display: none; }
  .pvl-tc { gap: 8px; padding: 0 8px 0 6px; }
  .pvl-tc__i { width: 28px; height: 28px; border-radius: 8px; }
  .pvl-tc__ok { position: absolute; top: 5px; right: 5px; }
  .pvl-tc__ok .pvl-i { width: 13px; height: 13px; }
  .pvl-dt { grid-template-columns: minmax(0, 1fr); grid-template-rows: 218px 104px; gap: 10px; height: 332px; }
  .pvl-sp { padding: 10px 12px; }
  .pvl-sp__e { display: grid; grid-template-columns: 34px minmax(0, 1fr); grid-template-rows: auto auto; column-gap: 10px; align-content: center; text-align: left; }
  .pvl-sp__ic { grid-row: 1 / 3; margin-bottom: 0; }
  .pvl-sp__e > b { align-self: end; line-height: 15px; }
  .pvl-sp__e > small { align-self: start; margin-top: 1px; }
  .pvl-brand { display: block; margin-top: 18px; }
  .pvl-sp__h { margin-bottom: 8px; }
  .pvl-key { margin-top: 8px; }
  .pvl-ty { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 38px; }
  .pvl-to { flex-direction: row; gap: 6px; }
  .pvl-to .pvl-i { width: 14px; height: 14px; }
  .pvl-sum { height: 52px; }
  .pvl-ft { flex-direction: column-reverse; align-items: stretch; gap: 8px; margin-top: 14px; }
  /* telefon: ortada, pencere arkada geri çekilir */
  .pvl-win { transform-origin: 50% 50%; }
  .pvl.s6 .pvl-win { scale: .94; }
  .pvl-ph { left: 50%; right: auto; top: 8px; width: min(282px, calc(100% - 32px)); height: 464px; margin-left: calc(min(282px, 100% - 32px) / -2); }
  .pvl-nt { left: 50%; top: 14px; width: min(306px, calc(100% - 24px)); margin-left: calc(min(306px, 100% - 24px) / -2); }
}
@container (max-width: 400px) {
  .pvl-lg small { display: none; }
}