fix: improve lock icon visibility in API config popover

[roomote-v0]

Related GitHub Issue

Closes: #12237

Description

This PR attempts to address the lock icon visibility issues reported in Issue #12237. The user reported that the lock/unlock icon in the API Configuration popover is effectively invisible and provides no hover feedback.

Changes:

• Replaced the subtle IconButton (which used opacity-60 for the unlocked state) with a more visible Button that includes a text label ("Locked" / "Unlocked") next to the icon
• Uses text-vscode-descriptionForeground with opacity-90 instead of opacity-60 for the unlocked state, making it visible on all themes
• Uses text-vscode-focusBorder for the locked state (highlighted)
• Includes a StandardTooltip explaining the lock function on hover
• Ensures cursor: pointer is always present via explicit class
• Added i18n keys for "locked"/"unlocked" labels in all 18 locales
• Updated tests to match new styling

Feedback and guidance are welcome.

Test Procedure

• Run cd webview-ui && npx vitest run src/components/chat/__tests__/ApiConfigSelector.spec.tsx -- all 21 tests pass
• Run cd webview-ui && npx vitest run src/components/chat/__tests__/ChatTextArea.lockApiConfig.spec.tsx -- all 5 tests pass
• Manual: Open the API Configuration popover in the chat panel. The lock button should now show "Unlocked" (with icon) in a visible muted color, or "Locked" (with icon) in a highlighted color. Hovering should show a tooltip and pointer cursor.

Pre-Submission Checklist

• Issue Linked: This PR is linked to an approved GitHub Issue.
• Scope: Changes are focused on the linked issue.
• Self-Review: Performed a thorough self-review.
• Testing: Updated tests to cover changes.
• Contribution Guidelines: Read and agree to the Contributor Guidelines.