Two-tier navigation with expandable submenus

This example uses Tailwind CSS classes to create a two-tier vertical navigation menu. The top-level navigation links are displayed in a list. Some of the top-level links have associated submenu links that can be expanded and collapsed using button elements. The submenu links are revealed when the parent button is clicked. The .flex classes create the overall menu layout. .gap-y- spacing classes separate the menu items vertically. .hover:bg-gray-50 highlights menu items on hover. .rounded-md and .p-2 add rounded corners and padding to menu links. .text-sm, .font-semibold, and .text-gray-700 style the link text. The button elements for parent menu items use .w-full, .flex, .text-left, and .items-center to style the buttons. The rotated arrow icons indicate expanded/collapsed state. The submenu ul uses .mt-1 and .px-2 for positioning. Submenu links use pl-9 for indentation and .block for vertical stacking.