/* Remove margin at top of entry content */
.entry-content {
    margin-block-start: 0;
}

/* 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: #4E6D64;

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

                        > 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: 16px;
                            }

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

                            .wp-block-navigation-submenu {
                                gap: 10px;
                                margin-top: 15px;
                                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: 14px;
                                    }
                                }
                            }

                            &: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 {
                                display: block;
                            }
                        }
                    }

                }

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

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

/* Header */
body:not(.wp-admin):not(.block-editor-iframe__body) {
    header {
        /*position: fixed;*/
        top: 0;
        width: 100%;
        z-index: 99;

        > .has-background{
            transition-property: background-color;
            transition-duration: 0.2s;
            transition-timing-function: ease-in-out;
        }

        .site-header--inner{
            transition-property: background-color, padding;
            transition-duration: 0.2s;
            transition-timing-function: ease-in-out;
        }

        #logo-wrapper{
            align-self: flex-start;
            opacity: 1;
            overflow: hidden;
            transition-property: opacity, width;
            transition-duration: 0.2s;
            transition-timing-function: ease-in-out;

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


        &.transparent-on-load:not(.scrolling){
            .site-header--inner{
                --wp--preset--color--primary: #fff;
                background-color: unset !important;

                img{
                    filter: brightness(0) invert(1);
                }

                .wp-block-button__link{
                    &:hover{
                        color: #4E6D64 !important;
                    }
                }
            }
        }

        @media screen and (max-width: 992px) {
            #logo-wrapper{
                justify-content: flex-start;
            }
        }

        &.scrolling{
            .wp-block-navigation-item__content{
                &::before{
                    background-color: var(--wp--preset--color--primary);
                }
            }

            .site-header--inner{
                padding-bottom: 10px !important;
                padding-top: 10px !important;
            }

            #logo-wrapper{
                height: 0;
                opacity: 0;
                pointer-events: none;
            }
        }
    }
}

/* Helper Classes */
@media screen and (max-width: 767.98px) {
    .vertical-center-on-mobile{
        &.is-vertical{
            justify-content: center !important;
        }
    }
}

.is-position-sticky,
.avoid-header {
    top: 200px !important;
    scroll-margin-top: 200px;
}

html{
    scroll-behavior: smooth;
}

.yoast-breadcrumbs{
    a,
    span {
        font-size: clamp(0.75rem, 0.692rem + 0.308vw, 1rem);
    }

    a{
        color: inherit;
        transition: color 0.2s ease-in-out;

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

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

.query-loop-filters-render{
    flex-wrap: wrap;
}

footer{
    margin: 0;
}

.expander {
    display: grid;
    grid-template-rows: 0fr;
    overflow: hidden;
    transition: grid-template-rows 1s;

    .expander-content {
        min-height: 200px;
        position: relative;

        &::before{
            background-image: linear-gradient(0deg, rgba(255,255,255,1), rgba(255,255,255,0) 100%);
            bottom: 0;
            content: '';
            height: 100px;
            left: 0;
            opacity: 1;
            position: absolute;
            transition-property: opacity;
            transition-duration: 0.2s;
            transition-timing-function: ease-in-out;
            width: 100%;
        }
    }

    &.expanded {
        grid-template-rows: 1fr;

        .expander-content{
            &::before{
                opacity: 0;
            }
        }
    }
}

.select-wrapper,
.control:has(> select) {
    display: inline-block;
    position: relative;

    &::before{
        background-image: url("../images/chevron-outline-down.svg");
        background-repeat: no-repeat;
        background-size: contain;
        content: '';
        height: 18px;
        pointer-events: none;
        position: absolute;
        right: 10px;
        top: 50%;
        translate: 0 -50% 0;
        width: 18px;
        z-index: 1;
    }

    select{
        appearance: none;
        background-color: var(--wp--preset--color--white);
        border: 1px solid var(--wp--preset--color--secondary);
        border-radius: 100px;
        color: var(--wp--preset--color--secondary);
        cursor: pointer;
        padding: 10px 35px 10px 10px;
    }
}

.gfield.gfield--type-html{
    ul, ol {
        list-style: initial;
    }
}

#premium-sample{
    display: none;
}

.wp-block-post-terms{
	&.taxonomy-brand {
		pointer-events: none;
	}
}