/* =================================================================
   CADDEBET — MOBİL UYGULAMA DAVRANIŞI
   Alt sekme çubuğu, güvenli alanlar, dokunma iyileştirmeleri.
   ================================================================= */

/* ---------- Alt sekme çubuğu ---------- */
.alt-bar{display:none}

@media(max-width:900px){
  .alt-bar{
    position:fixed;left:0;right:0;bottom:0;z-index:70;
    display:grid;grid-template-columns:repeat(5,1fr);align-items:end;gap:2px;
    padding:8px 8px calc(8px + env(safe-area-inset-bottom));
    background:linear-gradient(180deg,rgba(10,11,17,.92),rgba(6,7,11,.99));
    border-top:1px solid rgba(255,255,255,.07);
    backdrop-filter:blur(16px);
    box-shadow:0 -18px 40px -30px #000;
    transition:transform .3s cubic-bezier(.2,.8,.3,1);
  }
  .alt-bar.gizli{transform:translateY(112%)}

  .alt-bar a,.alt-bar .ab-tus{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
    padding:7px 2px;border-radius:14px;min-height:52px;
    color:var(--muted-2);background:none;border:0;font:inherit;cursor:pointer;
    transition:.2s;-webkit-tap-highlight-color:transparent;
  }
  .alt-bar .ab-ic{
    width:26px;height:26px;display:grid;place-items:center;font-size:20px;transition:.2s;
  }
  .alt-bar .ab-yz{font-size:10px;font-weight:600;letter-spacing:.01em}

  .alt-bar a:active,.alt-bar .ab-tus:active{transform:scale(.94)}
  .alt-bar a.on{color:#fff}
  .alt-bar a.on .ab-ic{
    color:var(--brand-2);
    filter:drop-shadow(0 0 10px rgba(238,4,57,.7));
  }
  .alt-bar a.on::before{
    content:"";position:absolute;margin-top:-14px;width:22px;height:3px;border-radius:99px;
    background:var(--brand);box-shadow:0 0 12px rgba(238,4,57,.9);
  }

  /* Ortadaki Canlı RTP: yükseltilmiş alev düğmesi */
  .alt-bar a.orta{position:relative}
  .alt-bar a.orta .ab-ic{
    width:52px;height:52px;border-radius:18px;margin-top:-26px;font-size:24px;color:#fff;
    background:linear-gradient(150deg,#f5a524,var(--brand));
    box-shadow:0 14px 28px -12px rgba(238,4,57,.95),inset 0 1px 0 rgba(255,255,255,.3);
    animation:altAlev 3s ease-in-out infinite;
  }
  .alt-bar a.orta.on::before{display:none}
  @keyframes altAlev{
    0%,100%{box-shadow:0 14px 28px -12px rgba(238,4,57,.95),inset 0 1px 0 rgba(255,255,255,.3)}
    50%{box-shadow:0 16px 36px -10px rgba(245,120,36,1),inset 0 1px 0 rgba(255,255,255,.4)}
  }

  /* Çubuk içeriği kapatmasın */
  body{padding-bottom:calc(74px + env(safe-area-inset-bottom))}
  .ftr{padding-bottom:20px}
  #topBtn{bottom:calc(88px + env(safe-area-inset-bottom))}
}

/* ---------- Genel mobil dokunma iyileştirmeleri ---------- */
@media(max-width:900px){
  html{-webkit-text-size-adjust:100%}
  body{overscroll-behavior-y:contain}
  a,button,.btn,label,select,input{-webkit-tap-highlight-color:rgba(238,4,57,.14)}
  .btn,.ys,.tk,.yan-oge,.rtp-tab{min-height:42px}
  /* Yatay kayan alanlar parmakla akıcı kaysın */
  .yayin-sekme,.tv-katlar,.etk-suz,.yan-liste,.kz-yol,.tbl-wrap{
    -webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;
  }
  .kz{scroll-snap-align:start}
  /* Form alanlarında iOS yakınlaştırmasın */
  input,select,textarea{font-size:16px}
}

/* Telefonda üst şerit sabit kalsın, alan kaplamasın */
@media(max-width:900px){
  .hdr{position:sticky;top:0;z-index:50}
  .hdr-in{min-height:60px}
}

/* Uygulama gibi açıldığında (ana ekrana eklenmişse) */
@media(display-mode:standalone){
  .ticker{display:none}
  body{padding-top:env(safe-area-inset-top)}
}

/* =================================================================
   AÇILIŞ ANİMASYONU — hangi video yüklenirse yüklensin ekrana uyar
   (Bu dosya en son yüklendiği için modules.css'teki cover kuralını ezer.)
   ================================================================= */
.intro{background:#000}
.intro video{background:#000}

/* Yalnızca ekran videodan belirgin dar olduğunda (telefon/tablet dikey):
   video kırpılmadan tam görünür. Masaüstü oranları (16:10 ve 16:9) etkilenmez. */
@media(max-aspect-ratio:4/3){
  .intro video{object-fit:contain !important;width:100%;height:100%}
}
@media(max-width:760px){
  .intro-bar{height:3px}
  /* Dikey ekranda video ortada dursun, üstü altı marka zemini olsun.
     Zemin ÖNCE düz siyah: yarı saydam degrade tek başına kalırsa
     sayfanın içeriği animasyonun arkasından görünüyordu. */
  .intro{
    background-color:#000;
    background-image:radial-gradient(circle at 50% 42%,rgba(238,4,57,.18),transparent 62%);
  }
}

/* =================================================================
   ORİJİNAL LOGO — DAR EKRAN
   Logo görseli metin logodan daha geniştir; küçük telefonlarda
   başlığı taşırmasın diye kademeli küçülür.
   ================================================================= */
@media(max-width:900px){
  .hdr .brand-img{height:34px}
}
@media(max-width:560px){
  .hdr .brand-img{height:30px}
  .yan-bas .brand-img{height:28px}
}
@media(max-width:400px){
  .hdr .brand-img{height:26px}
}

/* Sağ kenar şeridi.
   Telefonda sayfa yatayda birkaç piksel taşabildiği için "right:0"
   bazı tarayıcılarda ekranın dışına düşüyordu. Şerit bu yüzden
   soldan başlayıp GÖRÜNEN genişlik (100vw) kadar yer kaplar ve
   düğmeler bu kutunun sağına yaslanır — böylece her koşulda
   ekranın sağ kenarında durur. */
@media(max-width:900px){
  .sdok{
    left:0;right:auto;width:100vw;max-width:100vw;
    bottom:calc(92px + env(safe-area-inset-bottom,0px));
    align-items:flex-end;
  }
}

/* =================================================================
   ÜST ŞERİT — DAR EKRAN DÜZENİ
   Dil düğmesi eklendiği için küçük telefonlarda "İş Ortaklığı"
   üstten kalkar (yan menüde ve alt barda zaten var); böylece
   logo + dil + giriş düğmesi ekrana sığar, taşma olmaz.
   ================================================================= */
@media(max-width:560px){
  .hdr-in{gap:8px}
  .hdr-cta{gap:6px;min-width:0}
  .hdr-cta .btn.ortak{display:none}
  .hdr-cta .btn.brand{padding:0 11px;font-size:12.5px;white-space:nowrap}
}
@media(max-width:400px){
  .hdr-cta .btn.brand span,.hdr-cta .btn.brand{font-size:12px}
  .hdr .dil-tus .of{display:none}
  .hdr .dil-tus{padding:0 9px}
}