{% extends "layout.html" %}
{% block content %}
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
	<link rel="stylesheet"
	  href="https://checkoutshopper-live.adyen.com/checkoutshopper/sdk/4.1.0/adyen.css"
	  integrity="sha384-+CPzBNZVkBXu4uXDECnVuVQ24Kl8vWrR61UzuuuUj5IBEP//BQ0G0KDNfz2iPcvJ"
	  crossorigin="anonymous">

	<div id="payment-page">
		<div class="container">
			<div class="checkout-component-container">

				<div id="component" class="payment">
					<!-- Component will be rendered here -->
				</div>

			</div>
		</div>
	</div>

	<script src="https://checkoutshopper-live.adyen.com/checkoutshopper/sdk/4.1.0/adyen.js"
		integrity="sha384-3tEepwhhMcyxgIbL3HBe3I59BpSMNyKoNrbKWARYH1tJ7K7K6NdTDqOltKlwiVsH"
		crossorigin="anonymous"></script>

    <script id="client-key" type="application/json">{{ clientKey }}</script>
    <script id="integration-type" type="application/json">{{ integrationType }}</script>

    <script src="/js/adyen-implementation.js"></script>
{% endblock %}