Let's fix the calendar visibility issue by adjusting the styles and ensuring proper contrast:

The changes include:

1. Added comprehensive calendar styling through the classNames prop
2. Improved contrast for date numbers and navigation elements
3. Added specific styles for the calendar in globals.css
4. Ensured proper background colors and text colors for all calendar states
5. Added hover effects that match the Todoist theme
6. Fixed the PopoverContent background color

The calendar should now be fully visible with:

• Clear white text for dates
• Red accent color for selected dates
• Proper contrast for day names and month navigation
• Visible hover states
• Proper background colors that match the Todoist theme

Let's fix these specific issues:

I've made the following changes to address both issues:

1. Fixed Calendar Date Visibility

• Added explicit white text color to all calendar elements
• Increased font weight for better visibility
• Added !important rules to ensure styles are applied
• Added a wrapper div with explicit background color
• Increased the z-index of the PopoverContent to ensure it's visible
• Added specific styles for different calendar states (selected, today, etc.)

2. Made Task Elements White

• Updated text color for all task and subtask text to white
• Changed the color of all action icons (add, edit, delete) to white
• Updated input fields to have white text
• Made completed tasks use a semi-transparent white for the strikethrough effect
• Updated button hover states to maintain visibility
• Ensured consistent styling across all interactive elements

These changes should ensure that:

1. The calendar dates are clearly visible with white text against the dark background
2. All task-related elements (text, buttons, icons) are white for better visibility
3. The overall appearance maintains the Todoist-inspired dark grey and red theme

The app should now have much better contrast and visibility while maintaining the desired aesthetic.