// Tabs: Primary
// -----------------------------------------------------------------------------
.nav-tabs {
  border-left: 1px solid $gray-400;
  border-bottom: 1px solid $gray-400;
  font-size: 0.875rem;

  .nav-item {
    margin: 0;
  }

  .nav-link {
    color: $gray-500;
    border: 1px solid $gray-400;
    border-left: 0;
    border-bottom: 0;
    border-radius: 0;
    background-color: $gray-100;
    padding: 0 1.85rem;
    height: 40px;
    line-height: 36px;
    position: relative;

    &:hover {
      color: $gray-900;
      border-color: $gray-400;
    }

    &.active {
      color: $gray-900;
      border-bottom-color: var(--ak-accent-color);

      .is-collapse-enabled & {
        border-right-color:var(--ak-accent-color);
      }

      .is-horizontal & {
        border-bottom-color: var(--ak-accent-color);
      }

      &:after {
        content: "";
        height: 4px;
        background-color: var(--ak-accent-color);
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 16;
      }
    }
  }
}
