/* Global styles */
header {
    position: sticky;
    top: 0;
    width: 100%;
    z-index: 99999;

    .header-inner {
        transition: padding 0.2s ease-in-out;

        .wp-block-site-logo {
            img {
                transition: width 0.2s ease-in-out;
            }
        }

        .navigation-wrapper {
            transition: gap 0.2s ease-in-out;

            .top-navigation-wrapper {
                transition-property: height, opacity, padding, translate;
                transition-duration: 0.2s;
                transition-timing-function: ease-in-out;
            }

            .wp-block-navigation {
                .wp-block-navigation__container {
                    transition: color 0.2s ease-in-out;
                }

                .wp-block-button__link {
                    transition-property: background-color, color;
                    transition-duration: 0.2s;
                    transition-timing-function: ease-in-out;
                }
            }
        }
    }

    &.scrolling {
        .header-inner {
            padding: 5px 0 !important;

            .wp-block-site-logo {
                img {
                    width: 135px;
                }
            }

            .navigation-wrapper {
                gap: 0 !important;

                .top-navigation-wrapper {
                    height: 0 !important;
                    opacity: 0;
                    padding: 0 !important;
                    pointer-events: none;
                    translate: 0 -100% 0;
                }

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

                    .wp-block-button__link {
                        background-color: var(--wp--preset--color--quaternary) !important;
                        border-color: var(--wp--preset--color--quaternary) !important;
                        color: var(--wp--preset--color--white) !important;


                        .wp-block-navigation__responsive-container-close svg, .wp-block-navigation__responsive-container-open svg {
                            fill: var(--wp--preset--color--quaternary);
                        }
                    }
                }
            }
        }

        &:not(:has(.header-dark)):not(.scrolling) {
            .header-inner {
                .wp-block-site-logo {
                    img {
                        filter: brightness(0) invert(1);
                    }
                }
            }
        }
    }
}

/* Mobile menu */
@media screen and (max-width: 795px) {
    body:not(.wp-admin):not(.block-editor-iframe__body) {
        header {
            .wp-block-navigation__responsive-container {
                min-height: 100vh !important;

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

                    .wp-block-navigation__container {
                        width: 100%;
                        gap: 0px;

                        > li {
                            width: 100%;
                            box-sizing: border-box;
                            border-bottom: 1px solid rgba(255, 255, 255, 0.2);
                            padding-bottom: var(--wp--preset--spacing--small-secondary);

                            > a {
                                color: white;
                                padding: 0 var(--wp--preset--spacing--small-secondary);
                                font-size: 14px;
                            }

                            + li {
                                padding-top: var(--wp--preset--spacing--small-secondary);
                            }

                            .wp-block-navigation-submenu {
                                padding-left: 0 !important;
                                padding-top: var(--wp--preset--spacing--small-secondary);
                                padding-bottom: 0;

                                > li {
                                    margin-bottom: 5px;

                                    > a {
                                        color: rgba(255, 255, 255, 0.75);
                                        padding: 0 var(--wp--preset--spacing--small-secondary);
                                        font-size: 12px;
                                    }
                                }
                            }

                            &:last-child {
                                border-bottom: 0;
                            }
                        }
                    }

                    .wp-block-buttons {
                        padding: 0 var(--wp--preset--spacing--small-secondary);
                        width: 100%;
                        box-sizing: border-box;

                        .wp-block-button {
                            flex: 0 1 100%;
                            width: 100%;
                            display: block;

                            .wp-block-button__link {
                                border: 2px solid white;
                                background-color: white;
                                color: var(--wp--preset--color--primary);
                                display: block;

                                &:hover {
                                    border: 2px solid white !important;
                                    background-color: transparent !important;
                                    color: white !important;
                                }
                            }
                        }
                    }

                }

                .wp-block-navigation__responsive-container-close {
                    top: 30px !important;
                    right: 30px !important;

                    svg {
                        fill: white !important;
                    }
                }
            }
        }
    }
}

.entry-content{
    margin: 0 !important;
}

.yoast-breadcrumbs{
    a{
        opacity: 0.8;
        transition: opacity 0.2s ease-in-out;

        &:hover{
            opacity: 1;
        }
    }

    span.breadcrumb_last{
        font-weight: bold;
    }
}