//
// Navbar tabs
// --------------------------------------------------


// Move borders to anchors instead of bottom of list
.nav-tabs-justified
{
  border-bottom: 0;

  > li > a
  {
    // Override margin from .nav-tabs
    margin-right: 0;
    border-radius: @border-radius-base;
  }

  > .active > a,
  > .active > a:hover,
  > .active > a:focus
  {
    border: 1px solid @nav-tabs-justified-link-border-color;
  }

  @media (min-width: @screen-sm-min)
  {
    > li > a
    {
      border-bottom: 1px solid @nav-tabs-justified-link-border-color;
      border-radius: @border-radius-base @border-radius-base 0 0;
    }
    > .active > a,
    > .active > a:hover,
    > .active > a:focus
    {
      border-bottom-color: @nav-tabs-justified-active-link-border-color;
    }
  }
}

// Tabs
// -------------------------

// Give the tabs something to sit on
.nav-tabs
{
  border-bottom: 1px solid @nav-tabs-border-color;
  > li
  {
    float: left;
    // Make the list-items overlay the bottom border
    margin-bottom: -1px;

    // Actual tabs (as links)
    > a
    {
      margin-right: 2px;
      line-height: @line-height-base;
      border: 1px solid transparent;
      border-radius: @border-radius-base @border-radius-base 0 0;
      &:hover
      {
        border-color: @nav-tabs-link-hover-border-color @nav-tabs-link-hover-border-color @nav-tabs-border-color;
      }
    }

    // Active state, and it's :hover to override normal :hover
    &.active > a
    {
      &,
      &: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;
      }
    }
  }
  // pulling this in mainly for less shorthand
  &.nav-justified
  {
    .nav-justified();
    .nav-tabs-justified();
  }
}



// Tabbable tabs
// -------------------------

// Clear any floats
.tabbable
{
  .clearfix();
}

// Show/hide tabbable areas
.tab-content > .tab-pane,
.pill-content > .pill-pane
{
  display: none;
}
.tab-content,
.pill-content
{
  > .active
  {
    display: block;
  }
}

// Specific dropdowns
.nav-tabs .dropdown-menu
{
  // make dropdown border overlap tab border
  margin-top: -1px;
  // Remove the top rounded corners here since there is a hard edge above the menu
  .border-top-radius(0);
}
