.tn
  &-tab
    &-header
      display flex
      justify-content center
      align-items center
      &__nav
        width 100%
        display flex
        height 38px
        box-sizing border-box
        position relative
        background-color #fff
        &-item
          flex 1
          display inline-flex
          justify-content center
          align-items center
          position relative
          > a
            padding 0 3px
            font-size 16px
            color currentColor
            height 100%
            display inline-flex
            align-items center
          &-bg
            position absolute
            top 6px
            left 10px
            right 10px
            bottom 8px
      
      &__nav__default
        padding-bottom 1px
        color #000
        .tn-tab-header__nav-item
          color #7383a2
          > a
            color: inherit
            box-sizing border-box
            border-bottom 2px solid transparent
            position: relative;
            z-index: 3;
        .tn-tab-active
          color #0082ff
          > a
            border-color currentColor
            // color #0082FF
            font-size 16px
            // font-weight bold
        &::after
          content ' '
          position absolute
          z-index 5
          bottom 0
          left 0
          width 100%
          border-bottom 1px solid currentColor
          opacity 0.3
          -webkit-transform scaleY(.5)
          transform scaleY(.5)
          -webkit-transform-origin 0 0
          transform-origin 0 0
      &__type__light
        .tn-tab-header__nav-item-bg
          background-color rgba(0, 130, 255, 0.2)
      &__type__dark
        background-color rgba(0, 130, 255, 1)
        .tn-tab-header__nav-item
          color rgba(255, 255, 255, .5)
        .tn-tab-header__nav-item-bg
          background-color rgba(0, 130, 255, 1)
        .tn-tab-active
          color #fff
      &__nav__highlight
        height 28px
        border-radius 4px
        border 1px solid currentColor
        color #574E5F
        .tn-tab-header__nav-item
          color currentColor
          > a
            font-size 13px
          &:not(:last-child)
            border-right 1px solid currentColor
        .tn-tab-active
          a
            color #fff
          background-color currentColor
    &-content
      position relative
      &__item
        width 100%
        display none
        &.tn-tab-content-active
          display block

    &-nav-nomal
      .tn-tab-nav
        display flex
        .tn-tab-nav-item
          width 1%
          flex 1
          display block