/* Touch Swipe Handler Visual Feedback Styles */
.touch-active {
    transition: transform 0.1s ease-out;
}

.swiping {
    cursor: grabbing;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

.swipe-complete {
    animation: swipeComplete 0.2s ease-out;
}

@keyframes swipeComplete {
    0% { transform: scale(1); }
    50% { transform: scale(1.02); }
    100% { transform: scale(1); }
}

/* Prevent text selection during swipe */
.modal-body.swiping * {
    user-select: none !important;
    -webkit-user-select: none !important;
    -moz-user-select: none !important;
    -ms-user-select: none !important;
}

/* Smooth transitions for slideshow navigation */
.slideshow-view.swipe-transitioning .modal-carousel-item {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Touch-friendly navigation buttons */
@media (max-width: 768px) {
    .nav-button {
        min-height: 44px;
        min-width: 44px;
        touch-action: manipulation;
    }
    
    .nav-button:active {
        transform: scale(0.95);
        transition: transform 0.1s ease-out;
    }
}

/* Halloween-themed swipe indicators (optional) */
.swipe-indicator {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 2rem;
    color: #ff6b35;
    opacity: 0;
    transition: opacity 0.2s ease-out;
    pointer-events: none;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.swipe-indicator.left {
    left: 20px;
}

.swipe-indicator.right {
    right: 20px;
}

.swipe-indicator.show {
    opacity: 0.8;
    animation: swipeHint 0.5s ease-out;
}

@keyframes swipeHint {
    0% { transform: translateY(-50%) scale(0.8); opacity: 0; }
    50% { transform: translateY(-50%) scale(1.1); opacity: 1; }
    100% { transform: translateY(-50%) scale(1); opacity: 0.8; }
}