/* Mobile Best Practices for AGM Network - 2025 */

/* Viewport and Touch Optimization */
html {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    touch-action: manipulation;
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Touch-Friendly Tap Targets */
button, a, input[type="button"], input[type="submit"], .clickable {
    min-height: 44px;
    min-width: 44px;
}

/* Prevent Text Selection on Tap */
.button, .btn, button, a.button {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
}

/* Optimized Typography for Mobile */
@media (max-width: 430px) {
    body {
        font-size: 16px; /* Prevents zoom on iOS */
        line-height: 1.5;
    }
    
    h1 {
        font-size: 1.75em;
        line-height: 1.2;
    }
    
    h2 {
        font-size: 1.5em;
        line-height: 1.3;
    }
    
    h3 {
        font-size: 1.25em;
        line-height: 1.4;
    }
    
    p {
        margin-bottom: 1em;
    }
}

/* Navigation for Small Screens */
@media (max-width: 430px) {
    .main-navigation a {
        padding: 14px 20px;
        font-size: 15px;
    }
}

@media (max-width: 375px) {
    .main-navigation a {
        padding: 12px 18px;
        font-size: 14px;
    }
}

@media (max-width: 360px) {
    .main-navigation a {
        padding: 11px 16px;
        font-size: 13px;
    }
}

/* Form Inputs - Prevent Zoom on Focus */
@media (max-width: 430px) {
    input[type="text"],
    input[type="email"],
    input[type="tel"],
    input[type="number"],
    input[type="password"],
    textarea,
    select {
        font-size: 16px !important; /* 16px+ prevents iOS zoom */
        padding: 12px 15px;
    }
}

/* Container Spacing for Mobile */
@media (max-width: 430px) {
    .container, .content-container {
        padding-left: 15px;
        padding-right: 15px;
    }
}

@media (max-width: 375px) {
    .container, .content-container {
        padding-left: 12px;
        padding-right: 12px;
    }
}

@media (max-width: 360px) {
    .container, .content-container {
        padding-left: 10px;
        padding-right: 10px;
    }
}

/* Buttons - Touch-Friendly */
@media (max-width: 430px) {
    .btn, .button, button[type="submit"] {
        min-height: 48px;
        padding: 14px 24px;
        font-size: 16px;
    }
}

@media (max-width: 375px) {
    .btn, .button, button[type="submit"] {
        padding: 13px 22px;
        font-size: 15px;
    }
}

@media (max-width: 360px) {
    .btn, .button, button[type="submit"] {
        padding: 12px 20px;
        font-size: 14px;
    }
}

/* Tables - Horizontal Scroll on Mobile */
@media (max-width: 768px) {
    table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }
}

/* Images - Responsive */
@media (max-width: 430px) {
    img {
        max-width: 100%;
        height: auto;
    }
}

/* Modal Overlays - Full Coverage */
@media (max-width: 430px) {
    .modal, .overlay, .popup-overlay {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
    }
}

/* Prevent Horizontal Scroll */
@media (max-width: 430px) {
    body {
        overflow-x: hidden;
    }
    
    * {
        max-width: 100%;
    }
}

/* Close Buttons - Touch Optimized */
@media (max-width: 430px) {
    .close, .close-button, .close-modal, .popup-close-btn, .chat-close {
        min-width: 48px !important;
        min-height: 48px !important;
        padding: 12px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}

/* Sticky Footer - Safe Area */
@media (max-width: 430px) {
    footer {
        padding-bottom: env(safe-area-inset-bottom, 20px);
    }
}

/* Chat Widget - iPhone Notch Support */
@media (max-width: 430px) and (min-height: 700px) {
    .chat-window {
        bottom: max(80px, env(safe-area-inset-bottom, 80px));
    }
    
    .chat-button {
        bottom: max(15px, env(safe-area-inset-bottom, 15px));
    }
}

/* Performance - Reduce Motion */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* Dark Mode Support */
@media (prefers-color-scheme: dark) {
    /* Add dark mode styles if needed */
}

/* High Contrast Mode */
@media (prefers-contrast: high) {
    button, a, input {
        border-width: 2px;
    }
}

/* Landscape Orientation Adjustments */
@media (max-width: 896px) and (orientation: landscape) {
    .chat-window {
        height: 85vh;
        max-height: 85vh;
    }
    
    .modal-content {
        max-height: 90vh;
        overflow-y: auto;
    }
}

/* PWA Safe Areas */
@supports(padding: max(0px)) {
    body {
        padding-left: env(safe-area-inset-left);
        padding-right: env(safe-area-inset-right);
    }
}