/*
 * Mobile Responsive Optimizations
 * PageSpeed and Mobile Friendly Improvements
 */

/* Global Mobile Fixes */
@media (max-width: 768px) {
    /* Container Padding */
    .container,
    .woocommerce-page {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
    
    /* WooCommerce Account Pages */
    .woocommerce-MyAccount-navigation ul {
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
    }
    
    .woocommerce-MyAccount-navigation ul li a {
        font-size: 11px;
        padding: 10px 12px;
    }
    
    .woocommerce-MyAccount-content {
        padding: 20px 16px !important;
    }
    
    /* Orders Table */
    .woocommerce-orders-table {
        display: block;
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    
    .woocommerce-orders-table table {
        min-width: 600px;
        font-size: 12px;
    }
    
    .woocommerce-orders-table th,
    .woocommerce-orders-table td {
        padding: 10px 8px;
    }
    
    /* Order Details */
    .woocommerce-order-details {
        padding: 20px 16px !important;
    }
    
    .woocommerce-order-details__title {
        font-size: 20px !important;
    }
    
    .woocommerce-table--order-details {
        font-size: 13px;
    }
    
    .woocommerce-table--order-details th,
    .woocommerce-table--order-details td {
        padding: 12px 8px !important;
    }
    
    /* Forms */
    .woocommerce-form-row {
        margin-bottom: 16px;
    }
    
    .woocommerce-Input,
    .woocommerce-form__input,
    .input-text {
        padding: 12px 14px !important;
        font-size: 16px !important; /* Prevents zoom on iOS */
    }
    
    .woocommerce-Button,
    .button {
        padding: 14px 24px !important;
        font-size: 15px !important;
    }
    
    /* Address Cards */
    .woocommerce-Address {
        margin-bottom: 20px;
        padding: 20px 16px !important;
    }
    
    .woocommerce-Address-title h3 {
        font-size: 18px !important;
    }
    
    /* Delivery Link Box */
    .delivery-link-box {
        flex-direction: column;
        padding: 20px !important;
        gap: 16px;
    }
    
    .delivery-link-icon {
        width: 56px !important;
        height: 56px !important;
    }
    
    .delivery-link-content h3 {
        font-size: 20px !important;
    }
    
    .delivery-link-content p {
        font-size: 14px !important;
    }
    
    .delivery-link-button {
        padding: 12px 24px !important;
        font-size: 14px !important;
    }
    
    /* Messages */
    .woocommerce-message,
    .woocommerce-error,
    .woocommerce-info {
        padding: 16px 20px !important;
        font-size: 14px !important;
    }
    
    /* Login/Register Forms */
    .woocommerce-form-container {
        grid-template-columns: 1fr !important;
        gap: 24px;
    }
    
    .woocommerce-form-card {
        padding: 24px 20px !important;
    }
    
    .woocommerce-form-card h2 {
        font-size: 24px !important;
    }
    
    /* Service Page Mobile */
    .service-hero {
        padding: 60px 0 50px !important;
    }
    
    .service-hero h1 {
        font-size: 36px !important;
    }
    
    .service-hero-description {
        font-size: 17px !important;
    }
    
    .service-hero-price {
        padding: 24px 32px !important;
    }
    
    .price-value {
        font-size: 48px !important;
    }
    
    .stats-container {
        grid-template-columns: 1fr !important;
        gap: 16px;
        padding: 0 16px !important;
    }
    
    .stat-card {
        padding: 24px 20px !important;
    }
    
    .package-container {
        padding: 0 16px !important;
    }
    
    .package-card {
        padding: 32px 20px !important;
    }
    
    .package-header h3 {
        font-size: 24px !important;
    }
    
    .price-amount {
        font-size: 40px !important;
    }
    
    .how-container,
    .success-container,
    .benefits-container {
        padding: 0 16px !important;
    }
    
    .how-grid,
    .benefits-grid {
        grid-template-columns: 1fr !important;
        gap: 20px;
    }
    
    .success-grid {
        grid-template-columns: 1fr !important;
        gap: 20px;
    }
    
    .success-stats-grid {
        grid-template-columns: 1fr !important;
    }
    
    /* About Page Mobile */
    .about-hero {
        padding: 60px 0 50px !important;
    }
    
    .about-hero h1 {
        font-size: 36px !important;
    }
    
    .hero-description {
        font-size: 17px !important;
    }
    
    .mission-content h2,
    .section-title {
        font-size: 28px !important;
    }
    
    .large-text {
        font-size: 19px !important;
    }
    
    .story-grid {
        grid-template-columns: 1fr !important;
        gap: 32px;
    }
    
    .values-grid,
    .why-grid {
        grid-template-columns: 1fr !important;
    }
    
    .stats-grid {
        grid-template-columns: 1fr !important;
    }
    
    .team-features {
        grid-template-columns: 1fr !important;
    }
    
    .footer-content {
        grid-template-columns: 1fr !important;
        gap: 32px;
    }
    
    .footer-column h3 {
        font-size: 16px !important;
    }
    
    .footer-links li a {
        font-size: 13px !important;
    }
    
    .footer-bottom {
        flex-direction: column;
        gap: 16px;
        text-align: center;
    }
    
    .footer-legal {
        flex-direction: column;
        gap: 12px;
    }
    
    /* Blog Mobile */
    .blog-hero {
        padding: 60px 0 40px !important;
    }
    
    .blog-hero .container {
        padding: 0 16px !important;
    }
    
    .blog-hero h1 {
        font-size: 32px !important;
    }
    
    .blog-hero-description {
        font-size: 17px !important;
    }
    
    .blog-container {
        padding: 0 16px !important;
    }
    
    .post-header {
        padding: 60px 0 40px !important;
    }
    
    .post-title {
        font-size: 28px !important;
    }
    
    .post-meta-card {
        padding: 24px 16px 20px !important;
    }
    
    .post-content-container {
        padding: 0 16px !important;
    }
    
    .post-sidebar {
        padding: 0 16px !important;
    }
    
    /* Contact Page Mobile */
    .contact-hero {
        padding: 60px 0 40px !important;
    }
    
    .contact-hero h1 {
        font-size: 32px !important;
    }
    
    .method-cards {
        grid-template-columns: 1fr !important;
    }
    
    .contact-form-wrapper {
        grid-template-columns: 1fr !important;
    }
    
    .location-content {
        grid-template-columns: 1fr !important;
    }
    
    /* Index Page - Product Table */
    .filter-table-container {
        padding: 0 8px !important;
    }
    
    .table-wrapper {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    
    /* Tap Target Size (Google PageSpeed) */
    button,
    a,
    input,
    select,
    textarea {
        min-height: 44px;
        min-width: 44px;
    }
    
    /* Reduce Motion for Accessibility */
    @media (prefers-reduced-motion: reduce) {
        * {
            animation-duration: 0.01ms !important;
            animation-iteration-count: 1 !important;
            transition-duration: 0.01ms !important;
        }
    }
}

/* Tablet Responsive (768px - 1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
    .container,
    .woocommerce-page {
        padding-left: 24px !important;
        padding-right: 24px !important;
    }
    
    .stats-container,
    .how-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    
    .success-grid {
        grid-template-columns: 1fr !important;
    }
}

/* Performance Optimizations */
@media (max-width: 768px) {
    /* Reduce Shadow Complexity */
    .stat-card,
    .benefit-card,
    .success-card,
    .how-step {
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
    }
    
    /* Simplify Gradients for Performance */
    .service-hero,
    .about-hero,
    .service-cta {
        background: #1d1d1f !important;
    }
    
    .stat-primary {
        background: #0071e3 !important;
    }
    
    /* Reduce Transform Complexity */
    .stat-card:hover,
    .benefit-card:hover,
    .success-card:hover,
    .how-step:hover {
        transform: none !important;
    }
}