/**
 * Mobil Dokunmatik Optimizasyonu CSS
 * Touch feedback, ripple effects ve swipe göstergeleri
 */

/* Touch Ripple Effect */
.touch-ripple {
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.6);
    transform: scale(0);
    animation: ripple-animation 0.6s ease-out;
    pointer-events: none;
    z-index: 1000;
}

@keyframes ripple-animation {
    to {
        transform: scale(4);
        opacity: 0;
    }
}

/* Touch Active State */
.touch-active {
    transform: scale(0.95);
    opacity: 0.8;
    transition: transform 0.1s ease, opacity 0.1s ease;
}

/* Dokunmatik Optimizasyonları */
a, button, .category-item, .menu-button, .contact-btn, .action-btn, 
.product-item, .menu-item-card, .product-card, .category-card {
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    touch-action: manipulation;
    cursor: pointer;
}

/* Swipe Indicator (opsiyonel) */
.swipe-indicator {
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.7);
    color: white;
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 0.75rem;
    opacity: 0;
    transition: opacity 0.3s ease;
    z-index: 9999;
    pointer-events: none;
}

.swipe-indicator.show {
    opacity: 1;
}

/* Swipe Animation */
.swiping {
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Touch Feedback için Active States */
.category-item:active,
.menu-button:active,
.contact-btn:active,
.action-btn:active,
.product-item:active,
.menu-item-card:active {
    transform: scale(0.97);
    opacity: 0.9;
}

/* Mobilde daha iyi touch target boyutları */
@media (max-width: 768px) {
    a, button, .category-item, .menu-button, .contact-btn, 
    .action-btn, .product-item, .menu-item-card {
        min-height: 40px;
        min-width: 40px;
    }
    
    /* Touch target'lar için padding artır */
    .contact-btn, .action-btn {
        padding: 12px 16px;
    }
}

/* Prevent text selection on touch */
* {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Input ve textarea için selection'ı geri getir */
input, textarea, [contenteditable="true"] {
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
}

/* Smooth scrolling for swipe */
html {
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
}

body {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain;
}

/* Swipe gesture visual feedback */
.swipe-left-indicator,
.swipe-right-indicator {
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    width: 50px;
    height: 50px;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1.5rem;
    opacity: 0;
    transition: opacity 0.2s ease;
    z-index: 9998;
    pointer-events: none;
}

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

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

.swipe-left-indicator.show,
.swipe-right-indicator.show {
    opacity: 1;
}

/* Category swipe container */
.category-swipe-container {
    position: relative;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.category-swipe-container::-webkit-scrollbar {
    display: none;
}

.category-swipe-item {
    scroll-snap-align: start;
    flex-shrink: 0;
}

/* Product swipe container */
.product-swipe-container {
    position: relative;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
}

/* Touch optimization for images */
img {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    pointer-events: none;
}

/* Butonlar için touch feedback */
.btn, button {
    position: relative;
    overflow: hidden;
}

.btn:active, button:active {
    transform: scale(0.98);
}

/* Prevent double-tap zoom */
* {
    touch-action: manipulation;
}

/* Özel touch area'lar */
.touch-area {
    position: relative;
    min-height: 44px;
    min-width: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
}