How to add custom CSS to checkout forms

SureCart components use a shadow DOM to encapsulate their styles. This provides a few advantages:

• Styles are protected from any potential style conflicts. This means you don’t have to worry about theme or plugin styles conflicting with the SureCart UI.
• If the internal HTML structure of any components change, you won’t need to update any custom css.

There are two ways to make customizations to SureCart components. One way is with CSS custom properties (“CSS variables”), the other is with CSS parts (“parts”).

See full documentation with examples: https://developer.surecart.com/docs/styling-ui