.x-navbar-complex {
  @extend %x-flex-center,
          %w-100,
          %py-2,
          %py-md-0;

  min-width: 0;

  .breadcrumb {
    @extend %pl-0,
            %pt-0;

    min-width: 0;
    flex-wrap: nowrap;

    &-item {

      &:last-child {
        overflow: hidden;
        white-space: nowrap;
        min-width: 0;
      }

      a {
        color: theme-color("info") !important;

        @include hover-focus-active {
          color: theme-color("secondary");
        }
      }

      &-wrapper {
        display: inline-block !important;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
      }
    }
  }
}

.x-navbar-complex-prepend {
  @extend %pr-0,
          %x-flex-center;

  .btn {
    @extend %x-flex-center,
            %p-0,
            %text-info,
            %bg-transparent,
            .x-no-focus;
    line-height: 1;

    @include hover-focus-active {
      color: theme-color("secondary");
    }
  }
}

.x-navbar-complex-content {
  @extend %ml-3,
          %pl-3,
          %pr-3,
          %flex-grow-1,
          %position-relative,
          %border-left;
  min-width: 0;

  .x-title {
    @extend %position-relative;

    flex: 1;
    min-width: 0;

    h6 {
      @extend %mb-0;
      max-width: 17rem;
      overflow: hidden !important;
      text-overflow: ellipsis;
      white-space: nowrap;
      @include media-breakpoint-up(md) {
        max-width: 100%;
      }
    }
  }
}