Bad Display. Is CSS getting applied properly?

[Brian-1150]

I get a build error when I import '@wojtekmaj/react-daterange-picker/'
so I am importing '@wojtekmaj/react-daterange-picker/dist/entry.nostyle' instead. Then I also import the two css files. So my imports look as follows:

import Head from 'next/Head';
import * as React from "react";
import { FC } from 'react';
import { Controller, useFormContext } from 'react-hook-form';
import DateRangePicker from '@wojtekmaj/react-daterange-picker/dist/entry.nostyle'
import '@wojtekmaj/react-daterange-picker/dist/DateRangePicker.css'
import 'react-calendar/dist/Calendar.css'
import Calendar from 'react-calendar'

But some of the CSS is not being applied because the display of the Calendar is way out of whack. How can I be sure the CSS gets applied properly?

I am trying to use DateRangePicker within a Controller for React-Hook-Form.

I am using NextJS typescript. The entire code is below. Basically the calendar that pops up is huge and not in a grid, but all dates in one huge column.

Thanks!

import Head from 'next/Head';
import * as React from "react";
import { FC } from 'react';
import { Controller, useFormContext } from 'react-hook-form';
import DateRangePicker from '@wojtekmaj/react-daterange-picker/dist/entry.nostyle'
import '@wojtekmaj/react-daterange-picker/dist/DateRangePicker.css'
import 'react-calendar/dist/Calendar.css'
import Calendar from 'react-calendar'




const DateRange: FC = () => {
    const { control, formState: { errors } } = useFormContext();
    const [value, onChange] = React.useState([new Date(), new Date()]);
    return (
        <>

            <Controller
                name='pick_up_date'
                control={control}
                defaultValue={null}
                render={({ field }) =>
                    <DateRangePicker {...field}
                        className='react-daterange-picker'
                        calendarClassName='react-calendar'
                        placeholderText='pick_up_date'
                        onChange={onChange}
                        value={value}
                    />
                }
            />
        </>
    )
}
export default DateRange

[wojtekmaj]

Add Calendar's CSS first, and React-DateRange-Picker's second. This way any overrides added in the latter will apply correctly. I think.