/* Mobile Responsiveness Fixes */
@media (max-width: 768px) {
    /* Container & Layout */
    .container {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }
    
    /* Header Navbar */
    .navbar-inner {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 1rem !important;
        padding: 1rem 0 !important;
    }
    .navbar-search {
        width: 100% !important;
        margin-left: 0 !important;
    }
    .navbar-actions {
        width: 100% !important;
        justify-content: space-between !important;
    }
    .main-nav {
        display: none !important;
    }
    .main-nav.show {
        display: flex !important;
    }
    
    /* Product Grid */
    #product-grid, .product-grid, .grid, [style*="grid-template-columns: repeat(auto-fill"] {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 0.75rem !important;
    }
    
    /* Product Detail Page */
    .product-detail-container {
        flex-direction: column !important;
    }
    .product-detail-image, .product-detail-info {
        width: 100% !important;
        flex: none !important;
        padding: 0 !important;
    }
    
    /* Category List */
    .category-grid, [style*="grid-template-columns: repeat(10"] {
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 0.5rem !important;
    }
    
    /* Dashboard Sidebar & Content */
    #dashboard-grid {
        grid-template-columns: 1fr !important;
    }
    #dashboard-sidebar {
        position: static !important;
        margin-bottom: 2rem !important;
    }
    
    /* Footer */
    footer .container > div {
        grid-template-columns: 1fr !important;
        gap: 2rem !important;
    }
    
    /* Text Sizes */
    h1 { font-size: 1.5rem !important; }
    h2 { font-size: 1.25rem !important; }
    h3 { font-size: 1rem !important; }
    
    /* Hide some desktop-only items */
    .desktop-only { display: none !important; }
}

@media (max-width: 480px) {
    #product-grid, .product-grid, .grid, [style*="grid-template-columns: repeat(auto-fill"] {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 0.5rem !important;
    }
    .category-grid, [style*="grid-template-columns: repeat(10"] {
        grid-template-columns: repeat(3, 1fr) !important;
    }
}