Public booking page hover fix

[joe-shajan]

What does this PR do?

Fixes #6919

Fixed background color when hovering. I have also changed the background in the Badge.tsx component for grey variant. To match the Figma design. Is that ok? Or will this affect any other places?

Also, I noticed that the right arrow is currently at the right top. but in design, it's in the centre. Should I change it in this PR?

New design

tinywow_joeshajan._.Cal.com.-.Google.Chrome.2023-02-08.23-14-36_13419920.mp4

Environment: Staging(main branch) / Production

Type of change

• Bug fix (non-breaking change which fixes an issue)
• Chore (refactoring code, technical debt, workflow improvements)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• This change requires a documentation update

How should this be tested?

• Test A
• Test B

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated
cal	❌ Failed (Inspect)			Feb 10, 2023 at 2:20PM (UTC)
ui	✅ Ready (Inspect)	Visit Preview	💬 Add your feedback	Feb 10, 2023 at 2:20PM (UTC)

[vercel]

@joeshajan is attempting to deploy a commit to the cal Team on Vercel.

A member of the Team first needs to authorize it.