I have been trying to get Flowbite Svelte's Navbar component to work properly. It works fine for mobile but any screen that is large it does not show the links of the NavUl attribute.

src/lib/components/Navbar.svelte

<script>
  import { Navbar, NavBrand, NavLi, NavUl, NavHamburger } from 'flowbite-svelte'
</script>

<Navbar fluid={true} let:hidden let:toggle>
  <NavBrand href="/">
    <img
      src=".svg"
      class="mr-3 h-6 sm:h-9"
      alt="Flowbite Logo"
    />
    <span class="self-center whitespace-nowrap text-xl font-semibold dark:text-white">
      Flowbite
    </span>
  </NavBrand>
  <NavHamburger on:click={toggle} />
  <NavUl hidden={false}>
    <NavLi href="/" active={true}>Home</NavLi>
    <NavLi href="/about">About</NavLi>
    <NavLi href="/services">Services</NavLi>
    <NavLi href="/pricing">Pricing</NavLi>
    <NavLi href="/contact">Contact</NavLi>
  </NavUl>
</Navbar>

src/routes/+page.svelte

<script>
    import Navbar from "$lib/components/Navbar.svelte";
</script>

<Navbar />

src/routes/+layout.svelte

<script lang="ts">
    import '../app.css';
    let { children } = $props();
</script>

{@render children()}

src/app.css

@import 'tailwindcss';

tailwind.config.js

const config = {
    content: [
        "./src/**/*.{html,js,svelte,ts}",
        "./node_modules/flowbite-svelte/**/*.{html,js,svelte,ts}",
    ],

    plugins: [
        require('flowbite/plugin')
    ],

    darkMode: 'class',

    theme: {
        extend: {
            colors: {
                // flowbite-svelte
                primary: { 50: '#FFF5F2', 100: '#FFF1EE', 200: '#FFE4DE', 300: '#FFD5CC', 400: '#FFBCAD', 500: '#FE795D', 600: '#EF562F', 700: '#EB4F27', 800: '#CC4522', 900: '#A5371B' },
            }
        },
        screens: {
            'sm': '640px',
            // => @media (min-width: 640px) { ... }

            'md': '768px',
            // => @media (min-width: 768px) { ... }

            'lg': '1024px',
            // => @media (min-width: 1024px) { ... }

            'xl': '1280px',
            // => @media (min-width: 1280px) { ... }

            '2xl': '1536px',
            // => @media (min-width: 1536px) { ... }
        },
    }
};

module.exports = config;

And I ensured to set the screen sizes as this post said that fixed their similar issue Svelte flowbite NavBar Display Issue

What am I missing? I followed to get my application started.