@custom-variant dark (&:where(.dark, .dark *, [data-mode="dark"], [data-mode="dark"] *));

@custom-variant hover {
  @media (hover: hover) {
    &:hover {
      @slot;
    }
  }

  @media (hover: none) {
    &:active {
      @slot;
    }
  }
}

@custom-variant no-hover {
  @media (hover: none) {
    @slot;
  }
}