$tabs-prefix: #{$prefix}-tabs;
@mixin tabs-base {
  display: flex;
  position: relative;
  flex: 1 0 auto;
  transition: all $animation-duration-base;
}

@mixin ne-tabs {
  .#{$tabs-prefix} {
    @include tabs-base;
  }
  .#{$tabs-prefix}-container {
    display: flex;
    border-bottom: 1px solid $global-border-color;
  }
  .#{$tabs-prefix}-scroller {
    display: flex;
    position: relative;
    overflow-x: hidden;
    flex: 1 1 auto;
    margin-bottom: -1px;
    white-space: nowrap;
  }
  .#{$tabs-prefix}-scroll-button {
    border-radius: 0;
  }
  .#{$tabs-prefix}-inkbar {
    position: absolute;
    bottom: 0;
    z-index: 1;
    height: 2px;
    background-color: $primary-color;
    transition: all $animation-duration-base ease-out;
  }
  @each $name, $value in $sizes-map {
    .#{$tabs-prefix}-#{$name} {
      height: $value;
      font-size: map_get($font-sizes-map, $name);
      line-height: ($global-line-height + 0.01px) / map-get($font-sizes-map, $name);
    }
  }
}