Create a responsive web-app dashboard called “ACME” for a Content Supply Chain.

Overall layout • Two zones: a fixed left sidebar (desktop width ≈ 240 px, collapsible to 64 px) and a main area. • A top horizontal navbar sits inside the main area.

Left sidebar (from top to bottom)

1. Hamburger menu icon (lucide-react: Menu) to toggle collapse.
2. Cliente name (bold, uppercase).
3. Project list (vertical):
   • “Proyecto 1”
   • “Proyecto 2”
   • “Proyecto 3” (selected → highlight with primary color bar).
4. Tools for the selected project (indented sub-list, regular weight):
   • “SEO”
   • “Landings”
   • “Imágenes”
   • “Vídeos”
   • “Ads” The active tool should have a subtle background highlight.
5. Help box stuck to the bottom:
   • rounded rectangle input with placeholder “¿En qué puedo ayudarte?”
   • “?” icon inside a circle at its right edge (lucide-react: HelpCircle).

Top navbar (horizontal, full width of main area) • Left-aligned menu items (medium weight text): “Crear” · “Tareas” · “Galería” · “Mensajes” – show a tiny primary-colored dot to the top-right of “Tareas” and “Mensajes”. • Spacer grows. • Right-aligned user area: “123” (remaining tokens) • avatar icon (lucide-react: User, 32 × 32 px, circular).

Main content • Leave an empty <div className="flex-1"> area for future pages.

Visual style • Tech stack: Next.js / React / TypeScript + Tailwind CSS. • Font: Inter, 14 px base. • Color palette: – Sidebar bg: slate-50 (#f8fafc)
– Primary accent: indigo-600 (#4f46e5)
– Text: slate-900 on light bg
• Use Tailwind dark-mode classes (dark:) to provide a dark variant. • Add smooth hover states (transition-colors duration-150).

Behaviour • Sidebar collapses on screens < md; hamburger toggles visibility. • Active project & tool are stored in React state; clicking updates highlights. • Show notification dots only when counts > 0 (hard-code true for now). • No external data fetching—use stub arrays for projects / tools.

Deliverables • One self-contained component (or page) that renders the full layout. • Use lucide-react for icons, next-themes for dark-mode toggle if you wish. • Code should be production-ready, well-structured and typed.