Hi there,

I have two payment types (onSite and Stripe) set up and am using custom SCSS (see below) to hide one or other payment option depending on where the step booking form is displayed. 

Stripe is set as the default payment method, but for logged in users the Stripe button and form is hidden..

/*hide Stripe payment on tenant booking form */
.amelia-tenant {
 .am-fs__payments-main-button-stripe {display:none !important; }
 .am-fs__payment-stripe { display:none !important; }
 .am-fs__info-form .el-form-item:nth-of-type(n + 9) { display:none !important; }
}

As the hidden button (for Stripe) has the class "am-fs__payments-main-button_selected" when the user goes to the next step it gives the error message that card details need to be entered. See screen shots attached.

I'm wondering if I can either:

- Use Javascript to set the am-fs__payments-main-button_selected class when the Stripe button is hidden, or 

- Globally unset the class .am-fs__payments-main-button_selected.

Could you help me to understand how either of these could be done? Or suggest an alternative?

[I know I could duplicate the services for tenants and non-tenants, but there are already 20 services, with extras, so this makes management for my client quite complicated].

Thank you for your help!

Best wishes,

Derek

OK, thank you Marko.