/******************************************************************************/
/* Mobile Touch Fix for Location Fields                                       */
/******************************************************************************/

/* Ensure location fields work properly on all mobile devices */
@media (max-width: 1024px) {
    /* Fix for iPad and tablet touch issues */
    .rtbs-main .rtbs-form-field.rtbs-form-field-pickup-location,
    .rtbs-main .rtbs-form-field.rtbs-form-field-dropoff-location {
        position: relative;
        overflow: visible !important;
    }

    /* Ensure input fields are fully tappable */
    .rtbs-main .rtbs-form-field.rtbs-form-field-pickup-location input[type="text"],
    .rtbs-main .rtbs-form-field.rtbs-form-field-dropoff-location input[type="text"] {
        position: relative;
        z-index: 2 !important;
        touch-action: manipulation !important;
        -webkit-tap-highlight-color: transparent !important;
        pointer-events: auto !important;
        cursor: pointer !important;
    }

    /* Fix floating label z-index issues on mobile */
    .rtbs-main .rtbs-form-field.rtbs-form-field-pickup-location .rtbs-floating-label,
    .rtbs-main .rtbs-form-field.rtbs-form-field-dropoff-location .rtbs-floating-label {
        pointer-events: none !important;
        z-index: 5 !important;
    }

    /* Ensure "Use my location" link is tappable */
    .rtbs-main .rtbs-my-location-link {
        pointer-events: auto !important;
        z-index: 20 !important;
        position: absolute !important;
        right: 8px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        padding: 6px 10px !important;
        min-width: 100px !important;
        min-height: 32px !important;
        background-color: rgba(255, 255, 255, 0.9) !important;
        border: 1px solid rgba(255, 140, 66, 0.3) !important;
        border-radius: 6px !important;
        text-align: center !important;
    }

    .rtbs-main .rtbs-my-location-link.enabled {
        display: inline-block !important;
    }

    /* Fix icon positioning on mobile */
    .rtbs-main .rtbs-form-field.rtbs-form-field-pickup-location .rtbs-meta-icon-2,
    .rtbs-main .rtbs-form-field.rtbs-form-field-dropoff-location .rtbs-meta-icon-2 {
        pointer-events: none !important;
        user-select: none !important;
        -webkit-tap-highlight-color: transparent !important;
    }

    /* Fix floating label active state padding/height on tablets */
    .rtbs-main .rtbs-form-field.rtbs-form-field-pickup-location input:focus~.rtbs-floating-label,
    .rtbs-main .rtbs-form-field.rtbs-form-field-pickup-location input:not(:placeholder-shown)~.rtbs-floating-label,
    .rtbs-main .rtbs-form-field.rtbs-form-field-dropoff-location input:focus~.rtbs-floating-label,
    .rtbs-main .rtbs-form-field.rtbs-form-field-dropoff-location input:not(:placeholder-shown)~.rtbs-floating-label {
        padding: 0 4px !important;
        line-height: 1.0 !important;
    }
}

/* Specific fixes for iPhone and small mobile devices */
@media (max-width: 768px) {
    /* Increase touch target size for better mobile usability */
    .rtbs-main .rtbs-form-field.rtbs-form-field-pickup-location input[type="text"],
    .rtbs-main .rtbs-form-field.rtbs-form-field-dropoff-location input[type="text"] {
        min-height: 60px !important;
        font-size: 16px !important; /* Prevents zoom on iOS */
        padding: 18px 20px 18px 56px !important;
    }

    /* Enhanced floating label behavior on mobile */
    .rtbs-main .rtbs-form-field.rtbs-form-field-pickup-location .rtbs-floating-label,
    .rtbs-main .rtbs-form-field.rtbs-form-field-dropoff-location .rtbs-floating-label {
        max-width: calc(100% - 140px) !important;
        font-size: 14px !important;
        line-height: 1.3 !important;
    }

}

/* Extra small mobile devices */
@media (max-width: 480px) {
    .rtbs-main .rtbs-form-field.rtbs-form-field-pickup-location .rtbs-floating-label,
    .rtbs-main .rtbs-form-field.rtbs-form-field-dropoff-location .rtbs-floating-label {
        max-width: calc(100% - 100px) !important;
        font-size: 13px !important;
    }

    .rtbs-main .rtbs-my-location-link {
        padding: 4px 8px !important;
        min-width: 90px !important;
        min-height: 28px !important;
        right: 6px !important;
    }

    .rtbs-main .rtbs-my-location-link a {
        color: #FF8C42 !important;
        font-weight: 600 !important;
        font-size: 11px !important;
        line-height: 20px !important;
        text-decoration: none !important;
    }

    .rtbs-main .rtbs-my-location-link:hover {
        background-color: rgba(255, 140, 66, 0.2) !important;
    }
}

/* Fix for iOS Safari specifically */
@supports (-webkit-touch-callout: none) {
    .rtbs-main .rtbs-form-field.rtbs-form-field-pickup-location input[type="text"],
    .rtbs-main .rtbs-form-field.rtbs-form-field-dropoff-location input[type="text"] {
        -webkit-appearance: none !important;
        -webkit-border-radius: 6px !important;
        border-radius: 6px !important;
        appearance: none !important;
    }
}

/* Fix for Android devices */
@media screen and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm) {
    .rtbs-main .rtbs-form-field.rtbs-form-field-pickup-location input[type="text"],
    .rtbs-main .rtbs-form-field.rtbs-form-field-dropoff-location input[type="text"] {
        touch-action: manipulation !important;
    }
}

/* Ensure autocomplete dropdown works on mobile */
.ui-autocomplete {
    z-index: 1000 !important;
    position: absolute !important;
}

.ui-autocomplete .ui-menu-item {
    padding: 12px 16px !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    cursor: pointer !important;
    touch-action: manipulation !important;
}

.ui-autocomplete .ui-menu-item:hover,
.ui-autocomplete .ui-menu-item:focus {
    background-color: #f5f5f5 !important;
}

/* Mobile autocomplete fixes */
@media (max-width: 768px) {
    .ui-autocomplete {
        max-width: 90vw !important;
        left: 5vw !important;
        right: 5vw !important;
        width: auto !important;
        max-height: 50vh !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    .ui-autocomplete .ui-menu-item {
        padding: 16px !important;
        font-size: 16px !important;
        min-height: 48px !important;
        display: flex !important;
        align-items: center !important;
        touch-action: manipulation !important;
        -webkit-tap-highlight-color: transparent !important;
    }

    .ui-autocomplete .ui-menu-item:hover,
    .ui-autocomplete .ui-menu-item:focus,
    .ui-autocomplete .ui-menu-item.ui-state-focus {
        background-color: #f5f5f5 !important;
        outline: none !important;
    }

    /* Prevent zoom on focus for iOS */
    .ui-autocomplete .ui-menu-item input {
        font-size: 16px !important;
    }
}

/* Additional mobile touch optimizations */
@media (max-width: 480px) {
    .ui-autocomplete {
        max-width: 95vw !important;
        left: 2.5vw !important;
        right: 2.5vw !important;
    }

    .ui-autocomplete .ui-menu-item {
        padding: 14px !important;
        font-size: 15px !important;
        min-height: 44px !important;
    }
}
