/* iPad Optimization Styles */

/* iPad (portrait and landscape) */
@media only screen 
and (min-device-width: 768px) 
and (max-device-width: 1024px) {
    /* Base layout adjustments */
    .container {
        padding: 1.5rem;
        max-width: 100%;
    }
    
    /* Improve touch targets */
    .module-card {
        padding: 2rem;
        min-height: 220px;
    }
    
    .module-card img {
        height: 100px;
    }
    
    /* Optimize grid for iPad screen size */
    .modules-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
    }
    
    /* Adjust tables grid for better touch experience */
    .tables-selection {
        grid-template-columns: repeat(4, 1fr);
        gap: 12px;
    }
    
    .table-box {
        padding: 1rem;
    }
    
    /* Enhanced touch feedback */
    .table-box:active {
        background-color: #f0f5ff;
        border-color: var(--primary-color);
    }
    
    /* Optimize buttons for touch */
    .primary-button, .secondary-button {
        padding: 1.2rem 2rem;
        min-width: 180px;
    }
    
    /* Replace hover effects with active states for touch */
    .module-card:hover {
        transform: none;
    }
    
    .module-card:active {
        transform: scale(0.98);
        box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
    }
    
    /* Fix input fields for touch */
    input[type="number"],
    select {
        font-size: 16px; /* Prevents zoom on iOS */
        -webkit-appearance: none; /* Removes iOS default styling */
        border-radius: 8px;
    }
    
    .answer-input {
        width: 200px;
        font-size: 1.6rem;
        padding: 1.2rem;
    }
    
    /* Modal enhancements */
    .modal-content {
        width: 450px;
        padding: 2.5rem;
    }
    
    /* Optimize practice area for iPad */
    .question {
        font-size: 2.2rem;
        margin-bottom: 2.5rem;
    }
    
    /* Results display enhancements */
    .question-result {
        padding: 1rem;
        margin-bottom: 1rem;
    }
}

/* iPad Pro (portrait and landscape) */
@media only screen 
and (min-device-width: 1024px) 
and (max-device-width: 1366px) {
    .module-container {
        max-width: 800px;
    }
    
    .modules-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* iPad (landscape) specific adjustments */
@media only screen 
and (min-device-width: 768px) 
and (max-device-width: 1024px)
and (orientation: landscape) {
    .modules-grid {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .tables-selection {
        grid-template-columns: repeat(5, 1fr);
    }
    
    .practice-area .question-container {
        max-width: 80%;
        margin: 0 auto;
    }
}

/* iPad (portrait) specific adjustments */
@media only screen 
and (min-device-width: 768px) 
and (max-device-width: 1024px)
and (orientation: portrait) {
    h1 {
        font-size: 2.5rem;
    }
    
    .tables-selection {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .action-buttons {
        flex-direction: column;
        gap: 1rem;
    }
}

/* Disable hover animations in touch environments */
@media (hover: none) {
    .module-card:hover {
        transform: none;
        box-shadow: var(--card-shadow);
    }
    
    .module-card:hover img {
        transform: none;
    }
    
    .primary-button:hover, .secondary-button:hover {
        transform: none;
        box-shadow: 0 4px 10px rgba(74, 111, 255, 0.3);
    }
    
    .table-box:hover {
        background-color: transparent;
        border-color: #ddd;
    }
}

/* Optimize scrolling */
body {
    -webkit-overflow-scrolling: touch;
}

/* Fix for iOS form elements */
input, 
select, 
textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

/* Fix for iOS tap delay */
* {
    touch-action: manipulation;
}