.tabs__horz--container, .tabs__vert--container{
   background: var(--tisc-bg-secondary);
   color: var(--tisc-text-primary);
}

.tabs__horz--buttons, .tabs__vert--buttons{
   display: flex;
   flex-wrap: wrap;
}

.tab__button{
   padding: 0 25px;
   cursor: pointer;
   border-bottom: 5px solid var(--tisc-bg-secondary);
   transition: all .1s;
   text-align: center;

   @include media($mobile){
       width: calc(100% - 50px);
   }

   &:hover{
       border-color: var(--tisc-primary-light);
       color: var(--tisc-primary-light);
   }

   &.active{
       border-color: var(--tisc-primary);
       color: var(--tisc-primary);
   }

   &.disabled{
       color: color(grey, '4');
       pointer-events: none;
       filter: opacity(0.4);
   }
}

.tabs__vert--container{
   display: flex;

   @include media($mobile){
       flex-direction: column;
   }
}

.tabs__vert--buttons{
   width: 150px;
}

.tabs__vert--content{
   width: calc( 100% - 150px );
}

.tabs__vert--buttons, .tabs__vert--content{
   @include media($mobile){
       width: 100%;
   }
}