/* Mobile Optimization CSS */

/* Base Mobile Fixes */
@media (max-width: 991px) {
    /* Reorder layout - Flights first, then filters */
    .flight-booking .row {
        display: flex;
        flex-direction: column;
    }
    
    /* Move filters to bottom on mobile */
    .flight-booking .col-lg-4.col-xl-3 {
        order: 2;
        margin-bottom: 0 !important;
        margin-top: 20px;
    }
    
    /* Flights appear first */
    .flight-booking .col-lg-8.col-xl-9 {
        order: 1;
    }
    
    /* Search Summary Bar - Mobile */
    .trip-search-bar {
        margin-bottom: 15px;
    }
    
    .search-summary {
        padding: 12px;
        flex-direction: column;
        gap: 12px;
    }
    
    .search-info {
        flex-direction: column;
        gap: 8px;
        width: 100%;
    }
    
    .search-item {
        font-size: 13px;
        padding: 8px 0;
        border-bottom: 1px solid #eee;
    }
    
    .search-item:last-child {
        border-bottom: none;
    }
    
    .modify-search-btn {
        width: 100%;
        justify-content: center;
        padding: 10px;
    }
    
    /* Sorting Header - Mobile */
    .trip-booking-sort {
        flex-direction: column;
        gap: 10px;
        padding: 12px;
        margin-bottom: 15px;
    }
    
    .trip-booking-sort h5 {
        font-size: 16px;
        margin-bottom: 0;
    }
    
    .sort-options {
        width: 100%;
    }
    
    .sort-options select {
        width: 100%;
    }
    
    /* Quick Filters - Mobile */
    .quick-filters {
        gap: 8px;
        margin-bottom: 15px;
        overflow-x: auto;
        flex-wrap: nowrap;
        padding: 0 5px;
    }
    
    .quick-filter-btn {
        padding: 8px 12px;
        font-size: 12px;
        white-space: nowrap;
        flex-shrink: 0;
    }
    
    /* Flight Cards - Mobile */
    .flight-booking-item {
        padding: 12px;
        margin-bottom: 12px;
    }
    
    .flight-booking-header {
        flex-direction: column;
        gap: 10px;
    }
    
    .flight-airline-info {
        width: 100%;
    }
    
    .flight-booking-body {
        padding: 12px 0;
    }
    
    .flight-route-info {
        flex-direction: column;
        gap: 15px;
    }
    
    .flight-time-info {
        width: 100%;
    }
    
    .flight-stop-info {
        width: 100%;
        padding: 10px 0;
    }
    
    .flight-booking-footer {
        flex-direction: column;
        gap: 12px;
        padding-top: 12px;
    }
    
    .flight-price-info {
        width: 100%;
        text-align: center;
    }
    
    .flight-booking-btn {
        width: 100%;
    }
    
    .flight-booking-btn .theme-btn {
        width: 100%;
        justify-content: center;
    }
    
    /* Filter Sidebar - Mobile */
    .booking-sidebar {
        margin-top: 20px;
    }
    
    .booking-item {
        margin-bottom: 20px;
        padding: 15px;
    }
    
    .booking-title {
        font-size: 16px;
        margin-bottom: 12px;
    }
}

/* Tablet Adjustments */
@media (min-width: 768px) and (max-width: 991px) {
    .search-info {
        flex-direction: row;
        flex-wrap: wrap;
    }
    
    .search-item {
        width: 48%;
        border-bottom: none;
    }
    
    .trip-booking-sort {
        flex-direction: row;
        justify-content: space-between;
    }
    
    .sort-options {
        width: auto;
    }
}

