/* =====================================================================================
   PROPERTIES INDEX MOBILE STYLES
   Villa listesi sayfası için mobil özel CSS stilleri
   ===================================================================================== */

/* Mobile Filter Sidebar */
@media (max-width: 1023px) {
    #filter-sidebar {
        position: relative;
        z-index: 40;
        margin-bottom: 1.5rem;
        flex-direction: column;
        max-height: 85vh;
    }
    
    /* Hidden class'ı varsa gizle */
    #filter-sidebar.hidden {
        display: none !important;
    }
    
    /* Hidden class'ı yoksa göster */
    #filter-sidebar:not(.hidden) {
        display: flex !important;
    }
    
    #filter-sidebar form {
        display: flex;
        flex-direction: column;
        flex: 1;
        min-height: 0;
        gap: 1rem;
    }
    
    #filter-sidebar form > div.rounded-xl {
        flex: 1;
        overflow-y: auto;
        min-height: 0;
        -webkit-overflow-scrolling: touch;
    }
    
    #filter-sidebar form > button[type="submit"] {
        flex-shrink: 0;
        position: sticky;
        bottom: 0;
        margin-top: auto;
        z-index: 10;
        box-shadow: 0 -4px 6px -1px rgba(0, 0, 0, 0.1), 0 -2px 4px -1px rgba(0, 0, 0, 0.06);
    }
    
    #mobile-filter-toggle {
        margin-bottom: 1rem;
    }
}

/* Mobile Sort Dropdown */
@media (max-width: 767px) {
    #mobile-sort-dropdown {
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    }
}

/* Tablet ve Mobil için View Toggle Optimizasyonu */
@media (max-width: 1023px) {
    /* View toggle butonları mobilde daha kompakt */
    .view-toggle-container {
        width: 100%;
    }
}