// Tabs Vertical (new)
//================================================== //

.tab-container.vertical {
  background-color: $vertical-tab-background-color;

  > .tab-list-container {
    background-color: $vertical-tab-background-color;
    border-right: 1px solid $vertical-tab-border-color;

    > .tab-list {
      > .tab {
        max-height: 40px;

        a {
          max-width: inherit;
          max-height: inherit;
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
          padding: 10px 30px;
        }
      }
    }
  }
}

.tab-container.vertical > .tab-list-container > .tab-list > .tab.is-selected:not(.is-disabled) {
  &:hover {
    background-color: $vertical-tab-hover-background-color;
  }

  &.is-selected {
    background-color: $vertical-tab-selected-background-color;

    a {
      color: $vertical-tab-active-text-color-new;
      font-weight: 600;
    }

    &:hover {
      background-color: $vertical-tab-selected-background-color;

      a {
        color: $vertical-tab-active-text-color-new;
        font-weight: 600;
      }
    }
  }

}