.tag-plugin.tabs
  position: relative
  margin-top: 1rem
  margin-bottom: 1rem
  display: flex
  flex-direction: column
  &[align=left]
    align-items: flex-start
    .nav-tabs,.tab-content
      align-self: flex-start
  &[align=center]
    align-items: center
    .nav-tabs,.tab-content
      align-items: center
  &[align=right]
    align-items: flex-end
    .nav-tabs,.tab-content
      align-self: flex-end

.tag-plugin.tabs
  .nav-tabs
    display: flex
    align-self: center
    overflow: scroll visible
    scrollbar(0, 0)
    max-width: 100%
    white-space: nowrap
    margin: 0 !important
    line-height: 1.5
    position: relative
    padding: 8px 0
    &:after
      content: ''
      position: absolute
      background: var(--block-border)
      width: 100%
      height: 2px
      bottom: 0
      left: 0
      border-radius: 2px
    .tab
      list-style-type: none
      a
        display: block
        cursor: pointer
        padding: .25rem .75rem
        --fs-content: $fs-content-3
        font-size: var(--fs-content)
        line-height: inherit
        font-weight: 500
        color: var(--text-p3)
        border-radius: 4px
        position: relative
        margin: 0 2px
        &:hover
          color: var(--text-p1)
          background: var(--block-border)
        i
          pointer-events: none
      &.active a
        cursor: default
        color: var(--text-p1)
        background: var(--card)
        box-shadow: $boxshadow-button
        &:after
          content: ''
          z-index: 1
          position: absolute
          background: var(--theme)
          height: 2px
          bottom: -8px
          left: .75rem
          right: .75rem
          border-radius: 2px

  .tab-content
    max-width: 100%
    text-align: justify
    margin-top: .5rem
    display: flex
    flex-direction: column
    .tab-pane
      display: block
      max-width: 100%
      &:not(.active)
        height: 0
        overflow: hidden
      &.active
        height: auto
  .tab-content:has(.grid-box),.tab-pane:has(.grid-box)
    width: 100%