/* ══════════════════════════════════════════════════════════════════════
   ob-modal.css — SİTE GENELİ MODAL KATMANI (v9)
   7 Ağustos 2026.

   NEDEN VAR: telefon tarafında modal kabuğu on beş ayrı biçimde
   yazılmıştı. `.mov`/`.mb` CSS'inin yirmi iki inline kopyası vardı ve
   kopyalar birbirinden sapmıştı — beş farklı bulanıklık değeri
   (5/7/8/11/22px), dört farklı katman numarası (7000 · 9000 · 100000 ·
   2147483000) ve bazı kopyalarda kapanış gecikmesi eksikti (modal
   kapandıktan sonra 350 ms boyunca görünmeyen tıklama alanı kalıyordu).

   Aynı ürünün her sayfasında modal başka türlü açılıyordu. Artık tek
   kaynak burası; sayfalar kendi kopyalarını taşımıyor.

   KATMAN DÜZENİ — tek merdiven, tahmin yok:
     kilit   2147482900  sayfa kilidi (karşılama kilidi gibi), modalın ALTI
     modal   2147483000  bütün normal modallar
     üst     2147483100  modalın üstüne açılan modal (kırpma, ödeme onayı,
                         büyük görsel) — yoksa alttakinin arkasında kalır
     bildiri 2147483300  toast; her şeyin üstünde kalmalı
   ══════════════════════════════════════════════════════════════════════ */

:root{
  --ob-z-kilit:2147482900;
  --ob-z-modal:2147483000;
  --ob-z-ustmodal:2147483100;
  --ob-z-bildiri:2147483300;

  /* Marka kimliği v9 — kart dili: RENK YOK, saf bulanıklık.
     Kartlara beyaz tül eklenince zemin soluyor ve "karartma" gibi
     duruyor; Bilo bunu reddetti. */
  --ob-cam:rgba(255,255,255,.04);
  --ob-cam-kenar:1px solid rgba(255,255,255,.26);
  --ob-perde:rgba(8,8,12,.58);
  --ob-bulanik:blur(26px);
}

/* ── PERDE (arka plan) ──────────────────────────────────────────────────
   `visibility` geçişi bilerek iki değerli: açılırken 0s gecikmeyle hemen
   görünür oluyor, kapanırken .35s bekliyor ki sönme animasyonu görünsün.
   Sapmış kopyalarda bu ikinci kural eksikti ve modal kapandıktan sonra
   yarım saniye boyunca altındaki düğmeler tıklanamıyordu. */
.mov{
  position:fixed; inset:0; z-index:var(--ob-z-modal);
  display:flex; align-items:flex-end; justify-content:center;
  background:var(--ob-perde);
  backdrop-filter:blur(11px) saturate(1.25);
  -webkit-backdrop-filter:blur(11px) saturate(1.25);
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .3s ease, visibility 0s .35s;
}
.mov.active{
  opacity:1; visibility:visible; pointer-events:auto;
  transition:opacity .3s ease, visibility 0s 0s;
}

/* ── ALT SAYFA (bottom sheet) ─────────────────────────────────────────
   Telefonda modal ekranın ortasında değil altından çıkar: başparmak orada.
   Alt dolgu güvenli alanı (çentikli telefonların alt çubuğu) hesaba katar. */
.mb{
  width:100%; max-height:86vh; overflow-y:auto;
  -webkit-overflow-scrolling:touch; overscroll-behavior:contain;
  background:var(--ob-cam);
  backdrop-filter:var(--ob-bulanik);
  -webkit-backdrop-filter:var(--ob-bulanik);
  border:var(--ob-cam-kenar); border-bottom:none;
  border-radius:22px 22px 0 0;
  padding:6px 18px calc(26px + env(safe-area-inset-bottom));
  transform:translateY(100%);
  transition:transform .35s cubic-bezier(.16,1,.3,1);
  touch-action:pan-y;
}
.mov.active .mb{ transform:translateY(0); }

/* Cam desteklenmeyen tarayıcıda saf şeffaf kart okunmaz olurdu:
   arkasındaki metin doğrudan yazının içinden geçerdi. */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .mb{ background:rgba(13,13,18,.97); }
  .mov{ background:rgba(8,8,12,.86); }
}

.mb-handle{ width:36px; height:4px; border-radius:2px; margin:10px auto 14px;
  background:rgba(255,255,255,.18); cursor:grab; }
