{% if dataObj.custom_style is not empty %}
<style>
    {
            {
            dataObj.custom_style
        }
    }
</style>

{% endif %}

<script nonce="{{ dataObj.nonce }}">
    let dataObj = JSON.parse("{{ dataObj|json_encode()|escape('js') }}")
</script>

{% block javascript %}
<script nonce="{{ dataObj.nonce }}">
    var wpwlOptions = {
        style: dataObj.style, // <== this style comes from settings page of gateways
        paymentTarget: "_top",
        locale: dataObj.is_arabic ? 'ar' : 'en',
        registrations: {
            hideInitialPaymentForms: true,
            requireCvv: "true"
        },
        browser: {
            threeDChallengeWindow: 5
        }
    }
</script>
{% endblock %}

<form class="paymentWidgets" action="{{ dataObj.postBackURL }}" data-brands="{{ dataObj.payment_brands }}"></form>

{% block javascript_footer %}
<script src="{{ dataObj.scriptURL }}{{ dataObj.checkoutId }}" crossorigin="anonymous"></script>
{% endblock %}