/* Small Mobile Devices */
@media (max-width: 576px) {
    /* Hero Section - Mobile */
    .hero-section {
        padding: 20px 0;
    }
    
    .search-area {
        padding: 15px 0;
    }
    
    .search-wrapper {
        padding: 15px;
    }
    
    .search-box {
        padding: 15px;
    }
    
    /* Flight Type Radio Buttons */
    .flight-type {
        flex-direction: column !important;
        gap: 8px;
    }
    
    .form-check-inline {
        margin-right: 0 !important;
        width: 100%;
    }
    
    /* Search Form Fields */
    .flight-search-content .row {
        margin: 0 -5px;
    }
    
    .flight-search-content .col-lg-3,
    .flight-search-content .col-lg-4,
    .flight-search-content .col-lg-6 {
        padding: 0 5px;
        margin-bottom: 10px;
    }
    
    .form-group {
        margin-bottom: 10px;
    }
    
    .form-control {
        font-size: 14px;
        padding: 10px;
    }
    
    /* Search Button */
    .search-btn {
        margin-top: 10px;
    }
    
    .search-btn .theme-btn {
        width: 100%;
        padding: 12px;
        font-size: 14px;
    }
    
    /* Feature Area */
    .feature-area {
        padding: 40px 0;
    }
    
    .feature-item {
        margin-bottom: 20px;
        padding: 20px;
    }
    
    /* Flight Area */
    .flight-area {
        padding: 40px 0;
    }
    
    .flight-item {
        margin-bottom: 20px;
    }
    
    /* Testimonial Area */
    .testimonial-area {
        padding: 40px 0;
    }
    
    /* CTA Area */
    .cta-area {
        padding-bottom: 40px;
    }
    
    .cta-wrapper {
        padding: 30px 20px;
    }
    
    .cta-text h1 {
        font-size: 24px;
    }
    
    /* Flight List Page */
    .flight-list {
        padding: 40px 0;
    }
    
    /* Price Display */
    .price-amount {
        font-size: 20px;
    }
    
    .price-label {
        font-size: 12px;
    }
    
    /* Upgrade Modal - Mobile */
    .upgrade-modal-content {
        width: 95%;
        max-height: 90vh;
        margin: 20px auto;
    }
    
    .upgrade-options {
        flex-direction: column;
    }
    
    .upgrade-option {
        width: 100%;
    }
    
    .upgrade-modal-header h3 {
        font-size: 18px;
    }
    
    .upgrade-features {
        grid-template-columns: 1fr;
    }
}

/* Extra Small Devices */
@media (max-width: 375px) {
    .container {
        padding-left: 10px;
        padding-right: 10px;
    }
    
    .search-wrapper {
        padding: 10px;
    }
    
    .search-box {
        padding: 10px;
    }
    
    .flight-booking-item {
        padding: 10px;
    }
    
    .search-item {
        font-size: 12px;
    }
    
    .quick-filter-btn {
        padding: 6px 10px;
        font-size: 11px;
    }
}

/* Landscape Mobile Orientation */
@media (max-width: 991px) and (orientation: landscape) {
    .hero-section {
        min-height: auto;
    }
    
    .search-area {
        padding: 10px 0;
    }
}

/* Fix for iOS Safari */
@supports (-webkit-touch-callout: none) {
    .form-control {
        font-size: 16px !important; /* Prevents zoom on focus */
    }
}

/* Ensure proper spacing */
.py-120 {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
}

@media (max-width: 991px) {
    .py-120 {
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }
}

@media (max-width: 576px) {
    .py-120 {
        padding-top: 30px !important;
        padding-bottom: 30px !important;
    }
    
    .pt-120 {
        padding-top: 30px !important;
    }
    
    .pb-120 {
        padding-bottom: 30px !important;
    }
}

/* Fix container spacing */
@media (max-width: 991px) {
    .container {
        padding-left: 15px;
        padding-right: 15px;
    }
}

/* Improve touch targets for mobile */
@media (max-width: 991px) {
    .form-check-input {
        width: 18px;
        height: 18px;
        margin-top: 2px;
    }
    
    .form-check-label {
        padding-left: 5px;
        cursor: pointer;
    }
    
    button, .btn, .theme-btn {
        min-height: 44px; /* iOS recommended touch target */
    }
}