Fix submit button styling on cover page form

I need help fixing my custom CSS that is no longer working properly for the form block on this page: https://stephanie-elizabeth.com/inner-sanctuary-guided-meditation

This is the code I have in place currently:

// lightbox form styling //
.form-wrapper {
  border: 2px solid #F4EEE8;
    padding: 20px;  
  background: #F4EEE8;
}

.form-wrapper .field-list .field .field-element {
  padding: 14px;
  background: #FFFEFA;
  border-radius: 0;
}

.form-wrapper .field-list .title {
  display: block;
  color: #4D4472;
}

.form-wrapper .field-list .field .caption {
  color: #4D4472;
}

.form-wrapper .field-list .description {
  font-style: italic;
  color: #4D4472;
}

.sqs-modal-lightbox-content .lightbox-inner .lightbox-content .lightbox-close {
    color: #4D4472;
}

.sqs-modal-lightbox-content .lightbox-inner .lightbox-content .form-wrapper .form-title {
  color: #A991AE;}

.sqs-modal-lightbox-content .lightbox-inner .lightbox-content .form-wrapper {
    color: #4D4472;
}


.form-wrapper input[type=submit] {
    background-color: #A991AE;
 font-family: Montserrat;
    font-weight: 700;
    font-style: normal;
    text-transform: uppercase;
    letter-spacing: .3em;
  border-radius: 5em;
 }
  
.form-wrapper input[type=submit]:hover {box-shadow: 0px 2px 5px rgba(0,0,0,.3)}

This button looks the way it should:

I want this "Get Access Now" submit button on the form to look the same as the "Download the Meditation" button above, and previously it did.  But for some reason the button background color is no longer displaying properly:

What do I need to tweak to get this fixed?

You can access Circle Labs > Enable option in bottom of page > Your code will work again.

Thank you @tuanphan!  Is this the setting that should be toggled on?

On 2/6/2024 at 12:39 AM, sebriggs said:

Thank you @tuanphan!  Is this the setting that should be toggled on?

 

Yes.

Thank you @tuanphan. I did toggle that on yesterday and it's still not displaying properly on my end. Do you see something different?

Try this code to Custom CSS box

.sqs-slide-wrapper[data-slide-type="cover-page"] .sso-button-style-outline~.sqs-modal-lightbox .form-wrapper input[type=submit] {
    background-color: #a890ad !important;
}

On 2/11/2024 at 10:22 AM, tuanphan said:

Try this code to Custom CSS box

.sqs-slide-wrapper[data-slide-type="cover-page"] .sso-button-style-outline~.sqs-modal-lightbox .form-wrapper input[type=submit] {
    background-color: #a890ad !important;
}

 

Unfortunately this did not work either and the issue is still present.

On 2/29/2024 at 3:09 AM, sebriggs said:

Unfortunately this did not work either and the issue is still present.

I forgot, code in Cover Page, you need to add to Cover Page Header Code Injection, not Custom CSS

<style>
  .sqs-slide-wrapper[data-slide-type="cover-page"] .sso-button-style-outline~.sqs-modal-lightbox .form-wrapper input[type=submit] {
    background-color: #a890ad !important;
}
</style>