Just FYI guys,
After the above code ended up working out from @creedon (thank you!) - I realized that I needed different booking links for each service. So here's the breakdown of what I ended up doing after lots of research:
GOAL: Redirect Add to Cart link to Acuity Scheduling session link
OUTCOME:
First, I tagged each product that I wanted to change with "hideorder"
I hid the Quantity and Add To Cart button with CSS
Then I made any links in the product description into a button, making it easy for me to redirect to any link of my pleasing!
EXAMPLE: https://leleandbeane27.squarespace.com/services/p/tennessee-wedding-package (password is password)
//Add "hideorder" tag to any product or service to remove dropdown, quantity, and order button //
//Remove Select Size Dropdown//
article .tag-hideorder .variant-option {
display: none;
}
//Remove Quantity Dropdown//
article .tag-hideorder .product-quantity-input {
display: none;
}
//Remove Order Button//
article .tag-hideorder .sqs-add-to-cart-button-wrapper {
display: none;
}
//Make Link A Button Within My Branding//
.ProductItem-details .ProductItem-details-excerpt a {
text-decoration: none!important;
border: solid 1px #3B3C36 !important;
color: #3B3C36 !important;
transition: all .4s cubic-bezier(0.75, 0, 0, 1) !important;
margin-block-start: 1.5rem;
padding: 1.5%;
background-size: 202% 100%;
background-color: transparent !important;
background-image: linear-gradient(to right, rgba(0,0,0,0) 50%, #3B3C36 50%) !important;
text-transform: uppercase;
letter-spacing: .1em;
width: 35%;
text-align: center;
font-size: .7rem !important;
}
.ProductItem-details .ProductItem-details-excerpt a:hover {
color: #fff !important;
background-position: -99% 0% !important;
}