Setting multiple selectors in the same CSS rule returns an unexpected result

[fazdiu]

Setting multiple selectors in the same CSS rule returns an unexpected result: For example:

import { TailwindConverter } from 'css-to-tailwindcss';
import postcssNested from "postcss-nested";

const converter = new TailwindConverter({
  remInPx: 16, // set null if you don't want to convert rem to pixels
  postCSSPlugins: [postcssNested], // add any postcss plugins to this array
  tailwindConfig: {
    // your tailwind config here
    content: [],
    theme: {
      extend: {
        colors: {},
      },
    },
  },
});

const inputCSS = `
.test{
  color:red;

  &:hover, &:focus{
    color: blue;
  }
}`;

converter.convertCSS(inputCSS).then(({ convertedRoot, nodes }) => {
  console.log(convertedRoot.toString());
});

Obtained result:

.test {
  @apply text-[red];
}
.test:hover,
.test:focus {
  @apply text-[blue];
}

Expected result:

.test {
  @apply text-[red] focus:text-[blue] hover:text-[blue];
}