/* --- TABLET ADAPTIVE OVERRIDES (max-width: 1024px) --- */
@media (max-width: 1024px) {
    /* Main shop and checkout container spacing protection */
    .woocommerce-cart .entry-content,
    .woocommerce-checkout .entry-content,
    .woocommerce-account .entry-content {
        padding: 20px !important;
    }
    
    /* Harmonize grid layouts with wider spaces to prevent overlaps (2 columns) */
    .woocommerce ul.products,
    .woocommerce-page ul.products,
    .elementor-widget-woocommerce-products ul.products,
    .elementor-widget-wc-archive-products ul.products {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        column-gap: 24px !important;
        row-gap: 32px !important;
    }

    .woocommerce ul.products li.product,
    .woocommerce-page ul.products li.product,
    .elementor-widget-woocommerce-products ul.products li.product,
    .elementor-widget-wc-archive-products ul.products li.product {
        width: 100% !important;
        float: none !important;
        margin: 0 !important;
        clear: none !important;
    }
    
    /* Ensure no float-clearing pseudo-elements occupy grid cells */
    .woocommerce ul.products::before,
    .woocommerce ul.products::after,
    .woocommerce-page ul.products::before,
    .woocommerce-page ul.products::after {
        display: none !important;
        content: none !important;
    }
}

/* --- MOBILE ADAPTIVE OVERRIDES (max-width: 767px) --- */
@media (max-width: 767px) {
    /* Fluid container widths with comfortable borders */
    .woocommerce-cart .entry-content,
    .woocommerce-checkout .entry-content,
    .woocommerce-account .entry-content,
    .archive.tax-product_cat .ast-container,
    .post-type-archive-product .ast-container {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    /* Stack checkout steps, cart items and account grids vertically */
    .woocommerce-checkout #customer_details .col-1,
    .woocommerce-checkout #customer_details .col-2,
    .woocommerce-checkout #order_review,
    .woocommerce-checkout #order_review_heading {
        width: 100% !important;
        float: none !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
    }
    
    .woocommerce-cart .cart-collaterals .cart_totals {
        width: 100% !important;
        float: none !important;
    }
    
    /* Force products in 2 columns on mobile with spacious gaps (using robust CSS Grid) */
    .woocommerce ul.products,
    .woocommerce-page ul.products,
    .woocommerce div.products ul.products,
    .woocommerce-page div.products ul.products,
    .elementor-widget-woocommerce-products ul.products,
    .elementor-widget-wc-archive-products ul.products {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        column-gap: 20px !important;
        row-gap: 28px !important;
    }
    
    .woocommerce ul.products li.product,
    .woocommerce-page ul.products li.product,
    .woocommerce div.products ul.products li.product,
    .woocommerce-page div.products ul.products li.product,
    .elementor-widget-woocommerce-products ul.products li.product,
    .elementor-widget-wc-archive-products ul.products li.product {
        width: 100% !important;
        float: none !important;
        margin: 0 !important;
        clear: none !important;
        display: block !important;
    }

    /* Ensure no float-clearing pseudo-elements occupy grid cells */
    .woocommerce ul.products::before,
    .woocommerce ul.products::after,
    .woocommerce-page ul.products::before,
    .woocommerce-page ul.products::after,
    .woocommerce div.products ul.products::before,
    .woocommerce div.products ul.products::after,
    .elementor-widget-woocommerce-products ul.products::before,
    .elementor-widget-woocommerce-products ul.products::after,
    .elementor-widget-wc-archive-products ul.products::before,
    .elementor-widget-wc-archive-products ul.products::after {
        display: none !important;
        content: none !important;
    }
    
    /* Fix table responsiveness on mobile checkout/cart */
    .woocommerce-cart-form table.shop_table_responsive tr td,
    .woocommerce-checkout table.shop_table_responsive tr td {
        display: block !important;
        text-align: right !important;
        padding-left: 45% !important;
        position: relative !important;
    }
    
    .woocommerce-cart-form table.shop_table_responsive tr td::before,
    .woocommerce-checkout table.shop_table_responsive tr td::before {
        position: absolute !important;
        left: 12px !important;
        text-align: left !important;
        font-weight: bold !important;
    }
}