header.header-default,
header.header-special {
    .wp-block-navigation {
        .wp-block-navigation-item__content.wp-block-navigation-item__content {
            padding: 10px 0;
            transition: all 0.25s ease-in-out;

            &:hover {
                color: var(--wp--preset--color--primary);

                + .wp-block-navigation__submenu-icon {
                    transform: rotate(45deg);
                }
            }
        }
        .wp-block-navigation__submenu-container {
            border: 0px !important;
            
            &.wp-block-navigation-submenu {
                .wp-block-navigation-item__content.wp-block-navigation-item__content {
                    padding: 10px 15px;
                }
            }
        }
        .wp-block-navigation__submenu-icon {
            width: 8px;
            height: 8px;
            background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="8" height="8" viewBox="0 0 8 8"><path d="M5.906,0V5.906H0V8H8V0Z" transform="translate(0 0)" fill="%2382c341"/></svg>');
            background-position: top left;
            background-repeat: no-repeat;
            border: 0;
            margin-left: 8px;
            margin-top: 5px;
            transition: all 0.25s ease-in-out;
    
            svg {
                display: none;
            }
        }
    }

    &.scrolled {
        .wp-block-navigation {
            .wp-block-navigation-item__content.wp-block-navigation-item__content {
                color: var(--wp--preset--color--quaternary);
            }
        }

        .wp-block-button {
            .wp-block-button__link {
                &:not(.is-style-outline):not(.is-style-arrow) {
                    &:hover {
                        background-color: transparent !important;
                        color: var(--wp--preset--color--primary) !important;
                        border: 2px solid var(--wp--preset--color--primary) !important;
                    }
                }
            }
        }
    }

    .wp-block-button {
        .wp-block-button__link {
            &:not(.is-style-outline):not(.is-style-arrow) {
                border: 2px solid var(--wp--preset--color--primary);
                transition: all 0.25s ease-in-out;
    
                &:hover {
                    background-color: white !important;
                    color: var(--wp--preset--color--primary) !important;
                    border: 2px solid white !important;
                }
            }
        }
    }
}

header.header-default {
    .wp-block-navigation {
        .wp-block-navigation-item__content.wp-block-navigation-item__content {
            color: var(--wp--preset--color--quaternary);
        }
    }

    &.scrolled {
        .wp-block-navigation {
            .wp-block-navigation-item__content.wp-block-navigation-item__content {
                &:hover {
                    color: var(--wp--preset--color--primary);
                }
                
            }
        }
    }

    .wp-block-button {
        .wp-block-button__link {
            &:not(.is-style-outline):not(.is-style-arrow) {
                &:hover {
                    background-color: white !important;
                    color: var(--wp--preset--color--primary) !important;
                    border: 2px solid var(--wp--preset--color--primary) !important;
                }
            }
        }
    }
}

.wp-block-navigation {
    &.is-style-arrow {
        .wp-block-navigation-link {
            a {
                &::before {
                    transition: all 0.25s ease-in-out;
                    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="10.358" height="10.358" viewBox="0 0 10.358 10.358"><path d="M5.407,0V5.408H0V7.324H7.324V0Z" transform="translate(0 5.179) rotate(-45)" fill="%2382c341"/></svg>');
                    width: 10px;
                    height: 10px;
                    margin-right: 10px;
                    margin-top: 0px;
                }

                &:hover {
                    &::before {
                        margin-left: 4px;
                        margin-right: 6px;
                    }
                }
            }
        }
    }
}