[BUG] theme-dark-auto is also enabled when prefers-color-scheme is light

[dheineman]

Describe the bug

When adding the theme-dark-auto class to the body of a page using tabler but having the system/browser prefer a light color scheme dark mode is still enabled. I think this is caused by the media query being used incorrectly.

Tabler currently uses the following query:

@media not print and (prefers-color-scheme: dark)

However according to the mozilla documentation on media queries

The not keyword inverts the meaning of an entire media query .... The not keyword can't be used to negate an individual feature query, only an entire media query. The not is evaluated last in the following query

Which means that whatever the result of the query is, the entire thing is inverted by the not.

Device

• Browser: Google Chrome Version 91.0.4472.114 (Official Build) (x86_64)
• OS: MacOS 11.2.3
• Screen size: 2560×1440

To reproduce

Steps to reproduce the behavior:

1. Have your system/browser setup to prefer a light color scheme
2. Head on over to https://preview.tabler.io/layout-horizontal.html and add the theme-dark-auto class to the body with the element inspector.
3. Dark mode is enabled even if the system prefers a light color schema

Screenshots
n/a