/**
 * Mobile Responsiveness Enhancements
 * Additional CSS for better mobile experience
 */

/* Mobile-first responsive adjustments */
@media (max-width: 768px) {
    /* Navigation */
    .max-w-7xl {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    /* Service cards */
    .service-card, .task-card {
        padding: 1rem;
        margin-bottom: 1rem;
    }

    /* Buttons */
    button, .btn {
        padding: 0.75rem 1rem;
        font-size: 0.875rem;
        min-height: 44px; /* Touch-friendly */
    }

    /* Inputs */
    input, textarea, select {
        font-size: 16px; /* Prevents zoom on iOS */
        padding: 0.75rem;
        min-height: 44px; /* Touch-friendly */
    }

    /* Result containers */
    .result-container {
        padding: 1rem;
        font-size: 0.875rem;
    }

    .result-container pre {
        font-size: 0.75rem;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Action buttons */
    .action-buttons, .result-actions {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .action-buttons button, .result-actions button {
        flex: 1 1 auto;
        min-width: 120px;
    }

    /* Status pipeline */
    .status-pipeline {
        flex-direction: column;
        gap: 0.5rem;
    }

    .status-pipeline .step {
        width: 100%;
    }

    /* Tables */
    table {
        display: block;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* Modals */
    .modal, .dialog {
        width: 95%;
        max-width: 95%;
        margin: 1rem auto;
        padding: 1rem;
    }

    /* Toast notifications */
    #toast-container {
        top: 1rem;
        right: 1rem;
        left: 1rem;
        width: auto;
    }

    /* Search history dropdown */
    .search-history-dropdown {
        max-height: 50vh;
    }

    /* Favorites list */
    .favorite-item {
        padding: 0.75rem;
    }

    /* Onboarding tour */
    .onboarding-tour-card {
        width: 90%;
        max-width: 90%;
        left: 5% !important;
        right: 5% !important;
    }

    /* Keyboard shortcuts help */
    .keyboard-shortcuts-help {
        width: 95%;
        max-width: 95%;
    }
}

/* Tablet adjustments */
@media (min-width: 769px) and (max-width: 1024px) {
    .max-w-7xl {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }

    .service-card, .task-card {
        padding: 1.25rem;
    }
}

/* Touch device optimizations */
@media (hover: none) and (pointer: coarse) {
    /* Larger touch targets */
    button, .btn, a {
        min-height: 44px;
        min-width: 44px;
    }

    /* Remove hover effects on touch devices */
    .hover\:bg-gray-50:hover {
        background-color: transparent;
    }

    /* Better spacing for touch */
    .space-y-3 > * + * {
        margin-top: 1rem;
    }
}

/* Landscape mobile */
@media (max-width: 896px) and (orientation: landscape) {
    .onboarding-tour-card {
        max-height: 80vh;
        overflow-y: auto;
    }
}

/* High DPI displays */
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    /* Ensure crisp rendering */
    button, input, textarea {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
}

/* Print styles */
@media print {
    .no-print, button, .action-buttons, .result-actions {
        display: none !important;
    }

    .result-container {
        page-break-inside: avoid;
    }
}