/* ================================================================
   VIPTRANSfY — MOBİL DÜZELTME PAKETİ
   Bu dosyayı public/css/mobile-fix.css olarak kaydedin
   ve layout blade'de </head> öncesine şunu ekleyin:
   <link href="css/mobile-fix.css" rel="stylesheet">
   ================================================================ */


/* ----------------------------------------------------------------
   1. PRELOADER — Pozisyon ve görsel düzeltme
   
   designesia.js şunu oluşturuyor:
   #de-preloader
     └── div.de-preloader
           └── div.custom-loader-image
                 └── <center>
                       └── <img src="/img/loading.gif">

   <center> tag'i mobilde sol hizalanıyor — bunu düzeltiyoruz.
   ---------------------------------------------------------------- */

/* Ana preloader kapsayıcı — tam ekran ortası */
#de-preloader {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: #ffffff !important;
    z-index: 999999 !important;
    margin: 0 !important;
    padding: 0 !important;
    /* Overflow gizle — taşan içerik görünmesin */
    overflow: hidden !important;
}

/* JS'nin oluşturduğu .de-preloader div'i — tam doldur ve flex ile ortala */
#de-preloader .de-preloader {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* .custom-loader-image — içeriği ortala */
#de-preloader .custom-loader-image {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: auto !important;
    /* Eski left/top/position değerlerini sıfırla */
    position: static !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    margin: 0 auto !important;
}

/* <center> tag'ini block ve tam genişlik yap */
#de-preloader .custom-loader-image center {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin: 0 auto !important;
}

/* GIF görselini ortala ve boyutlandır */
#de-preloader .custom-loader-image img.hb,
#de-preloader .custom-loader-image center img {
    display: block !important;
    margin: 0 auto !important;
    position: static !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    /* Mobilde daha iyi görünüm için ölçekle */
    width: 90px !important;
    height: auto !important;
    max-width: 90px !important;
}

/* ----------------------------------------------------------------
   2. HEADER MOBİL DÜZELTMESİ
   
   Topbar (40px) + Nav (80px) = ~120px masaüstü.
   Mobilde topbar gizleniyor, sadece nav kalıyor (~70px).
   ---------------------------------------------------------------- */
@media (max-width: 991px) {

    /* Topbar'ı gizle — zaten xs-hide ile yazı gizliydi
       ama div hâlâ yer kaplıyordu */
    #topbar {
        display: none !important;
    }

    /* Header — sabit + tam genişlik */
    header.transparent {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        z-index: 9000 !important;
    }

    /* Siyah spacer bar — sadece nav yüksekliği kadar */
    .ustarka {
        height: 70px !important;
        min-height: 70px !important;
    }

    /* İçerik nav'ın altına kaymayı önle */
    #content {
        padding-top: 70px !important;
    }

    /* Logo küçülsün */
    #logo img {
        max-height: 36px !important;
    }

    /* Üyelik butonu */
    .menu_side_area .btn-main {
        font-size: 11px !important;
        padding: 5px 10px !important;
    }
}

@media (min-width: 992px) {
    .ustarka {
        height: 140px !important;
    }
}
