Load website resources via HTTPS when using HTTPS


So i have a SSL certificate installed on my website, which i really dont need except on checkout and cart pages.

However when viewers access my website in https:// the website breaks, i lose pretty much all my styling as the resources are loaded via http instead of https.

Now i know that i could force the whole wordpress installation to be https:// by going to settings/general and changing the URLs to https:// however that is NOT what i want to do.

What i want to do is be able to have wordpress load all resources via https:// when a user accesses my website through https:// but load normally through http:// when they access the website normally. No need to load all pages with https:// when they access via http:// which is what the solution of changing URL’s does.

Can anyone help with this? try to access my website through https://verdacci.com and see what happens. When i manually change the http:// to https:// in inspect element the website regains styles.