/* Mobile-specific styles */

/* Base touch improvements */
* {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-touch-callout: none;
    box-sizing: border-box;
}

/* Ensure content doesn't overflow on small screens */
html, body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
    position: relative;
}

/* Improve button and link tap targets */
a, button, .btn, .nav-link, .dropdown-item, label[for] {
    min-height: 44px;
    min-width: 44px;
    padding: 0.75rem 1.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    touch-action: manipulation;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0.1);
    position: relative;
    line-height: 1.2;
}

/* Ensure form elements are touch-friendly */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="search"],
input[type="url"],
select,
textarea {
    min-height: 44px;
    padding: 0.5rem;
    font-size: 16px !important; /* Prevent iOS zoom on focus */
}

/* Form elements touch optimization */
input, select, textarea, button {
    font-size: 16px !important; /* Prevent iOS zoom on focus */
}

/* Prevent long words from breaking layout */
p, h1, h2, h3, h4, h5, h6, li, a, span, div {
    word-wrap: break-word;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
}

/* Image optimization */
img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* Card and container touch improvements */
.card, .feature-box, .quick-links-panel .card {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    -webkit-tap-highlight-color: transparent;
}

.card:active, .feature-box:active {
    transform: scale(0.98);
}

/* Modal and overlay improvements */
.modal {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain;
}

/* Improve scrolling on iOS */
.modal-open {
    position: fixed;
    width: 100%;
}

.modal-dialog {
    margin: 0.5rem auto;
    min-height: calc(100% - 1rem);
    display: flex;
    align-items: center;
}

/* Carousel touch improvements */
.carousel {
    touch-action: pan-y;
}

/* Improve scrolling behavior */
.scrollable-container {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000;
    perspective: 1000;
}

/* Hide scrollbar but keep scrollable */
.scrollable-container {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}

.scrollable-container::-webkit-scrollbar {
    display: none;  /* Chrome, Safari, Opera */
}

/* Disable pull-to-refresh */
body {
    overscroll-behavior-y: contain;
}

/* Optimize animations */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* Fix for iOS form zoom */
@supports (-webkit-touch-callout: none) {
    input, select, textarea {
        font-size: 16px !important;
    }
}

/* Fix for sticky hover on mobile */
@media (hover: none) {
    .btn:hover, .nav-link:hover, .dropdown-item:hover {
        background-color: initial;
    }
}