Tabbed Navigation with Status Indicators

This component uses Tailwind CSS utilities to create a responsive tabbed navigation. It has different implementations for mobile and desktop views. The mobile view uses a select dropdown to switch between tabs. The desktop view uses flex and whitespace-nowrap to create a horizontal tab bar. The active tab is indicated by the border-indigo-500 and text-indigo-600 utilities. Each tab displays a status indicator badge to show counts. These use bg-gray-100/bg-indigo-100 and rounded-full utilities. On desktop, the tabs have hover states with border-gray-200 and text-gray-700 to indicate interactivity.