.mb h3{ font-family:'Geist','Sora',sans-serif; font-size:16px; font-weight:700;
  color:#fff; letter-spacing:-.01em; }
.mb p,.mb li,.mb label,.mb input,.mb textarea,.mb select{
  font-family:'Sora',sans-serif; }
.mx{ float:right; background:transparent; border:none; color:rgba(255,255,255,.55);
  font-size:18px; cursor:pointer; padding:2px 5px; line-height:1; }
.mx:hover{ color:#fff; }

.menu-item{ display:flex; align-items:center; gap:12px; padding:14px 4px;
  border-bottom:1px solid rgba(255,255,255,.06); color:rgba(255,255,255,.86);
  font-size:14px; font-weight:500; }
.menu-item:last-child{ border-bottom:none; }
.menu-item:active{ color:#ffbd59; }
.menu-item:active .mi-icon{ background:rgba(255,189,89,.10); border-color:rgba(255,189,89,.22); }
.mi-icon{ width:34px; height:34px; border-radius:9px; flex-shrink:0;
  display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12);
  transition:background .18s, border-color .18s; }
.mi-icon svg{ width:18px; height:18px; display:block; }
.menu-sep{ height:1px; background:rgba(255,255,255,.08); margin:8px 0; }

/* Modal açıkken ObAi baloncuğu modalın üstüne binmesin. */
body.ob-modal-open #obaiMainWidget{
  opacity:0 !important; visibility:hidden !important; pointer-events:none !important;
  transition:opacity .22s ease, visibility .22s ease;
}

/* iOS kaydırma kilidi — `overflow:hidden` iOS Safari'de YETMEZ, sayfa
   modalın arkasında kaymaya devam eder. Gövde sabitlenip kaydırma
   konumu negatif `top` ile korunuyor; js/ob-modal.js kapanışta geri
   veriyor. Kilit CSS burada, konum hesabı JS'te — ikisi birlikte çalışır. */
body.ob-modal-kilit{
  position:fixed; left:0; right:0; width:100%;
  overflow:hidden; overscroll-behavior:none;
}

/* ══ UYUM KATMANI ══════════════════════════════════════════════════════
   Sitede `.mov` dışında on dört ayrı modal kabuğu daha var. Hepsini elle
   `.mov`'a çevirmek onlarca çalışan akışı (ödeme, kırpma, NDA, toplantı)
   aynı anda riske atardı. Bunun yerine görünüş ve katman düzeni tek
   noktadan eşitleniyor; kabukların kendi yerleşim mantığı yerinde kalıyor.

   Ölçülen sapmalar burada kapanıyor:
     .cmp-ov  100000 · .ob-ov 9000 · .intent-ov 7000  → modal katmanına
     .gec-modal / .sess-modal / .ob-modal → arka planı hiç karartmıyordu
     .pd-ov   rgba(4,3,2,.66) kahverengiye kaçan perde → marka perdesi   */
.modal-ov,.ob-mov,.modal-overlay,.pd-ov,.sys-modal,
.qv-overlay,.sim-overlay,.cmp-ov,.ob-ov,.intent-ov,
.gec-modal,.sess-modal,.ob-modal,.gate-overlay{
  z-index:var(--ob-z-modal);
  background:var(--ob-perde);
  backdrop-filter:blur(11px) saturate(1.25);
  -webkit-backdrop-filter:blur(11px) saturate(1.25);
}

/* Bunlar başka bir modalın ÜSTÜNE açılıyor (görsel kırpma, ödeme onayı,
   büyük görsel). Aynı katmanda kalırlarsa altta kalıp erişilemez olurlar. */
.lb-ov,.lb-overlay,.pub-ov,.bpay-ov,#cropModal,#consentModal{
  z-index:var(--ob-z-ustmodal);
}

/* Sayfa kilidi modalın ALTINDA durmalı: kilit ekranındayken açılan bir
   modal (ör. "neden isteniyor?") kilidin arkasında kalmamalı. */
.gate-overlay,.lock-overlay{ z-index:var(--ob-z-kilit); }

.toast,#toast,.ob-toast{ z-index:var(--ob-z-bildiri); }

/* Kart aileleri v9 cam diline çekiliyor. Yalnız MODAL İÇİ hedefleniyor:
   `.card` gibi genel adlara site geneli dokunmak daha önce kayıt formunu,
   KVKK onay kutusunu ve sözleşme modalını bozmuştu (ob-video-uyum.css
   içindeki uzun notun konusu bu). Kapsam modalla sınırlı. */
.modal-ov > .modal,.ob-mov > .ob-mb,.modal-overlay > .modal-box,
.pd-ov > .pd-mb,.sys-modal > .sys-box{
  background:var(--ob-cam) !important;
  backdrop-filter:var(--ob-bulanik);
  -webkit-backdrop-filter:var(--ob-bulanik);
  border:var(--ob-cam-kenar);
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .modal-ov > .modal,.ob-mov > .ob-mb,.modal-overlay > .modal-box,
  .pd-ov > .pd-mb,.sys-modal > .sys-box{ background:rgba(13,13,18,.97) !important; }
}

/* Sanal klavye açılınca `vh` yeniden hesaplanmıyor ve formun gönder
   düğmesi klavyenin altında kalıyordu (toplantı daveti modalında birebir
   böyleydi). `dvh` destekleyen tarayıcıda gerçek görünür yükseklik
   kullanılıyor; desteklemeyende yukarıdaki 86vh geçerli kalıyor. */
@supports (height:100dvh){
  .mb,.modal-ov > .modal,.ob-mov > .ob-mb{ max-height:86dvh; }
}

@media (prefers-reduced-motion:reduce){
  .mov,.mb{ transition-duration:.01ms !important; }
}