How to style reused astro component

[native furnace]

How to style DocsBtn component when it's used inside another astro component?

<div class='root'>
    <div class='text'>
        <h2>Are you ready to learn?</h2>
        <DocsBtn href='/introduction' text='Get to the docs' />
    </div>
    <div class='bottom-grad' aria-hidden='true'></div>
</div>```

[hot quest]

One method is to pass the classes as a prop and use the class:list method in the element(s) to be modified: https://docs.astro.build/en/reference/directives-reference/#classlist. You would need to have the classes ready within the component, or use the is:global reference: https://docs.astro.build/en/reference/directives-reference/#isglobal