html {
  --accordion-transition: 0.25s ease;
}
#mobile-nav-container {
  & .mobile-nav__main {
    /* spacing for featured-menu in mobile-nav-grid */
    .accordion-nav .mobile-nav-grid {
      padding-top: 1rem;
      border-top: var(--divider);
      margin-top: .5rem;
    }
    .mobile-nav-grid.accordion-nav {
      /* display: none; */
      padding-bottom: .5rem;
      padding-top: .5rem;
      border-bottom: var(--divider);

      .accordion-nav__tab {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        padding-left: 0;
        /* padding-right: 0.75rem; */
        padding-right: 0;
        color: inherit;
        font-size: var(--font-xl);
        font-weight: bold;
      }
      span.accordion-nav__icon.addButton {
        --plus-btn-thickness: .1875rem;
        position: relative;
        pointer-events: none;
        transition: transform var(--accordion-transition);
      }
      span.accordion-nav__icon.addButton:before {
        left: 8px;
        top: 5px;
      }
      .accordion-nav__tab .addButton:before, 
      .accordion-nav__tab .addButton:after {
        display: block!important;
        transition: border-color var(--accordion-transition);
      }
      .accordion-nav__tab--active .accordion-nav__icon.addButton:before {
        border-left-color: transparent;
      }
      .accordion-nav__tab--active .accordion-nav__icon.addButton:after {
        border-right-color: transparent;
      }
      .accordion-nav__panel {
        display: block;
        max-height: 0;
        overflow: hidden;
        transition: max-height var(--accordion-transition);
        opacity: 0;
      }
      
      .accordion-nav__panel--active {
        max-height: var(--panel-height);
        opacity: 1;
      }
      
      .accordion-nav__icon {
        transition: transform var(--accordion-transition);
      }
      
      .accordion-nav__tab--active .accordion-nav__icon {
        transform: rotate(180deg);
      }
      
      /* Support reduced motion */
      @media (prefers-reduced-motion: reduce) {
        .accordion-nav__panel,
        .accordion-nav__icon {
          transition: none;
        }
      }
    }
  }
}