feat: implement Tabs and TabButton components (#180)

[MarvyNwaokobia]

This PR implements a robust and flexible Tabs navigation system to improve content organization across the platform. Built using the Compound Component pattern, it offers developers high flexibility while ensuring a consistent user experience and full accessibility.

Features

• Compound API: Uses Tabs, TabList, TabButton, TabPanels, and TabPanel for a clean, declarative structure.
• Accessibility (A11y): Full ARIA implementation and keyboard support (Arrow keys for navigation, Home/End for boundaries).
• Smooth Transitions: Integrated with framer-motion for a spring-animated active indicator and cross-fading panel transitions.
• Mobile First: The tab list supports horizontal touch scrolling with hidden scrollbars, ensuring a great experience on smaller screens.
• Design System: Fully wired into the PayEasy color palette and Tailwind configuration.

Acceptance Criteria Verified

• Switching works: State is managed via React Context.
• Mobile friendly: Horizontal overflow scrolling enabled.
• Icons display: Optional icon support in TabButton.
• Accessible: Proper roles and focus management.
• Keyboard navigation: Arrows, Home, and End keys function as expected.
• Smooth transitions: Layout animations for the active state.
• Professional appearance: Matches brand guidelines.

Technical Details

• Location: apps/web/components/Tabs.tsx and apps/web/components/TabButton.tsx.
• Dependencies: React Context, Framer Motion, Tailwind CSS.
• Utility: Integrates with the project's cn utility for clean Tailwind class merging.

closes #180