Using multiple variants together is not working

[apollo79]

I am using Kobalte and want to style a select item when it is highlighted differently than when it is selected, but therefore I have to chain two variants:

// ...
<Select.Item
   item={props.item}
  class="ui-highlighted:ui-not-selected:bg-red ui-selected:bg-green"
  >
    // ...
</Select.Item>
// ...

But that doesn't seem to be possible, the red background just never appears.

I have made a reproduction here: https://stackblitz.com/edit/solidjs-templates-mc1pgd?file=src%2FApp.tsx