Now I'll update the sidebar to display "Teman Sehat" on one line and make it responsive for mobile with a collapsible navbar:

Now I'll update the layout to be responsive and adjust margins for mobile:

Now I'll update the TopHeader to be mobile-responsive:

Perfect! I've successfully updated the app for mobile responsiveness:

Changes Made:

• Sidebar: Updated to display "Teman Sehat" on a single line, added mobile menu toggle button, sidebar is now hidden on mobile and slides out when menu is opened
• Layout: Adjusted main content margins to work on both mobile (mt-14) and desktop (lg:mt-20, lg:ml-64)
• Header: Made responsive with smaller icons on mobile (w-4 h-4) and larger on desktop (lg:w-5 lg:h-5), reduced padding on mobile for cleaner spacing

The app is now fully responsive with a clean mobile experience. On mobile, users can toggle the navigation menu using the hamburger button, and the layout won't be cluttered. On desktop, the full sidebar is visible with the expand/collapse toggle button at the bottom.

I found the issue. The sidebar has hidden lg:flex which hides it on mobile and shows it only on large screens. I'll fix the CSS in the layout and sidebar to make sure the navbar is always visible:

Done! I've fixed the sidebar visibility issue by changing hidden lg:flex to just flex. Now the sidebar will always be visible on desktop and will slide out from the left on mobile when you click the menu button. The sidebar should now be displaying properly with the logo, "Teman Sehat" text on one line, and all the menu items.