Improve styling for badges inside the segment items in navigation menus

[webdevcody]

see the attached image, notice how the title of the segment squishes the badge. this looks bad and i need you to fix it.

[webdevcody]

@cursor please fix this.

[cursor]

Create PR

I enhanced the SidebarMenuItem component by improving its layout and visual consistency. I ensured menu items with badges have proper padding and added a default background color to the SidebarMenuBadge for better visibility, aligning with the sidebar's accent theme.

• I modified the sidebarMenuButtonVariants in src/components/ui/sidebar.tsx to include group-has-[[data-sidebar=menu-badge]]/menu-item:pr-8. This ensures SidebarMenuItem elements automatically apply right padding when they contain a SidebarMenuBadge, preventing text overlap.
• I added bg-sidebar-accent/20 dark:bg-sidebar-accent/15 to the SidebarMenuBadge component's styling in src/components/ui/sidebar.tsx. This provides a subtle, theme-consistent background color to badges, improving their visibility within the sidebar.

---

_{Learn more about Cursor Agents}