/* Sefiri — Ust bar (mobil) v2
   ---------------------------------------------------------------
   Bu dosyadaki HER kural html[data-so-ust="v2"] ile baslar.
   Nitelik yoksa tek bir kural bile uygulanmaz; ust bar birebir eski
   halinde gorunur. Geri donus = niteligi koymamak.

   Kapat: ?ustbar=eski  ·  Ac: ?ustbar=v2  ·  Secim hatirlanir.
   Sunucu tarafi kapatma: SEFIRI_USTBAR_V2=false

   SORUN
   mobile-layout-fix-v1.js .nav'a sabit bes sutun veriyordu:
     grid-template-columns:repeat(5,minmax(0,1fr))
   Ama bes cocuktan yalnizca ucu gorunur: #balanceBtn'i
   persistent-topbar-v1.js, #profileBtn'i yine mobile-layout-fix
   display:none yapiyor. display:none olan cocuk grid'den tamamen
   dusuyor, dolayisiyla ayakta kalan uc dugme 1-2-3. sutunlara
   yerlesiyor ve 4. ile 5. sutun sagda BOS kaliyor.
   390px'te olculen: nav 370px, sutun 70px, dugmeler sol 10-240
   arasinda, sagda 150px olu alan. "Butonlar solda kaliyor" bu.
   Yoneticide alti cocuk bes sutuna sigmayip alt satira tasiyordu.

   COZUM
   Sabit sutun sayisini birakip flex'e donuyoruz: kac dugme gorunurse
   satiri o kadar dugme paylasir. Gizli cocuklar hic yer kaplamaz,
   sayiyi hicbir yere yazmadigimiz icin ileride dugme eklenip
   cikarilinca da bozulmaz.

   OZGULLUK NOTU: kazanan kural html[data-so-view="simple"] .topbar
   .nav (0,3,1). Buradakiler iki nitelikli: html[data-so-ust][data-so-view]
   .topbar .nav (0,4,1) — hem mobile-layout-fix'i hem de govde sonunda
   yuklenen tema dosyasini yener. Bu iki nitelikli bicimi bozmayin.

   DOKUNULMAYANLAR: hicbir DOM dugumu tasinmiyor/eklenmiyor/siliniyor,
   hicbir id veya sinif degismiyor, gizli dugmeler gizli kaliyor
   (#balanceBtn zaten #soTopupBtn ile degistirilmisti, #profileBtn'in
   isini alt gezinme cubugu goruyor), hicbir tiklama isleyicisi
   degismiyor, masaustu duzenine dokunulmuyor.
   --------------------------------------------------------------- */

@media(max-width:760px){

  /* sabit bes sutun yerine esnek satir */
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav{
    display:flex!important;
    grid-template-columns:none!important;
    flex-wrap:nowrap!important;
    align-items:stretch!important;
    gap:7px!important;
  }

  /* gorunur dugmeler kalan genisligi esit paylasir */
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav>button,
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav>#soTopupBtn,
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav>#soAdminBtn,
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav>.sr-account-btn{
    flex:1 1 0!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    height:44px!important;
    min-height:44px!important;
    padding:0 10px!important;
    font-size:10px!important;
    letter-spacing:.04em!important;
  }

  /* "Nasil?" bir yardim dugmesi, para dugmeleriyle esit genislik
     hak etmiyor: icerigi kadar yer kaplasin, kalani digerlerine. */
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav>#soGuideTrigger{
    flex:0 0 auto!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    height:44px!important;
    min-height:44px!important;
    padding:0 12px!important;
    font-size:9.5px!important;
    gap:5px!important;
  }
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav>#soGuideTrigger .so-guide-q{
    width:19px!important;height:19px!important;flex:0 0 19px!important;
    margin-right:3px!important;font-size:10px!important;
  }

  /* bakiye dugmesi paranin oldugu yer — hafifce one ciksin */
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav>#soTopupBtn{
    flex:1.25 1 0!important;
    font-weight:950!important;
  }
}

@media(max-width:390px){
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav{
    gap:6px!important;
  }
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav>button,
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav>#soTopupBtn,
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav>#soAdminBtn,
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav>.sr-account-btn{
    padding:0 8px!important;
    font-size:9.5px!important;
  }
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav>#soGuideTrigger{
    padding:0 10px!important;
    font-size:9px!important;
  }
}

/* Cok dar telefonlarda (<=340px) dort dugme cikarsa taşmasin diye
   yalnizca yazi kuculur; dokunma yuksekligi 44px korunur. */
@media(max-width:340px){
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav{gap:5px!important}
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav>button,
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav>#soTopupBtn,
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav>#soAdminBtn,
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav>.sr-account-btn{
    padding:0 6px!important;font-size:8.5px!important;
  }
  html[data-so-ust="v2"][data-so-view="simple"] .topbar .nav>#soGuideTrigger{
    padding:0 8px!important;font-size:8.5px!important;
  }
}