`Toggle word wrap` and `Copy` buttons in code examples almost invisible

### Have you read the Contributing Guidelines on issues?

- [X] I have read the [Contributing Guidelines on issues](https://github.com/facebook/docusaurus/blob/main/CONTRIBUTING.md#issues).

### Prerequisites

- [X] I'm using the latest version of Docusaurus.
- [ ] I have tried the `npm run clear` or `yarn clear` command.
- [ ] I have tried `rm -rf node_modules yarn.lock package-lock.json` and re-installing packages.
- [ ] I have tried creating a repro with https://new.docusaurus.io.
- [ ] I have read the console error message carefully (if applicable).

### Description

`Toggle word wrap` and `Copy` buttons in code examples are almost invisible.


### Reproducible demo

https://github.com/facebook/docusaurus/tree/main/website

### Steps to reproduce

1. Open https://docusaurus.io/docs/typescript-support#setup
2. Change window size, so the code example doesn't fit on one line
3. Hover on code example

### Expected behavior

`Toggle word wrap` and `Copy` buttons in code examples should have an opaque background.

### Actual behavior

`Toggle word wrap` and `Copy` buttons in code examples have a semi-transparent background and merge with the text.

### Your environment

- Public source code: https://github.com/facebook/docusaurus/tree/main/website
- Public site URL: https://docusaurus.io/
- Docusaurus version used: 3.7.0
- Environment name and version (e.g. Chrome 89, Node.js 16.4): Chrome 131
- Operating system and version (e.g. Ubuntu 20.04.2 LTS): macOS 15.2

### Self-service

- [ ] I'd be willing to fix this bug myself.