/**
 * @file
 * Primary navigation shared styles for both desktop and mobile.
 * -wide covers desktop-only and -offcanvas covers mobile-only.
 */

.primary-nav__menu {
  list-style: none;
}

.primary-nav__menu-item {
  margin: 0 0 1em 0;
  min-height: 1.5rem;
  font-weight: bold;
}

.primary-nav__menu-item.primary-nav__menu-item--has-children {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

/** Menu items may be linked, not linked text, or button. **/

.primary-nav__menu-link {
  text-decoration: none;
}

.primary-nav__menu-link:focus {
  outline: solid 2px var(--laurier-gold);
  outline-offset: 2px;
}

.primary-nav__menu-link--nolink {
  padding: 0.5625rem 0;
  color: var(--laurier-purple);
}

.primary-nav__menu-link--button {
  padding: 0;
  border: 0;
  background: transparent;
}

/** Span inside the link **/
.primary-nav__menu-link-inner {
  display: inline-flex;
  align-items: center;
}

/** Top level specific styles. **/

.primary-nav__menu--level-1 {
  margin: 0;
}

.primary-nav__menu-link--level-1 {
  position: relative;
  display: flex;
}

.primary-nav__menu-link-inner--level-1:is(:hover) {
  outline: 2px solid var(--laurier-gold);
  outline-offset: 2px;
  position: relative;
}

/** Secondary (and theoretically, tertiary) menu styles. **/

.primary-nav__menu--level-2 {
  margin-left: -1.125rem;
  padding-left: 2.8125rem;
}

.primary-nav__menu--level-2 {
  visibility: hidden;
  overflow: hidden;
  flex-basis: 100%;
  max-height: 0;
  margin-top: 0;
  margin-bottom: 0;
  transition: visibility 0.4s, max-height 0.4s;
}

.primary-nav__menu-link--level-2,
.primary-nav__menu-link--level-3 {
  color: var(--laurier-purple);
  font-weight: normal;
}

.primary-nav__menu--level-2.is-active-menu-parent {
  visibility: visible;
  max-height: none;
}