// Pill nav
//
// Horizontal navigation with large top-aligned tab visuals.

.nav-tab {
  .list-unstyled();
  margin-bottom: @line-height-computed;
  border-bottom: 1px solid @nav-tabs-border-color;
  &:extend(.clearfix all);
}

.nav-tab-item {
  position: relative;
  display: block;
  float: left;
  // Make the list-items overlay the bottom border
  margin-bottom: -1px;
}

.nav-tab-link {
  display: block;
  padding: @nav-link-padding;
  margin-right: .2rem;
  line-height: @line-height-base;
  border: 1px solid transparent;
  .border-radius(@border-radius-base @border-radius-base 0 0);

  &:hover,
  &:focus {
    text-decoration: none;
    background-color: @nav-link-hover-bg;
    border-color: @nav-tabs-link-hover-border-color @nav-tabs-link-hover-border-color @nav-tabs-border-color;
  }
}

// Open dropdown and active states
.open,
.active {
  > .nav-tab-link {
    &,
    &:hover,
    &:focus {
      color: @nav-tabs-active-link-hover-color;
      background-color: @nav-tabs-active-link-hover-bg;
      border: 1px solid @nav-tabs-active-link-hover-border-color;
      border-bottom-color: transparent;
      cursor: default;
    }
  }
}

// Disabled state sets text to gray and nukes hover/tab effects
.disabled {
  > .nav-tab-link {
    &,
    &:hover,
    &:focus {
      color: @nav-disabled-link-color;
      background-color: transparent;
      border-color: transparent;
      cursor: not-allowed;
    }
  }
}