State classes
The classes Smootify toggles on products, variants and the cart, to style each state in the site's CSS.
Smootify adds and removes these classes as the state changes. Style each state in the site’s CSS (a class Smootify sets on a host or a parent is :global() in a component’s scoped <style>); never set them yourself.
smootify-product
loaded, price-varies, is-variable, has-subscription, is-on-sale, is-free, is-available, is-not-available, not-existing-variant, is-currently-out-of-stock, many-in-stock, last-in-stock, low-stock, low-not-last-stock, is-new, has-price-breaks
smootify-variant
loaded, is-on-sale, is-available, is-not-available, last-in-stock, low-stock, not-existing-variant
smootify-cart
loaded, is-rendered, is-empty-cart, has-taxes, has-empty-quote
smootify-search-discovery
inited, empty, is-filtered, has-pagination, has-page-numbers, is-single-result
smootify-search-page
inited, is-empty, is-filtered, has-pagination, has-page-numbers, has-query, is-single-result