I figure it out if this can help anyone else! This is the code I used:
#siteWrapper #Tock_widget_container .sqs-button-element--primary .TockWidget-B2 {
visibility: hidden;
}
#siteWrapper #Tock_widget_container .sqs-button-element--primary .TockWidget-B2:after {
visibility: visible;
position: absolute;
top: 0.5;
left: 2.8rem;
content: "Sign up now";
}
I found the CSS style (#siteWrapper #Tock_widget_container .sqs-button-element--primary .TockWidget-B2) that references the HTML through using the Squarespace ID chrome plugin, copying the ID of the button, and then opening the html inspector of the page, ctrl+F and pasting the ID, clicking on the HTML element that contained the "Book now" text, and the copying the CSS style from the Style section below that correlated to the HTML code.
Then, using the CSS code found in this link: https://www.geeksforgeeks.org/how-to-replace-text-with-css/ I replace the ".toBeReplaced" parameter with the CSS Style found in the previous paragraph. After playing with the alignment a little, everything worked!
I really hope this can help anyone else having the same issue!