style: fix text contrast and input visibility on task completion modal

[Nishant-Babariya-21]

📌 Description

This PR resolves a UI/UX contrast failure where text elements inside the task completion modal became completely invisible when the application was toggled into Dark Mode. Because the modal wrapper utilizes a static white background canvas, components inheriting dynamic theme variables shifted to a white text color, causing zero contrast visibility. This has been resolved by enforcing hardcoded, theme-independent light utility colors across the inner layout wrapper elements.

🔗 Related Issue

Closes #879

🛠 Changes Made

• Decoupled the heading (<h2>) and description text (<p>) from dynamic variables inside the durationModalTask block in frontend/src/pages/Tasks.jsx, locking them to explicit high-contrast values (text-slate-950 and text-slate-600).
• Forced an explicit text-slate-950 class utility directly onto the modal's <input> element so that numbers typed by users remain crisp, dark, and fully legible against the white background canvas.
• Isolated the "Cancel" control button elements with standard, consistent border sets to preserve a persistent light-mode aesthetic across all application views.

📸 Screenshots

Before Changes:-

After Changes:-

✅ Checklist

• Code runs locally
• Followed project structure
• No console errors
• Properly tested changes
• Linked the issue

🚀 Notes for Reviewers

The component changes are confined strictly to the visual templates inside the modal conditional statement at the bottom of the tasks screen file. No backend pipelines, state hooks, or global theme styles were modified or impacted.