@import "~ui/styles/theme.less";

.root {
  display: flex;
}

.tabs {
  position: relative;
  border-right: 1px solid @border-color;
  background-color: @bg-color-alt;
  font-size: 13px;
}

.main {
  display: flex;
  flex-direction: column;
  width: 235px;
  flex: 1;
  overflow-y: scroll;
}

.tab {
  
  border: 1px solid @bg-color;
  margin: 3px;
  border-radius: 3px;
  
  padding: 5px 2px;
  cursor: pointer;
  background-color: @bg-color;

  &:hover {
    background-color: #9c9c9c !important;
  }
  &:active {
    transition: 200ms;
    background-color: #BFBFBF !important;
  }
  &.selected {
    background-color: #7d7d7d;
  }
}