/* Mobil Görünüm Düzeltmeleri - Sağ Taraf Boşluk Sorunu */

/* Body ve HTML overflow düzeltmesi */
html, body {
    overflow-x: hidden !important;
    max-width: 100% !important;
    width: 100% !important;
}

/* Ana container'ları düzelt */
#wrapper, .main, #home {
    overflow-x: hidden !important;
    max-width: 100% !important;
    width: 100% !important;
}

/* Grid container genişlik kontrolü */
.grid-container {
    max-width: 100% !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    box-sizing: border-box !important;
}

/* Mobil için özel düzeltmeler */
@media (max-width: 768px) {
    /* Tüm section'lar için */
    .section {
        overflow-x: hidden !important;
        max-width: 100% !important;
    }
    
    /* Kategori grid düzeltmesi */
    .epcl-popular-categories .epcl-flex {
        overflow-x: hidden !important;
        max-width: 100% !important;
    }
    
    .epcl-popular-categories .left {
        max-width: 100% !important;
        width: 100% !important;
    }
    
    /* Grid item'lar için */
    .item.mobile-grid-33 {
        width: 33.333% !important;
        max-width: 33.333% !important;
        padding-left: 5px !important;
        padding-right: 5px !important;
        box-sizing: border-box !important;
    }
    
    /* Flex container düzeltmeleri */
    .epcl-flex {
        flex-wrap: wrap !important;
        overflow-x: hidden !important;
    }
    
    /* Grid container padding düzeltmesi */
    .grid-container {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
    
    /* Kategori top bar düzeltmesi */
    .categories-topbar {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }
    
    .categories-topbar .topbar-inner {
        overflow-x: hidden !important;
        max-width: 100% !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
        box-sizing: border-box !important;
    }
    
    /* Header düzeltmesi */
    #header .grid-container {
        padding-left: 12px !important;
        padding-right: 12px !important;
        max-width: 100% !important;
    }
}

/* Çok küçük ekranlar için ekstra düzeltme */
@media (max-width: 480px) {
    .grid-container {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    
    .item.mobile-grid-33 {
        padding-left: 3px !important;
        padding-right: 3px !important;
    }
}
