Override WooCommerce Styles semantically

functions.php

// This tip solves the issue of WooCommerce stylesheets being loaded after your custom ones.
// Which will save you from having to add !important, or getting overly specific with your CSS styles.
// Just make sure the WooCommerce syles are listed as a dependency, which automatically puts your CSS after WooCommerce

    function my_custom_scripts() {
    
      wp_enqueue_style(‘custom-css’, get_stylesheet_directory_uri().’/main.css’, array(‘woocommerce-general’));
   
      /*** Deprecated method ***
      // place wooCommerce styles before our main stlesheet
    	if ( class_exists('woocommerce') ) {
    		wp_dequeue_style( 'woocommerce-general' );
    		wp_enqueue_style('woocommerce-general', plugins_url() .'/woocommerce/assets/css/woocommerce.css');
    	}
      *** end deprecated method ***/
      
    }
    add_action('wp_enqueue_scripts', 'my_custom_scripts');