header.wp-block-template-part {
    position: fixed;
    z-index: 5;
    top: 0;
    left: 0;
    width: 100%;
    transition: all 0.5s;

    .pre-header {
        overflow: hidden;
    }

    .block-visibility-hide-extra-large-screen {
        margin-top: 0 !important;
    }

    .wp-block-navigation {
        a {
            padding-top: 10px;
            padding-bottom: 10px;

            &:hover {
                color: var(--wp--preset--color--loops-blood) !important;
            }
        }

        .wp-block-navigation__submenu-icon {
            margin-left: 10px;
            margin-top: -2px;
        }
    }

    &.sticky {
        background-color: var(--wp--preset--color--white) !important;
        color: var(--wp--preset--color--white) !important;
        
        box-shadow: 0px 10px 10px  rgba(0, 0, 0, 0.25);
/*          0px 10px 10px var(--wp--preset--color--black) ; */

        .pre-header {
            max-height: 0px;
        }
        
        .custom-logo {
            width: 75px;
            filter: unset;
        }

        .overlay {
            .custom-logo {
                filter: unset;
            }
        }

        .wp-block-navigation__submenu-icon {
            svg {
                color: var(--wp--preset--color--black);
            }
        }

        .wp-block-navigation__responsive-container {
            min-height: 100vh !important;

            &.has-modal-open {
                background-color: var(--wp--preset--color--darkness) !important;

                .wp-block-navigation__container {
                    width: 100%;
                    gap: 0px !important;
            
                    > li {
                        width: 100%;
                        box-sizing: border-box;
                        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
                        border-radius: 0;
                        padding: 0 !important;

                        > a, 
                        > button {
                            color: var(--wp--preset--color--white);
                            padding: 20px 40px !important;
                            font-size: var(--wp--preset--font-size--h-4) !important;
                            display: block;

                            &:hover {
                                color: var(--wp--preset--color--loops-blood);
                            }
                        }
            
                        + li {
                            padding-top: 30px;
                        }
            
                        .wp-block-navigation-submenu {
                            padding: 0 40px !important;
                            margin: 0 !important;
                            position: relative !important;
                            top: 0 !important;
            
                            > li {
                                margin-bottom: 5px;
            
                                > a, button {
                                    color: var(--wp--preset--color--white) !important;
                                    font-size: var(--wp--preset--font-size--h-5) !important;
                                }

                                > ul {
                                    padding: 20px 0 !important;

                                    > li {
                                        margin-bottom: 5px;

                                        > a {
                                            color: var(--wp--preset--color--white) !important;
                                            font-size: var(--wp--preset--font-size--small) !important;
                                            opacity: 0.5;
                                        }
                                    }
                                }
                            }
                        }
            
                        &:last-child {
                            border-bottom: 0;
                        }
                    }
                }
            }

            .wp-block-navigation__responsive-container-close {
                top: 40px;
                right: 40px;

                svg {
                    fill: var(--wp--preset--color--white) !important;
                }
            }
        }

        .wp-block-navigation {
            a {
                color: var(--wp--preset--color--black) !important;
            }
        }
    }

    .overlay {
        .custom-logo {
            filter: brightness(0) invert(1);
        }
    }
}

.admin-bar {

}

@media (max-width: 1099px) {
    header.wp-block-template-part {
        .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
            display: none !important;
        }

        .wp-block-navigation__responsive-container-open:not(.always-shown) {
            display: flex !important;
        }

        .wp-block-navigation__submenu-icon {
            display: none !important;
        }

        .wp-block-navigation__responsive-container {
            min-height: 100vh !important;

            &.has-modal-open {
                background-color: var(--wp--preset--color--darkness) !important;

                .wp-block-navigation__container {
                    width: 100%;
                    gap: 0px !important;
            
                    > li {
                        width: 100%;
                        box-sizing: border-box;
                        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
                        border-radius: 0;
                        padding: 0 !important;

                        > a, 
                        > button {
                            color: var(--wp--preset--color--white);
                            padding: 20px 40px !important;
                            font-size: var(--wp--preset--font-size--h-4) !important;
                            display: block;
                        }
            
                        + li {
                            padding-top: 30px;
                        }
            
                        .wp-block-navigation-submenu {
                            padding: 0 40px !important;
                            margin: 0 !important;
                            position: relative !important;
                            top: 0 !important;
            
                            > li {
                                margin-bottom: 5px;
            
                                > a, button {
                                    color: var(--wp--preset--color--white) !important;
                                    font-size: var(--wp--preset--font-size--h-5) !important;
                                }

                                > ul {
                                    padding: 20px 0 !important;

                                    > li {
                                        margin-bottom: 5px;

                                        > a {
                                            color: var(--wp--preset--color--white) !important;
                                            font-size: var(--wp--preset--font-size--small) !important;
                                            opacity: 0.5;
                                        }
                                    }
                                }
                            }
                        }
            
                        &:last-child {
                            border-bottom: 0;
                        }
                    }
                }
            }

            .wp-block-navigation__responsive-dialog {
                margin-top: 0 !important;
            }

            .wp-block-navigation__responsive-container-close {
                top: 40px;
                right: 40px;

                svg {
                    fill: var(--wp--preset--color--white) !important;
                }
            }
        }

        &.sticky {
            .wp-block-navigation__responsive-container-open {
                svg {
                    fill: var(--wp--preset--color--black) !important;
                }
            }

            .wp-block-navigation {
                a {
                    color: var(--wp--preset--color--white) !important;
                }
            }
        }
    }
}


/* Add padding only when the admin bar is visible */
@media screen and (min-width: 783px) {
    body.admin-bar {
        padding-top: 32px; /* Default height of the admin bar */
        header{
            top: 32px;
        }
    }
}

/* For smaller screens (admin bar is smaller on mobile) */
@media screen and (max-width: 782px) {
    body.admin-bar {
        padding-top: 46px; /* Height of the admin bar on smaller screens */
        header{
            top: 46px;
        }
    }
}

header .wp-block-navigation-item__label, 
header .wp-block-navigation-item__content{
    text-wrap: nowrap!important;
}