/* Mobile Optimization Styles */

/* Better touch targets */
button, 
a, 
input, 
select, 
.clickable {
    min-height: 44px; /* Minimum recommended touch target size */
    touch-action: manipulation; /* Improve touch response */
}

/* Prevent zooming on input focus on iOS */
@media screen and (max-width: 768px) {
    input, select, textarea {
        font-size: 16px; 
    }
}

/* Safe area insets for notched phones */
body {
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
    padding-bottom: env(safe-area-inset-bottom);
}

/* Better scrolling */
.overflow-scroll, 
.overflow-x-scroll, 
.overflow-y-scroll {
    -webkit-overflow-scrolling: touch;
}

/* Hide scrollbars but keep functionality */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* PWA Display Modes */
@media all and (display-mode: standalone) {
    body {
        /* Adjustments for standalone (app-like) mode */
        -webkit-user-select: none;
        user-select: none;
    }
}

/* Bottom Navigation Bar support (if added) */
.bottom-nav-safe {
    padding-bottom: calc(60px + env(safe-area-inset-bottom));
}