/* BistoLab mobil uyum (prod) — native/cilalı PWA */
@media (max-width: 860px) {
  html, body { overflow: clip visible !important; overscroll-behavior-y: contain; }
  .wrap, .content, section, article { max-width: 100% !important; box-sizing: border-box; }
  img, svg, video, iframe { max-width: 100% !important; }
  canvas { max-width: 100% !important; height: auto !important; }
  *[style*="width:760px"], *[style*="width: 760px"],
  *[style*="width:420px"], *[style*="width:412px"],
  *[style*="width:380px"], *[style*="width:340px"]
    { width: 100% !important; max-width: 100% !important; }
}
/* TELEFON DİKEY (portrait) -> SABİT ince üst yatay-scroll ikon-bar */
@media (max-width: 768px) and (orientation: portrait) {
  body { flex-direction: column !important; padding-top: 56px !important; }
  .side, body.snav-collapsed .side {
    position: fixed !important; top: 0 !important; left: 0 !important; right: 0 !important;
    width: 100% !important; height: 56px !important;
    flex-direction: row !important; flex-wrap: nowrap !important;
    overflow-x: auto !important; overflow-y: hidden !important;
    align-items: center !important; gap: 3px; z-index: 1000 !important;
    border-right: none !important; border-bottom: 1px solid var(--line) !important;
    padding: 0 12px !important; background: rgba(12,13,17,.85) !important;
    -webkit-backdrop-filter: saturate(180%) blur(14px); backdrop-filter: saturate(180%) blur(14px);
    -webkit-overflow-scrolling: touch;
  }
  .side::-webkit-scrollbar { display: none !important; height: 0 !important; }
  .side { scrollbar-width: none !important; }
  .side .brand { flex: none !important; padding: 0 8px 0 0 !important; margin: 0 !important; border: none !important; }
  .side nav, body.snav-collapsed .side nav {
    flex-direction: row !important; flex-wrap: nowrap !important; gap: 2px !important; flex: none !important; }
  .side .blbl, .side nav a span, .side .nlabel, .side .uinfo, .side .snav-tg { display: none !important; }
  .side .userbox, body.snav-collapsed .side .userbox { margin: 0 0 0 6px !important; flex: none !important; padding: 0 !important; }
  .side .avatar { width: 30px !important; height: 30px !important; }
  body.snav-collapsed .side nav a, .side nav a { padding: 9px 11px !important; flex: none !important; border-radius: 9px; }
  .side nav a::after { display: none !important; }
  .side nav a.on { box-shadow: none !important; background: var(--surface-2) !important; }
  .main { width: 100% !important; flex: 1 1 100% !important; min-width: 0 !important; }
  .wrap { padding: 16px 14px 64px !important; }
}
@media (max-width: 560px) and (orientation: portrait) {
  body { font-size: 14px; }
  a, button, .btn, [role="button"], input, select { min-height: 44px; }
  input, select, textarea { font-size: 16px !important; }
}
/* TELEFON YATAY (landscape) -> app.py'nin KENDİ sol bar'ı (toggle + genişlet/daralt) ama SABİT (fixed) */
@media (orientation: landscape) and (max-height: 600px) {
  body { padding-top: 0 !important; }
  .side, body.snav-collapsed .side {
    position: fixed !important; top: 0 !important; left: 0 !important; bottom: 0 !important;
    height: 100vh !important; overflow-y: auto !important; overflow-x: hidden !important;
    padding-left: max(11px, env(safe-area-inset-left)) !important;
  }
  .side::-webkit-scrollbar { width: 0 !important; }
  .main { margin-left: 214px !important; width: auto !important; flex: 1 !important; min-width: 0; padding-top: 0 !important; }
  body.snav-collapsed .main { margin-left: 62px !important; }
  .wrap { padding-right: max(20px, env(safe-area-inset-right)) !important; }
}
@supports (padding: max(0px)) {
  @media (max-width: 768px) and (orientation: portrait) {
    .side { height: calc(56px + env(safe-area-inset-top)) !important; padding-top: env(safe-area-inset-top) !important; }
    body { padding-top: calc(56px + env(safe-area-inset-top)) !important; }
  }
}

