I have since switched this calendar from Calendly to Cal.com to see if made a difference when i embedded the iframe and still, nothing shows up when I click on "book appointment" in the widget. It shows up completely blank

Hey! I looked at the code you input and it is not in an iframe format. Try out the below format and change the calendly link to yours and see if it works

<iframe src="https://calendly.com" style="width:100%;height:100%;border:0;" frameborder="0" scrolling="no"> </iframe>