<div id="{{ button_id }}"></div>

<style>
  #
  {{ button_id }}
  {
    padding-bottom: 15px;
    text-align: right;
  }
</style>

<script type="text/javascript">
    (function ($) {
        $(document).ready(function () {
            var script;
            
            script = document.createElement('script');
            script.type = 'text/javascript';
            script.async = true;
            script.id = 'amazon-login-sdk';
            script.src = 'https://api-cdn.amazon.com/sdk/login1.js';
            
            document.getElementsByTagName('head')[0].appendChild(script);
            
            amazon.Login.setClientId('{{ client_id }}');
        });
        
        $(window).load(function () {
            OffAmazonPayments.Button("{{ button_id }}", "{{ merchant_id }}", {
              type: "{{ button_type }}",
              color: "{{ button_colour }}",
              size: "{{ button_size }}",
              language: "{{ language }}",
              authorization: function () {
                amazon.Login.authorize({
                    scope: 'profile postal_code payments:widget payments:shipping_address'
                }, "{{ return_url }}");
              },
              onError: function (error) {
                {% if sandbox %}
                    console.log("Amazon Login Error (" + error.getErrorCode() + "): " + error.getErrorMessage());
                {% endif %}
              }
            });
        });
    })(jQuery);
</script>