Replace native browser alerts with a Toast/notification component in Login

[teja-311]

Feature Request

Login.jsx currently uses window.alert() / alert() for all user feedback such as login errors, success messages, forgot-password flow, and reset-password flow (8 call sites total). Native browser alerts block the entire page, can't be styled, and feel unprofessional compared to the rest of the UI.

Proposed Solution

Add a small, reusable Toast component (frontend/src/components/common/Toast.jsx):

• Auto-dismisses after ~3 seconds
• Has a manual close (×) button
• Supports success / error / info styling
• No external dependencies, plain React state + inline styles

Replace all alert() calls in Login.jsx with this component.

Scope Note

There are ~27 alert() calls across other files in the codebase (AdminHome, AllCourses, Register, TeacherHome, etc.) — this issue is scoped to Login.jsx only to keep the change focused and reviewable. Happy to open follow-up issues for the other files if this is merged.

Additional Context

I'd like to combine this with issue #24 (Settings dropdown overlap + Activity Logs filter panel overflow) into a single PR, since I'm already working on that fix and this keeps related frontend UX polish together, per your earlier suggestion to combine smaller fixes into one meaningful PR.

I've already built and tested this locally. happy to open the PR if assigned.

[udaycodespace]

@teja-311 Assigned.

When you open the PR, please include:

• Before/after screenshots or a short screen recording of the login flow.
• A brief summary of the changes made (Toast component + Login.jsx integration only).
• Testing details (successful login, invalid credentials, forgot password, reset password, auto-dismiss, manual close, and consecutive notifications).
• Ensure the implementation is substantial (around 20+ lines of meaningful code) and not just replacing alert() calls.
• Keep the scope limited to this issue. If you're also working on Settings dropdown overlap and Activity Logs filter panel overflow on admin pages #24, include it as a separate commit within the same PR for easier review.

This will help speed up the review process.

[udaycodespace]

@teja-311 Assigned.

When you open the PR, please include:

• Before/after screenshots or a short screen recording of the login flow.
• A brief summary of the changes made (Toast component + Login.jsx integration only).
• Testing details (successful login, invalid credentials, forgot password, reset password, auto-dismiss, manual close, and consecutive notifications).
• Ensure the implementation is substantial (around 20+ lines of meaningful code) and not just replacing alert() calls.
• Keep the scope limited to this issue. If you're also working on Settings dropdown overlap and Activity Logs filter panel overflow on admin pages #24, include it as a separate commit within the same PR for easier review.

This will help speed up the review process.

Also, since I previously closed PR #30 because it only contained a couple of small CSS changes, you can include those fixes in this PR as a separate commit if they're still relevant. That will make the overall contribution more meaningful while keeping the commit history easy to review.