How to implement a client credentials type oAuth 2.0 in a frontend application?

I am new here and in web development. Pardon my silly mistakes.

Is there any way? If yes, then how?

Scenario:

I need to make a hotel booking site. The data for rooms and hotels comes from a 3rd party API client.

That 3rd party API uses OAuth 2.0 and gives you the client secret and client id for authentication. Using those, I get an access token. Then I use that access token to get the data and can make an express or node js server render web application easily.

But my target is to make SPA. But here, I can't share the client credentials. So I need a backend that gives you the access token to the front, then the front end uses that token and calls the 3rd party API endpoints for data.

Now I doubt that some could misuse that access token. So what is the right way to implement this?

Limitations :

1. You can only get the access token six times a day.
2. A single access token is only valid for 48 hours only.
3. Creating and maintaining user accounts is not an option for now.

Solutions in my mind:

1. Build the app using the server-side frameworks.
2. Build a backend that uses a cross-origin policy to verify the request and redirect every request to the 3rd party.
3. Build an entire backend and endpoints that act as middleware and fetch necessary data when requested.
4. Get the access token and deliver it by protecting it using a cross-origin policy and using 3rd party endpoints directly. Also, implement IP or use restrictions or critical endpoints.

It would be great if someone suggest to me how to implement the OAuth 2.0. With the given scenario and limitation.