Hide out of stock products in ‘product carroussel’

Hello, Elementor team! First of all, thank you so much for such an useful plugin!

I’m having a lot of trouble finding out how to hide out of stock products from my front page plugins. I don’t want to disable them from showing up in the entire website, cause having my customers to sing up for “back in stock” listing is very important for my business. Just really don’t want my out of stock products showing up on my Sale (“Ofertas”) section.

Tried the following codes from another reply, yet they didn’t work:

add_filter( 'woocommerce_products_widget_query_args', 'custom_products_widget_query_arg', 10, 1 );
function custom_products_widget_query_arg( $query_args ) {
    if( ! is_admin() ) {
        $query_args['meta_query'][] = array(
            'key'     => '_stock_status',
            'value'   => 'outofstock',
            'compare' => '!='
        );
    }
    return $query_args;
}

add_filter( 'woocommerce_products_widget_query_args', 'custom_products_widget_query_arg', 10, 1 );
function custom_products_widget_query_arg( $query_args ) {
    if( ! is_admin() ) {
        $query_args['tax_query'][] = array(
            'taxonomy' => 'product_visibility',
            'field'    => 'name',
            'terms'    => array('outofstock'),
            'operator' => 'NOT IN'
        );
    }
    return $query_args;
}

Is there a way to make it happen?

Thanks!

The page I need help with: [log in to see the link]