Adding Header Injection to Just the Cart Page

Site URL: https://www.nathannixonphotography.com/cart

Hey all,

My website has been customized (Brine family) so that my header overlaps my homepages gallery banner - I think it looks great. However, this causes issues on other pages which don't have a banner as my Logo (which is in white) almost disappears. I have solved this on those white background pages with a simple header code injection to invert the color of the logo (and cart button) so that it turns to black.

However, on the Cart page of the site I am unable to access the settings menu of the page to actually inject any code so I can't use my solution to fix the page. I was wondering if anyone knew a way I could use to specifically target just the Cart page to get my Logo and the Cart Icon to invert to black? 

For reference, this is the code I am injecting on the pages such as my Store and Journal pages.

<style>
.Header-branding-logo {
    -webkit-filter: invert(100%);
    filter: invert(100%);
  filter:progid:DXImageTransform.Microsoft.BasicImage(invert='1');
  }
</style>

<style>
.Cart {
    -webkit-filter: invert(100%);
    filter: invert(100%);
  filter:progid:DXImageTransform.Microsoft.BasicImage(invert='1');
  }
</style>

Any help would be appreciated, thank you!

Add to Home > Design > Custom CSS

/* cart page id is cart */
body#cart {
	.Header-branding-logo {
    -webkit-filter: invert(100%);
    filter: invert(100%);
  filter:progid:DXImageTransform.Microsoft.BasicImage(invert='1');
  }
  .Cart {
      -webkit-filter: invert(100%);
      filter: invert(100%);
    filter:progid:DXImageTransform.Microsoft.BasicImage(invert='1');
    }
}

That worked perfectly, thank you!