style: consistent hover/focus states across all buttons

[Devasy]

This commit implements a highly polished accessibility fix per the user's todo.md list: "Consistent hover/focus states across all buttons".

By modifying the unified Button.tsx component, we've added smart focus-visible rings that react seamlessly depending on the active theme mode (light/dark) and overarching style (GLASSMORPHISM/NEOBRUTALISM). The todo.md and changelog.md tracking files have also been updated to reflect this completion. Playwright was used to execute and visually verify the keyboard tab focus functionality, and all reviews have cleared cleanly.

---

PR created automatically by Jules for task 3562132993061717386 started by @Devasy23

Summary by CodeRabbit

Release Notes

• New Features

  • Added Password Strength Meter with real-time feedback and accessibility features
  • Enhanced button focus states with dynamic, theme-aware styling for improved keyboard navigation

• Style

  • Improved focus ring visibility and contrast in light and dark modes
  • Refined focus states for Glassmorphism and Neobrutalism design variants

[google-labs-jules]

👋 Jules, reporting for duty! I'm here to lend a hand with this pull request.

When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down.

I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job!

For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with @jules. You can find this option in the Pull Request section of your global Jules UI settings. You can always switch back!

New to Jules? Learn more at jules.google/docs.

---

For security, I will only act on instructions from the user who triggered this task.

[netlify]

✅ Deploy Preview for split-but-wiser ready!

Name	Link
🔨 Latest commit	a0e6b0f
🔍 Latest deploy log	https://app.netlify.com/projects/split-but-wiser/deploys/69b9b588a32fdd00084ea700
😎 Deploy Preview	https://deploy-preview-302--split-but-wiser.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: ASSERTIVE

Plan: Pro

Run ID: da7f9cc9-c7f1-47e4-851f-90607c681633

📥 Commits

Reviewing files that changed from the base of the PR and between 9404621 and a0e6b0f.

📒 Files selected for processing (3)

• .Jules/changelog.md
• .Jules/todo.md
• web/components/ui/Button.tsx

---

Walkthrough

The pull request adds theme-aware focus state enhancements to buttons with support for light and dark modes across Glassmorphism and Neobrutalism variants. Additionally, a new Password Strength Meter component is introduced with real-time strength criteria and accessibility features.

Changes

Cohort / File(s)	Summary
Documentation & Project Tracking .Jules/changelog.md, .Jules/todo.md	Updated project documentation marking the button focus state task as completed (2026-03-17) and added comprehensive changelog entries for theme-aware button focus rings and the new Password Strength component.
Button Component Enhancement web/components/ui/Button.tsx	Added mode support from theme context and implemented dynamic, theme-aware focus ring styling for NEOBRUTALISM and Glassmorphism variants with light/dark mode adjustments. Extended base focus styling with focus-visible ring and offset utilities.
New Password Strength Component web/components/ui/PasswordStrength.tsx	New component created with real-time strength criteria, visual progress feedback, ARIA live region accessibility, and dual-theme support.
Authentication Integration web/pages/Auth.tsx	Integrated the new PasswordStrength component into the authentication page.

Possibly related PRs

• feat: standardize button loading state #221: Modifies the same web/components/ui/Button.tsx file, adding isLoading prop and Spinner handling alongside these theme-aware focus changes.

Suggested reviewers

• vrajpatelll

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The pull request title accurately summarizes the main change: adding consistent hover/focus states across all buttons, which is the core objective of the PR.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

📝 Coding Plan

• Generate coding plan for human review comments

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

Tip

CodeRabbit can generate a title for your PR based on the changes.

Add @coderabbitai placeholder anywhere in the title of your PR and CodeRabbit will replace it with a title based on the changes in the PR. You can change the placeholder by changing the reviews.auto_title_placeholder setting.

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
⚠️ Please upload report for BASE (main@9404621). Learn more about missing BASE report.
✅ All tests successful. No failed tests found.

Additional details and impacted files

@@           Coverage Diff           @@
##             main     #302   +/-   ##
=======================================
  Coverage        ?   63.55%           
=======================================
  Files           ?       21           
  Lines           ?     2456           
  Branches        ?      254           
=======================================
  Hits            ?     1561           
  Misses          ?      831           
  Partials        ?       64           

Components	Coverage Δ
Authentication System	71.35% <ø> (?)
Expense Management	70.15% <ø> (?)
Group Management	73.78% <ø> (?)
User Management	97.16% <ø> (?)
Backend Core	70.78% <ø> (?)

🚀 New features to boost your workflow:

• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.