How to use PicoCSS with datatables?

[Leftium]

I'd like to use PicoCSS with datatables, but I'm having trouble with CSS conflicts:

• https://kit-demos-git-datatables-picocss-leftium.vercel.app/
• https://github.com/Leftium/kit-demos/tree/datatables-picocss

Perhaps I need to start from the ground up and build a custom PicoCSS datatables using headless components like the tutorial? However the CSS styles from the demos looked much better and it was simpler to just steal that CSS...

Another option may be to scope PicoCSS to .pico classed elements only, but that would mean datatables cannot be children of any elements styled with PicoCSS, nor use the PicoCSS themes/dark mode.

Any suggestions for how to get datatables and PicoCSS (and SvelteKit) to work together?

[Leftium]

It seems PicoCSS conditional styling was enough!

• Datatables layout fixed.
• Yet still gets PicoCSS darkmode.
• (Also I was able to delete the global styles I thought I needed for datatables)
• Fixed here: https://bangtastic.vercel.app/