.bd-navbar {
  min-height: 10rem;
  background-color: $primary;

  @include media-breakpoint-down(md) {
    padding-right: 0.5rem;
    padding-left: 0.5rem;

    .navbar-nav-scroll {
      max-width: 100%;
      height: 2.5rem;
      margin-top: 0.25rem;
      overflow: hidden;
      font-size: 0.875rem;

      .navbar-nav {
        padding-bottom: 2rem;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
      }
    }
  }

  &.bd-navbar--slim {
    min-height: 5rem;
    @include media-breakpoint-up(md) {
      @supports (position: sticky) {
        position: sticky;
        top: 0;
        z-index: 9;
      }
    }
  }

  .navbar-nav {
    .nav-link {
      padding-right: 0.5rem;
      padding-left: 0.5rem;
      color: #fff;

      &.active,
      &:hover {
        color: #fff;
        background-color: transparent;
      }

      &.active {
        font-weight: 500;
      }
    }
  }

  .navbar-nav-svg {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    vertical-align: text-top;
  }

  .dropdown-menu {
    font-size: 0.875rem;
  }

  .dropdown-item.active {
    font-weight: 500;
    color: $gray-900;
    background-color: transparent;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23292b2c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: 0.4rem 0.6rem;
    background-size: 0.75rem 0.75rem;
  }
}

.bd-search {
  background-color: $white;
  position: relative; // To contain the Algolia search
  @include media-breakpoint-up(lg) {
    max-width: 20rem;
  }

  .form-control:focus {
    border-color: $primary-bright;
    box-shadow: 0 0 0 3px rgba($primary-bright, 0.25);
  }
}

.bd-menu-docs-toggle {
  line-height: 1;
  color: $gray-900;
}

.bd-logo-title {
  font-size: 24px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: unset;
  margin-bottom: 0;
  @include media-breakpoint-up(sm) {
    font-size: 32px;
    line-height: 1;
  }
}

.bd-logo-subtitle {
  font-size: 14px;
  font-weight: 300;
  letter-spacing: normal;
}
