/* ===== MOBILE RESPONSIVENESS ENHANCEMENTS ===== */

/* Mobile-first responsive design */
@media (max-width: 575.98px) {
    /* Container mobile padding */
    .container, .container-fluid {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    /* Better mobile spacing */
    .py-5 {
        padding-top: 2rem !important;
        padding-bottom: 2rem !important;
    }

    .mt-5 {
        margin-top: 2rem !important;
    }

    /* Enhanced mobile typography */
    h1 { font-size: 1.75rem; line-height: 1.3; }
    h2 { font-size: 1.5rem; line-height: 1.3; }
    h3 { font-size: 1.25rem; line-height: 1.4; }
    .lead { font-size: 1rem; line-height: 1.5; }

    /* Touch-friendly buttons */
    .btn {
        min-height: 44px;
        padding: 0.5rem 1rem;
        font-size: 1rem;
    }

    /* Better mobile form controls */
    .form-control, .form-select {
        font-size: 16px; /* Prevents zoom on iOS */
        padding: 0.5rem 0.75rem;
        min-height: 44px;
    }

    /* Enhanced mobile navigation */
    .navbar-brand img {
        height: 41px;
        width: auto;
    }

    /* Better mobile dropdowns */
    .dropdown-menu {
        border: none;
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
        border-radius: 0.5rem;
    }

    .dropdown-item {
        padding: 0.75rem 1rem;
        font-size: 0.9rem;
    }

    /* Mobile search enhancements */
    #toolSearch {
        font-size: 16px; /* Prevents zoom on iOS */
        padding: 0.5rem 2.5rem 0.5rem 1rem;
        min-height: 44px;
    }

    .badge {
        font-size: 0.75rem;
        padding: 0.25rem 0.5rem;
    }

    /* Better mobile footer */
    .footer-link {
        display: block;
        padding: 0.25rem 0;
        font-size: 0.9rem;
    }

    /* Enhanced mobile cards */
    .card {
        border-radius: 0.5rem;
        border: none;
        box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    }

    /* Mobile alert enhancements */
    .alert {
        border-radius: 0.5rem;
        padding: 0.75rem;
        font-size: 0.9rem;
    }
}

/* Tablet responsive adjustments */
@media (max-width: 767.98px) and (min-width: 576px) {
    .container, .container-fluid {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }

    .btn {
        min-height: 42px;
    }

    .form-control, .form-select {
        min-height: 42px;
    }
}

/* Landscape mobile optimizations */
@media (max-height: 500px) and (orientation: landscape) {
    .py-5 {
        padding-top: 1rem !important;
        padding-bottom: 1rem !important;
    }

    .navbar {
        padding: 0.25rem 0;
    }

    .navbar-brand img {
        height: 41px;
    }

    .btn {
        padding: 0.375rem 0.75rem;
        font-size: 0.9rem;
        min-height: 40px;
    }

    .form-control, .form-select {
        padding: 0.375rem 0.5rem;
        min-height: 40px;
        font-size: 15px;
    }
}

/* Touch device optimizations */
@media (hover: none) and (pointer: coarse) {
    /* Touch feedback for interactive elements */
    .btn:active, .nav-link:active, .dropdown-item:active {
        transform: scale(0.98);
        transition: transform 0.1s ease;
    }

    /* Better touch targets */
    .nav-link, .dropdown-item {
        min-height: 44px;
        display: flex;
        align-items: center;
    }

    /* Enhanced touch scrolling */
    * {
        -webkit-overflow-scrolling: touch;
    }
}

/* iOS specific fixes */
@supports (-webkit-touch-callout: none) {
    /* Prevent text size adjustment */
    html {
        -webkit-text-size-adjust: 100%;
    }

    /* Better iOS form handling */
    .form-control, .form-select {
        -webkit-appearance: none;
        appearance: none;
        border-radius: 0.375rem;
        background-clip: padding-box;
    }

    /* iOS button styling */
    .btn {
        -webkit-appearance: none;
        appearance: none;
        border-radius: 0.375rem;
    }

    /* iOS navigation improvements */
    .navbar-toggler {
        border: none;
        background: none;
    }

    .navbar-toggler:focus {
        box-shadow: none;
        outline: 2px solid #0d6efd;
        outline-offset: 2px;
    }
}

/* Android specific enhancements */
@media screen and (max-width: 767px) {
    .android-device .btn:active {
        background-color: rgba(255, 255, 255, 0.2);
    }
}

/* High DPI display optimizations */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .navbar-brand img {
        image-rendering: -webkit-optimize-contrast;
        image-rendering: crisp-edges;
    }
}

/* Better focus indicators for accessibility */
@media (max-width: 767px) {
    .btn:focus, .form-control:focus, .form-select:focus, .nav-link:focus {
        outline: 3px solid #0d6efd;
        outline-offset: 2px;
        box-shadow: none;
    }
}

/* Mobile keyboard space handling */
@media (max-width: 767px) {
    .mobile-keyboard-space {
        padding-bottom: 120px;
        transition: padding-bottom 0.3s ease;
    }
}

/* Enhanced mobile scrolling */
.mobile-scroll {
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
}

/* Loading states for mobile */
.mobile-loading {
    animation: mobile-pulse 1.5s ease-in-out infinite;
}

@keyframes mobile-pulse {
    0% { opacity: 1; }
    50% { opacity: 0.7; }
    100% { opacity: 1; }
}
