:root {
    --theme--primary-color: var(--color-theme-primary);
    --theme--link-color: var(--color-theme-link);
    --theme--text-color: var(--wp--preset--color--charcoal);
    --theme--heading-color: var(--theme--text-color);
}

.wp-block-columns.grid {
    display:grid;
}

.site-header {
    position:sticky;
    top:0;
    z-index:999;
    background:#fff;
    box-shadow: 0 2px 7px rgba(0,0,0,0.10);
    transition-duration: 500ms;
}

.custom-logo-link img {
    width:auto;
    min-width: 230px;
    height: 100px;
    transition-duration: 500ms;
}

.site-header.sticky .custom-logo-link img,
#headerSize.compact .custom-logo-link img {
    min-width: 138.5px;
    height: 60px;
}

body.page-template-default h1.main-title,
body.archive h1.entry-title {
    margin: 2em 0 1em 0;
}

#headerSize {
    opacity:0;
    transition-property: opacity;
    transition-timing-function: ease-in-out;
    transition-duration: 300ms;
    padding: 15px 50px;
    
    & .header-button {
        font-size: var(--wp--preset--font-size--x-small);
    }
    
    & #menu-toggle {
        display:none;
    }
    
    & #header-mobile-buttons {
          display:none;
    }

    &.init {
        opacity: 1;
    }
}

#headerSize.compact {
    padding: 15px 25px;
    
    & .header-button {
        font-size: var(--wp--preset--font-size--xx-small);
    }
}

#headerSize.mobile {
    padding: 15px 15px;
    
    & #header-center {
        display:none;
    }
    
    & #header-buttons {
        display:none;
    }
    & #header-mobile-buttons {
         display:inline-block;
    }
    
    & #menu-toggle {
        display:inline-block;
    }
}

/* Quick Search */
#header-quick-search {
    position:relative;
    &::before {
        position:absolute;
        left:10px;
        content: '\f002';
        font-family: "Font Awesome 5 Pro";
        font-weight:300;
        color: var(--theme--primary-color); 
    }
}

/*Main Menu*/ 

.site-header-navigation {
    & ul.menu {
        list-style: none;
        margin: 0;
        padding: 0;
        display:flex;
        flex-wrap:nowrap;
        font-family: var(--wp--preset--font-family--bricolage-grotesque);
        font-size: var(--wp--preset--font-size--small);
        
        & li {
            padding: 0 8px;
            display: block;
            position:relative;
            
            & a {
                position: relative;
                display: block;
                text-decoration: none;
                padding: var(--nav-menu--padding-y, 0.5rem) var(--nav-menu--padding-x, 1rem);
                white-space:nowrap;
                color: var(--theme--header-text-color, #191818);
                -webkit-transition: color 150ms linear;
                -moz-transition: color 150ms linear;
                -o-transition: color 150ms linear;
                -ms-transition: color 150ms linear;
                transition: color 150ms linear;
            }
            
            & > a {
                padding: var(--nav-menu--padding-y, 0.5rem) 0.25rem;

                &:hover {
                    color: var(--theme--primary-color, #BDA588); 
                }
            }

            & ul.sub-menu {
                visibility:hidden;
                list-style: none;
                margin:20px 0 0 -10px;
                position:absolute;
                background-color: var(--wp--preset--color--sand);
                text-align:left;
                opacity:0;
                transition-duration: 300ms;
                z-index: 10;
                
                & li {
                    padding:0;

                    & a {
                        color:#000;
                        display:block;
                        position:relative;
                        transition:300ms;
                        padding-left:15px;
                        padding-right:15px;
                        font-family: var(--wp--preset--font-family--poppins);
                        font-weight:300;
                        font-size: var(--wp--preset--font-size--small);

                        &::after {
                            content: '';
                            position:absolute;
                            top:0;
                            left:0;
                            bottom:0;
                            width:5px;
                            background:var(--theme--primary-color, #666666);
                            opacity:0;
                            transition:300ms;
                        }
                        &:hover::after {
                            opacity:1;
                        }
                    }

                    & > ul.sub-menu {
                        visibility:hidden;
                        list-style: none;
                        margin: 0;
                        padding: 0;
                        position:absolute;
                        left:100%;
                        top:0;
                        opacity:0;
                    }
                }
            }

            &:hover {
                & > ul.sub-menu{
                    margin: 5px 0 0 -10px;
                    visibility:visible;
                    opacity:1;
                }
            }
        }
    }
}

#headerSize.compact .site-header-navigation ul.menu > li > a {
    font-size: var(--wp--preset--font-size--small);
}
#headerSize.compact .site-header-navigation ul.menu li  ul.sub-menu li > a{
    font-size: var(--wp--preset--font-size--x-small);
}

/* Banner Text Size */
@media screen and (min-width: 1200px){
    .banner-text h1,
    .banner-text h2 {
        font-size: 5rem;
    }
}

/* Splide Overrides */

.splide {

    .splide__arrow {
        border-radius: 0;
        background: #1a1d1e99;
        opacity:0.7;

        & svg {
            fill: #fff;
        }
    }
    
    .splide__pagination {
        bottom:0;
        position:relative;
        margin-top:10px;

        .splide__pagination__page{
            border:1px solid var(--theme--primary-color);
            background: transparent;

            &.is-active {
                border:1px solid var(--theme--primary-color);
                background: var(--theme--primary-color);;
            }
        }
    }

}

#mobile-search-button #faux-dates-input {
    position:relative;

    &:before {
        content: '\f073';
        font-family: "Font Awesome 5 Pro";
        font-weight:400;
        position:absolute;
        left:0;
        top:2px;
        color: var(--theme--primary-color);
    }
}

/* Prevent Theme Slideout Menus from interfering with mMenu */
body.mm-wrapper_opening #mobile-search-bar-bottom-holder-wrapper,
body.mm-wrapper_opening #advanced-search-filters-wrapper,
body.mm-wrapper_opening #quick-search-wrapper{
    display:none;
}

@media screen and (min-width: 800px) {
    .wp-block-group.justify-text p,
    p.justify-text {
        text-align: justify !important;
        text-align-last: center !important;
    }
}