/* ==========================================================================
   FuyaMC — Mobil sadeleştirme katmanı
   Amaç: mobilde animasyon/dekor yükünü azaltmak, taşan/üst üste binen
   buton ve sabit öğeleri düzeltmek, dokunmatik için daha okunaklı bir
   düzen sunmak.
   Kapsam: <= 1023.98px (tablet + telefon), telefon özel: <= 639.98px
   ========================================================================== */

/* ---------- 1) Animasyon ve ağır efektleri kapat ---------- */
@media (max-width: 1023.98px) {
    html { scroll-behavior: auto !important; }
    /* Fixed arka planlar mobilde kaydırma sırasında titrer */
    body, body::before { background-attachment: scroll !important; }

    /* Dekoratif sonsuz animasyonları durdur (tek seferlik girişler de anında biter) */
    *, *::before, *::after {
        animation-duration: .001ms !important;
        animation-delay: 0s !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
        transition-delay: 0s !important;
    }

    /* Yükleniyor göstergeleri çalışmaya devam etsin */
    #siteLoading .sl-spinner { animation: slDon .8s linear infinite !important; }
    .spinner { animation: spin .7s linear infinite !important; }

    /* Ağır arka plan katmanları */
    .bg-ambient,
    .bg-orb,
    #fx-particles,
    .cursor-glow,
    .hero-glow {
        display: none !important;
    }

    .header-banner::before { opacity: .12 !important; }
    .navbar-custom {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    /* Scroll-reveal animasyonları: içerik hemen görünsün */
    .reveal,
    .reveal-left,
    .reveal-right,
    .reveal-scale,
    .reveal-blur {
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
    }
    body.yukleniyor #ustAlan,
    body.yukleniyor .header-banner,
    body.yukleniyor > main > section,
    body.yukleniyor > footer {
        opacity: 1 !important;
        transform: none !important;
    }

    /* Hareketli metin/ikon/logo efektleri */
    .gradient-text,
    .hero-ip,
    .hero-logo,
    .btn-hero,
    .icon-bob,
    .bar-title,
    .live-dot,
    .destek-talep.kirmizi,
    .destek-talep.yeni,
    .destek-talep.one-cikan,
    .destek-ilgilen-roz {
        animation: none !important;
    }

    /* Hover'a bağlı kaymalar mobilde kilitlenmesin */
    .card-custom:hover,
    .btn-primary:hover,
    .btn-secondary:hover,
    .btn-kredi:hover,
    .footer-link:hover,
    .section-nav-btn:hover,
    .header-side-chip:hover {
        transform: none !important;
    }
    .btn-primary::after { display: none !important; }

    /* Arka plan bulanıklıkları mobil GPU'yu yoruyor */
    .backdrop-blur-sm,
    .backdrop-blur,
    .backdrop-blur-md,
    .backdrop-blur-lg,
    .backdrop-blur-xl,
    .backdrop-blur-2xl,
    .backdrop-blur-3xl {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }
    /* Inline blur kullanan popup/kartlar da mobilde bulanıklaştırmasın */
    [style*="backdrop-filter"] {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    /* Duran yatay şeritler: animasyon yerine kaydırılabilir olsun */
    #sonYuklemePist,
    #profilPist {
        width: auto !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        animation: none !important;
        transform: none !important;
    }
    #sonYuklemePist::-webkit-scrollbar,
    #profilPist::-webkit-scrollbar { display: none; }

    /* Mobilde canlı destek balonu yalnızca ana sayfada görünür.
       Destek/sohbet ve diğer sayfalarda aynı işi sayfa kendisi yaptığı için gizlenir. */
    body:not(.ana-sayfa) #canliBalon,
    body:not(.ana-sayfa) #canliPanel,
    body:not(.ana-sayfa) #canliYetkiliBtn { display: none !important; }
    #canliBalonBtn::after { display: none; }
}

/* ---------- 2) Telefon düzeni ---------- */
@media (max-width: 639.98px) {
    /* Sabit duyuru bandı alt içeriği kapatmasın */
    body.duyuru-var:not(.sohbet-tam-body) { padding-bottom: 56px; }

    /* Duyuru bandı: kayan yazı yerine tek satır sabit ve kompakt */
    #duyuruBar {
        --duyuru-yukseklik: 44px !important;
        --duyuru-font: 13px !important;
        z-index: 55;
    }
    .duyuru-track {
        width: 100% !important;
        height: 44px !important;
        justify-content: center !important;
        animation: none !important;
        transform: none !important;
        will-change: auto !important;
    }
    .duyuru-metin {
        display: block !important;
        width: 100%;
        max-width: 100%;
        padding: 0 14px !important;
        line-height: 44px !important;
        font-size: 13px !important;
        text-align: center;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .duyuru-metin[aria-hidden="true"] { display: none !important; }

    /* ---------- Navbar: kalabalığı azalt ---------- */
    .navbar-custom > div {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
    .navbar-custom > div > div {
        flex-wrap: nowrap !important;
        column-gap: 6px !important;
    }
    .navbar-custom .nav-logo { margin-right: 4px !important; }
    .navbar-custom .nav-logo img { height: 30px !important; }
    /* Üst bardaki kısa butonlar sıkışmasın: yazılar zaten mobilde ikona düşer */
    .navbar-custom .btn-kredi,
    .navbar-custom .btn-primary {
        flex: 0 0 auto;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    .navbar-custom .nav-hamburger {
        width: 42px !important;
        height: 42px !important;
        flex: 0 0 auto;
    }

    /* ---------- Hero ---------- */
    .header-banner {
        height: auto !important;
        min-height: 0 !important;
    }
    .header-banner .text-center {
        padding: 64px 16px 28px !important;
    }
    .hero-logo {
        width: min(62vw, 220px) !important;
        max-height: 26vh !important;
        filter: none !important;
    }
    .hero-ip { font-size: clamp(1.9rem, 9vw, 2.65rem) !important; }
    .hero-ver { font-size: .8rem !important; }

    /* ---------- Bölüm boşlukları ---------- */
    main > section[class*="py-16"],
    main > section[class*="py-20"],
    main > section[class*="py-24"] {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }
    main > section > .max-w-6xl,
    main > section > .max-w-7xl {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    /* Çok kolonlu ızgaraları tek kolona indir (2'li küçük kartlar korunur) */
    main .grid[class*="grid-cols-3"],
    main .grid[class*="grid-cols-4"],
    main .grid[class*="grid-cols-5"],
    main .grid[class*="grid-cols-6"] {
        grid-template-columns: 1fr !important;
    }

    /* Taşan tablo/içerikler */
    main table,
    .om-icerik table {
        display: block;
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    main img,
    .om-icerik img,
    .om-icerik video {
        max-width: 100% !important;
        height: auto !important;
    }
    .om-icerik pre,
    pre {
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* iOS'ta odaklanınca sayfanın zoom yapmasını engelle */
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
    select,
    textarea {
        font-size: 16px !important;
    }

    /* ---------- Butonlar ---------- */
    .btn,
    .btn-primary,
    .btn-secondary,
    .btn-kredi {
        min-height: 42px;
        max-width: 100%;
        padding: 10px 14px;
        white-space: normal;
        text-align: center;
        line-height: 1.3;
        min-width: 0;
    }
    .btn-sm {
        min-height: 36px;
        padding: 8px 12px;
    }
    /* Yan yana butonlar taşarsa alt satıra geçsin */
    .flex:has(> .btn),
    .flex:has(> .btn-primary),
    .flex:has(> .btn-secondary),
    .flex:has(> .btn-kredi) {
        flex-wrap: wrap !important;
    }

    /* ---------- Sabit öğeler: üst üste binmesin ---------- */
    /* Canlı destek balonu duyuru bandının üstünde */
    #canliBalon {
        right: 12px !important;
        bottom: 56px !important;
        z-index: 9000 !important;
    }
    #canliBalonBtn { width: 48px !important; height: 48px !important; font-size: 22px !important; }

    /* "Bildirim Aç" düğmesi balonun üstünde */
    #destekBildirimKoseBtn {
        right: 12px !important;
        bottom: 112px !important;
        padding: 10px 14px !important;
        font-size: 11px !important;
        max-width: calc(100vw - 24px);
    }
    #destekBildirimKoseBtn i { font-size: 15px; }

    /* PC önerisi mobilde anlamsız */
    #pcOneri { display: none !important; }

    /* Sabit etkinlik kartı: ekran kenarına yapışıp butonları kapatmasın */
    #etkinlikSabit {
        max-width: min(300px, calc(100vw - 24px)) !important;
        z-index: 9001 !important;
    }
    #etkinlikSabit[data-kose="sag_alt"] { right: 12px !important; bottom: 112px !important; }
    #etkinlikSabit[data-kose="sol_alt"] { left: 12px !important; bottom: 56px !important; }
    #etkinlikSabit[data-kose="sag_ust"] { right: 12px !important; top: 64px !important; }
    #etkinlikSabit[data-kose="sol_ust"] { left: 12px !important; top: 64px !important; }

    /* Push bilgi balonu duyuru bandının üstünde kalsın */
    body.duyuru-var div[style*="z-index:100001"] {
        bottom: 64px !important;
    }

    /* Toast'lar duyuru bandının üstünde kalsın */
    .toast,
    .toast-container,
    #destekToast,
    #cekilisToast,
    #anketToast,
    #dosyaToast,
    #oyToast,
    #oneriToast,
    #casinoToast,
    #formToast {
        bottom: 64px !important;
        max-width: calc(100vw - 24px) !important;
    }

    /* ---------- Modal / popup ---------- */
    #duyuruPopup > div,
    #bildirimListeWrap > div,
    #destekBildirimPopup {
        max-width: calc(100vw - 20px) !important;
        max-height: 88vh !important;
        padding: 18px !important;
        border-radius: 16px !important;
    }
    #duyuruPopupKapat {
        width: 100%;
        min-height: 44px;
    }

    /* ---------- Sohbet / destek: başlık ve giriş alanı taşmasın ---------- */
    .sohbet-kbaslik {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 6px;
    }
    .sohbet-kbaslik > * { min-width: 0; max-width: 100%; }
    .sohbet-giris { flex-wrap: wrap; }
    .sohbet-giris > * { min-width: 0; max-width: 100%; }
    .destek-durum-sec,
    .destek-durum-etiket,
    .destek-durum-bos { max-width: 100% !important; }

    /* ---------- İçerik kutuları ---------- */
    .card-custom,
    .card {
        border-radius: 14px;
    }
    .kredi-badge { font-size: .7rem; }

    /* Dokunmatik geri bildirim */
    a, button, [role="button"] {
        -webkit-tap-highlight-color: rgba(245, 158, 11, .15);
    }
}

/* ---------- 3) Çok küçük ekranlar (<= 380px) ---------- */
@media (max-width: 380px) {
    .navbar-custom .nav-logo img { height: 26px !important; }
    .navbar-custom .nav-hamburger { width: 38px !important; height: 38px !important; }
    .hero-logo { width: min(58vw, 190px) !important; }
    #canliBalonBtn { width: 44px !important; height: 44px !important; }
    #destekBildirimKoseBtn { font-size: 10px !important; padding: 9px 12px !important; }
}

/* ---------- 4) Hareket azaltma tercihi: her ekran boyutunda ---------- */
@media (prefers-reduced-motion: reduce) {
    .bg-orb,
    #fx-particles,
    .cursor-glow {
        display: none !important;
    }
}