Add dark mode support for colors

[CasJam]

Dark mode support was implemented by systematically adding dark: variants to existing Tailwind CSS color classes across the application's React components.

Changes were applied to:

• app/javascript/pages/Welcome.jsx
• app/javascript/pages/Habits/Index.jsx
• app/javascript/pages/Habits/Edit.jsx
• app/javascript/pages/Habits/New.jsx
• app/javascript/pages/Habits/Show.jsx

Specific color adjustments include:

• Backgrounds: Classes like bg-gray-50 were updated to dark:bg-gray-900, and bg-white to dark:bg-gray-800.
• Text: text-gray-900 became dark:text-white, and text-gray-600 became dark:text-gray-300.
• Borders: border-gray-300 was updated to dark:border-gray-600.
• Interactive States: Hover, focus, and ring colors (e.g., focus:ring-indigo-500) received corresponding dark variants (e.g., dark:focus:ring-indigo-400).
• Semantic Colors: Green, red, and blue alert/status colors, as well as indigo accent colors, were also given dark counterparts (e.g., bg-green-100 to dark:bg-green-900).

The application now automatically adapts its color scheme based on the user's system dark mode preference, without requiring an in-app toggle.