Tailwind is not loading styles in custom card (upgrade nova 3 to 4)

[Javier1995]

• Laravel Version: 10.5.1
• Nova Version: 4.14.1
• PHP Version: 8.2
• Database Driver & Version: mysql
• Operating System and Version: ubuntu(using laravel sail)
• Browser type and version: Google Chrome latest version

Description:

I'v been struggling to figure out how to load tailwind style to my custom cards, maybe I am missing something:

BetterSearch.vue

<template>
    <Card class="flex flex-col items-center justify-center">
        <div class="px-3 py-3">
            <form
                action="/nova/resources/app-accounts/lens/app-account-search"
                method="get"
            >
                <h3 class="flex mb-3 text-base text-80 font-bold">
                    Search For Member
                </h3>
                <input
                    type="text"
                    name="s"
                    class="form-control form-input form-input-bordered"
                    placeholder="Search..."
                />
                <input
                    type="submit"
                    value="Go"
                    class="btn btn-default btn-primary m-4"
                />
            </form>
        </div>
    </Card>
</template>

<script setup>
const props = defineProps({
    Card: String,
});
</script>

Card.js

Nova.booting((Vue, router, store) => {
    Vue.component('better-search', require('./components/BetterSearch').default)
})