.navbar {
  z-index: 1; // required to make the shadow overlap the below content (need is visible in mobile drawer overlay)
  border: 0;
  border-radius: 0;
  @include box-shadow($bmd-shadow-2dp);

  // #853 start - https://github.com/twbs/bootstrap/pull/18976/files
  @if $enable-flex {
    display: flex;
    flex-flow: row nowrap;
    flex-shrink: 0;
    align-items: center;
    align-self: stretch;

    > * {
      flex-shrink: 0;
    }
  } @else {
    @include clearfix;
  }
  // #853 end - https://github.com/twbs/bootstrap/pull/18976/files
}

.navbar-nav {
  .nav-item {
    position: relative; // used to correctly size ripple container
  }
}

.navbar > .container {
  flex: 1;
}