.header {
  position: sticky;
  top: 0;
  z-index: 100;

  .gin--core-navigation & {
    top: 54px;
  }
}

.page--canvas-wrapper .header {
  top: 0;
}

.navbar-brand {
  display: block;
}

#navbar-main {
  background-color: $primary-colors-primary-accent;
  padding: $padding-padding-xs 0;
  box-shadow: none;

  .navbar-nav {
    @include media-breakpoint-up(md) {
      gap: 0;
    }

    li.nav-item {
      @include media-breakpoint-up(md) {
        margin-right: 2rem;
      }

      &:last-of-type {
        @include media-breakpoint-up(md) {
          margin-right: 0;
        }
      }

      a.nav-link {
        color: $primary-colors-primary-contrast;
        text-transform: none;
        padding: 0;
        font-size: rem-calc(16);
        font-style: normal;
        font-weight: $font-weight-medium;
        line-height: 1.4;
        letter-spacing: rem-calc(-1);

        &:focus,
        &:hover {
          color: $primary-colors-primary-contrast;
        }

        &::after {
          display: none;
        }
      }
    }

    li.menu-item--expanded {
      >a.nav-link {
        @include media-breakpoint-up(lg) {
          padding-right: rem-calc(28);
        }

        &::before {
          @include media-breakpoint-up(lg) {
            font-family: $font-fontawesome;
            font-weight: 900;
            font-size: 14px;
            color: #D90C10;
            position: absolute;
            top: 0;
            right: rem-calc(5);
            content: '\f078';
            transition: all 0.3s ease;
          }
        }
      }

      &:has(.show-important)::before {
        transform: rotate(180deg);
      }

      &.hovered .dropdown-cor-menu,
      &.dropdown:hover ul,
      .dropdown-cor-menu {
        @include media-breakpoint-up(lg) {
          display: none;
        }
      }
    }
  }

  .navbar-toggler {
    &:focus {
      box-shadow: 0 0 0 $primary-colors-primary-contrast;
    }

    .navbar-toggler-icon {
      background-image: url('../images/close-white.svg');
      filter: none;
    }
  }
}

#CollapsingNavbar {
  @include media-breakpoint-down(lg) {
    margin: 0 rem-calc(-12);
    position: relative;
    top: rem-calc(10);
    z-index: 10;
    background-color: $primary-colors-primary-accent;
    min-height: calc(100vh - 71px);
    height: 30px;
    overflow-y: scroll;
  }
}
