.tabs {
  display: inline-flex;
  background: var(--color-bg-primary);
  border: 1px solid var(--color-border-secondary);
  border-radius: 6px;
  overflow: hidden;

  .tab-item {
    padding: 12px 20px;
    font-size: 15px;
    border-left: 1px solid var(--color-border-secondary);
    transition: background .15s ease, color .15s ease;

    &.active {
      background: var(--color-bg-quaternary);
    }

    &:first-child {
      border-left: 0;
    }

    &:hover {
      background: var(--color-bg-quaternary);
    }
  }
}
