I'm only loosely familiar with React/Next.js/TailWind so bare with me if this is simple user error. I'm able to initialize a project according to the v0 documentation and app components but I can't seem to get themes to work.

When I import a component, I am able to display the component but it seems to entirely lack the theme elements. I just get a bare black & white color scheme like in the image attached despite seeing the Daylight theme in the v0 dashboard. When I take the code provided for the component at the tailwind.config.ts copy code window, and paste that into tailwind.config.ts, all that changes is it rounds off the slider node and the select boxes from squares to circles.

After adding the component I see "To install theme colors and fonts, visit https://v0.dev/t/JuK8j9b0AuK and follow the instructions under the Code tab."

v0.dev

instant quotation tool for dog poo scooping. number of dogs as a slider Chosen number of dogs determines price. | A shadcn/ui and v0 generation

This is a v0.app and shadcn/ui generation for the prompt: instant quotation tool for dog poo scooping. number of dogs as a slider Chosen number of dogs determines price.

I do not see any instructions or documentation under the code tab.

After using npx tailwindcss init tailwind.config.js is created, but no change is applied when I copy the provided code into this file

Here is my directory layout, which may be an issue

Using an Ubuntu machine if that is relevant