[@svelteuidev/core] createStyles improvement - revert the revert

Support for classnames for each element of a component. Can be easily overriden. Ex: svelteui-Timeline-root - svelteui-Timeline-icon, etc.
It now transforms all darkMode keywords recursively (fixes the problem that it was only switched if only on one level deeper)
It uses class names for references and correctly uses their class when they are referenced. Usage below:
```
{
.root {
 ...
 [`& .${getRef('icon')}`]: { ... }
}
.icon {
  ref: getRef('icon'),
  ....
}
}
```

Tested in storybook and in the docs and fixed any problems that happened due to these changes.

[X] Read the Contributing guide
[X] Prefix your PR title with [@svelteui/core], [@svelteui/actions], [@svelteui/motion], [@svelteui/core], [core], or [docs].
[X] This message body should clearly illustrate what problems it solves.

[X] Run the tests with npm test and lint the project with yarn lint or just run yarn repo:prepush and check to see if it's passing.

svelteuidev / svelteui