/*
Theme Name: Twenty Twenty-Five Child - navigation customization
Theme URI: https://envirostage.com/
Description: Navigation customization to accompany the child theme for the Twenty Twenty-Five theme.
Author: Chad Lenek
Author URI: https://envirostage.com/
Template: twentytwentyfive-child
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyfive-child navCustom
*/


/*mobile navigation customization - align left etc*/
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__responsive-container-content {
    align-items: flex-start;
    text-align: left;
    padding: 2rem;
}

.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__container,
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation-item {
    align-items: flex-start;
    text-align: left;
    width: 100%;
}

.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation-item__content {
    justify-content: flex-start;
    width: 100%;
}

/* Submenus */
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__submenu-container {
    display: none;
    padding-left: 1.25rem;
    margin-left: 0;
    width: 100%;
}

/* Show submenu when JS adds class */
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation-item.mobile-submenu-open >
.wp-block-navigation__submenu-container {
    display: flex;
}

/* Optional + / - indicator */
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation-item.has-child >
.wp-block-navigation-item__content::after {
    content: " +";
    margin-left: 0.35rem;
}

.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation-item.has-child.mobile-submenu-open >
.wp-block-navigation-item__content::after {
    content: " −";
}
/* Reset all mobile submenu containers */
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__submenu-container {
    display: none;
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;

    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    align-items: flex-start !important;
    text-align: left !important;
    box-shadow: none !important;
    border: 0 !important;
}

/* Show opened submenu */
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation-item.mobile-submenu-open >
.wp-block-navigation__submenu-container {
    display: flex !important;
    flex-direction: column !important;
}

/* Reset every submenu item */
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__submenu-container >
.wp-block-navigation-item {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: flex-start !important;
}

/* Reset every submenu link */
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__submenu-container >
.wp-block-navigation-item >
.wp-block-navigation-item__content {
    width: 100% !important;
    margin: 0 !important;
    padding: 0.75rem 0 0.35rem!important;
    justify-content: flex-start !important;
    text-align: left !important;
}
/* Level 2 items */
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__container >
.wp-block-navigation-item >
.wp-block-navigation__submenu-container >
.wp-block-navigation-item >
.wp-block-navigation-item__content {
    padding-left: 1.5rem !important;
}

/* Level 3 items */
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__container >
.wp-block-navigation-item >
.wp-block-navigation__submenu-container
.wp-block-navigation__submenu-container >
.wp-block-navigation-item >
.wp-block-navigation-item__content {
    padding-left: 3.0rem !important;
}

/*box frame rendered around parent plus child menu items - this attempts to override that*/
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation-item:focus,
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation-item:focus-within,
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation-item__content:focus,
.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation-item__content:focus-visible {
    outline: none;
    box-shadow: none;
}

/* Show them inside opened mobile menu */
.wp-block-navigation__responsive-container.is-menu-open
.mobile-only-nav-item {
    display: flex !important;
}
/*forcing diff breakpoint on the navigation menu - hamburger below 900px width*/
@media (max-width: 900px) {
  .wp-block-navigation__responsive-container-open {
    display: flex !important;
  }
  .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: none !important;
  }
}
@media (min-width: 901px) {
	/* Hide mobile-only links by default/desktop */
	.mobile-only-nav-item {
		display: none !important;
	}
}