Feature/password strength meter 145

[Myparadox-creator]

Field	Details
name	Pull Request
about	Propose a change to the ClinIQ codebase
title	feat: add real-time accessible password strength meter to sign up page
labels	elusoc, UI/UX, feature
assignees

---

Description

What does this PR do?

• Adds a real-time, dependency-free Password Strength Meter below the password input field on the Sign Up page (src/pages/Signup.tsx).
• Evaluates password complexity across 4 criteria: length (8+ chars), uppercase letters, numbers, and special characters.
• Displays a color-coded progress bar (red for Weak, amber for Fair, blue for Strong, emerald for Very Strong) alongside a criteria checklist.
• Enforces strict validation to prevent form submission when the password is rated Weak.
• Built with full ARIA accessibility attributes (role="progressbar", aria-valuenow, aria-live="polite").
• Resolves missing imports in Navbar.tsx and adds defensive error handling in AuthContext.tsx and supabaseClient.ts to ensure stable app mounting across all environments.

Why is this change needed?
For a healthcare platform handling sensitive patient records, weak user passwords pose a critical security risk. Adding real-time feedback encourages strong password creation and protects user accounts.

Related Issue
Closes #145

---

How to Test

Please provide clear and concise steps to test your changes locally.

1. Checkout the branch and start the dev server:

   git checkout feature/password-strength-meter-145
   npm run dev
   

---

Screenshots