fix(css): add custom chevron arrow for select elements and adjust pad…

[ozer0602]

Summary

Fix native <select> dropdown buttons showing the arrow icon with no spacing from the right border. The arrow was visually crammed against the edge across all pages (logs, connectors, MCP servers, settings, etc.).

Changes

• Add appearance: none to all native <select> elements via globals.css to remove the browser's built-in arrow and decouple trigger button styling from the open dropdown list
• Replace the native arrow with a custom chevron-down SVG via CSS background-image, positioned with 0.5rem clearance from the right border
• Override padding-right with !important to make room for the custom arrow (needed to outrank Tailwind's px-* utility specificity)
• Add a dark-mode variant using the appropriate muted foreground color

Type

• Bug fix

Testing

• Tested manually (describe steps below)

Verified on /logs, /connectors, /mcp-server, /settings/users, /settings/roles, /admin/users, /admin/roles, and the tool editor. Confirmed:

1. The closed select button shows the chevron with proper right spacing in both light and dark mode
2. The open dropdown options are visually unchanged (OS-rendered, unaffected by the CSS change)

Checklist

• My code follows the existing code style
• I have tested my changes locally
• All existing tests pass (npm test)
• This PR has a descriptive title

Related Issues

[github-actions]

👋 Welcome, @ozer0602, and thanks for opening your first PR on AnythingMCP!

A few quick pointers:

• Make sure CI is green before requesting review (Backend, Frontend, Playwright, CodeQL, Trivy).
• If this is a new adapter, the parametrised catalog.spec.ts test will validate it automatically.
• Sign off your commits if you can — it's not blocking, just nice to have.

Someone from the core team will look at this within ~48h. If you don't hear back, please ping us in Discussions / Q&A.

⭐ While you wait — if you find AnythingMCP useful, a star helps others discover it.