/* 
 * Desktop Full Width Overrides
 * Removes "boxed" layout constraints (e.g., max-width: 1200px) on large screens.
 * Targets: Desktop view (>1024px)
 */

@media (min-width: 1024px) {

    /* 1. Global Container Reset */
    .container,
    .main-container,
    .page-wrapper,
    .content-wrapper {
        max-width: 100% !important;
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 24px;
        /* Maintain safe edge spacing */
        padding-right: 24px;
        box-sizing: border-box;
    }

    /* 2. Header & Navigation */
    .header,
    .header-container,
    .navbar,
    .nav-container {
        max-width: 100% !important;
        width: 100% !important;
    }

    /* Keep header content somewhat contained but wider if needed, 
       or let it stretch fully. user asked for "full width" */
    .header-content,
    .header .inner-container {
        max-width: 100% !important;
        padding: 0 24px;
    }

    /* 3. Footer */
    .footer,
    .footer-wrapper,
    .flipkart-footer,
    .seo-footer-section {
        max-width: 100% !important;
        width: 100% !important;
    }

    .footer-content {
        max-width: 100% !important;
        padding: 0 40px;
        /* Footers often look better with slightly more breathing room */
    }

    /* 4. Product Page Specifics */
    /* Ensure the main grid takes full width */
    .product-page-container,
    .product-main,
    .product-details,
    .row.product-layout {
        max-width: 100% !important;
        width: 100% !important;
        margin: 0 !important;
    }

    /* Adjust the columns if they were relying on a fixed parent width */
    .product-image-col {
        /* Keep image column recognizable but allow breathing room */
        min-width: 450px;
    }

    .product-info-col {
        flex: 1;
        /* Take remaining space */
    }

    /* 5. Search Results / Category Pages */
    .search-results-container,
    .category-container,
    .listing-container {
        max-width: 100% !important;
        width: 100% !important;
        padding: 0 24px;
    }

    /* 6. Homepage Specifics */
    body.homepage .main-banner,
    body.homepage .slider-container {
        max-width: 100% !important;
        width: 100% !important;
    }

    body.homepage .category-row,
    body.homepage .deals-section {
        max-width: 100% !important;
        padding: 0 24px;
    }
}