/* Mobile Touch Optimization
 * Fixes scroll locking and touch conflicts on mobile devices
 */

/* Prevent text selection on clickable items */
.modal-gallery-item,
.carousel-slide,
.gallery-item,
.repair-card {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    /* Remove tap highlight on iOS */
}

/* Enable proper touch scrolling */
.gallery-modal .modal-body,
.repair-modal-info,
.gallery-modal-grid {
    touch-action: pan-y !important;
    /* Allow vertical scrolling */
    -webkit-overflow-scrolling: touch !important;
    /* Smooth scrolling on iOS */
}

/* Prevent touch conflicts on modal overlays */
.gallery-modal,
.repair-detail-modal {
    touch-action: none !important;
    /* Prevent scroll on backdrop */
}

/* Allow scrolling inside modal content */
.gallery-modal .modal-content,
.repair-modal-content {
    touch-action: auto !important;
    /* Re-enable touch inside content */
}

/* Clickable items should allow tap but not drag */
.modal-gallery-item,
.carousel-slide,
.gallery-item {
    touch-action: manipulation !important;
    /* Fast tap, no double-tap zoom */
}

/* Buttons and links - fast tap response */
button,
a,
.btn-primary,
.btn-secondary,
.modal-close,
.repair-modal-close {
    touch-action: manipulation !important;
    -webkit-tap-highlight-color: rgba(59, 130, 246, 0.1);
}

/* Prevent selection on overlay text */
.modal-item-info,
.slide-info,
.repair-modal-header {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Allow text selection in description areas */
.repair-modal-description,
.modal-item-description,
.structured-field-content {
    -webkit-user-select: text !important;
    -moz-user-select: text !important;
    -ms-user-select: text !important;
    user-select: text !important;
}

/* Mobile-specific: Prevent scroll bounce on modals */
@media (max-width: 768px) {

    .gallery-modal.active,
    .repair-detail-modal.active {
        position: fixed !important;
        overflow: hidden !important;
    }

    .gallery-modal .modal-body,
    .repair-modal-info {
        overflow-y: scroll !important;
        -webkit-overflow-scrolling: touch !important;
        overscroll-behavior: contain !important;
        /* Prevent scroll chaining */
    }

    /* CRITICAL: Ensure modal content can scroll properly */
    .repair-modal-content {
        overflow: hidden !important;
        /* Parent must hide overflow */
    }

    .repair-modal-body {
        overflow: visible !important;
        /* Allow child to handle scroll */
    }

    /* Ensure clickable items don't interfere with scrolling */
    .modal-gallery-item,
    .gallery-item {
        touch-action: manipulation !important;
        cursor: pointer !important;
    }

    /* Remove hover effects on mobile (they can cause issues) */
    .modal-gallery-item:hover,
    .gallery-item:hover {
        transform: none !important;
    }

    /* Faster tap response */
    .modal-gallery-item:active,
    .gallery-item:active {
        opacity: 0.8;
        transition: opacity 0.1s ease;
    }
}