I made a child theme with style.css, style-rtl.css and functions.php files for a multilingual site.

Now I want to load the RTL parent and then child stylesheets for Arabic and to load LTR parent and then child styesheets for european languages.

Currently the issue is that the child LTR stylesheet is still loading for RTL pages and with the same specificity of the selector, the LTR child is even overriding RTL child.

Here is what I am using in the functions.php of the child theme made for the parent storefront theme:

add_action( 'wp_enqueue_scripts', 'storefront_enqueue_styles');

function storefront_enqueue_styles() {

$parent_style = 'parent-style'; 

if (is_rtl()){
wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style-rtl.css' );

wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style-rtl.css', array( $parent_style ), wp_get_theme()->get('Version') );   
}
else {  
wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );

wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array( $parent_style ), wp_get_theme()->get('Version')    ); 
}
}