/* ===== FAZ-1 PREMIUM: native alt tab-bar (bottom navigation) ===== */
.btab{display:none}
.navmask{display:none}
@media (max-width: 768px) and (orientation: portrait){
  .btab{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:1100;
    height:calc(56px + env(safe-area-inset-bottom) + 24px);
    padding-bottom:calc(env(safe-area-inset-bottom) + 24px);
    background:rgba(12,13,17,.93);
    -webkit-backdrop-filter:saturate(180%) blur(18px);backdrop-filter:saturate(180%) blur(18px);
    border-top:1px solid rgba(255,255,255,.06);}
  .btab .bt{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:3px;color:#7e828c;text-decoration:none;font-size:10.5px;font-weight:500;justify-content:flex-start;padding-top:9px;
    letter-spacing:.01em;transition:color .15s,transform .1s;-webkit-tap-highlight-color:transparent;}
  .btab .bt svg{width:23px;height:23px;}
  .btab .bt.on{color:var(--accent,#6d7cff);}
  .btab .bt.on svg{filter:drop-shadow(0 0 6px rgba(109,124,255,.45));}
  .btab .bt:active{transform:scale(.92);color:#c9ccd4;}
  .wrap{padding-bottom:calc(82px + env(safe-area-inset-bottom)) !important;}
  /* üst-bar artık "Daha" ile açılan kayan menü (default gizli) */
  .side,body.snav-collapsed .side{transform:translateY(-112%);transition:transform .26s cubic-bezier(.4,0,.2,1);}
  body.shownav .side,body.shownav.snav-collapsed .side{transform:translateY(0);}
  body{padding-top:0 !important;}
  .navmask{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:999;
    opacity:0;pointer-events:none;transition:opacity .22s;}
  body.shownav .navmask{display:block;opacity:1;pointer-events:auto;}
}

/* ===== "Daha" -> premium BOTTOM-SHEET menü (alttan dikey liste) ===== */
@media (max-width:768px) and (orientation:portrait){
  body.shownav .side{
    top:auto !important;bottom:0 !important;left:0 !important;right:0 !important;
    height:auto !important;max-height:74vh !important;width:100% !important;
    flex-direction:column !important;flex-wrap:nowrap !important;align-items:stretch !important;
    overflow-y:auto !important;overflow-x:hidden !important;gap:0 !important;
    border-radius:22px 22px 0 0 !important;border:0 !important;border-top:1px solid rgba(255,255,255,.07) !important;
    padding:0 12px calc(20px + env(safe-area-inset-bottom)) !important;
    transform:translateY(0) !important;background:rgba(16,18,24,.985) !important;z-index:1200 !important;
    box-shadow:0 -18px 50px -12px rgba(0,0,0,.6) !important;
  }
  body.shownav .side::before{content:'';display:block;width:40px;height:4px;border-radius:3px;
    background:#3a3f4b;margin:9px auto 6px !important;flex:none !important;}
  body.shownav .side .brand{display:flex !important;padding:4px 6px 10px !important;border:0 !important;margin:0 !important;flex:none !important;}
  body.shownav .side .blbl{display:inline !important;}
  body.shownav .side .nlabel{display:block !important;font-size:10px !important;text-transform:uppercase;
    letter-spacing:.09em;color:#5e616b !important;padding:8px 8px 4px !important;}
  body.shownav .side nav{flex-direction:column !important;flex-wrap:nowrap !important;gap:1px !important;
    width:100% !important;flex:none !important;}
  body.shownav .side nav a{justify-content:flex-start !important;gap:13px !important;padding:13px 14px !important;
    width:100% !important;border-radius:12px !important;}
  body.shownav .side nav a span{display:inline !important;font-size:14.5px !important;font-weight:500 !important;}
  body.shownav .side nav a svg{width:20px !important;height:20px !important;flex:none !important;}
  body.shownav .side nav a::after{display:none !important;}
  body.shownav .side .userbox{display:flex !important;margin-top:6px !important;padding:11px 10px !important;
    border-top:1px solid rgba(255,255,255,.06) !important;}
  body.shownav .side .uinfo,body.shownav .side .uname,body.shownav .side .urole{display:block !important;}
}

/* ===== FAZ-2: dokunma feedback + akıcılık ===== */
@media (max-width:768px) and (orientation:portrait){
  a,button,.btab .bt,.fav-tbl tr,#ftbl tr,#atbl tr,#btbl tr,.card,[role=button],input,select{
    -webkit-tap-highlight-color:transparent !important;}
  .btab .bt,a,button,.fav-tbl tr,#ftbl tr,.card{transition:transform .1s ease,opacity .12s,background .15s;}
  a:active,button:active,.btab .bt:active,.fav-tbl tr:active,#ftbl tr:active{
    transform:scale(.98);opacity:.86;}
  html{scroll-behavior:auto;}
  body,.wrap,.main,.tblw{-webkit-overflow-scrolling:touch;}
  /* dokunma hedefi min 44px (zaten var, pekiştir) */
  .btab .bt{min-height:48px;}
}

/* ===== FAZ-3: premium micro-animasyon ===== */
@media (max-width:768px) and (orientation:portrait){
  @keyframes bl-fade{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
  @keyframes bl-card{from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none}}
  @keyframes bl-up{from{transform:translateY(100%)}to{transform:translateY(0)}}
  .wrap{animation:bl-fade .32s cubic-bezier(.4,0,.2,1)}
  .btab{animation:bl-up .4s cubic-bezier(.16,1,.3,1)}
  .fav-tbl tr,#ftbl tr{animation:bl-card .42s cubic-bezier(.4,0,.2,1) backwards}
  .fav-tbl tr:nth-child(1),#ftbl tr:nth-child(1){animation-delay:.03s}
  .fav-tbl tr:nth-child(2),#ftbl tr:nth-child(2){animation-delay:.07s}
  .fav-tbl tr:nth-child(3),#ftbl tr:nth-child(3){animation-delay:.11s}
  .fav-tbl tr:nth-child(4),#ftbl tr:nth-child(4){animation-delay:.15s}
  .fav-tbl tr:nth-child(5),#ftbl tr:nth-child(5){animation-delay:.19s}
  .fav-tbl tr:nth-child(n+6),#ftbl tr:nth-child(n+6){animation-delay:.22s}
}
@media (prefers-reduced-motion:reduce){
  .wrap,.btab,.fav-tbl tr,#ftbl tr{animation:none !important}
}

/* ===== FAZ-4: PWA-native (cold-start splash + pull-to-refresh) ===== */
.bl-splash{position:fixed;inset:0;z-index:99999;background:#0a0b0e;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;transition:opacity .55s ease}
.bl-splash img{border-radius:20px;animation:bl-splash-pop .5s cubic-bezier(.16,1,.3,1)}
.bl-splash-name{font-size:25px;font-weight:700;letter-spacing:.4px;color:#fff;font-family:system-ui,-apple-system,sans-serif}
.bl-splash-tag{font-family:'Inter',-apple-system,sans-serif;font-size:12.5px;font-weight:500;letter-spacing:.015em;color:#9398a2}
.bl-splash.out{opacity:0;pointer-events:none}
@keyframes bl-splash-pop{from{opacity:0;transform:scale(.82)}to{opacity:1;transform:none}}
.bl-ptr{position:fixed;top:-44px;left:50%;transform:translateX(-50%);z-index:9998;width:38px;height:38px;border-radius:50%;background:#151821;box-shadow:0 4px 16px rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s}
.bl-ptr-spin{width:18px;height:18px;border:2.5px solid #2a2f3a;border-top-color:var(--accent,#5b8cff);border-radius:50%}
.bl-ptr.ready .bl-ptr-spin{border-top-color:#3ad29f}
.bl-ptr.go .bl-ptr-spin{animation:bl-spin .6s linear infinite}
@keyframes bl-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.bl-splash img{animation:none}}

/* ===== FAZ-5: geniş tablo mobil iyileştirme (yatay kaydırma) ===== */
@media (max-width:768px) and (orientation:portrait){
  /* Geniş tablolarda yatay kaydırma. NOT: -webkit-overflow-scrolling:touch
     iOS'ta position:sticky'yi BOZAR (bilinen WebKit çakışması) -> KULLANMA.
     Modern iOS'ta momentum zaten default. overscroll: sayfaya taşmasın. */
  .tw,.bw .tw,.tblw{overscroll-behavior-x:contain;}
  /* Bilanço: Hisse kolonu SABİT — yana kayınca hangi satır olduğu kaybolmaz.
     KÖK: genel mobil kural #btbl'i display:block;overflow-x:auto yapıyor ->
     tablonun KENDİSİ scroll-container olunca sticky td tabloya göre kayıyor.
     Çözüm: portrait'te tabloyu normal table'a döndür, scroll'u .tw wrapper'a
     bırak. + border-collapse:separate (collapse sticky-left'i iptal eder). */
  #btbl{display:table !important;overflow:visible !important;
    border-collapse:separate !important;border-spacing:0 !important;}
  #btbl th:first-child,#btbl td:first-child{
    position:sticky;left:0;z-index:2;background:var(--surface,#131722);
    box-shadow:1px 0 0 var(--line,#23262f);}
  #btbl thead th:first-child{z-index:3;}
}

/* ===== FAZ-6: iOS dokunma KÖK FİX (Levent 2026-06-23 screenshot kanıtı) =====
   Butona/linke dokununca iOS METİN SEÇİYOR (mavi işaret + büyüteç oval) ->
   tıklama yerine seçim oluyor, sayfa kayıyor, buton çalışmıyor. Çözüm: link/
   buton'da metin-seçimi + uzun-bas menüsü KAPALI. (input/textarea HARİÇ.) */
@media (max-width: 860px) {
  /* mobilde TÜM sayfa seçilemez (native app hissi). Dar selector "9 dk önce"
     gibi <a> DIŞINDA kalan metni kaçırıyordu -> büyüteç+mavi seçim (Levent
     2026-06-23 screenshot). Çözüm: body geneli none, yalnız form alanları text. */
  body {
    -webkit-user-select: none !important; user-select: none !important;
    -webkit-touch-callout: none !important;
  }
  input, textarea, select, [contenteditable="true"], [contenteditable=""] {
    -webkit-user-select: text !important; user-select: text !important;
    -webkit-touch-callout: default !important;
  }
}

/* ===== FAZ-7: iOS-18 PWA scroll-jump fix (Levent 2026-06-23 VİDEO kanıtı) =====
   Haber sayfası açıkken HERHANGİ dokunma -> içerik ~900px aşağı zıplıyor, kalıcı.
   KÖK: HİÇBİR JS-handler yok (app-pwa.js B8-minimal'de yok, _HABER_JS'de scroll
   yok, app_dev'de touch/scroll listener yok = grep kanıtı) -> SAF iOS-18 NATIVE
   scroll-anchoring + overscroll davranışı (356 haberlik uzun liste tetikliyor).
   Çözüm: scroll-anchoring KAPAT (dokununca DOM-anchor zıplamasın) + overscroll
   bounce KAPAT. */
@media (max-width: 860px) {
  html, body { overscroll-behavior: none !important; overflow-anchor: none !important; }
  #hb-list, .main, .wrap, .tblw { overflow-anchor: none !important; }
}

/* iOS PWA ust guvenli alan (status bar / notch) - Levent iPhone 2026-07-03 */
@media (max-width:768px) and (orientation:portrait){
  .wrap{padding-top:calc(16px + env(safe-area-inset-top)) !important;}
}