/* SkyTeam Mobile Filters - SAFE VERSION */

/* ============================================
   MOBILE FILTER DRAWER
   ============================================ */

/* Hide sidebar on mobile, show via drawer instead */
@media (max-width: 991px) {
    .col-xl-3.col-lg-4 {
        position: fixed !important;
        top: 0 !important;
        left: -100% !important;
        width: 85% !important;
        max-width: 350px !important;
        height: 100vh !important;
        z-index: 9999 !important;
        transition: left 0.3s ease !important;
        overflow-y: auto !important;
        background: #fff !important;
        box-shadow: 2px 0 15px rgba(0, 0, 0, 0.2) !important;
    }

    .col-xl-3.col-lg-4.mobile-filter-open {
        left: 0 !important;
    }

    /* Filter backdrop */
    .mobile-filter-backdrop {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background: rgba(0, 0, 0, 0.5);
        z-index: 9998;
    }

    .mobile-filter-backdrop.active {
        display: block !important;
    }

    /* Filter close button */
    .mobile-filter-close {
        position: absolute !important;
        top: 20px !important;
        right: 20px !important;
        background: #f1f5f9 !important;
        border: none !important;
        width: 35px !important;
        height: 35px !important;
        border-radius: 50% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        cursor: pointer !important;
        z-index: 10 !important;
    }

    .mobile-filter-close:hover {
        background: #e2e8f0 !important;
    }

    /* Results take full width on mobile */
    .col-xl-9.col-lg-8 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }
}

/* Filter count badge */
.filter-count {
    font-size: 12px !important;
    padding: 2px 8px !important;
    border-radius: 12px !important;
    font-weight: 600 !important;
}

/* Mobile filter trigger button */
.mobile-filter-trigger {
    position: sticky !important;
    top: 80px !important;
    z-index: 100 !important;
}

.mobile-filter-trigger .button {
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.2) !important;
}

/* ============================================
   HIDE MATRIX ON MOBILE
   ============================================ */
@media (max-width: 768px) {
    .flight-matrix {
        display: none !important;
    }

    .row.mb-20:has(.flight-matrix) {
        display: none !important;
    }
}