if/else statement for shopify cart.item_count

I have found some similar questions on this site and others, but none seem to provide the solution I am looking for (or I am just not seeing it clearly) and I could really use some guidance.

I have a Shopify theme that has been modified to include two mega dropdown menus, each of which requires a specific (negative) left margin for proper alignment. I am using the following code to set these margins:

    <script>
    $(document).ready(function(){
      $(".site-nav li ul:eq(0)").css("left","-411%");
      $(".site-nav li ul:eq(1)").css("left","-670%");
      if ($(window).width()<768) {
        $(".site-nav li ul").css("left","auto");
      }

      $(window).on('resize', function() {
        if ($(window).width()<768) {
        $(".site-nav li ul").css("left","auto");
        }
      });
    });
    </script>

The problem I'm having is that when someone adds an item to the cart a cart icon is added to the navar which throws off the alignment of the dropdown menus.

I have tried various CSS edits to no avail and am looking for an if/else statement that will change the left margin when an item is added to the cart.

Here is the altered code I am trying to implement in order to meet this objective:

    <script>
    $(document).ready(function(){
      if (cart.item_count > 0) {
      $(".site-nav li ul:eq(0)").css("left","-351%");
      $(".site-nav li ul:eq(1)").css("left","-610%");
      }
      else {
      $(".site-nav li ul:eq(0)").css("left","-411%");
      $(".site-nav li ul:eq(1)").css("left","-670%");
      }
      if ($(window).width()<768) {
        $(".site-nav li ul").css("left","auto");
      }

      $(window).on('resize', function() {
        if ($(window).width()<768) {
        $(".site-nav li ul").css("left","auto");
        }
      });
    });
    </script>

This does not work and as I am less than proficient with Javascript, I am unclear as to what I am doing wrong. Any help that you can provide would be greatly appreciated.

Thanks,