How to over-ride default CSS on Slider

[chipnetics]

Hi there, I am trying to make the text-input field (where user can click and manually enter a value) on a slider wider (https://carbon-components-svelte.onrender.com/components/Slider).... I think it uses class="bx--text-input bx--slider-text-input" but I'm unsure how I can over-ride the default CSS theme setting without editing the theme directly. Any help is appreciated!

[theetrain]

It's possible to override styles via :global() and class selectors.

<style>
	:global(.bx--text-input.bx--slider-text-input) {
		background-color: black;
		color: white;
		font-weight: 600;
	}
</style>

Here's a demo: https://svelte.dev/repl/6e1a4e83c2f54e7e838b1081da3f8bf5?version=3.55.1

Once #1629 is complete, it will be possible to target CSS variables to theme Carbon components.

[chipnetics]

Thanks, worked great!