Header nav items not displaying correctly.

Site URL: https://cat-fish-xrta.squarespace.com/

Hello guys, since I have embedded Commerce7 to Squarespace, I copied and pasted the installation code as Commerce7 guide below, but it seems the Login and Cart are not displaying correctly as I expect them to show on the right side aligned. I would appreciate any help about css code to correct this issue. Thank you!

<!-- Adds the Commerce7 styles -->
<link href="https://cdn.commerce7.com/v2/commerce7.css" rel="stylesheet">

<!-- Adds Commcerce7 widgets for the cart and customer account login -->
<script type="text/javascript">
    document.addEventListener('DOMContentLoaded', function(event) {
    var node = document.createElement('div')
    
    var accountNode = document.createElement('div')
    accountNode.id = 'c7-account'
    node.appendChild(accountNode)
    
    var cartNode = document.createElement('div')
    cartNode.id = 'c7-cart'
    node.appendChild(cartNode)
    
    var header = document.getElementsByTagName('header')[0]
    header.appendChild(node)
    })
</script>

<!-- Tells Commerce7 which account to connect to -->
<script type="text/javascript" 
        src="https://cdn.commerce7.com/v2/commerce7.js" 
        id="c7-javascript" 
        data-tenant="tenantId">
</script>

Your site is private. Can you setup an access password & share url again? We can check easier

9 hours ago, tuanphan said:

Your site is private. Can you setup an access password & share url again? We can check easier

Hi I have set my site with passcode: cape

https://cat-fish-xrta.squarespace.com/

Thanks!

16 hours ago, tuanphan said:

Try adding to Design > Custom CSS

@media screen and (min-width:992px) {
div#c7-account, div#c7-cart {
    position: absolute;
    right: 0;
    top: 50px;
    right: 50px;
}
div#c7-cart {
    right: 10px;
    top: 30px;
}}

Thank you su much! It really helps!