Cart Tab is Cut Off!

I have a very weird issue that for a long time I’ve put off fixing cause I am that stumped on it.

On my client’s Products’ Template pages, I created an add to cart banner that is fixed to the bottom of the viewport and appears only after scrolling halfway down the page.

Problem is: when you use the add to cart button on the banner, the cart tab automatically slides out from the right, and there is a gap (of 93 px, same height as the banner) below the customer’s cart tab that pushes the tab outside of the viewport.

Please help, I have run out of solutions to try and get this cart to fill the entire viewport.

Edit: Best way to see the problem is using the link and trying to add a product to your cart after scrolling to the bottom of a product listing.

Read Only:

Demo Site: