/* Mobile Navigation
--------------------------------------------- */
@media only screen and (max-width: 900px) {
	.is-menu-open.has-modal-open {
		padding: var(--wp--preset--spacing--small);
	}

	.is-menu-open.has-modal-open .wp-block-navigation__container {
		width: 100%;
	}

	.is-menu-open.has-modal-open .wp-block-navigation__container > li {
		width: 100%;
		padding: 0 0;
		position: relative;
	}

	.is-menu-open.has-modal-open .wp-block-navigation-item__content {
		width: 100%;
		padding: var(--wp--preset--spacing--small) 0 !important;
        font-size: var(--wp--preset--font-size--xlarge);
        text-align: center;
        font-weight: var(--wp--custom--font-weight--semibold);
        color: white !important;
	}
}

/* copy of wp default css to a 1000px media query */
@media (min-width: 900px) {
    .wp-block-navigation__responsive-container-open:not(.always-shown) {
        display: none !important;
    }

    .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
        display: block !important;
        width: 100%;
        position: relative;
        z-index: auto;
        background-color: inherit;
    }
}
    
/* WP default for 600px */
@media (min-width: 600px) {
    .wp-block-navigation__responsive-container-open:not(.always-shown) {
        display: flex;
    }
    .wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
        display: none;
    }
}    
    
/* 
* Navigation text decoration
*/

/* Default - Transparent */
:root :where(.wp-block-navigation a:where(:not(.wp-element-button))){
    text-decoration: underline;
    text-decoration-color: transparent;
    text-decoration-thickness: 2px;
    transition: text-decoration .3s;
    text-underline-offset: 7px;
}

/* Active item */
:root :where(.wp-block-navigation .current-menu-item a:where(:not(.wp-element-button))){
    text-decoration-color: var(--wp--preset--color--light-200);
    text-decoration-thickness: 2px;
}

@media (hover: hover){
    :root :where(.wp-block-navigation a:where(:not(.wp-element-button)):hover){
        text-decoration-color: var(--wp--preset--color--light-200);
        text-decoration-thickness: 2px;
        transition: text-decoration .1s;
    }
}

.wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open{
    background-color: var(--wp--preset--color--primary-100);
    color: white;
}

/* 
* Sticky navigation fix
* Makes parent element sticky, so no grouping in templates needed
*/
.wp-block-template-part:has(>.is-position-sticky) {
	--wp-admin--admin-bar--position-offset: var( --wp-admin--admin-bar--height, 0px );
	position: sticky;
	top: calc( 0px + var( --wp-admin--admin-bar--position-offset, 0px ) );
	z-index: 10;
}

