/*
 * Accordion presentation for core/navigation and custom Navigation Overlays.
 * JavaScript adds innovitale-accordion-item only inside a Navigation block whose
 * presentation is set to Haitari, so these rules do not affect other menus.
 */


/* Keep accordion navigation full width before any branch is opened. */
.wp-block-navigation.innovitale-mobile-accordion .wp-block-navigation__responsive-container.is-menu-open,
.wp-block-navigation.innovitale-mobile-accordion .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog,
.wp-block-navigation.innovitale-mobile-accordion .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.wp-block-navigation.innovitale-mobile-accordion .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content > .wp-block-navigation__container,
.wp-block-navigation.innovitale-mobile-accordion .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
.wp-block-navigation.innovitale-mobile-accordion .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item,
.wp-block-navigation.innovitale-mobile-accordion .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-submenu {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box;
}

.wp-block-navigation.innovitale-mobile-accordion .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content,
.wp-block-navigation.innovitale-mobile-accordion .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
    align-items: stretch !important;
}

/* Custom Navigation Overlay can render an inner navigation without inheriting
 * the outer block's sizing. The prepared accordion items are our safe marker. */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container:has(> .innovitale-accordion-item),
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation:has(.innovitale-accordion-item),
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation:has(.innovitale-accordion-item) > .wp-block-navigation__container {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box;
    align-items: stretch !important;
}

.wp-block-navigation .wp-block-navigation-submenu.innovitale-accordion-item {
    display: flex !important;
    flex-flow: row wrap !important;
    align-items: center !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box;
}

.wp-block-navigation .wp-block-navigation-submenu.innovitale-accordion-item > .wp-block-navigation-item__content {
    flex: 1 1 auto;
    min-width: 0;
    width: auto !important;
    box-sizing: border-box;
}

.wp-block-navigation .wp-block-navigation-submenu.innovitale-accordion-item > .wp-block-navigation-submenu__toggle {
    position: static !important;
    flex: 0 0 33px;
    width: 33px !important;
    min-width: 33px;
    height: 33px !important;
    margin-left: auto !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    background: transparent;
    border: 0;
    color: inherit;
    cursor: pointer;
}

.wp-block-navigation .wp-block-navigation-submenu.innovitale-accordion-item > .wp-block-navigation-submenu__toggle svg {
    display: block;
    width: 16px !important;
    height: 16px !important;
    fill: currentColor;
    transition: transform 160ms ease;
}

.wp-block-navigation .wp-block-navigation-submenu.innovitale-accordion-item > .wp-block-navigation__submenu-container {
    position: static !important;
    inset: auto !important;
    flex: 0 0 100%;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
    box-sizing: border-box;
    border: 0 !important;
    box-shadow: none !important;
    transform: none !important;
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

.wp-block-navigation .wp-block-navigation-submenu.innovitale-accordion-item.innovitale-accordion-open > .wp-block-navigation__submenu-container {
    display: flex !important;
    flex-direction: column;
    align-items: stretch;
    visibility: visible !important;
    opacity: 1 !important;
}

.wp-block-navigation .wp-block-navigation-submenu.innovitale-accordion-item.innovitale-accordion-open > .wp-block-navigation-submenu__toggle svg {
    transform: rotate(180deg);
}

.wp-block-navigation .wp-block-navigation-submenu.innovitale-accordion-item > .wp-block-navigation__submenu-container > .wp-block-navigation-item,
.wp-block-navigation .wp-block-navigation-submenu.innovitale-accordion-item > .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
    width: 100%;
    box-sizing: border-box;
}
