Casimir43/enhancement/660 update prg page to match newest figma design

[Casimir43]

📄 Pull Request Overview

Closes #660

🔧 Changes Made

Added a tab switcher to flip between Action Plan, Annual Report, and Association Rules. Also cleaned up the board member section and applied new design features.

✅ Checklist Before Submission

• Functionality: I have tested my code, and it works as expected. ✅
• JSDoc: I have added or updated JSDoc comments for all relevant code. ✅
• Debugging: No console.log() or other debugging statements are left. ✅
• Clean Code: Removed commented-out or unnecessary code. ✅
• Tests: Added new tests or updated existing ones for the changes made. ✅
• Documentation: Documentation has been updated (if applicable). ✅

---

📝 Additional Information

• On mobile, tabs show icons instead of text since small text doesn't fit well
• On mobile, the document images move below the text so the text can use the full width

[Skoivumaki]

Small UI fixes:

• Text overflows when in split-view. (good rule is, if website looks bad on larger tablets, split-view is going to break):

• Your mobile implementation of CustomSwitch is clean, but in terms of user experience, its often bad to use icons to represent complex words. Simply fix it by disabling CustomSwitch for mobile and loop the tabs as seen in Figma example 1 (mobile). Just remember to make it look good and not overflow:

Otherwise everything looks good 👍