/* Swipe Gesture Visual Feedback */
.hero-slider.touch-active,
.party-slider-container.touch-active,
.past-event-slider-container.touch-active {
    transition: transform 0.1s ease-out;
    cursor: grabbing;
}

.hero-slider.touch-active .hero-slide,
.party-slider-container.touch-active .party-slide,
.past-event-slider-container.touch-active .past-event-slide {
    pointer-events: none;
}

/* Swipe progress indicator */
.hero-slider::after,
.party-slider-container::after,
.past-event-slider-container::after {
    content: '';
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 4px;
    background: rgba(255, 255, 255, 0.3);
    border-radius: 2px;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.hero-slider.touch-active::after,
.party-slider-container.touch-active::after,
.past-event-slider-container.touch-active::after {
    opacity: 1;
}

.hero-slider::before,
.party-slider-container::before,
.past-event-slider-container::before {
    content: '';
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 4px;
    background: #ff6b6b;
    border-radius: 2px;
    transition: width 0.1s ease;
}

.hero-slider.touch-active::before,
.party-slider-container.touch-active::before,
.past-event-slider-container.touch-active::before {
    width: calc(60px * var(--swipe-progress, 0));
}

/* Touch feedback for slider buttons */
.slider-prev:active,
.slider-next:active,
.party-slider-prev:active,
.party-slider-next:active,
.past-event-slider-prev:active,
.past-event-slider-next:active {
    transform: scale(0.95);
    transition: transform 0.1s ease;
}

/* Enhanced touch targets for mobile */
@media (max-width: 768px) {
    .slider-prev,
    .slider-next,
    .party-slider-prev,
    .party-slider-next,
    .past-event-slider-prev,
    .past-event-slider-next {
        min-width: 44px;
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    /* Improve touch feedback */
    .hero-slider,
    .party-slider-container,
    .past-event-slider-container {
        touch-action: pan-y pinch-zoom;
    }
    
    /* Disable text selection during swipe */
    .hero-slider.touch-active *,
    .party-slider-container.touch-active *,
    .past-event-slider-container.touch-active * {
        user-select: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
    }
}

/* Haptic feedback simulation for desktop */
@media (hover: hover) {
    .hero-slider:hover,
    .party-slider-container:hover,
    .past-event-slider-container:hover {
        cursor: grab;
    }
    
    .hero-slider:active,
    .party-slider-container:active,
    .past-event-slider-container:active {
        cursor: grabbing;
    }
}

/* Swipe direction indicators */
.swipe-indicator {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    background: rgba(255, 107, 107, 0.9);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 18px;
    opacity: 0;
    transition: opacity 0.3s ease, transform 0.3s ease;
    pointer-events: none;
    z-index: 10;
}

.swipe-indicator.left {
    left: 20px;
    transform: translateY(-50%) translateX(-20px);
}

.swipe-indicator.right {
    right: 20px;
    transform: translateY(-50%) translateX(20px);
}

.hero-slider.swiping-left .swipe-indicator.left,
.party-slider-container.swiping-left .swipe-indicator.left,
.past-event-slider-container.swiping-left .swipe-indicator.left {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
}

.hero-slider.swiping-right .swipe-indicator.right,
.party-slider-container.swiping-right .swipe-indicator.right,
.past-event-slider-container.swiping-right .swipe-indicator.right {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
}