From c9e64cfd37a31b55ff146f355d84b8566bdfcc38 Mon Sep 17 00:00:00 2001
From: Bas Maassen <maassenbas@hotmail.com>
Date: Wed, 13 Feb 2019 17:01:27 +0100
Subject: [PATCH 01/22] Fail order afer Cancel and OFFER_CLOSED (#120)

---
 .../cartridge/scripts/adyenHppCancelledPayment.ds    | 10 ++++++++--
 .../cartridge/scripts/handleCustomObject.ds          | 12 +++++++++++-
 .../cartridge/scripts/handleNotify.ds                |  1 +
 3 files changed, 20 insertions(+), 3 deletions(-)

diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyenHppCancelledPayment.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyenHppCancelledPayment.ds
index a291df57c..f998b2f7c 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/adyenHppCancelledPayment.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyenHppCancelledPayment.ds
@@ -18,7 +18,7 @@ function handle (hpm : Object, order : Order) : Number {
 	// Log detailed response to ScriptLog and log file
 	var msg : String = createLogMessage(hpm);
 	Logger.getLogger("Adyen").debug(msg);
-	
+
 	// Check the input parameters
 	if (order == null) {
 		Logger.getLogger("Adyen").fatal("Payment for not existing order was cancelled. No order was provided to the script.");
@@ -28,7 +28,9 @@ function handle (hpm : Object, order : Order) : Number {
 	// Indicates that payment was cancelled on Adyen HPP
 	var cancelledHpp = false;
 	var paymentInstrument : PaymentInstrument;
-	
+	var OrderMgr = require('dw/order/OrderMgr');
+	var Transaction = require('dw/system/Transaction');
+
 	try {
 		// Check if payment was cancelled and was used Adyen payment method
 		if (hpm.authResult.stringValue == "CANCELLED") {
@@ -57,6 +59,10 @@ function handle (hpm : Object, order : Order) : Number {
 			
 			// Add a note with all details
 			order.addNote("Adyen Payment Notification", msg);
+
+			Transaction.wrap(function () {
+				OrderMgr.failOrder(order);
+			});
 		}
 	} catch (e) {
 		// Log the error and exit
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/handleCustomObject.ds b/cartridges/int_adyen_overlay/cartridge/scripts/handleCustomObject.ds
index 94f415974..015e5620c 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/handleCustomObject.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/handleCustomObject.ds
@@ -37,6 +37,8 @@ function execute( args : PipelineDictionary ) : Number
 }
 function handle( customObj : CustomObject  ) : Object
 {
+	var OrderMgr = require('dw/order/OrderMgr');
+	var Transaction = require('dw/system/Transaction');
 	var paymentSuccess : Boolean = false;
 	var refusedHpp : Boolean = false;
 	var pending : Boolean = false;
@@ -154,7 +156,15 @@ function handle( customObj : CustomObject  ) : Object
 				order.setPaymentStatus(Order.PAYMENT_STATUS_PAID);
 				order.setExportStatus(Order.EXPORT_STATUS_READY);
 				Logger.getLogger("Adyen", "adyen").info ("Order {0} closed and updated to status PAID.",order.orderNo);  
-				break;	
+				break;
+			case "OFFER_CLOSED" :
+				order.setPaymentStatus(Order.PAYMENT_STATUS_NOTPAID);
+				order.setExportStatus(Order.EXPORT_STATUS_NOTEXPORTED);
+				Transaction.wrap(function () {
+					OrderMgr.failOrder(order);
+				});
+				Logger.getLogger("Adyen", "adyen").info ("Offer closed for order {0} and updated to status NOT PAID.", order.orderNo);
+				break;
 			case "PENDING" :
 				pending = true;
 				Logger.getLogger("Adyen", "adyen").info ("Order {0} was in pending status.",order.orderNo);
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/handleNotify.ds b/cartridges/int_adyen_overlay/cartridge/scripts/handleNotify.ds
index e46f6d4ad..7b5ff61b5 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/handleNotify.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/handleNotify.ds
@@ -65,6 +65,7 @@ function notify (notificationData) {
             case "CAPTURE_FAILED" :
             case "ORDER_OPENED" :
             case "ORDER_CLOSED" :
+            case "OFFER_CLOSED":
             case "PENDING" :
                 customObj.custom.updateStatus = "PROCESS";
                 Logger.getLogger("Adyen").info ("Received notification for merchantReference {0} with status {1}. Custom Object set up to 'PROCESS' status.", notificationData.merchantReference, notificationData.eventCode);

From 457286dc26ce82748ba342f1edd3bd495e818a91 Mon Sep 17 00:00:00 2001
From: Bas Maassen <maassenbas@hotmail.com>
Date: Wed, 13 Feb 2019 17:02:04 +0100
Subject: [PATCH 02/22] Send [accepted] after custom object is created (#122)

---
 .../cartridge/controllers/Adyen.js              | 17 ++++++++++++-----
 .../cartridge/controllers/Adyen.js              | 17 +++++++++++++----
 .../cartridge/scripts/handleNotify.ds           |  7 +++----
 3 files changed, 28 insertions(+), 13 deletions(-)

diff --git a/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js b/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js
index 15bb7912f..ec858296d 100644
--- a/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js
+++ b/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js
@@ -203,14 +203,21 @@ server.post('Notify', server.middleware.https, function (req, res, next) {
     var	checkAuth = require('int_adyen_overlay/cartridge/scripts/checkNotificationAuth');
     var status = checkAuth.check(req);
     if (!status) {
-        res.render('/error');
+        res.render('/adyen/error');
         return {};
     }
     var	handleNotify = require('int_adyen_overlay/cartridge/scripts/handleNotify');
-    Transaction.wrap(function () {
-        handleNotify.notify(req.form);
-    });
-    res.render('/notify');
+    Transaction.begin();
+    var success = handleNotify.notify(req.form);
+
+    if(success){
+      Transaction.commit();
+      res.render('/notify');
+    }
+    else {
+      res.json({error: "Notification not handled"});
+      Transaction.rollback();
+    }
     next();
 });
 
diff --git a/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js b/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js
index af6a426cd..9eb1aef3d 100644
--- a/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js
+++ b/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js
@@ -38,10 +38,19 @@ function notify() {
 	}
 
 	var	handleNotify = require('int_adyen_overlay/cartridge/scripts/handleNotify');
-	Transaction.wrap(function () {
-   		handleNotify.notifyHttpParameterMap(request.httpParameterMap);
-	});
-	app.getView().render('notify');
+
+	Transaction.begin();
+	var success = handleNotify.notifyHttpParameterMap(request.httpParameterMap);
+
+	if(success){
+		Transaction.commit();
+		app.getView().render('notify');
+	}
+	else {
+		Transaction.rollback();
+	}
+
+
 }
 
 /**
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/handleNotify.ds b/cartridges/int_adyen_overlay/cartridge/scripts/handleNotify.ds
index 7b5ff61b5..c76e39e4b 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/handleNotify.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/handleNotify.ds
@@ -43,7 +43,6 @@ function notify (notificationData) {
     try {
         var msg : String = createLogMessage(notificationData);
         Logger.getLogger("Adyen").debug(msg);
-
         var calObj: Calendar = new Calendar();
         var keyValue: String = notificationData.merchantReference + "-" + StringUtils.formatCalendar(calObj, "yyyyMMddhhmmss");
         var customObj: CustomObject = CustomObjectMgr.createCustomObject("adyenNotification", keyValue);
@@ -74,13 +73,13 @@ function notify (notificationData) {
                 customObj.custom.updateStatus = "PENDING";
                 Logger.getLogger("Adyen").info ("Received notification for merchantReference {0} with status {1}. Custom Object set up to 'PENDING' status.", notificationData.merchantReference, notificationData.eventCode);
         }
-
+        return true;
     }
 	catch (e){
-        Logger.getLogger("Adyen", "adyen").error(e.message);
+        Logger.getLogger("Adyen", "adyen").error("Notification failed: " + JSON.stringify(notificationData) + "\n" + "Error message: " + e.message);
+        return false;
 	}
 
-	return PIPELET_NEXT;
 }
 
 function createLogMessage(notificationData){

From 8b1295dc991fd2dce99eba44da602ac1cbfdeb6e Mon Sep 17 00:00:00 2001
From: scott <scott.powell@adyen.com>
Date: Mon, 25 Feb 2019 16:30:18 -0800
Subject: [PATCH 03/22] WIP: need to parse brandCode substring

---
 .../templates/default/redirectHPP.isml         | 18 +++++++++++++++---
 1 file changed, 15 insertions(+), 3 deletions(-)

diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/redirectHPP.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/redirectHPP.isml
index f3721803c..6d0d8ff4e 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/redirectHPP.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/redirectHPP.isml
@@ -30,10 +30,22 @@
     var inputType: String = Debug ? 'text' : 'hidden';
 
     if (directoryLookup) {
-        var url: String = "https://test.adyen.com/hpp/skipDetails.shtml";
-        if (Mode == "LIVE") {
-            url = "https://live.adyen.com/hpp/skipDetails.shtml";
+
+        if (pdict.ParamsMap.brandCode == "klarna" || pdict.ParamsMap.brandCode == "klarna_b2b" || pdict.ParamsMap.brandCode == "afterpay_default"
+        || pdict.ParamsMap.brandCode == "klarna_account" || pdict.ParamsMap.brandCode == "ratepay" || pdict.ParamsMap.brandCode == "molpay_cash" || pdict.ParamsMap.brandCode == "molpay_epay"
+        || pdict.ParamsMap.brandCode == "molpay_paysbuy") {
+
+            var url: String = "https://test.adyen.com/hpp/skipDetails.shtml";
+            if (Mode == "LIVE") {
+                url = "https://live.adyen.com/hpp/skipDetails.shtml";
+            }
+        } else {
+            var url: String = "https://test.adyen.com/hpp/details.shtml";
+            if (Mode == "LIVE") {
+                url = "https://live.adyen.com/hpp/details.shtml";
+            }
         }
+
     } else {
         var url: String = "https://test.adyen.com/hpp/" + hppType + ".shtml";
         if (Mode == "LIVE") {

From af07de581e36ffdb037126fe04caab61512413d8 Mon Sep 17 00:00:00 2001
From: scott <scott.powell@adyen.com>
Date: Thu, 28 Feb 2019 17:03:10 -0800
Subject: [PATCH 04/22] Added helper functions for open invoice and molpay
 payment methods

---
 .../templates/default/redirectHPP.isml          |  7 ++++---
 .../cartridge/scripts/util/AdyenHelper.ds       | 17 +++++++++++++++++
 2 files changed, 21 insertions(+), 3 deletions(-)

diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/redirectHPP.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/redirectHPP.isml
index 6d0d8ff4e..f88f78d4f 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/redirectHPP.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/redirectHPP.isml
@@ -14,6 +14,7 @@
     var Debug: String = Site.getCurrent().getCustomPreferenceValue("Adyen_Debug");
     var paymentSelection: String = Site.getCurrent().getCustomPreferenceValue("Adyen_PaymentSelection");
 
+    var AdyenHelper = require ("int_adyen_overlay/cartridge/scripts/util/AdyenHelper");
 
     var hppType;
     switch (String(paymentSelection)) {
@@ -29,11 +30,11 @@
 
     var inputType: String = Debug ? 'text' : 'hidden';
 
+    var paymentMethod = pdict.ParamsMap.brandCode;
+
     if (directoryLookup) {
 
-        if (pdict.ParamsMap.brandCode == "klarna" || pdict.ParamsMap.brandCode == "klarna_b2b" || pdict.ParamsMap.brandCode == "afterpay_default"
-        || pdict.ParamsMap.brandCode == "klarna_account" || pdict.ParamsMap.brandCode == "ratepay" || pdict.ParamsMap.brandCode == "molpay_cash" || pdict.ParamsMap.brandCode == "molpay_epay"
-        || pdict.ParamsMap.brandCode == "molpay_paysbuy") {
+        if (AdyenHelper.isOpenInvoiceMethod(paymentMethod) || AdyenHelper.isMolpayMethod(paymentMethod)) {
 
             var url: String = "https://test.adyen.com/hpp/skipDetails.shtml";
             if (Mode == "LIVE") {
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
index 96961bfdb..d69b5109f 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
@@ -147,6 +147,23 @@ var __AdyenHelper : Object = {
         return returnValue;
     },
 
+    isOpenInvoiceMethod: function(paymentMethod){
+            if(paymentMethod.indexOf("afterpay") > -1 || paymentMethod.indexOf("klarna") > -1 || paymentMethod.indexOf("ratepay") > -1 ){
+                if(paymentMethod.indexOf("afterpaytouch") == -1 ){
+                    return true;
+                }
+            }
+            return false;
+    },
+
+    isMolpayMethod: function(paymentMethod) {
+        if (paymentMethod.indexOf("molpay") > -1) {
+            return true;
+        }
+
+        return false;
+    },
+
     // Get saved card token of customer saved card based on matched cardUUID
     getCardToken: function (cardUUID, CustomerObj) {
         var token = '';

From 16af420c95a74237deb5f5711057a56d72e7ae41 Mon Sep 17 00:00:00 2001
From: Mark Hijdra <mark_hijdra@hotmail.com>
Date: Thu, 7 Mar 2019 10:57:04 +0100
Subject: [PATCH 05/22] Removes only success objects, fix for split payment
 notifications (#123)

---
 .../cartridge/scripts/deleteCustomObjects.ds  | 21 ++++++++++++-------
 .../cartridge/scripts/job/notifications.js    |  5 ++---
 2 files changed, 15 insertions(+), 11 deletions(-)

diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/deleteCustomObjects.ds b/cartridges/int_adyen_overlay/cartridge/scripts/deleteCustomObjects.ds
index e8eee9642..5a7d2bdd8 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/deleteCustomObjects.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/deleteCustomObjects.ds
@@ -19,19 +19,24 @@ function handle( orderID : String ) : Object {
 	}
 	while (searchQuery.hasNext()) {
 		var co : CustomObject = searchQuery.next();
-		dw.system.Logger.getLogger("Adyen", "adyen").info("Remove CO object with merchantReference {0} and pspReferenceNumber  {1}", co.custom.merchantReference, co.custom.pspReference);
-		try {
-			CustomObjectMgr.remove(co);
-		} catch (e) {
-			var ex = e;
-			dw.system.Logger.getLogger("Adyen", "adyen").error("Error occured during delete CO, ID: {0}, erorr message {1}", co.custom.orderId, e.message);
-		}
+		remove(co);
 	}
 	searchQuery.close();
    return PIPELET_NEXT;
 }
 
+function remove ( co ) {
+	dw.system.Logger.getLogger("Adyen", "adyen").info("Remove CO object with merchantReference {0} and pspReferenceNumber  {1}", co.custom.merchantReference, co.custom.pspReference);
+	try {
+		CustomObjectMgr.remove(co);
+	} catch (e) {
+		var ex = e;
+		dw.system.Logger.getLogger("Adyen", "adyen").error("Error occured during delete CO, ID: {0}, erorr message {1}", co.custom.orderId, e.message);
+	}
+}
+
 module.exports = {
 	'execute': execute,
-	'handle': handle
+	'handle': handle,
+	'remove': remove
 }
\ No newline at end of file
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/job/notifications.js b/cartridges/int_adyen_overlay/cartridge/scripts/job/notifications.js
index 239807564..dd4984bef 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/job/notifications.js
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/job/notifications.js
@@ -78,12 +78,11 @@ function clearNotifications(pdict) {
 	var searchQuery = CustomObjectMgr.queryCustomObjects("adyenNotification", "custom.processedStatus = 'SUCCESS'", null);
 	logger.info("Removing Processed Custom Objects start with count {0}", searchQuery.count);
 
-	var customObj, orderID;
+	var customObj;
 	while (searchQuery.hasNext()) {
 		customObj = searchQuery.next();
-		orderID = customObj.custom.orderId.split("-", 1)[0];
 		Transaction.wrap(function () {
-			deleteCustomObjects.handle(orderID);
+			deleteCustomObjects.remove(customObj);
 		});
 		
 	}

From 858a44a6ecfce12e81e5005801db8c6ed4750993 Mon Sep 17 00:00:00 2001
From: Bas Maassen <maassenbas@hotmail.com>
Date: Wed, 3 Apr 2019 08:33:36 +0200
Subject: [PATCH 06/22] Compatibility with SFRA version 3.3.0 (#140)

---
 .../cartridge/controllers/CheckoutServices.js | 64 +++++++++++--------
 1 file changed, 38 insertions(+), 26 deletions(-)

diff --git a/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js b/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js
index 1b674f0a8..70b3bd239 100644
--- a/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js
+++ b/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js
@@ -53,11 +53,12 @@ server.append('SubmitPayment',
 
 server.replace('PlaceOrder', server.middleware.https, function (req, res, next) {
   var BasketMgr = require('dw/order/BasketMgr');
-  var HookMgr = require('dw/system/HookMgr');
+  var OrderMgr = require('dw/order/OrderMgr');
   var Resource = require('dw/web/Resource');
   var Transaction = require('dw/system/Transaction');
   var URLUtils = require('dw/web/URLUtils');
   var basketCalculationHelpers = require('*/cartridge/scripts/helpers/basketCalculationHelpers');
+  var hooksHelper = require('*/cartridge/scripts/helpers/hooks');
 
   var currentBasket = BasketMgr.getCurrentBasket();
   if (!currentBasket) {
@@ -71,16 +72,22 @@ server.replace('PlaceOrder', server.middleware.https, function (req, res, next)
     return next();
   }
 
-  var validationBasketStatus = HookMgr.callHook(
-    'app.validate.basket',
-    'validateBasket',
-    currentBasket,
-    false
-  );
-  if (validationBasketStatus.error) {
+  if (req.session.privacyCache.get('fraudDetectionStatus')) {
     res.json({
       error: true,
-      errorMessage: validationBasketStatus.message
+      cartError: true,
+      redirectUrl: URLUtils.url('Error-ErrorCode', 'err', '01').toString(),
+      errorMessage: Resource.msg('error.technical', 'checkout', null)
+    });
+
+    return next();
+  }
+
+  var validationOrderStatus = hooksHelper('app.validate.order', 'validateOrder', currentBasket, require('*/cartridge/scripts/hooks/validateOrder').validateOrder);
+  if (validationOrderStatus.error) {
+    res.json({
+      error: true,
+      errorMessage: validationOrderStatus.message
     });
     return next();
   }
@@ -168,30 +175,31 @@ server.replace('PlaceOrder', server.middleware.https, function (req, res, next)
     return next();
   }
 
-    var fraudDetectionStatus = HookMgr.callHook('app.fraud.detection', 'fraudDetection', currentBasket);
-    if (fraudDetectionStatus.status === 'fail') {
-        Transaction.wrap(function () { OrderMgr.failOrder(order); });
-
-        // fraud detection failed
-        req.session.privacyCache.set('fraudDetectionStatus', true);
+  var fraudDetectionStatus = hooksHelper('app.fraud.detection', 'fraudDetection', currentBasket, require('*/cartridge/scripts/hooks/fraudDetection').fraudDetection);
+  if (fraudDetectionStatus.status === 'fail') {
+    Transaction.wrap(function () {
+      OrderMgr.failOrder(order);
+    });
 
-        res.json({
-            error: true,
-            cartError: true,
-            redirectUrl: URLUtils.url('Error-ErrorCode', 'err', fraudDetectionStatus.errorCode).toString(),
-            errorMessage: Resource.msg('error.technical', 'checkout', null)
-        });
+    // fraud detection failed
+    req.session.privacyCache.set('fraudDetectionStatus', true);
 
-        return next();
-    }
+    res.json({
+      error: true,
+      cartError: true,
+      redirectUrl: URLUtils.url('Error-ErrorCode', 'err', fraudDetectionStatus.errorCode).toString(),
+      errorMessage: Resource.msg('error.technical', 'checkout', null)
+    });
 
-    // Places the order
-    var placeOrderResult = adyenHelpers.placeOrder(order, fraudDetectionStatus);
+    return next();
+  }
 
+  // Places the order
+  var placeOrderResult = adyenHelpers.placeOrder(order, fraudDetectionStatus);
   if (placeOrderResult.error) {
     res.json({
       error: true,
-      errorMessage: Resource.msg('error.placeorder', 'checkout', null)
+      errorMessage: Resource.msg('error.technical', 'checkout', null)
     });
     return next();
   }
@@ -209,6 +217,10 @@ server.replace('PlaceOrder', server.middleware.https, function (req, res, next)
   }
 
   COHelpers.sendConfirmationEmail(order, req.locale.id);
+
+  // Reset usingMultiShip after successful Order placement
+  req.session.privacyCache.set('usingMultiShipping', false);
+
   res.json({
     error: false,
     orderID: order.orderNo,

From 8cd049cccb6434198b34ac723389e80fddebb427 Mon Sep 17 00:00:00 2001
From: Bas Maassen <bas.maassen@adyen.com>
Date: Tue, 7 May 2019 06:40:19 -0700
Subject: [PATCH 07/22] Update README.md

---
 README.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index 5a6f7cb44..cf0e04272 100755
--- a/README.md
+++ b/README.md
@@ -12,9 +12,9 @@ The integration is based on the Site Genesis demo store provided by Commerce Clo
   
 ## Installation, Usage and Configuration
 
-Installation, Usage and Configuration is explained in our [manual](https://docs.adyen.com/developers/plug-ins-and-partners/salesforce-commerce-cloud).
+Installation, Usage and Configuration is explained in our [manual](https://docs.adyen.com/plugins/salesforce-commerce-cloud/).
 
-ApplePay configuration can be found [here](documentation/ApplePay.md)
+ApplePay configuration can be found [here](https://docs.adyen.com/plugins/salesforce-commerce-cloud/set-up-payment-methods/#set-up-apple-pay-on-the-web)
 
 ## Support
   

From 46fa6672777e474cabec55e8cdf81900955388ca Mon Sep 17 00:00:00 2001
From: Scott Powell <scott.t.powell14@gmail.com>
Date: Wed, 8 May 2019 08:15:37 -0700
Subject: [PATCH 08/22] Update README.md

---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index cf0e04272..b987a9844 100755
--- a/README.md
+++ b/README.md
@@ -1,6 +1,6 @@
 # Salesforce Commerce Cloud Adyen Cartridge
 
-Adyen provides a LINK cartridge to integrate with a Salesforce Commerce Cloud (SCC). This cartridge enables a SCC store to use the Adyen payment service. This cartridge supports SFRA and JS-Controllers.
+Adyen provides a LINK cartridge to integrate with a Salesforce Commerce Cloud (SCC). This cartridge enables a SCC store to use the Adyen payment service. This cartridge supports SFRA up to v3.3.0 and JS-Controllers.
 
 ## Integration
 The plugin integrates Classic integration for all card payments. Local/redirect payment methods are integrated with DirectoryLookup and HPP. For Point Of Sale (POS) payments we use Terminal API using Cloud-based communication. 

From b4557655333fed091e905271438eaf8a9ec43a5a Mon Sep 17 00:00:00 2001
From: Bas Maassen <bas.maassen@adyen.com>
Date: Fri, 10 May 2019 15:09:06 -0700
Subject: [PATCH 09/22] Compatibility SFRA v4.0.0 (#150)

* Compatibility with SFRA v4.0.0
---
 .../cartridge/controllers/CheckoutServices.js |  45 ------
 .../cartridge/scripts/hooks.json              |   8 +
 .../processor/adyen_credit_form_processor.js  | 143 ++++++++++++++++++
 .../payment/processor/adyen_form_processor.js |  46 ++++++
 .../checkout/billing/paymentOptions.isml      |  36 -----
 .../alternativePaymentMethodsContent.isml     |  10 +-
 .../paymentOptions/creditCardContent.isml     |  41 ++---
 7 files changed, 229 insertions(+), 100 deletions(-)
 create mode 100644 cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit_form_processor.js
 create mode 100644 cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_form_processor.js

diff --git a/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js b/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js
index 70b3bd239..9356aa2bb 100644
--- a/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js
+++ b/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js
@@ -6,51 +6,6 @@ server.extend(module.superModule);
 var COHelpers = require('*/cartridge/scripts/checkout/checkoutHelpers');
 var adyenHelpers = require('*/cartridge/scripts/checkout/adyenHelpers');
 
-function getEncryptedData() {
-  var paymentForm = server.forms.getForm('billing');
-  return paymentForm.creditCardFields.adyenEncryptedData.value;
-}
-
-
-server.append('SubmitPayment',
-  server.middleware.https,
-  function (req, res, next) {
-    var viewData = res.getViewData();
-    viewData.adyenEncryptedData = getEncryptedData();
-    var paymentForm = server.forms.getForm('billing');
-
-    viewData.paymentInformation = {
-      cardType: {
-        value: paymentForm.creditCardFields.cardType.value
-      },
-      cardNumber: {
-        value: paymentForm.creditCardFields.cardNumber.value
-      },
-      expirationMonth: {
-        value: parseInt(paymentForm.creditCardFields.expirationMonth.selectedOption, 10)
-      },
-      expirationYear: {
-        value: parseInt(paymentForm.creditCardFields.expirationYear.value, 10)
-      },
-      securityCode: {
-          value: paymentForm.creditCardFields.securityCode.value
-      }
-    };
-
-    if(paymentForm.creditCardFields.selectedCardID) {
-        viewData.storedPaymentUUID = paymentForm.creditCardFields.selectedCardID.value;
-    }
-
-    // set selected brandCode & issuerId to session variable
-    session.custom.brandCode = req.form.brandCode;
-    session.custom.adyenPaymentMethod = req.form.adyenPaymentMethod;
-    session.custom.issuerId = req.form.issuerId;
-    session.custom.adyenIssuerName = req.form.adyenIssuerName;
-
-    res.setViewData(viewData);
-    next();
-  });
-
 server.replace('PlaceOrder', server.middleware.https, function (req, res, next) {
   var BasketMgr = require('dw/order/BasketMgr');
   var OrderMgr = require('dw/order/OrderMgr');
diff --git a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks.json b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks.json
index 794c1aee6..b913a88a1 100644
--- a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks.json
+++ b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks.json
@@ -4,9 +4,17 @@
 			"name": "app.payment.processor.adyen_credit",
 			"script": "./hooks/payment/processor/adyen_credit"
 		},
+		{
+			"name": "app.payment.form.processor.adyen_credit",
+			"script": "./hooks/payment/processor/adyen_credit_form_processor"
+		},
 		{
 			"name": "app.payment.processor.adyen",
 			"script": "./hooks/payment/processor/adyen"
+		},
+		{
+			"name": "app.payment.form.processor.adyen",
+			"script": "./hooks/payment/processor/adyen_form_processor"
 		}
 	]
 }
diff --git a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit_form_processor.js b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit_form_processor.js
new file mode 100644
index 000000000..6ac4e47d5
--- /dev/null
+++ b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit_form_processor.js
@@ -0,0 +1,143 @@
+'use strict';
+
+var server = require('server');
+
+var COHelpers = require('*/cartridge/scripts/checkout/checkoutHelpers');
+
+function getEncryptedData() {
+    var paymentForm = server.forms.getForm('billing');
+    return paymentForm.creditCardFields.adyenEncryptedData.value;
+}
+
+/**
+ * Verifies the required information for billing form is provided.
+ * @param {Object} req - The request object
+ * @param {Object} paymentForm - the payment form
+ * @param {Object} viewFormData - object contains billing form data
+ * @returns {Object} an object that has error information or payment information
+ */
+function processForm(req, paymentForm, viewFormData) {
+    var array = require('*/cartridge/scripts/util/array');
+    var viewData = viewFormData;
+    var creditCardErrors = {};
+
+    if (!req.form.storedPaymentUUID) {
+        // verify credit card form data
+        creditCardErrors = COHelpers.validateCreditCard(paymentForm);
+    }
+
+    if (Object.keys(creditCardErrors).length) {
+        return {
+            fieldErrors: creditCardErrors,
+            error: true
+        };
+    }
+
+    viewData.paymentMethod = {
+        value: paymentForm.paymentMethod.value,
+        htmlName: paymentForm.paymentMethod.value
+    };
+
+    viewData.paymentInformation = {
+        cardType: {
+            value: paymentForm.creditCardFields.cardType.value,
+            htmlName: paymentForm.creditCardFields.cardType.htmlName
+        },
+        cardNumber: {
+            value: paymentForm.creditCardFields.cardNumber.value,
+            htmlName: paymentForm.creditCardFields.cardNumber.htmlName
+        },
+        securityCode: {
+            value: paymentForm.creditCardFields.securityCode.value,
+            htmlName: paymentForm.creditCardFields.securityCode.htmlName
+        },
+        expirationMonth: {
+            value: parseInt(
+                paymentForm.creditCardFields.expirationMonth.selectedOption,
+                10
+            ),
+            htmlName: paymentForm.creditCardFields.expirationMonth.htmlName
+        },
+        expirationYear: {
+            value: parseInt(paymentForm.creditCardFields.expirationYear.value, 10),
+            htmlName: paymentForm.creditCardFields.expirationYear.htmlName
+        }
+    };
+
+    if (req.form.storedPaymentUUID) {
+        viewData.storedPaymentUUID = req.form.storedPaymentUUID;
+    }
+
+    viewData.adyenEncryptedData = getEncryptedData();
+
+    viewData.saveCard = paymentForm.creditCardFields.saveCard.checked;
+
+    // process payment information
+    if (viewData.storedPaymentUUID
+        && req.currentCustomer.raw.authenticated
+        && req.currentCustomer.raw.registered
+    ) {
+        var paymentInstruments = req.currentCustomer.wallet.paymentInstruments;
+        var paymentInstrument = array.find(paymentInstruments, function (item) {
+            return viewData.storedPaymentUUID === item.UUID;
+        });
+
+        viewData.paymentInformation.cardNumber.value = paymentInstrument.creditCardNumber;
+        viewData.paymentInformation.cardType.value = paymentInstrument.creditCardType;
+        viewData.paymentInformation.securityCode.value = req.form.securityCode;
+        viewData.paymentInformation.expirationMonth.value = paymentInstrument.creditCardExpirationMonth;
+        viewData.paymentInformation.expirationYear.value = paymentInstrument.creditCardExpirationYear;
+        viewData.paymentInformation.creditCardToken = paymentInstrument.raw.creditCardToken;
+    }
+
+    return {
+        error: false,
+        viewData: viewData
+    };
+}
+
+/**
+ * Save the credit card information to login account if save card option is selected
+ * @param {Object} req - The request object
+ * @param {dw.order.Basket} basket - The current basket
+ * @param {Object} billingData - payment information
+ */
+function savePaymentInformation(req, basket, billingData) {
+    var CustomerMgr = require('dw/customer/CustomerMgr');
+
+    if (!billingData.storedPaymentUUID
+        && req.currentCustomer.raw.authenticated
+        && req.currentCustomer.raw.registered
+        && billingData.saveCard
+        && (billingData.paymentMethod.value === 'CREDIT_CARD')
+    ) {
+        var customer = CustomerMgr.getCustomerByCustomerNumber(
+            req.currentCustomer.profile.customerNo
+        );
+
+        var saveCardResult = COHelpers.savePaymentInstrumentToWallet(
+            billingData,
+            basket,
+            customer
+        );
+
+        req.currentCustomer.wallet.paymentInstruments.push({
+            creditCardHolder: saveCardResult.creditCardHolder,
+            maskedCreditCardNumber: saveCardResult.maskedCreditCardNumber,
+            creditCardType: saveCardResult.creditCardType,
+            creditCardExpirationMonth: saveCardResult.creditCardExpirationMonth,
+            creditCardExpirationYear: saveCardResult.creditCardExpirationYear,
+            UUID: saveCardResult.UUID,
+            creditCardNumber: Object.hasOwnProperty.call(
+                saveCardResult,
+                'creditCardNumber'
+            )
+                ? saveCardResult.creditCardNumber
+                : null,
+            raw: saveCardResult
+        });
+    }
+}
+
+exports.processForm = processForm;
+exports.savePaymentInformation = savePaymentInformation;
diff --git a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_form_processor.js b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_form_processor.js
new file mode 100644
index 000000000..b7d11c761
--- /dev/null
+++ b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_form_processor.js
@@ -0,0 +1,46 @@
+'use strict';
+
+var server = require('server');
+var Logger = require('dw/system/Logger');
+
+var COHelpers = require('*/cartridge/scripts/checkout/checkoutHelpers');
+
+/**
+ * Verifies the required information for billing form is provided.
+ * @param {Object} req - The request object
+ * @param {Object} paymentForm - the payment form
+ * @param {Object} viewFormData - object contains billing form data
+ * @returns {Object} an object that has error information or payment information
+ */
+function processForm(req, paymentForm, viewFormData) {
+    var viewData = viewFormData;
+
+    viewData.paymentMethod = {
+        value: paymentForm.paymentMethod.value,
+        htmlName: paymentForm.paymentMethod.value
+    };
+
+    // set selected brandCode & issuerId to session variable
+    session.custom.brandCode = req.form.brandCode;
+    session.custom.adyenPaymentMethod = req.form.adyenPaymentMethod;
+    session.custom.issuerId = req.form.issuerId;
+    session.custom.adyenIssuerName = req.form.adyenIssuerName;
+
+    return {
+        error: false,
+        viewData: viewData
+    };
+}
+
+/**
+ * Save the credit card information to login account if save card option is selected
+ * @param {Object} req - The request object
+ * @param {dw.order.Basket} basket - The current basket
+ * @param {Object} billingData - payment information
+ */
+function savePaymentInformation(req, basket, billingData) {
+
+}
+
+exports.processForm = processForm;
+exports.savePaymentInformation = savePaymentInformation;
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions.isml
index af5cefc31..6f25cb31e 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions.isml
@@ -20,42 +20,6 @@
            value="paymentMethod">
 
     <isset name="creditFields" value="${pdict.forms.billingForm.creditCardFields}" scope="page"/>
-<div class="row">
-    <div class="col-sm-6">
-        <div class="form-group
-            <isif condition=${creditFields.email.mandatory === true}>required</isif>
-            ${creditFields.email.htmlName}">
-            <label class="form-control-label" for="email">${Resource.msg('field.customer.email','checkout',null)}</label>
-            <span class="info-icon">
-                <span class="icon">i</span>
-                <div class="tooltip">
-                    ${Resource.msg('tooltip.email','creditCard',null)}
-                </div>
-            </span>
-            <input type="text" class="form-control email" id="email"
-                   value="${pdict.order.orderEmail||''}" ${creditFields.email.attributes} >
-            <div class="invalid-feedback"></div>
-        </div>
-    </div>
-    <div class="col-sm-6">
-        <div class="form-group
-            <isif condition=${creditFields.phone.mandatory === true}>required</isif>
-            ${creditFields.phone.htmlName}">
-            <label class="form-control-label" for="phoneNumber">${Resource.msg('field.customer.phone.number','checkout',null)}</label>
-            <span class="info-icon">
-                <span class="icon">i</span>
-                <div class="tooltip">
-                    ${Resource.msg('tooltip.phone.number','creditCard',null)}
-                </div>
-            </span>
-            <input type="tel" class="form-control phone" id="phoneNumber"
-                   value="${pdict.order.billing.billingAddress.address
-                ? pdict.order.billing.billingAddress.address.phone||''
-                : ''}" ${creditFields.phone.attributes} >
-            <div class="invalid-feedback"></div>
-        </div>
-    </div>
-</div>
 <div class="credit-card-selection-new" >
     <div class="tab-content">
         <isinclude template="checkout/billing/paymentOptions/paymentOptionsContent" />
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/alternativePaymentMethodsContent.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/alternativePaymentMethodsContent.isml
index abed10fc3..fa9685e0f 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/alternativePaymentMethodsContent.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/alternativePaymentMethodsContent.isml
@@ -1,6 +1,12 @@
 <!--- applicable credit cards--->
 <div class="tab-pane adyen-content" id="adyen-content" role="tabpanel">
-    <fieldset class="">
-        <isinclude template="checkout/billing/alternativePaymentMethodForm" />
+    <fieldset class="payment-form-fields">
+        <input type="hidden" class="form-control"
+               name="${pdict.forms.billingForm.paymentMethod.htmlName}"
+               value="Adyen"
+        >
+        <fieldset class="">
+            <isinclude template="checkout/billing/alternativePaymentMethodForm" />
+        </fieldset>
     </fieldset>
 </div>
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/creditCardContent.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/creditCardContent.isml
index 219962a47..a1b0a357d 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/creditCardContent.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/creditCardContent.isml
@@ -1,26 +1,33 @@
 <!--- applicable credit cards--->
 <div class="tab-pane active credit-card-content" id="credit-card-content" role="tabpanel">
+    <fieldset class="payment-form-fields">
+
     <!--- payment method is credit card --->
+        <input type="hidden" class="form-control"
+               name="${pdict.forms.billingForm.paymentMethod.htmlName}"
+               value="CREDIT_CARD"
+        >
 
-    <!--- register/authenticated user --->
-    <isif condition="${pdict.customer.registeredUser}">
-        <div class="user-payment-instruments container ${pdict.customer.registeredUser && pdict.customer.customerPaymentInstruments.length ? '' : 'checkout-hidden'}">
-            <!--- Stored user payments --->
-            <div class="stored-payments">
-                <isinclude template="checkout/billing/storedPaymentInstruments" />
-            </div>
+        <!--- register/authenticated user --->
+        <isif condition="${pdict.customer.registeredUser}">
+            <div class="user-payment-instruments container ${pdict.customer.registeredUser && pdict.customer.customerPaymentInstruments.length ? '' : 'checkout-hidden'}">
+                <!--- Stored user payments --->
+                <div class="stored-payments">
+                    <isinclude template="checkout/billing/storedPaymentInstruments" />
+                </div>
 
-            <!--- Add new credit card button --->
-            <div class="row">
-                <button class="btn btn-block add-payment btn-outline-primary" type="button">${Resource.msg('button.add.payment', 'checkout', null)}</button>
+                <!--- Add new credit card button --->
+                <div class="row">
+                    <button class="btn btn-block add-payment btn-outline-primary" type="button">${Resource.msg('button.add.payment', 'checkout', null)}</button>
+                </div>
             </div>
-        </div>
-    </isif>
-
-    <fieldset class="credit-card-form ${pdict.customer.registeredUser && pdict.customer.customerPaymentInstruments.length ? 'checkout-hidden' : ''}">
-        <isinclude template="checkout/billing/creditCardForm" />
-        <isif condition="${pdict.customer.registeredUser}">
-            <button class="btn btn-block cancel-new-payment btn-outline-primary ${pdict.customer.registeredUser && pdict.customer.customerPaymentInstruments.length ? '' : 'checkout-hidden'}" type="button">${Resource.msg('button.back.to.stored.payments', 'checkout', null)}</button>
         </isif>
+
+        <fieldset class="credit-card-form ${pdict.customer.registeredUser && pdict.customer.customerPaymentInstruments.length ? 'checkout-hidden' : ''}">
+            <isinclude template="checkout/billing/creditCardForm" />
+            <isif condition="${pdict.customer.registeredUser}">
+                <button class="btn btn-block cancel-new-payment btn-outline-primary ${pdict.customer.registeredUser && pdict.customer.customerPaymentInstruments.length ? '' : 'checkout-hidden'}" type="button">${Resource.msg('button.back.to.stored.payments', 'checkout', null)}</button>
+            </isif>
+        </fieldset>
     </fieldset>
 </div>

From b3f846c87332529aad6b24451cf87a5a354499c2 Mon Sep 17 00:00:00 2001
From: Bas Maassen <bas.maassen@adyen.com>
Date: Fri, 17 May 2019 13:40:26 -0700
Subject: [PATCH 10/22] Checkout API feature (#152)

* Checkout API feature

* Compatibility SFRA v4.0.0 for Checkout API (#151)
---
 .../order/PaymentInstrumentInfo_Adyen.isml    |  40 +-
 cartridges/int_adyen_SFRA/.eslintrc.json      |  64 +-
 .../cartridge/client/default/js/adyen-cse.js  | 183 ++--
 .../client/default/js/adyenCheckout.js        | 436 ++++++++
 .../cartridge/client/default/js/checkout.js   |  16 +-
 .../client/default/js/checkout/billing.js     |  34 +-
 .../client/default/js/checkout/checkout.js    |   2 +
 .../default/scss/adyen-checkout-2.1.0.scss    | 987 ++++++++++++++++++
 .../client/default/scss/adyenCss.scss         |  33 +-
 .../cartridge/controllers/Account.js          |  16 +-
 .../cartridge/controllers/Adyen.js            | 383 +++----
 .../cartridge/controllers/Checkout.js         |  14 +-
 .../cartridge/controllers/CheckoutServices.js | 335 +++---
 .../controllers/PaymentInstruments.js         | 115 +-
 .../cartridge/forms/default/adyenPayment.xml  |  16 +
 .../cartridge/forms/default/billing.xml       |  19 +
 .../cartridge/forms/default/creditCard.xml    |  50 +-
 .../cartridge/models/payment.js               |  13 +-
 .../cartridge/scripts/adyenService.ds         |   4 +-
 .../scripts/checkout/adyenHelpers.js          | 177 ++--
 .../scripts/hooks/payment/processor/adyen.js  |  84 +-
 .../hooks/payment/processor/adyen_credit.js   |  31 +-
 .../processor/adyen_credit_form_processor.js  |  33 +-
 .../payment/processor/adyen_form_processor.js |  17 +-
 .../default/account/payment/paymentForm.isml  | 136 +--
 .../templates/default/adyenform.isml          |   4 +-
 .../billing/alternativePaymentMethodForm.isml |  26 +-
 .../checkout/billing/creditCardForm.isml      | 125 +--
 .../checkout/billing/paymentOptions.isml      |   6 +-
 .../alternativePaymentMethodSummary.isml      |   5 +-
 .../alternativePaymentMethodTab.isml          |   8 +-
 .../paymentOptions/creditCardSummary.isml     |  15 +-
 .../paymentOptions/paymentOptionsContent.isml |   8 +-
 .../paymentOptions/paymentOptionsSummary.isml |   4 +-
 .../paymentOptions/paymentOptionsTabs.isml    |   6 +-
 .../billing/storedPaymentInstruments.isml     |  45 +
 .../adyenConfirmationDetails.isml             |  52 +
 .../confirmation/confirmationEmail.isml       |  48 +-
 .../templates/default/redirectHPP.isml        |  46 +-
 .../templates/resources/checkout.properties   |   1 -
 .../templates/resources/creditCard.properties |   1 +
 .../templates/resources/hpp.properties        |   4 +-
 cartridges/int_adyen_controllers/.DS_Store    |   0
 .../int_adyen_controllers/cartridge/.DS_Store |   0
 .../cartridge/controllers/Adyen.js            | 316 +++---
 .../scripts/payment/processor/ADYEN_CREDIT.js |  97 +-
 .../scripts/payment/processor/Adyen.js        |  49 +-
 .../cartridge/forms/default/adyPaydata.xml    |  28 +-
 .../cartridge/js/pages/checkout/adyen-cse.js  | 367 ++++---
 .../cartridge/js/pages/checkout/billing.js    | 550 +++++-----
 .../cartridge/scripts/UpdateSavedCards.ds     |   7 +-
 .../cartridge/scripts/adyen3DVerification.ds  |  18 +-
 .../cartridge/scripts/adyenCheckout.ds        | 386 +++++++
 .../scripts/adyenCreditVerification.ds        |  54 +-
 .../scripts/adyenGetOpenInvoiceData.ds        | 168 +++
 .../cartridge/scripts/adyenGetOriginKey.ds    |  95 ++
 .../scripts/adyenGetPaymentMethods.ds         |  98 ++
 .../adyenRedirectVerificationSHA256.ds        |  13 +-
 .../cartridge/scripts/util/AdyenHelper.ds     | 455 ++++----
 .../cartridge/static/default/css/adyenCSS.css |  78 ++
 .../cartridge/static/default/css/checkout.css | 834 ++++++++++++++-
 .../static/default/images/bancontact-dark.svg |  57 +
 .../static/default/images/maestro-dark.svg    |  66 ++
 .../adyenpaymentinstrumentdetails.isml        |   5 -
 .../templates/default/adyenOrderDetails.isml  |  50 +
 .../checkout/billing/adyenpaymentfields.isml  | 202 ++--
 .../checkout/billing/adyenpaymentmethods.isml |   6 +-
 .../templates/default/checkoutComponent.isml  |  72 ++
 .../components/order/orderdetails.isml        | 226 ++++
 .../components/order/orderdetailsemail.isml   | 256 +++++
 .../cartridge/templates/default/hpp.isml      |  77 +-
 .../templates/resources/checkout.properties   |  11 +
 .../meta/system-objecttype-extensions.xml     |  49 +-
 metadata/site_import/services.xml             |  52 +-
 .../sites/yourSiteId/preferences.xml          |  23 -
 75 files changed, 6233 insertions(+), 2174 deletions(-)
 create mode 100644 cartridges/int_adyen_SFRA/cartridge/client/default/js/adyenCheckout.js
 create mode 100644 cartridges/int_adyen_SFRA/cartridge/client/default/scss/adyen-checkout-2.1.0.scss
 create mode 100644 cartridges/int_adyen_SFRA/cartridge/forms/default/adyenPayment.xml
 create mode 100644 cartridges/int_adyen_SFRA/cartridge/forms/default/billing.xml
 create mode 100644 cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/storedPaymentInstruments.isml
 create mode 100644 cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/confirmation/adyenConfirmationDetails.isml
 delete mode 100644 cartridges/int_adyen_SFRA/cartridge/templates/resources/checkout.properties
 create mode 100644 cartridges/int_adyen_controllers/.DS_Store
 create mode 100644 cartridges/int_adyen_controllers/cartridge/.DS_Store
 create mode 100644 cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds
 create mode 100644 cartridges/int_adyen_overlay/cartridge/scripts/adyenGetOpenInvoiceData.ds
 create mode 100644 cartridges/int_adyen_overlay/cartridge/scripts/adyenGetOriginKey.ds
 create mode 100644 cartridges/int_adyen_overlay/cartridge/scripts/adyenGetPaymentMethods.ds
 create mode 100644 cartridges/int_adyen_overlay/cartridge/static/default/css/adyenCSS.css
 create mode 100644 cartridges/int_adyen_overlay/cartridge/static/default/images/bancontact-dark.svg
 create mode 100644 cartridges/int_adyen_overlay/cartridge/static/default/images/maestro-dark.svg
 create mode 100755 cartridges/int_adyen_overlay/cartridge/templates/default/adyenOrderDetails.isml
 create mode 100644 cartridges/int_adyen_overlay/cartridge/templates/default/checkoutComponent.isml
 create mode 100755 cartridges/int_adyen_overlay/cartridge/templates/default/components/order/orderdetails.isml
 create mode 100755 cartridges/int_adyen_overlay/cartridge/templates/default/components/order/orderdetailsemail.isml
 create mode 100644 cartridges/int_adyen_overlay/cartridge/templates/resources/checkout.properties
 delete mode 100644 metadata/site_import/sites/yourSiteId/preferences.xml

diff --git a/cartridges/bm_adyen/cartridge/templates/default/order/PaymentInstrumentInfo_Adyen.isml b/cartridges/bm_adyen/cartridge/templates/default/order/PaymentInstrumentInfo_Adyen.isml
index bbbf6a60f..9078c31da 100644
--- a/cartridges/bm_adyen/cartridge/templates/default/order/PaymentInstrumentInfo_Adyen.isml
+++ b/cartridges/bm_adyen/cartridge/templates/default/order/PaymentInstrumentInfo_Adyen.isml
@@ -9,6 +9,7 @@
 		var paymentInstrument = paymentInstruments.next();
 		var paymentMethod = dw.order.PaymentMgr.getPaymentMethod(paymentInstrument.paymentMethod);
 		var amount = order.custom.Adyen_value/100;
+		var adyenAdditionalPaymentData = JSON.parse(paymentInstrument.custom.adyenAdditionalPaymentData);
 	}
 </isscript>
 <BR><BR>
@@ -22,18 +23,39 @@
 			<img border='0' src='https://ca-test.adyen.com/ca/css/csr/images/adyen-logo.condensed.hr.png?c4e4' width='111'></A></th>
 			<th>Payment info</th>
 		</tr>
-	</thead>			
-<tr><td colspan='2'><hr size='1'></hr></td></tr>
-<tbody>
-			<tr><td class='infobox_title'>PSP reference</td><td class='infobox_item'><A target='new' HREF='https://ca-test.adyen.com/ca/ca/payments/searchPayments.shtml?skipList=firstResult&query=${order.custom.Adyen_pspReference}'><isprint value="${order.custom.Adyen_pspReference}"> </A></td></tr>
-		
-			<tr><td class='infobox_title'>Payment Method</td><td class='infobox_item'><isprint value="${order.custom.Adyen_paymentMethod}"></td></tr>
-			<tr><td class='infobox_title'>Eventcode</td><td class='infobox_item'><isprint value="${order.custom.Adyen_eventCode}"></td></tr>
-			<tr><td class='infobox_title'>Amount</td><td class='infobox_item'><isprint value="${amount}"></td></tr>
+	</thead>
+	<tbody>
+		<tr><td class='infobox_title'>PSP reference</td><td class='infobox_item'><A target='new' HREF='https://ca-test.adyen.com/ca/ca/payments/searchPayments.shtml?skipList=firstResult&query=${order.custom.Adyen_pspReference}'><isprint value="${order.custom.Adyen_pspReference}"> </A></td></tr>
+		<tr><td class='infobox_title'>Payment Method</td><td class='infobox_item'><isprint value="${order.custom.Adyen_paymentMethod}"></td></tr>
+		<tr><td class='infobox_title'>Eventcode</td><td class='infobox_item'><isprint value="${order.custom.Adyen_eventCode}"></td></tr>
+		<tr></tr>
+		<isif condition="${adyenAdditionalPaymentData != null}">
+			<isloop items="${adyenAdditionalPaymentData}" var="bankTransferItem" status="loopstate">
+				<isif condition="${bankTransferItem.key == 'bankTransfer.reference'}">
+					<tr>
+						<td><span class="infobox_title">Reference:</span></td>
+						<td><span class="summary-details">${bankTransferItem.value}</span></td>
+					</tr>
+				</isif>
+				<isif condition="${bankTransferItem.key == 'bankTransfer.owner'}">
+					<tr>
+						<td><span class="infobox_title">Beneficiary Name:</span></td>
+						<td><span class="summary-details">${bankTransferItem.value}</span></td>
+					</tr>
+				</isif>
+				<isif condition="${bankTransferItem.key == 'bankTransfer.iban'}">
+					<tr>
+						<td><span class="infobox_title">Bankaccount:</span></td>
+						<td><span class="summary-details">${bankTransferItem.value}</span></td>
+					</tr>
+				</isif>
+			</isloop>
+		</isif>
 	</tbody>
 </table>
-<BR>
 </div>
+<BR>
+
 <!-- END: Adyentable 
 			
 
diff --git a/cartridges/int_adyen_SFRA/.eslintrc.json b/cartridges/int_adyen_SFRA/.eslintrc.json
index 1b9b2f488..e335f8815 100755
--- a/cartridges/int_adyen_SFRA/.eslintrc.json
+++ b/cartridges/int_adyen_SFRA/.eslintrc.json
@@ -2,27 +2,45 @@
   "root": true,
   "extends": "airbnb-base/legacy",
   "rules": {
-        "import/no-unresolved": "off",
-        "indent": ["error", 4, { "SwitchCase": 1, "VariableDeclarator": 1 }],
-        "func-names": "off",
-        "valid-jsdoc": ["error", { "preferType": { "Boolean": "boolean", "Number": "number", "object": "Object", "String": "string" }, "requireReturn": false}],
-        "vars-on-top": "off",
-        "global-require": "off",
-        "no-shadow":"off",
-        "max-len": "off",
-        "no-underscore-dangle": "off",
-        "linebreak-style": 0,
-        "no-undef":"off",
-        "no-use-before-define":"off",
-        "no-param-reassign":"off",
-        "no-unused-vars":"off",
-        "eqeqeq":"off",
-        "no-array-constructor":"off",
-        "no-tabs":"off",
-        "no-restricted-syntax":"off",
-        "no-restricted-globals":"off",
-        "consistent-return":"off",
-        "no-redeclare":"off",
-        "no-plusplus":"off"
-    }
+    "import/no-unresolved": "off",
+    "indent": [
+      "error",
+      4,
+      {
+        "SwitchCase": 1,
+        "VariableDeclarator": 1
+      }
+    ],
+    "func-names": "off",
+    "valid-jsdoc": [
+      "error",
+      {
+        "preferType": {
+          "Boolean": "boolean",
+          "Number": "number",
+          "object": "Object",
+          "String": "string"
+        },
+        "requireReturn": false
+      }
+    ],
+    "vars-on-top": "off",
+    "global-require": "off",
+    "no-shadow": "off",
+    "max-len": "off",
+    "no-underscore-dangle": "off",
+    "linebreak-style": 0,
+    "no-undef": "off",
+    "no-use-before-define": "off",
+    "no-param-reassign": "off",
+    "no-unused-vars": "off",
+    "eqeqeq": "off",
+    "no-array-constructor": "off",
+    "no-tabs": "off",
+    "no-restricted-syntax": "off",
+    "no-restricted-globals": "off",
+    "consistent-return": "off",
+    "no-redeclare": "off",
+    "no-plusplus": "off"
+  }
 }
\ No newline at end of file
diff --git a/cartridges/int_adyen_SFRA/cartridge/client/default/js/adyen-cse.js b/cartridges/int_adyen_SFRA/cartridge/client/default/js/adyen-cse.js
index a046ef3ae..b554707da 100644
--- a/cartridges/int_adyen_SFRA/cartridge/client/default/js/adyen-cse.js
+++ b/cartridges/int_adyen_SFRA/cartridge/client/default/js/adyen-cse.js
@@ -1,5 +1,5 @@
 $('button[value="submit-payment"]').on('click', function (e) {
-    if($('#selectedPaymentOption').val() == 'CREDIT_CARD') {
+    if ($('#selectedPaymentOption').val() == 'CREDIT_CARD') {
         var cardData;
         var options = {};
         var masked = "";
@@ -7,7 +7,7 @@ $('button[value="submit-payment"]').on('click', function (e) {
         if (!$('.payment-information').data('is-new-payment')) {
             $('#selectedCardID').val($('.selected-payment').data('uuid'));
             cardData = getCardData(true);
-            options = { enableValidations: false };
+            options = {enableValidations: false};
         } else {
             $('#selectedCardID').val('');
             cardData = getCardData(false);
@@ -15,23 +15,22 @@ $('button[value="submit-payment"]').on('click', function (e) {
         }
 
         var validCard = encryptData(cardData, options);
-        if(!validCard){
+        if (!validCard) {
             return false;
         }
         $('#cardNumber').val(masked);
     }
 
-  if ($('#selectedPaymentOption').val() == 'Adyen' && $('#directoryLookup').val() == 'true' && !$("input[name='brandCode']:checked").val()) {
-      $('#requiredBrandCode').show();
-      return false;
-  }
-    if ($('#selectedPaymentOption').val() == 'Adyen' && $("input[name='brandCode']:checked").val())  {
+    if ($('#selectedPaymentOption').val() == 'Adyen' && $('#directoryLookup').val() == 'true' && !$("input[name='brandCode']:checked").val()) {
+        $('#requiredBrandCode').show();
+        return false;
+    }
+    if ($('#selectedPaymentOption').val() == 'Adyen' && $("input[name='brandCode']:checked").val()) {
         $('#adyenPaymentMethod').val($("input[name='brandCode']:checked").closest(".paymentMethod").find("label").text());
 
-        if ($("input[name='brandCode']:checked").parent().find('#issuerList').length){
+        if ($("input[name='brandCode']:checked").parent().find('#issuerList').length) {
             $('#adyenIssuerName').val($('#issuerList :selected').attr('label'));
-        }
-        else {
+        } else {
             $('#issuerList').val("");
             $('#adyenIssuerName').val("");
         }
@@ -39,37 +38,35 @@ $('button[value="submit-payment"]').on('click', function (e) {
 });
 
 $('button[value="add-new-payment"]').on('click', function (e) {
-  var cardData = getCardData(false);
-  var options = { enableValidations: true};
-  encryptData(cardData, options);
+    var cardData = getCardData(false);
+    var options = {enableValidations: true};
+    encryptData(cardData, options);
 });
 
 function getCardData(selectedCard) {
-  var cardData = {};
-  if (!selectedCard) {
-    cardData.number = $('#cardNumber').val();
-    cardData.holderName = $('#holderName').val();
-    cardData.expiryMonth = $('#expirationMonth').val();
-    cardData.expiryYear = $('#expirationYear').val();
-    cardData.cvc = $('#securityCode').val();
-  }
-  else {
-    cardData.cvc = $('.selected-payment #saved-payment-security-code').val();
-  }
-  return cardData;
+    var cardData = {};
+    if (!selectedCard) {
+        cardData.number = $('#cardNumber').val();
+        cardData.holderName = $('#holderName').val();
+        cardData.expiryMonth = $('#expirationMonth').val();
+        cardData.expiryYear = $('#expirationYear').val();
+        cardData.cvc = $('#securityCode').val();
+    } else {
+        cardData.cvc = $('.selected-payment #saved-payment-security-code').val();
+    }
+    return cardData;
 }
 
 function encryptData(cardData, options) {
-  var encryptedData = $('#adyenEncryptedData');
-  var encryptedDataValue;
-  var cseInstance = adyen.createEncryption(options);
+    var encryptedData = $('#adyenEncryptedData');
+    var encryptedDataValue;
+    var cseInstance = adyen.createEncryption(options);
     var validationResult = cseInstance.validate(cardData);
     $('#invalidCardDetails').hide();
-    if(!validationResult.valid){
+    if (!validationResult.valid) {
         showValidation(validationResult);
         return false;
-    }
-    else {
+    } else {
         cardData.generationtime = $('#adyen_generationtime').val();
         encryptedDataValue = cseInstance.encrypt(cardData);
         encryptedData.val(encryptedDataValue);
@@ -77,10 +74,10 @@ function encryptData(cardData, options) {
     }
 }
 
-function showValidation(validationResult){
+function showValidation(validationResult) {
     clearValidations();
-    for(var key in validationResult) {
-        if(validationResult[key] === false) {
+    for (var key in validationResult) {
+        if (validationResult[key] === false) {
             switch (key) {
                 case "holderName":
                     $('#holderName').addClass('is-invalid');
@@ -105,7 +102,7 @@ function showValidation(validationResult){
     $('#invalidCardDetails').show();
 }
 
-function clearValidations(){
+function clearValidations() {
     $('#holderName').removeClass('is-invalid');
     $('#cardNumber').removeClass('is-invalid');
     $('#expirationMonth').removeClass('is-invalid');
@@ -114,75 +111,75 @@ function clearValidations(){
 }
 
 function maskValue(value) {
-  if (value && value.length > 4) {
-    return value.replace(/\d(?=\d{4})/g, '*');
-  }
-  return '';
+    if (value && value.length > 4) {
+        return value.replace(/\d(?=\d{4})/g, '*');
+    }
+    return '';
 }
 
 $('button[value="submit-shipping"]').on('click', function (e) {
-  displayPaymentMethods();
+    displayPaymentMethods();
 });
 
 $(document).ready(function () {
-  displayPaymentMethods();
+    displayPaymentMethods();
 });
 
 function displayPaymentMethods() {
-  $('#paymentMethodsUl').empty();
-  if ($('#directoryLookup').val() == 'true') {
-    getPaymentMethods(function (data) {
-      jQuery.each(data.AdyenHppPaymentMethods, function (i, method) {
-        addPaymentMethod(method, data.ImagePath, data.AdyenDescriptions[i].description);
-      });
-
-      $('input[type=radio][name=brandCode]').change(function () {
-        $('.hppAdditionalFields').hide();
-        $('#extraFields_' + $(this).val()).show();
-      });
-    });
-  }
+    $('#paymentMethodsUl').empty();
+    if ($('#directoryLookup').val() == 'true') {
+        getPaymentMethods(function (data) {
+            jQuery.each(data.AdyenHppPaymentMethods, function (i, method) {
+                addPaymentMethod(method, data.ImagePath, data.AdyenDescriptions[i].description);
+            });
+
+            $('input[type=radio][name=brandCode]').change(function () {
+                $('.hppAdditionalFields').hide();
+                $('#extraFields_' + $(this).val()).show();
+            });
+        });
+    }
 }
 
 function getPaymentMethods(paymentMethods) {
-  $.ajax({
-    url: 'Adyen-GetPaymentMethods',
-    type: 'get',
-    success: function (data) {
-      paymentMethods(data);
-    }
-  });
+    $.ajax({
+        url: 'Adyen-GetPaymentMethods',
+        type: 'get',
+        success: function (data) {
+            paymentMethods(data);
+        }
+    });
 }
 
 function addPaymentMethod(paymentMethod, imagePath, description) {
-  var li = $('<li>').addClass('paymentMethod');
-  li.append($('<input>')
-    .attr('id', 'rb_' + paymentMethod.name)
-    .attr('type', 'radio')
-    .attr('name', 'brandCode')
-    .attr('value', paymentMethod.brandCode));
-  li.append($('<img>').addClass('paymentMethod_img').attr('src', imagePath + paymentMethod.brandCode + '.png'));
-  li.append($('<label>').text(paymentMethod.name).attr('for', 'rb_' + paymentMethod.name));
-  li.append($('<p>').text(description));
-
-  var additionalFields = $('<div>').addClass('hppAdditionalFields')
-    .attr('id', 'extraFields_' + paymentMethod.brandCode)
-    .attr('style', 'display:none');
-
-  if (paymentMethod.issuers) {
-    var issuers = $('<select>').attr('id', 'issuerList').attr('name', 'issuerId');
-    jQuery.each(paymentMethod.issuers, function (i, issuer) {
-      var issuer = $('<option>')
-        .attr('label', issuer.name)
-        .attr('value', issuer.issuerId);
-      issuers.append(issuer);
-    });
-    additionalFields.append(issuers);
-    li.append(additionalFields);
-  }
-  if ($('#OpenInvoiceWhiteList').val().indexOf(paymentMethod.brandCode) !== -1) {
-    // Display Additional Open Invoice fields
-    li.append(additionalFields);
-  }
-  $('#paymentMethodsUl').append(li);
-}
+    var li = $('<li>').addClass('paymentMethod');
+    li.append($('<input>')
+        .attr('id', 'rb_' + paymentMethod.name)
+        .attr('type', 'radio')
+        .attr('name', 'brandCode')
+        .attr('value', paymentMethod.brandCode));
+    li.append($('<img>').addClass('paymentMethod_img').attr('src', imagePath + paymentMethod.brandCode + '.png'));
+    li.append($('<label>').text(paymentMethod.name).attr('for', 'rb_' + paymentMethod.name));
+    li.append($('<p>').text(description));
+
+    var additionalFields = $('<div>').addClass('hppAdditionalFields')
+        .attr('id', 'extraFields_' + paymentMethod.brandCode)
+        .attr('style', 'display:none');
+
+    if (paymentMethod.issuers) {
+        var issuers = $('<select>').attr('id', 'issuerList').attr('name', 'issuerId');
+        jQuery.each(paymentMethod.issuers, function (i, issuer) {
+            var issuer = $('<option>')
+                .attr('label', issuer.name)
+                .attr('value', issuer.issuerId);
+            issuers.append(issuer);
+        });
+        additionalFields.append(issuers);
+        li.append(additionalFields);
+    }
+    if ($('#OpenInvoiceWhiteList').val().indexOf(paymentMethod.brandCode) !== -1) {
+        // Display Additional Open Invoice fields
+        li.append(additionalFields);
+    }
+    $('#paymentMethodsUl').append(li);
+}
\ No newline at end of file
diff --git a/cartridges/int_adyen_SFRA/cartridge/client/default/js/adyenCheckout.js b/cartridges/int_adyen_SFRA/cartridge/client/default/js/adyenCheckout.js
new file mode 100644
index 000000000..7837f7e6f
--- /dev/null
+++ b/cartridges/int_adyen_SFRA/cartridge/client/default/js/adyenCheckout.js
@@ -0,0 +1,436 @@
+const configuration = {
+    locale: $('#currentLocale').val(), // Defaults to en_US
+    originKey: originKey,
+    loadingContext: loadingContext
+};
+
+const checkout = new AdyenCheckout(configuration);
+const cardNode = document.getElementById('card');
+var oneClickCard = [];
+var card;
+var idealComponent;
+var afterpayComponent;
+var klarnaComponent;
+var isValid = false;
+
+getConfigurationSecureFields();
+
+$(document).ready(function () {
+    displayPaymentMethods();
+});
+
+var originKey = "";
+var loadingContext = "";
+
+function setConfigData(data, callback) {
+    originKey = data.adyenOriginKey[Object.keys(data.adyenOriginKey)[0]];
+    loadingContext = data.adyenLoadingContext;
+    callback();
+};
+
+function renderCardComponent() {
+    card = checkout.create('card', {
+        // Mandatory fields
+        originKey: originKey,
+        loadingContext: loadingContext, // The environment where we should loads the secured fields from
+        type: 'card',
+        hasHolderName: true,
+        holderNameRequired: true,
+        groupTypes: ["bcmc", "maestro", "visa", "mc", "amex", "diners", "discover"],
+
+        // Events
+        onChange: function (state) {
+            isValid = state.isValid;
+        }, // Gets triggered whenever a user changes input
+        onBrand: function (brandObject) {
+            $('#cardType').val(brandObject.brand);
+        } // Called once we detect the card brand
+    });
+    card.mount(cardNode);
+};
+
+var oneClickValid = false;
+
+function renderOneClickComponents() {
+    var componentContainers = document.getElementsByClassName("cvc-container");
+    jQuery.each(componentContainers, function (i, oneClickCardNode) {
+        var container = document.getElementById(oneClickCardNode.id);
+        var cardId = container.id.split("-")[1];
+        var brandCode = document.getElementById('cardType-' + cardId).innerText;
+
+        oneClickCard[i] = checkout.create('card', {
+            //Get selected card, send in payment request
+            originKey: originKey,
+            loadingContext: loadingContext, // The environment where we should loads the secured fields from
+            // Specific for oneClick cards
+
+            storedDetails: {
+                "card": {
+                    "expiryMonth": "",
+                    "expiryYear": "",
+                    "holderName": "",
+                    "number": ""
+                }
+            },
+            details: brandCode.includes('Bancontact') ? [] : [{"key": "cardDetails.cvc", "type": "cvc"}],
+            onChange: function (state) {
+                oneClickValid = state.isValid;
+                if (state.isValid) {
+                    $('#adyenEncryptedSecurityCode').val(state.data.encryptedSecurityCode);
+                }
+            } // Gets triggered whenever a user changes input
+        }).mount(container);
+    });
+};
+
+function getConfigurationSecureFields() {
+    $.ajax({
+        url: 'Adyen-GetConfigSecuredFields',
+        type: 'get',
+        data: {protocol: window.location.protocol},
+        success: function (data) {
+            if (!data.error) {
+                setConfigData(data, function () {
+                    renderCardComponent();
+                    renderOneClickComponents();
+                });
+            } else {
+                $('#errorLoadComponent').text(data.errorMessage);
+            }
+        }
+    });
+};
+
+$('.payment-summary .edit-button').on('click', function (e) {
+    jQuery.each(oneClickCard, function (i) {
+        oneClickCard[i].unmount();
+    });
+    renderOneClickComponents();
+    oneClickValid = false;
+});
+
+function displayPaymentMethods() {
+    $('#paymentMethodsUl').empty();
+    if ($('#directoryLookup').val() == 'true') {
+        getPaymentMethods(function (data) {
+            jQuery.each(data.AdyenHppPaymentMethods, function (i, method) {
+                addPaymentMethod(method, data.ImagePath, data.AdyenDescriptions[i].description);
+            });
+
+            $('input[type=radio][name=brandCode]').change(function () {
+                resetPaymentMethod();
+                $('#component_' + $(this).val()).show();
+            });
+        });
+    }
+};
+
+function resetPaymentMethod() {
+    $('#requiredBrandCode').hide();
+    $('#selectedIssuer').val("");
+    $('#adyenIssuerName').val("");
+    $('#dateOfBirth').val("");
+    $('#telephoneNumber').val("");
+    $('#gender').val("");
+    $('#bankAccountOwnerName').val("");
+    $('#bankAccountNumber').val("");
+    $('#bankLocationId').val("");
+    $('.additionalFields').hide();
+};
+
+function getPaymentMethods(paymentMethods) {
+    $.ajax({
+        url: 'Adyen-GetPaymentMethods',
+        type: 'get',
+        success: function (data) {
+            paymentMethods(data);
+        }
+    });
+};
+
+function addPaymentMethod(paymentMethod, imagePath, description) {
+    var li = $('<li>').addClass('paymentMethod');
+    li.append($('<input>')
+        .attr('id', 'rb_' + paymentMethod.name)
+        .attr('type', 'radio')
+        .attr('name', 'brandCode')
+        .attr('value', paymentMethod.type));
+    li.append($('<img>').addClass('paymentMethod_img').attr('src', imagePath + paymentMethod.type + '.png'));
+    li.append($('<label>').text(paymentMethod.name).attr('for', 'rb_' + paymentMethod.name));
+    li.append($('<p>').text(description));
+
+    if (paymentMethod.type == "ideal") {
+        var idealContainer = document.createElement("div");
+        $(idealContainer).addClass('additionalFields').attr('id', 'component_' + paymentMethod.type).attr('style', 'display:none');
+        idealComponent = checkout.create('ideal', {
+            details: paymentMethod.details
+        });
+        li.append(idealContainer);
+        idealComponent.mount(idealContainer);
+    }
+
+    if (paymentMethod.type.indexOf("klarna") !== -1) {
+        var klarnaContainer = document.createElement("div");
+        $(klarnaContainer).addClass('additionalFields').attr('id', 'component_' + paymentMethod.type).attr('style', 'display:none');
+        klarnaComponent = checkout.create('klarna', {
+            countryCode: $('#currentLocale').val(),
+            details: filterOutOpenInvoiceComponentDetails(paymentMethod.details),
+            visibility: {
+                personalDetails: "editable"
+            }
+        });
+        klarnaComponent.mount(klarnaContainer);
+
+        if (isNordicCountry($('#shippingCountry').val())) {
+            var ssnContainer = document.createElement("div");
+            $(ssnContainer).attr('id', 'ssn_' + paymentMethod.type);
+            var socialSecurityNumberLabel = document.createElement("span");
+            $(socialSecurityNumberLabel).text("Social Security Number").attr('class', 'adyen-checkout__label');
+            var socialSecurityNumber = document.createElement("input");
+            $(socialSecurityNumber).attr('id', 'ssnValue').attr('class', 'adyen-checkout__input').attr('type', 'text'); //.attr('maxlength', ssnLength);
+
+            ssnContainer.append(socialSecurityNumberLabel);
+            ssnContainer.append(socialSecurityNumber);
+            klarnaContainer.append(ssnContainer);
+        }
+
+        li.append(klarnaContainer);
+
+    }
+    ;
+
+    if (paymentMethod.type.indexOf("afterpay_default") !== -1) {
+        var afterpayContainer = document.createElement("div");
+        $(afterpayContainer).addClass('additionalFields').attr('id', 'component_' + paymentMethod.type).attr('style', 'display:none');
+        afterpayComponent = checkout.create('afterpay', {
+            countryCode: $('#currentLocale').val(),
+            details: filterOutOpenInvoiceComponentDetails(paymentMethod.details),
+            visibility: {
+                personalDetails: "editable"
+            }
+        });
+        li.append(afterpayContainer);
+        afterpayComponent.mount(afterpayContainer);
+    }
+    ;
+
+    if (paymentMethod.type.substring(0, 3) == "ach") {
+        var achContainer = document.createElement("div");
+        $(achContainer).addClass('additionalFields').attr('id', 'component_' + paymentMethod.type).attr('style', 'display:none');
+
+        var bankAccountOwnerNameLabel = document.createElement("span");
+        $(bankAccountOwnerNameLabel).text("Bank Account Owner Name").attr('class', 'adyen-checkout__label');
+        var bankAccountOwnerName = document.createElement("input");
+        $(bankAccountOwnerName).attr('id', 'bankAccountOwnerNameValue').attr('class', 'adyen-checkout__input').attr('type', 'text');
+
+        var bankAccountNumberLabel = document.createElement("span");
+        $(bankAccountNumberLabel).text("Bank Account Number").attr('class', 'adyen-checkout__label');
+        var bankAccountNumber = document.createElement("input");
+        $(bankAccountNumber).attr('id', 'bankAccountNumberValue').attr('class', 'adyen-checkout__input').attr('type', 'text').attr('maxlength', 17);
+
+        var bankLocationIdLabel = document.createElement("span");
+        $(bankLocationIdLabel).text("Routing Number").attr('class', 'adyen-checkout__label');
+        var bankLocationId = document.createElement("input");
+        $(bankLocationId).attr('id', 'bankLocationIdValue').attr('class', 'adyen-checkout__input').attr('type', 'text').attr('maxlength', 9);
+
+
+        achContainer.append(bankAccountOwnerNameLabel);
+        achContainer.append(bankAccountOwnerName);
+
+        achContainer.append(bankAccountNumberLabel);
+        achContainer.append(bankAccountNumber);
+
+        achContainer.append(bankLocationIdLabel);
+        achContainer.append(bankLocationId);
+
+        li.append(achContainer);
+    }
+
+    if (paymentMethod.details) {
+        if (paymentMethod.details.constructor == Array && paymentMethod.details[0].key == "issuer") {
+            var additionalFields = $('<div>').addClass('additionalFields')
+                .attr('id', 'component_' + paymentMethod.type)
+                .attr('style', 'display:none');
+
+            var issuers = $('<select>').attr('id', 'issuerList');
+            jQuery.each(paymentMethod.details[0].items, function (i, issuer) {
+                var issuer = $('<option>')
+                    .attr('label', issuer.name)
+                    .attr('value', issuer.id);
+                issuers.append(issuer);
+            });
+            additionalFields.append(issuers);
+            li.append(additionalFields);
+        }
+    }
+
+    $('#paymentMethodsUl').append(li);
+};
+
+
+//Filter fields for open invoice validation
+function filterOutOpenInvoiceComponentDetails(details) {
+    var filteredDetails = details.map(function (detail) {
+        if (detail.key == "personalDetails") {
+            var detailObject = detail.details.map(function (childDetail) {
+                if (childDetail.key == 'dateOfBirth' ||
+                    childDetail.key == 'telephoneNumber' ||
+                    childDetail.key == 'gender') {
+                    return childDetail;
+                }
+            });
+
+            if (!!detailObject) {
+                return {
+                    "key": detail.key,
+                    "type": detail.type,
+                    "details": filterUndefinedItemsInArray(detailObject)
+                };
+            }
+        }
+    });
+
+    return filterUndefinedItemsInArray(filteredDetails);
+};
+
+/**
+ * Helper function to filter out the undefined items from an array
+ * @param arr
+ * @returns {*}
+ */
+function filterUndefinedItemsInArray(arr) {
+    return arr.filter(function (item) {
+        return typeof item !== 'undefined';
+    });
+};
+
+function isNordicCountry(country) {
+    if (country === "SE" || country === "FI" || country === "DK" || country === "NO") {
+        return true;
+    }
+    return false;
+};
+
+//Submit the payment
+$('button[value="submit-payment"]').on('click', function (e) {
+    if ($('#selectedPaymentOption').val() == 'CREDIT_CARD') {
+        //new card payment
+        if ($('.payment-information').data('is-new-payment')) {
+            if (!isValid) {
+                return false;
+            } else {
+                $('#selectedCardID').val('');
+                setPaymentData();
+            }
+        }
+        //oneclick payment
+        else {
+            var uuid = $('.selected-payment').data('uuid');
+            if (!oneClickValid) {
+                return false;
+            } else {
+                var selectedCardType = document.getElementById('cardType-' + uuid).innerText;
+                document.getElementById('saved-payment-security-code-' + uuid).value = "000";
+                $('#cardType').val(selectedCardType)
+                $('#selectedCardID').val($('.selected-payment').data('uuid'));
+                return true;
+            }
+        }
+    } else if ($('#selectedPaymentOption').val() == 'Adyen') {
+        var selectedMethod = $("input[name='brandCode']:checked");
+        //no payment method selected
+        if (!adyenPaymentMethodSelected(selectedMethod.val())) {
+            $('#requiredBrandCode').show();
+            return false;
+        }
+        //check component details
+        else {
+            var componentState = checkComponentDetails(selectedMethod);
+            $('#adyenPaymentMethod').val($("input[name='brandCode']:checked").attr('id').substr(3));
+            return componentState;
+        }
+    }
+
+    return true;
+});
+
+function checkComponentDetails(selectedMethod) {
+    //set data from components
+    if (selectedMethod.val() == "ideal") {
+        if (idealComponent.componentRef.state.isValid) {
+            $('#selectedIssuer').val(idealComponent.componentRef.state.data.issuer);
+            $('#adyenIssuerName').val(idealComponent.componentRef.props.items.find(x => x.id == idealComponent.componentRef.state.data.issuer).name);
+        }
+        return idealComponent.componentRef.state.isValid;
+    } else if (selectedMethod.val().indexOf("klarna") > -1) {
+        if (klarnaComponent.componentRef.state.isValid) {
+            setOpenInvoiceData(klarnaComponent);
+            if ($('#ssnValue')) {
+                $('#socialSecurityNumber').val($('#ssnValue').val());
+            }
+        }
+        return klarnaComponent.componentRef.state.isValid;
+    } else if (selectedMethod.val().indexOf("afterpay_default") > -1) {
+        if (afterpayComponent.componentRef.state.isValid) {
+            setOpenInvoiceData(afterpayComponent);
+        }
+        return afterpayComponent.componentRef.state.isValid;
+    }
+    //if issuer is selected
+    else if (selectedMethod.closest('li').find('.additionalFields #issuerList').val()) {
+        $('#selectedIssuer').val(selectedMethod.closest('li').find('.additionalFields #issuerList').val());
+        $('#adyenIssuerName').val(selectedMethod.closest('li').find('.additionalFields #issuerList').find('option:selected').attr('label'));
+    } else if (selectedMethod.val().substring(0, 3) == "ach") {
+        $('#bankAccountOwnerName').val($('#bankAccountOwnerNameValue').val());
+        $('#bankAccountNumber').val($('#bankAccountNumberValue').val());
+        $('#bankLocationId').val($('#bankLocationIdValue').val());
+
+        if (!$('#bankLocationIdValue').val() || !$('#bankAccountNumberValue').val() || !$('#bankAccountOwnerNameValue').val()) {
+            return false;
+        }
+    }
+
+    return true;
+}
+
+function setOpenInvoiceData(component) {
+    if(component.componentRef.state.data.personalDetails){
+        if(component.componentRef.state.data.personalDetails.dateOfBirth){
+            $('#dateOfBirth').val(component.componentRef.state.data.personalDetails.dateOfBirth);
+        }
+        if(component.componentRef.state.data.personalDetails.gender){
+            $('#gender').val(component.componentRef.state.data.personalDetails.gender);
+        }
+        if(component.componentRef.state.data.personalDetails.telephoneNumber){
+            $('#telephoneNumber').val(component.componentRef.state.data.personalDetails.telephoneNumber);
+        }
+    }
+}
+
+function adyenPaymentMethodSelected(selectedMethod) {
+    if ($('#directoryLookup').val() == 'true') {
+        if (!selectedMethod) {
+            return false;
+        }
+    }
+    return true;
+}
+
+$('button[value="add-new-payment"]').on('click', function (e) {
+    setPaymentData();
+});
+
+function setPaymentData() {
+    $('#adyenEncryptedCardNumber').val(card.paymentData.encryptedCardNumber);
+    $('#adyenEncryptedExpiryMonth').val(card.paymentData.encryptedExpiryMonth);
+    $('#adyenEncryptedExpiryYear').val(card.paymentData.encryptedExpiryYear);
+    $('#adyenEncryptedSecurityCode').val(card.paymentData.encryptedSecurityCode);
+    $('#cardOwner').val(card.paymentData.holderName);
+}
+
+module.exports = {
+    methods: {
+        displayPaymentMethods: displayPaymentMethods
+    }
+};
+
diff --git a/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout.js b/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout.js
index d15bf283a..66f272be6 100644
--- a/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout.js
+++ b/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout.js
@@ -3,20 +3,20 @@
 var processInclude = require('base/util');
 
 $(document).ready(function () { // eslint-disable-line
-  var name = 'paymentError';
-  var error = (new RegExp('[?&]' + encodeURIComponent(name) + '=([^&]*)')).exec(location.search);
-  if (error) {
-    $('.error-message').show();
-    $('.error-message-text').text(decodeURIComponent(error[1]));
-  }
+    var name = 'paymentError';
+    var error = (new RegExp('[?&]' + encodeURIComponent(name) + '=([^&]*)')).exec(location.search);
+    if (error) {
+        $('.error-message').show();
+        $('.error-message-text').text(decodeURIComponent(error[1]));
+    }
 
     processInclude(require('base/checkout/checkout'));
     processInclude(require('./checkout/billing'));
     processInclude(require('./checkout/checkout'));
 
-  $('#selectedPaymentOption').val($('.payment-options .nav-item .active').parent().attr('data-method-id'));
+    $('#selectedPaymentOption').val($('.payment-options .nav-item .active').parent().attr('data-method-id'));
 });
 
 $('.payment-options .nav-link').click(function () {
-  $('#selectedPaymentOption').val($(this).parent().attr('data-method-id'));
+    $('#selectedPaymentOption').val($(this).parent().attr('data-method-id'));
 });
\ No newline at end of file
diff --git a/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout/billing.js b/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout/billing.js
index 5d421f4e4..74d47fa99 100644
--- a/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout/billing.js
+++ b/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout/billing.js
@@ -11,22 +11,30 @@ function updatePaymentInformation(order) {
 
     if (order.billing.payment && order.billing.payment.selectedPaymentInstruments
         && order.billing.payment.selectedPaymentInstruments.length > 0) {
-
-        if(order.billing.payment.selectedPaymentInstruments[0].paymentMethod == "CREDIT_CARD"){
+        if (order.billing.payment.selectedPaymentInstruments[0].paymentMethod == "CREDIT_CARD") {
             htmlToAppend += '<span>' + order.resources.cardType + ' '
                 + order.billing.payment.selectedPaymentInstruments[0].type
-                + '</span><div>'
-                + order.billing.payment.selectedPaymentInstruments[0].maskedCreditCardNumber
-                + '</div><div><span>'
-                + order.resources.cardEnding + ' '
-                + order.billing.payment.selectedPaymentInstruments[0].expirationMonth
-                + '/' + order.billing.payment.selectedPaymentInstruments[0].expirationYear
-                + '</span></div>';
-        }
-        else if(order.billing.payment.selectedPaymentInstruments[0].paymentMethod == "Adyen"){
-            htmlToAppend += '<span>'
-                + order.billing.payment.selectedPaymentInstruments[0].selectedAdyenPM
                 + '</span>';
+
+            if (order.billing.payment.selectedPaymentInstruments[0].maskedCreditCardNumber != null && order.billing.payment.selectedPaymentInstruments[0].expirationMonth != null) {
+                htmlToAppend += '<div>'
+                    + order.billing.payment.selectedPaymentInstruments[0].maskedCreditCardNumber
+                    + '</div><div><span>'
+                    + order.resources.cardEnding + ' '
+                    + order.billing.payment.selectedPaymentInstruments[0].expirationMonth
+                    + '/' + order.billing.payment.selectedPaymentInstruments[0].expirationYear
+                    + '</span></div>';
+            }
+        } else if (order.billing.payment.selectedPaymentInstruments[0].paymentMethod == "Adyen") {
+            htmlToAppend += '<div><span>'
+                + order.billing.payment.selectedPaymentInstruments[0].selectedAdyenPM
+                + '</span></div>';
+
+            if (typeof order.billing.payment.selectedPaymentInstruments[0].selectedIssuerName !== "undefined") {
+                htmlToAppend += '<div><span>'
+                    + order.billing.payment.selectedPaymentInstruments[0].selectedIssuerName
+                    + '</span></div>';
+            }
         }
     }
 
diff --git a/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout/checkout.js b/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout/checkout.js
index 8598085b6..1ac33b1cc 100644
--- a/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout/checkout.js
+++ b/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout/checkout.js
@@ -2,6 +2,7 @@ var shippingHelpers = require('base/checkout/shipping');
 var billingHelpers = require('base/checkout/billing');
 var summaryHelpers = require('base/checkout/summary');
 var billing = require('./billing');
+var adyenCheckout = require('../adyenCheckout');
 
 module.exports = {
     updateCheckoutView: function () {
@@ -16,6 +17,7 @@ module.exports = {
                     data.options
                 );
             });
+            adyenCheckout.methods.displayPaymentMethods();
             billingHelpers.methods.updateBillingInformation(
                 data.order,
                 data.customer,
diff --git a/cartridges/int_adyen_SFRA/cartridge/client/default/scss/adyen-checkout-2.1.0.scss b/cartridges/int_adyen_SFRA/cartridge/client/default/scss/adyen-checkout-2.1.0.scss
new file mode 100644
index 000000000..5f7fb9024
--- /dev/null
+++ b/cartridges/int_adyen_SFRA/cartridge/client/default/scss/adyen-checkout-2.1.0.scss
@@ -0,0 +1,987 @@
+.adyen-checkout__spinner__wrapper {
+  align-items: center;
+  display: flex;
+  height: 100%;
+  justify-content: center
+}
+
+.adyen-checkout__spinner__wrapper--inline {
+  display: inline-block;
+  height: auto;
+  margin-right: 8px
+}
+
+.adyen-checkout__spinner {
+  -webkit-animation: rotateSpinner 2s infinite linear;
+  animation: rotateSpinner 2s infinite linear;
+  border: 2px solid #00a3ff;
+  border-radius: 50%;
+  border-top-color: transparent;
+  height: 43px;
+  width: 43px
+}
+
+.adyen-checkout__spinner--large {
+  height: 43px;
+  width: 43px
+}
+
+.adyen-checkout__spinner--small {
+  height: 16px;
+  width: 16px
+}
+
+.adyen-checkout__spinner--medium {
+  height: 28px;
+  width: 28px
+}
+
+@-webkit-keyframes rotateSpinner {
+  0% {
+    -webkit-transform: rotate(0deg);
+    transform: rotate(0deg)
+  }
+  to {
+    -webkit-transform: rotate(1turn);
+    transform: rotate(1turn)
+  }
+}
+
+@keyframes rotateSpinner {
+  0% {
+    -webkit-transform: rotate(0deg);
+    transform: rotate(0deg)
+  }
+  to {
+    -webkit-transform: rotate(1turn);
+    transform: rotate(1turn)
+  }
+}
+
+.adyen-checkout__pay-button {
+  background: #001b2b;
+  border: 0;
+  border-radius: 3px;
+  box-shadow: 0 3px 4px rgba(0, 15, 45, .2);
+  color: #fff;
+  cursor: pointer;
+  font-size: 1em;
+  font-weight: 700;
+  height: 48px;
+  padding: 15px;
+  transition: background .3s ease-out;
+  width: 100%
+}
+
+.adyen-checkout__pay-button:disabled {
+  -moz-user-select: all;
+  -ms-user-select: all;
+  -webkit-user-select: all;
+  background: #e6e9eb;
+  box-shadow: none;
+  cursor: not-allowed;
+  user-select: all
+}
+
+.adyen-checkout__pay-button--loading {
+  -moz-user-select: none;
+  -ms-user-select: none;
+  -webkit-user-select: none;
+  background: #4c5f6b;
+  box-shadow: none;
+  outline: 0;
+  pointer-events: none;
+  user-select: none
+}
+
+.adyen-checkout__pay-button .adyen-checkout__spinner {
+  border-color: transparent #fff #fff;
+  border-width: 3px
+}
+
+.adyen-checkout__pay-button__content {
+  align-items: center;
+  display: flex;
+  justify-content: center
+}
+
+.adyen-checkout__payment-method {
+  background: #fff;
+  border: 1px solid #edf0f3;
+  cursor: pointer;
+  margin-top: -1px;
+  position: relative;
+  transition: opacity .3s ease-out;
+  width: 100%
+}
+
+.adyen-checkout__payment-method:focus {
+  outline: 0
+}
+
+.adyen-checkout__payment-method--selected + .adyen-checkout__payment-method, .adyen-checkout__payment-method:first-child {
+  border-top-left-radius: 3px;
+  border-top-right-radius: 3px;
+  margin-top: 0
+}
+
+.adyen-checkout__payment-method--next-selected {
+  border-bottom-left-radius: 3px;
+  border-bottom-right-radius: 3px
+}
+
+.adyen-checkout__payment-method--loading {
+  opacity: .2
+}
+
+.adyen-checkout__payment-method--selected.adyen-checkout__payment-method--loading {
+  opacity: .9
+}
+
+.adyen-checkout__payment-method--disabling {
+  opacity: .5
+}
+
+.adyen-checkout__payment-method__header {
+  align-items: center;
+  color: #00202e;
+  display: flex;
+  font-size: 16px;
+  font-weight: 400;
+  padding: 16px;
+  position: relative;
+  transition: background .1s ease-out;
+  width: 100%
+}
+
+.adyen-checkout__payment-method__surcharge {
+  color: #687282;
+  margin-left: 5px
+}
+
+.adyen-checkout__payment-method--selected {
+  background: #f7f8f9;
+  border: 1px solid #d4d9db;
+  border-radius: 3px;
+  cursor: default;
+  margin: 8px 0;
+  transition: margin .15s cubic-bezier(.4, 0, .2, 1) 0ms, opacity .3s ease-out
+}
+
+.adyen-checkout__payment-method--selected .adyen-checkout__payment-method__header {
+  font-weight: 500
+}
+
+.adyen-checkout__payment-method__details {
+  padding: 0 16px 16px
+}
+
+.adyen-checkout__payment-method__details__content {
+  padding: 6px 0 24px
+}
+
+.adyen-checkout__payment-method__image__wrapper {
+  height: 26px;
+  position: relative
+}
+
+.adyen-checkout__payment-method__image__wrapper:after {
+  border: 1px solid rgba(0, 27, 43, .17);
+  border-radius: 3px;
+  content: "";
+  height: 100%;
+  left: 0;
+  position: absolute;
+  top: 0;
+  width: 100%
+}
+
+.adyen-checkout__payment-method__image {
+  border-radius: 3px
+}
+
+.adyen-checkout__payment-method__disable_oneclick {
+  background-color: transparent;
+  border: none;
+  color: #687282;
+  cursor: pointer;
+  display: block;
+  font-size: 13px;
+  padding: 0;
+  position: absolute;
+  right: 70px;
+  text-decoration: underline
+}
+
+.adyen-checkout__payment-method__disable_oneclick:focus {
+  color: #00a3ff;
+  outline: 0
+}
+
+.adyen-checkout__payment-method__disable-confirmation {
+  align-items: center;
+  background: #e6e9eb;
+  color: #001b2b;
+  display: flex;
+  font-size: 15px;
+  justify-content: space-between;
+  margin-bottom: 10px;
+  padding: 8px 16px
+}
+
+.adyen-checkout__payment-method__disable-confirmation__buttons {
+  display: flex
+}
+
+.adyen-checkout__payment-method__disable-confirmation__button {
+  border: 1px solid transparent;
+  border-radius: 3px;
+  cursor: pointer;
+  font-size: 13px;
+  line-height: 15px;
+  margin: 0 0 0 8px;
+  padding: 8px
+}
+
+.adyen-checkout__payment-method__disable-confirmation__button--remove {
+  background: #d10244;
+  border-color: #d10244;
+  color: #fff
+}
+
+.adyen-checkout__payment-method__disable-confirmation__button--cancel {
+  background: transparent;
+  border-color: #001b2b;
+  color: #001b2b
+}
+
+.adyen-checkout__payment-method__radio {
+  background-color: #fff;
+  border: 1px solid #b9c4c9;
+  border-radius: 50%;
+  box-shadow: inset 0 1px 3px rgba(0, 27, 43, .15);
+  height: 18px;
+  position: absolute;
+  right: 20px;
+  transition: border-color .3s ease-out;
+  width: 18px
+}
+
+.adyen-checkout__payment-method__radio:after {
+  -webkit-transform: translateY(-50%) scale(0);
+  background-color: #fff;
+  border-radius: 50%;
+  box-shadow: 0 1px 1px rgba(0, 15, 45, .25);
+  content: "";
+  display: block;
+  height: 6px;
+  left: 0;
+  margin: 0 auto;
+  position: absolute;
+  right: 0;
+  top: 50%;
+  transform: translateY(-50%) scale(0);
+  transition: -webkit-transform .3s ease-out;
+  transition: transform .3s ease-out;
+  transition: transform .3s ease-out, -webkit-transform .3s ease-out;
+  width: 6px
+}
+
+.adyen-checkout__payment-method__radio:hover {
+  border-color: #00a3ff;
+  cursor: pointer
+}
+
+.adyen-checkout__payment-method__radio--selected {
+  background-color: #00a3ff;
+  border: 0 solid transparent;
+  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .26);
+  transition: all .3s ease-out
+}
+
+.adyen-checkout__payment-method__radio--selected:after {
+  -webkit-transform: translateY(-50%) scale(1);
+  transform: translateY(-50%) scale(1)
+}
+
+.adyen-checkout__field {
+  display: block;
+  margin-bottom: 16px
+}
+
+.adyen-checkout__field--error input {
+  border-color: #d81b4a;
+  color: #d81b4a
+}
+
+.adyen-checkout__field:last-child {
+  margin-bottom: 0
+}
+
+.adyen-checkout__helper-text, .adyen-checkout__label__text {
+  color: #001b2b;
+  display: block;
+  font-size: 13px;
+  font-weight: 400;
+  line-height: 13px;
+  padding-bottom: 8px
+}
+
+.adyen-checkout__helper-text {
+  color: #687282
+}
+
+.adyen-checkout__label__text {
+  transition: color .2s ease-out
+}
+
+.adyen-checkout__label--focused .adyen-checkout__label__text {
+  color: #07b
+}
+
+.adyen-checkout__error-text, .adyen-checkout__label__text--error {
+  align-items: center;
+  color: #d0021b;
+  display: flex;
+  font-size: 12px;
+  font-weight: 400;
+  margin-top: 4px
+}
+
+.adyen-checkout__icon svg {
+  fill: currentColor
+}
+
+.adyen-checkout__open-invoice .adyen-checkout__input--wrapper--socialSecurityNumber + .adyen-checkout__error-text {
+  max-width: 380px
+}
+
+.adyen-checkout__radio_group + .adyen-checkout-input__inline-validation {
+  display: none
+}
+
+.adyen-checkout__radio_group__input {
+  opacity: 0;
+  position: absolute
+}
+
+.adyen-checkout__radio_group__label {
+  display: block;
+  font-size: 13px;
+  font-weight: 400;
+  line-height: 16px;
+  margin-bottom: 8px;
+  padding-bottom: 0;
+  padding-left: 24px;
+  position: relative
+}
+
+.adyen-checkout__radio_group__label:before {
+  background-color: #fff;
+  border: 1px solid #b9c4c9;
+  border-radius: 50%;
+  content: "";
+  height: 16px;
+  left: 0;
+  position: absolute;
+  top: 0;
+  transition: border-color .3s ease-out;
+  width: 16px
+}
+
+.adyen-checkout__radio_group__label:after {
+  -webkit-transform: scale(0);
+  background-color: #fff;
+  border-radius: 50%;
+  box-shadow: 0 1px 1px rgba(0, 15, 45, .25);
+  content: "";
+  display: block;
+  height: 6px;
+  left: 5px;
+  margin: 0 auto;
+  position: absolute;
+  top: 5px;
+  transform: scale(0);
+  transition: -webkit-transform .3s ease-out;
+  transition: transform .3s ease-out;
+  transition: transform .3s ease-out, -webkit-transform .3s ease-out;
+  width: 6px
+}
+
+.adyen-checkout__radio_group__label:hover {
+  border-color: #00a3ff;
+  cursor: pointer
+}
+
+.adyen-checkout__radio_group__input:checked + .adyen-checkout__radio_group__label:before, .adyen-checkout__radio_group__label--selected {
+  background-color: #00a3ff;
+  border: 0 solid transparent;
+  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .26);
+  transition: all .3s ease-out
+}
+
+.adyen-checkout__radio_group__input:checked + .adyen-checkout__radio_group__label:after {
+  -webkit-transform: scale(1);
+  transform: scale(1)
+}
+
+.adyen-checkout__radio_group__label.adyen-checkout__radio_group__label--invalid:before {
+  border: 1px solid #d10244
+}
+
+.adyen-checkout__checkbox {
+  display: block
+}
+
+.adyen-checkout__checkbox > input[type=checkbox] {
+  opacity: 0;
+  pointer-events: none;
+  position: absolute
+}
+
+.adyen-checkout__checkbox__label {
+  -moz-user-select: none;
+  -ms-user-select: none;
+  -webkit-user-select: none;
+  color: #001b2b;
+  cursor: pointer;
+  display: inline-block;
+  font-size: 13px;
+  font-weight: 400;
+  line-height: 16px;
+  padding-left: 24px;
+  position: relative;
+  user-select: none
+}
+
+.adyen-checkout__checkbox__input + span:before {
+  -webkit-transform: rotate(37deg);
+  -webkit-transform-origin: 100% 100%;
+  border-color: transparent #fff #fff transparent;
+  border-radius: 0 2px 1px 2px;
+  border-style: solid;
+  border-width: 1px 2px 2px 1px;
+  content: "";
+  height: 11px;
+  left: 1px;
+  opacity: 0;
+  position: absolute;
+  top: 2px;
+  transform: rotate(37deg);
+  transform-origin: 100% 100%;
+  transition: opacity .2s ease-out;
+  width: 6px;
+  z-index: 1
+}
+
+.adyen-checkout__checkbox__input:checked + .adyen-checkout__checkbox__label:before {
+  opacity: 1
+}
+
+.adyen-checkout__checkbox__input + .adyen-checkout__checkbox__label:after {
+  background-color: #fff;
+  border: 1px solid #b9c4c9;
+  border-radius: 3px;
+  content: "";
+  height: 16px;
+  left: 0;
+  position: absolute;
+  top: 0;
+  transition: background .15s ease-out, border .05s ease-out, box-shadow .1s ease-out;
+  width: 16px;
+  z-index: 0
+}
+
+.adyen-checkout__checkbox__input:checked + .adyen-checkout__checkbox__label:after {
+  background-color: #00a3ff;
+  border: 1px solid #00a3ff
+}
+
+.adyen-checkout__checkbox__input:focus + span:after {
+  border: 1px solid #00a3ff;
+  box-shadow: 0 0 0 2px #91d7ff
+}
+
+.adyen-checkout__checkbox__input.adyen-checkout__checkbox__input--invalid + .adyen-checkout__checkbox__label:after {
+  border: 1px solid #d10244
+}
+
+.adyen-checkout__dropdown {
+  font-size: 16px;
+  max-width: 100%;
+  width: 200px
+}
+
+.adyen-checkout__dropdown--small {
+  width: 130px
+}
+
+.adyen-checkout__dropdown--large {
+  width: 300px
+}
+
+.adyen-checkout__dropdown__button {
+  background: #fff;
+  border: 1px solid #b9c4c9;
+  border-radius: 3px;
+  font-size: 16px;
+  height: 40px;
+  line-height: 20px;
+  outline: 0;
+  padding: 9px 20px 9px 8px;
+  transition: border .2s ease-out, box-shadow .2s ease-out;
+  width: 100%
+}
+
+.adyen-checkout__dropdown__button__icon {
+  margin-right: 8px;
+  max-height: 20px;
+  max-width: 32px
+}
+
+.adyen-checkout__dropdown__button--active, .adyen-checkout__dropdown__button:active, .adyen-checkout__dropdown__button:focus {
+  border-color: #00a3ff;
+  box-shadow: 0 0 0 2px #91d7ff
+}
+
+.adyen-checkout__dropdown__button--readonly, .adyen-checkout__dropdown__button--readonly.adyen-checkout__dropdown__button--active {
+  background: #e6e9eb;
+  color: #001b2b;
+  cursor: not-allowed
+}
+
+.adyen-checkout__dropdown__button--invalid {
+  border-color: #d10244
+}
+
+.adyen-checkout__dropdown__button__text {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap
+}
+
+.adyen-checkout__dropdown__list {
+  border-radius: 3px;
+  box-shadow: 0 2px 7px rgba(0, 15, 45, .3);
+  margin-top: 2px;
+  z-index: 2
+}
+
+.adyen-checkout__dropdown__list.adyen-checkout__dropdown__list--active {
+  -webkit-animation: expand .1s ease-out;
+  animation: expand .1s ease-out
+}
+
+.adyen-checkout__dropdown__element {
+  -ms-hyphens: auto;
+  -webkit-hyphens: auto;
+  border: 1px solid transparent;
+  border-bottom-color: #e6e9eb;
+  cursor: pointer;
+  hyphens: auto;
+  line-height: 20px;
+  outline: 0;
+  padding: 8px;
+  transition: background .2s ease-out, border-color .2s ease-out;
+  word-break: break-word
+}
+
+.adyen-checkout__dropdown__element:last-child {
+  border-bottom: 0
+}
+
+.adyen-checkout__dropdown__element:active, .adyen-checkout__dropdown__element:focus, .adyen-checkout__dropdown__element:hover {
+  background: #f0f2f4
+}
+
+.adyen-checkout__dropdown__element:active, .adyen-checkout__dropdown__element:focus {
+  border-bottom-color: #00a3ff;
+  border-top-color: #00a3ff
+}
+
+.adyen-checkout__dropdown__element__icon {
+  margin-right: 8px;
+  max-height: 20px;
+  max-width: 32px
+}
+
+@-webkit-keyframes expand {
+  0% {
+    -webkit-transform: scaleY(0);
+    transform: scaleY(0)
+  }
+  to {
+    -webkit-transform: scaleX(1);
+    transform: scaleX(1)
+  }
+}
+
+@keyframes expand {
+  0% {
+    -webkit-transform: scaleY(0);
+    transform: scaleY(0)
+  }
+  to {
+    -webkit-transform: scaleX(1);
+    transform: scaleX(1)
+  }
+}
+
+.adyen-checkout__dropdown + .adyen-checkout-input__inline-validation {
+  right: 32px
+}
+
+.adyen-checkout__select-list {
+  margin: 0;
+  padding: 0
+}
+
+.adyen-checkout__select-list__item {
+  background: #fff;
+  border-top: 1px solid #b9c4c9;
+  cursor: pointer;
+  display: inline-block;
+  font-size: 16px;
+  line-height: 20px;
+  outline: 0;
+  padding: 9px;
+  width: 100%
+}
+
+.adyen-checkout__select-list__item:first-child {
+  border-top: 0
+}
+
+.adyen-checkout__select-list__item:active, .adyen-checkout__select-list__item:focus, .adyen-checkout__select-list__item:hover {
+  background: rgba(145, 215, 255, .5)
+}
+
+.adyen-checkout__select-list__item--selected {
+  background: rgba(145, 215, 255, .5);
+  font-weight: 700
+}
+
+.adyen-checkout__input {
+  background: #fff;
+  border: 1px solid #b9c4c9;
+  border-radius: 3px;
+  color: #001b2b;
+  display: block;
+  font-family: inherit;
+  font-size: 16px;
+  height: 40px;
+  outline: none;
+  padding: 5px 8px;
+  position: relative;
+  transition: border .2s ease-out, box-shadow .2s ease-out;
+  width: 200px
+}
+
+.adyen-checkout__input:required {
+  box-shadow: none
+}
+
+.adyen-checkout__input--wrapper {
+  display: inline-block;
+  position: relative
+}
+
+.adyen-checkout__input--wrapper--block {
+  display: block
+}
+
+.adyen-checkout-input__inline-validation {
+  -webkit-transform: translateY(-50%);
+  height: 16px;
+  position: absolute;
+  right: 14px;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 16px
+}
+
+.adyen-checkout-input__inline-validation--valid {
+  color: #039450
+}
+
+.adyen-checkout-input__inline-validation--invalid {
+  color: #d10244
+}
+
+.adyen-checkout__input.adyen-checkout__input--small {
+  width: 130px
+}
+
+.adyen-checkout__input.adyen-checkout__input--large {
+  width: 300px
+}
+
+.adyen-checkout__input.adyen-checkout__input--invalid {
+  border-color: #d10244
+}
+
+.adyen-checkout__input.adyen-checkout__input--valid {
+  border-bottom-color: #04ba65
+}
+
+.adyen-checkout__input--error {
+  border-color: #d0021b
+}
+
+.adyen-checkout__input::-webkit-input-placeholder {
+  color: #90a2bd;
+  font-weight: 200
+}
+
+.adyen-checkout__input::-ms-input-placeholder {
+  color: #90a2bd;
+  font-weight: 200
+}
+
+.adyen-checkout__input::placeholder {
+  color: #90a2bd;
+  font-weight: 200
+}
+
+.adyen-checkout__input--active, .adyen-checkout__input:active, .adyen-checkout__input:focus {
+  border: 1px solid #00a3ff;
+  box-shadow: 0 0 0 2px #91d7ff
+}
+
+.adyen-checkout__input[readonly] {
+  background-color: #e6e9eb;
+  border-color: transparent;
+  color: #687282;
+  cursor: default
+}
+
+.adyen-checkout__fieldset {
+  color: #687282;
+  display: block;
+  padding-bottom: 30px;
+  width: 100%
+}
+
+.adyen-checkout__fieldset__title {
+  color: #687282;
+  display: block;
+  font-size: 11px;
+  font-weight: 700;
+  letter-spacing: 1px;
+  margin: 0;
+  padding: 0 0 20px;
+  text-transform: uppercase
+}
+
+.adyen-checkout__fieldset--readonly {
+  color: #001b2b;
+  font-size: 13px;
+  line-height: 19px;
+  margin: 0
+}
+
+.adyen-checkout__open-invoice .adyen-checkout__checkbox--consent-checkbox {
+  max-width: 540px
+}
+
+.adyen-checkout__open-invoice .adyen-checkout__checkbox + .adyen-checkout__open-invoice .adyen-checkout__fieldset {
+  padding-top: 30px
+}
+
+.adyen-checkout__open-invoice .adyen-checkout__checkbox {
+  margin: 0 0 20px
+}
+
+.adyen-checkout__applepay__button {
+  height: 40px;
+  width: 240px
+}
+
+.adyen-checkout__card-input__form {
+  transition: opacity .25s ease-out
+}
+
+.adyen-checkout__card__exp-cvc {
+  display: flex
+}
+
+.adyen-checkout__card__cardNumber {
+  max-width: 400px
+}
+
+.adyen-checkout__card__cardNumber__input {
+  padding: 5px 8px 5px 57px
+}
+
+.adyen-checkout__card__exp-date__input--oneclick {
+  font-weight: 400;
+  height: 40px;
+  line-height: 40px
+}
+
+.adyen-checkout__card__exp-cvc .adyen-checkout__field {
+  margin-bottom: 0;
+  margin-right: 24px
+}
+
+.adyen-checkout__card-input .adyen-checkout__store-details {
+  margin-top: 16px
+}
+
+.adyen-checkout__giropay__results {
+  background: #fff;
+  border: 1px solid #b9c4c9;
+  border-radius: 4px;
+  max-height: 140px;
+  min-height: 100px;
+  overflow-y: scroll;
+  width: 100%
+}
+
+.adyen-checkout__giropay__no-results {
+  color: #687282;
+  display: block;
+  font-size: 13px;
+  padding: 0 0 0 2px
+}
+
+.adyen-checkout__giropay__placeholder {
+  color: #90a2bd;
+  display: block;
+  font-weight: 200;
+  padding: 0 0 0 2px
+}
+
+.adyen-checkout__giropay__loading {
+  display: block;
+  min-height: 100px
+}
+
+.adyen-checkout__giropay__loading .adyen-checkout__spinner__wrapper {
+  display: inline-block;
+  vertical-align: middle
+}
+
+.adyen-checkout__giropay__loading-text {
+  color: #687282;
+  font-size: 13px;
+  line-height: 16px;
+  vertical-align: middle
+}
+
+.adyen-checkout__giropay__error {
+  color: #d0021b;
+  font-size: 13px
+}
+
+.adyen-checkout__phone-input {
+  display: flex
+}
+
+.adyen-checkout__phone-input__prefix {
+  margin-right: .5em
+}
+
+.adyen-checkout__phone-input .adyen-checkout__field {
+  margin-bottom: 0
+}
+
+.adyen-checkout__iban-input__number {
+  padding: 5px 36px 5px 8px;
+  text-transform: uppercase
+}
+
+.adyen-checkout__wechatpay {
+  background: #fff;
+  border: 1px solid #dde1e3;
+  border-radius: 3px;
+  min-height: 443px;
+  padding: 40px;
+  text-align: center
+}
+
+.adyen-checkout__wechatpay__brand-logo {
+  height: 20px;
+  width: 109px
+}
+
+.adyen-checkout__wechatpay__subtitle {
+  margin-top: 32px
+}
+
+.adyen-checkout__wechatpay__payment_amount, .adyen-checkout__wechatpay__subtitle {
+  color: #001b2b;
+  font-size: 16px;
+  line-height: 19px
+}
+
+.adyen-checkout__wechatpay__progress {
+  background: #d4d9db;
+  border-radius: 25px;
+  height: 4px;
+  margin: 32px auto 12px;
+  padding-right: 3%;
+  width: 152px
+}
+
+.adyen-checkout__wechatpay__progress > span {
+  background: #00a3ff;
+  border-radius: 25px;
+  display: block;
+  height: 100%
+}
+
+.adyen-checkout__wechatpay__countdown {
+  color: #687282;
+  font-size: 13px
+}
+
+.adyen-checkout__wechatpay .adyen-checkout__spinner__wrapper {
+  margin: 60px 0
+}
+
+.adyen-checkout__alert {
+  align-items: flex-start;
+  background-color: #00a3ff;
+  border-radius: 3px;
+  color: #fff;
+  display: flex;
+  justify-content: space-between;
+  line-height: 1;
+  margin: 0;
+  padding: 12px
+}
+
+.adyen-checkout__alert--error {
+  background-color: #d81b4a
+}
+
+.adyen-checkout__alert--success {
+  background-color: #0abf53
+}
+
+.adyen-checkout__alert--info {
+  background-color: #00a3ff
+}
+
+.adyen-checkout__sdk, .adyen-checkout__sdk *, .adyen-checkout__sdk * :before, .adyen-checkout__sdk :after {
+  box-sizing: border-box
+}
+
+.adyen-checkout__payment-methods-list {
+  border-radius: 3px
+}
+
+.adyen-checkout__payment-methods-list--loading {
+  -moz-user-select: none;
+  -ms-user-select: none;
+  -webkit-user-select: none;
+  pointer-events: none;
+  user-select: none
+}
+
+.adyen-checkout__link {
+  color: #687282;
+  font-size: 13px;
+  text-decoration: underline
+}
\ No newline at end of file
diff --git a/cartridges/int_adyen_SFRA/cartridge/client/default/scss/adyenCss.scss b/cartridges/int_adyen_SFRA/cartridge/client/default/scss/adyenCss.scss
index 37659e814..2677bad36 100644
--- a/cartridges/int_adyen_SFRA/cartridge/client/default/scss/adyenCss.scss
+++ b/cartridges/int_adyen_SFRA/cartridge/client/default/scss/adyenCss.scss
@@ -1,13 +1,30 @@
 .paymentMethod {
-    list-style-type: none;
-    margin: 10px 0 10px 0;
+  list-style-type: none;
+  margin: 10px 0 10px 0;
 }
 
-.paymentMethod_img{
-    margin: 0 5px 0 5px;
+.paymentMethod_img {
+  margin: 0 5px 0 5px;
 }
 
-.hppAdditionalFields{
-    display: inline-block;
-    margin: 0 0 0 10px;
-}
\ No newline at end of file
+.additionalFields {
+  display: inline-block;
+  margin: 0 0 0 10px;
+  width: 100%;
+}
+
+.security-code-input .adyen-checkout__label__text {
+  display: none !important;
+}
+
+.security-code-input .adyen-checkout__card__exp-date__input--oneclick {
+  display: none !important;
+}
+
+.security-code-input .adyen-checkout__field {
+  margin: 0 !important;
+}
+
+.security-code-input .adyen-checkout__card__exp-cvc .adyen-checkout__field:first-child {
+  display: none;
+}
diff --git a/cartridges/int_adyen_SFRA/cartridge/controllers/Account.js b/cartridges/int_adyen_SFRA/cartridge/controllers/Account.js
index 6184826e3..483a377fd 100644
--- a/cartridges/int_adyen_SFRA/cartridge/controllers/Account.js
+++ b/cartridges/int_adyen_SFRA/cartridge/controllers/Account.js
@@ -7,14 +7,14 @@ var userLoggedIn = require('*/cartridge/scripts/middleware/userLoggedIn');
 var consentTracking = require('*/cartridge/scripts/middleware/consentTracking');
 
 server.append(
-  'Show',
-  server.middleware.https,
-  userLoggedIn.validateLoggedIn,
-  consentTracking.consent,
-  function (req, res, next) {
-    require('int_adyen_overlay/cartridge/scripts/UpdateSavedCards').updateSavedCards({ CurrentCustomer: req.currentCustomer.raw });
-    next();
-  }
+    'Show',
+    server.middleware.https,
+    userLoggedIn.validateLoggedIn,
+    consentTracking.consent,
+    function (req, res, next) {
+        require('int_adyen_overlay/cartridge/scripts/UpdateSavedCards').updateSavedCards({CurrentCustomer: req.currentCustomer.raw});
+        next();
+    }
 );
 
 module.exports = server.exports();
diff --git a/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js b/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js
index ec858296d..03799584f 100644
--- a/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js
+++ b/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js
@@ -7,216 +7,238 @@ var COHelpers = require('*/cartridge/scripts/checkout/checkoutHelpers');
 var adyenHelpers = require('*/cartridge/scripts/checkout/adyenHelpers');
 var OrderMgr = require('dw/order/OrderMgr');
 var Resource = require('dw/web/Resource');
+var Site = require('dw/system/Site');
 var Logger = require('dw/system/Logger');
+var adyenHelper = require('*/cartridge/scripts/util/AdyenHelper');
 
 const EXTERNAL_PLATFORM_VERSION = "SFRA";
 
 server.get('Adyen3D', server.middleware.https, function (req, res, next) {
-  var IssuerURL = req.querystring.IssuerURL;
-  var PaRequest = req.querystring.PaRequest;
-  var MD = req.querystring.MD;
-  var TermURL = URLUtils.https('Adyen-AuthorizeWithForm');
-
-  res.render('adyenform', {
-    issuerUrl: IssuerURL,
-    paRequest: PaRequest,
-    md: MD,
-    ContinueURL: TermURL
-  });
-  next();
+    var IssuerURL = req.querystring.IssuerURL;
+    var PaRequest = req.querystring.PaRequest;
+    var MD = req.querystring.MD;
+    var TermURL = URLUtils.https('Adyen-AuthorizeWithForm');
+
+    res.render('adyenform', {
+        issuerUrl: IssuerURL,
+        paRequest: PaRequest,
+        md: MD,
+        ContinueURL: TermURL
+    });
+    next();
 });
 
 server.post('AuthorizeWithForm', server.middleware.https, function (req, res, next) {
-  var adyen3DVerification = require('int_adyen_overlay/cartridge/scripts/adyen3DVerification');
-  var paymentInstrument;
-  var order;
-
-  if(session.custom.orderNo && session.custom.paymentMethod) {
-    try {
-      order = OrderMgr.getOrder(session.custom.orderNo);
-      paymentInstrument = order.getPaymentInstruments(session.custom.paymentMethod)[0];
-    }
-    catch(e){
-      Logger.getLogger("Adyen").error("Unable to retrieve order data from session.");
-      res.redirect(URLUtils.url('Checkout-Begin', 'stage', 'payment', 'paymentError', Resource.msg('error.payment.not.valid', 'checkout', null)));
-      return next();
+    var adyenCheckout = require('int_adyen_overlay/cartridge/scripts/adyenCheckout');
+    var paymentInstrument;
+    var order;
+
+    if (session.custom.orderNo && session.custom.paymentMethod) {
+        try {
+            order = OrderMgr.getOrder(session.custom.orderNo);
+            paymentInstrument = order.getPaymentInstruments(session.custom.paymentMethod)[0];
+        } catch (e) {
+            Logger.getLogger("Adyen").error("Unable to retrieve order data from session.");
+            res.redirect(URLUtils.url('Checkout-Begin', 'stage', 'payment', 'paymentError', Resource.msg('error.payment.not.valid', 'checkout', null)));
+            return next();
+        }
+
+        if (session.custom.MD == req.form.MD) {
+            var jsonRequest = {
+                "paymentData": paymentInstrument.custom.adyenPaymentData,
+                "details": {
+                    "MD": req.form.MD,
+                    "PaRes": req.form.PaRes
+                }
+            };
+            var result = adyenCheckout.doPaymentDetailsCall(jsonRequest);
+            Transaction.wrap(function () {
+                paymentInstrument.custom.adyenPaymentData = null;
+            });
+            // if error, return to checkout page
+            if (result.error || result.resultCode != 'Authorised') {
+                Transaction.wrap(function () {
+                    OrderMgr.failOrder(order);
+                });
+                res.redirect(URLUtils.url('Checkout-Begin', 'stage', 'payment', 'paymentError', Resource.msg('error.payment.not.valid', 'checkout', null)));
+                return next();
+            }
+
+            //custom fraudDetection
+            var fraudDetectionStatus = {status: 'success'};
+
+            // Places the order
+            var placeOrderResult = adyenHelpers.placeOrder(order, fraudDetectionStatus);
+            if (placeOrderResult.error) {
+                Transaction.wrap(function () {
+                    OrderMgr.failOrder(order);
+                });
+                res.redirect(URLUtils.url('Checkout-Begin', 'stage', 'placeOrder', 'paymentError', Resource.msg('error.technical', 'checkout', null)));
+                return next();
+            }
+
+            Transaction.begin();
+            order.setPaymentStatus(dw.order.Order.PAYMENT_STATUS_PAID);
+            order.setExportStatus(dw.order.Order.EXPORT_STATUS_READY);
+            paymentInstrument.paymentTransaction.transactionID = result.pspReference;
+            Transaction.commit();
+            COHelpers.sendConfirmationEmail(order, req.locale.id);
+            clearForms();
+            res.redirect(URLUtils.url('Order-Confirm', 'ID', order.orderNo, 'token', order.orderToken).toString());
+            return next();
+        }
     }
+    Logger.getLogger("Adyen").error("Session variable does not exists");
+    res.redirect(URLUtils.url('Checkout-Begin', 'stage', 'payment', 'paymentError', Resource.msg('error.payment.not.valid', 'checkout', null)));
+    return next();
+});
+
+server.get('Redirect', server.middleware.https, function (req, res, next) {
+    res.redirect(req.querystring.redirectUrl);
+    return next();
+});
 
-    if (session.custom.MD == req.form.MD) {
-      var result = adyen3DVerification.verify({
-        Order: order,
-        Amount: paymentInstrument.paymentTransaction.amount,
-        CurrentRequest: req.request,
-        MD: req.form.MD,
-        PaResponse: req.form.PaRes
-      });
-
-      // if error, return to checkout page
-      if (result.error || result.Decision != 'ACCEPT') {
+server.get('ShowConfirmation', server.middleware.https, function (req, res, next) {
+    var payLoad = req.querystring.payload;
+
+    //redirect to payment/details
+    var adyenCheckout = require('int_adyen_overlay/cartridge/scripts/adyenCheckout');
+    var requestObject = {};
+    requestObject['details'] = {};
+    requestObject.details['payload'] = payLoad;
+    var result = adyenCheckout.doPaymentDetailsCall(requestObject);
+    var order = OrderMgr.getOrder(result.merchantReference);
+    var paymentInstrument = order.getPaymentInstrument();
+    Transaction.wrap(function () {
+        paymentInstrument.custom.adyenPaymentData = null;
+    });
+    // Authorised: The payment authorisation was successfully completed.
+    if (result.resultCode == "Authorised") {
+        var OrderModel = require('*/cartridge/models/order');
+        var Locale = require('dw/util/Locale');
+        var currentLocale = Locale.getLocale(req.locale.id);
+        var orderModel = new OrderModel(order, {countryCode: currentLocale.country});
+
+        //Save orderModel to custom object during session
         Transaction.wrap(function () {
-          OrderMgr.failOrder(order);
+            order.custom.Adyen_CustomerEmail = JSON.stringify(orderModel);
         });
-        res.redirect(URLUtils.url('Checkout-Begin', 'stage', 'payment', 'paymentError', Resource.msg('error.payment.not.valid', 'checkout', null)));
-        return next();
-      }
-
-      //custom fraudDetection
-      var fraudDetectionStatus = {status: 'success'};
 
-      // Places the order
-      var placeOrderResult = adyenHelpers.placeOrder(order, fraudDetectionStatus);
-      if (placeOrderResult.error) {
+        clearForms();
+        res.redirect(URLUtils.url('Order-Confirm', 'ID', order.orderNo, 'token', order.orderToken).toString());
+    } else {
         Transaction.wrap(function () {
-          OrderMgr.failOrder(order);
+            OrderMgr.failOrder(order);
         });
-        res.redirect(URLUtils.url('Checkout-Begin', 'stage', 'placeOrder', 'paymentError', Resource.msg('error.technical', 'checkout', null)));
-        return next();
-      }
-
-      Transaction.begin();
-      order.setPaymentStatus(dw.order.Order.PAYMENT_STATUS_PAID);
-      order.setExportStatus(dw.order.Order.EXPORT_STATUS_READY);
-      paymentInstrument.paymentTransaction.transactionID = result.RequestToken;
-      Transaction.commit();
-      COHelpers.sendConfirmationEmail(order, req.locale.id);
-      clearForms();
-      res.redirect(URLUtils.url('Order-Confirm', 'ID', order.orderNo, 'token', order.orderToken).toString());
-      return next();
+        Logger.getLogger("Adyen").error("Payment failed, result: " + JSON.stringify(result));
+        res.redirect(URLUtils.url('Checkout-Begin', 'stage', 'payment', 'paymentError', Resource.msg('error.payment.not.valid', 'checkout', null)));
     }
-  }
-  Logger.getLogger("Adyen").error("Session variable does not exists");
-  res.redirect(URLUtils.url('Checkout-Begin', 'stage', 'payment', 'paymentError', Resource.msg('error.payment.not.valid', 'checkout', null)));
-  return next();
+    return next();
 });
 
-server.get('Redirect', server.middleware.https, function (req, res, next) {
-  var adyenVerificationSHA256 = require('int_adyen_overlay/cartridge/scripts/adyenRedirectVerificationSHA256');
-  var result;
-  var order = OrderMgr.getOrder(session.custom.orderNo);
-  Transaction.wrap(function () {
-    result = adyenVerificationSHA256.verify({
-      Order: order,
-      OrderNo: order.orderNo,
-      CurrentSession: session,
-      CurrentUser: customer,
-      PaymentInstrument: order.paymentInstrument,
-      brandCode: session.custom.brandCode,
-      issuerId: session.custom.issuerId
-    });
-  });
-
-  if (result === PIPELET_ERROR) {
-    res.render('error');
+server.get('OrderConfirm', server.middleware.https, function (req, res, next) {
+    res.redirect(URLUtils.url('Order-Confirm', 'ID', req.querystring.ID, 'token', req.querystring.token).toString());
     return next();
-  }
-
-  var pdict = {
-    merchantSig:	result.merchantSig,
-    Amount100: result.Amount100,
-    shopperEmail: result.shopperEmail,
-    shopperReference: result.shopperReference,
-    ParamsMap: result.paramsMap,
-    SessionValidity: result.sessionValidity,
-    Order: order,
-    OrderNo: order.orderNo
-  };
-
-  res.render('redirectHPP', pdict);
-  return next();
 });
 
-server.get('ShowConfirmation', server.middleware.https, function (req, res, next) {
-  var order = null;
-  if (req.querystring.merchantReference) {
-    order = OrderMgr.getOrder(req.querystring.merchantReference.toString());
-  }
-
-  if (req.querystring.authResult.value != 'CANCELLED') {
-    var requestMap = new Array();
-    for (var item in req.querystring) {
-      if (item !== 'toString') {
-        requestMap[item] = req.querystring[item];
-      }
+server.get('GetPaymentMethods', server.middleware.https, function (req, res, next) {
+    var BasketMgr = require('dw/order/BasketMgr');
+    var Resource = require('dw/web/Resource');
+    var getPaymentMethods = require('*/cartridge/scripts/adyenGetPaymentMethods');
+    var Locale = require('dw/util/Locale');
+    var countryCode = Locale.getLocale(req.locale.id).country;
+    var currentBasket = BasketMgr.getCurrentBasket();
+    if (currentBasket.getShipments().length > 0 && currentBasket.getShipments()[0].shippingAddress) {
+        countryCode = currentBasket.getShipments()[0].shippingAddress.getCountryCode();
     }
-
-    var authorizeConfirmation = require('int_adyen_overlay/cartridge/scripts/authorizeConfirmationCallSHA256');
-    var authorized = authorizeConfirmation.authorize(requestMap);
-    if (!authorized) {
-      res.redirect(URLUtils.url('Checkout-Begin', 'stage', 'payment', 'paymentError', Resource.msg('error.payment.not.valid', 'checkout', null)));
-      return next();
+    var paymentMethods;
+    try {
+        paymentMethods = getPaymentMethods.getMethods(BasketMgr.getCurrentBasket(), countryCode.value.toString()).paymentMethods;
+    } catch (err) {
+        paymentMethods = [];
     }
-  }
-  // AUTHORISED: The payment authorisation was successfully completed.
-  if (req.querystring.authResult == 'AUTHORISED') {
-      var OrderModel = require('*/cartridge/models/order');
-      var Locale = require('dw/util/Locale');
-
-      var currentLocale = Locale.getLocale(req.locale.id);
-      var orderModel = new OrderModel(order, { countryCode: currentLocale.country });
-
-      //Save orderModel to custom object during session
-      Transaction.wrap(function () {
-          order.custom.Adyen_CustomerEmail = JSON.stringify(orderModel);
-      });
-
-    clearForms();
-    res.redirect(URLUtils.url('Order-Confirm', 'ID', order.orderNo, 'token', order.orderToken).toString());
-    return next();
-  }
 
-  Transaction.wrap(function () {
-    OrderMgr.failOrder(order);
-  });
+    paymentMethods = paymentMethods.filter(function (method) {
+        return !isMethodTypeBlocked(method.type);
+    });
+    var descriptions = [];
+    paymentMethods.forEach(function (method) {
+        descriptions.push({
+            brandCode: method.type,
+            description: Resource.msg('hpp.description.' + method.type, 'hpp', "")
+        });
+    })
+
+    var adyenURL = adyenHelper.getAdyenUrl() + "hpp/img/pm/";
 
-  res.redirect(URLUtils.url('Checkout-Begin', 'stage', 'payment', 'paymentError', Resource.msg('error.payment.not.valid', 'checkout', null)));
-  return next();
+    res.json({
+        AdyenHppPaymentMethods: paymentMethods,
+        ImagePath: adyenURL,
+        AdyenDescriptions: descriptions
+    });
+    return next();
 });
 
-server.get('GetPaymentMethods', server.middleware.https, function (req, res, next) {
-  var BasketMgr = require('dw/order/BasketMgr');
-  var Resource = require('dw/web/Resource');
-  var getPaymentMethods = require('*/cartridge/scripts/getPaymentMethodsSHA256');
-  var paymentMethods;
-  try {
-    paymentMethods = getPaymentMethods.getMethods(BasketMgr.getCurrentBasket()).paymentMethods;
-  } catch (err) {
-    paymentMethods = [];
-  }
-
-  var descriptions = [];
-  paymentMethods.forEach(function (method){
-     descriptions.push({ brandCode : method.brandCode, description : Resource.msg('hpp.description.' + method.brandCode, 'hpp', "")});
-   })
-
-  res.json({
-      AdyenHppPaymentMethods: paymentMethods,
-      ImagePath: URLUtils.staticURL('/images/').toString(),
-      AdyenDescriptions : descriptions
-  });
-  return next();
+/**
+ * Checks if payment method is blocked
+ */
+function isMethodTypeBlocked(methodType) {
+    if (methodType.indexOf('bcmc_mobile_QR') !== -1 ||
+        (methodType.indexOf('wechatpay') !== -1 && methodType.indexOf('wechatpayWeb') === -1) ||
+        methodType == "scheme") {
+        return true;
+    } else {
+        return false;
+    }
+}
+
+/**
+ * Get OriginKey for Secured Fields
+ */
+server.get('GetConfigSecuredFields', server.middleware.https, function (req, res, next) {
+    var adyenGetOriginKey = require('*/cartridge/scripts/adyenGetOriginKey');
+    var baseUrl = req.querystring.protocol + "//" + Site.getCurrent().getHttpsHostName();
+    var originKey;
+    var error = false;
+    var errorMessage = "";
+    var loadingContext = "";
+
+    try {
+        originKey = adyenGetOriginKey.getOriginKey(baseUrl).originKeys;
+        loadingContext = adyenHelper.getLoadingContext();
+    } catch (err) {
+        error = true;
+        errorMessage = Resource.msg('load.component.error', 'creditCard', null);
+    }
+    res.json({
+        error: error,
+        errorMessage: errorMessage,
+        adyenOriginKey: originKey,
+        adyenLoadingContext: loadingContext
+    });
+    return next();
 });
 
 /**
  * Called by Adyen to update status of payments. It should always display [accepted] when finished.
  */
 server.post('Notify', server.middleware.https, function (req, res, next) {
-    var	checkAuth = require('int_adyen_overlay/cartridge/scripts/checkNotificationAuth');
+    var checkAuth = require('int_adyen_overlay/cartridge/scripts/checkNotificationAuth');
     var status = checkAuth.check(req);
     if (!status) {
         res.render('/adyen/error');
         return {};
     }
-    var	handleNotify = require('int_adyen_overlay/cartridge/scripts/handleNotify');
+    var handleNotify = require('int_adyen_overlay/cartridge/scripts/handleNotify');
     Transaction.begin();
     var success = handleNotify.notify(req.form);
 
-    if(success){
-      Transaction.commit();
-      res.render('/notify');
-    }
-    else {
-      res.json({error: "Notification not handled"});
-      Transaction.rollback();
+    if (success) {
+        Transaction.commit();
+        res.render('/notify');
+    } else {
+        res.json({error: "Notification not handled"});
+        Transaction.rollback();
     }
     next();
 });
@@ -225,26 +247,25 @@ server.post('Notify', server.middleware.https, function (req, res, next) {
  * Clear system session data
  */
 function clearForms() {
-  // Clears all forms used in the checkout process.
-  session.forms.billing.clearFormElement();
-
-  clearCustomSessionFields();
+    // Clears all forms used in the checkout process.
+    session.forms.billing.clearFormElement();
+    clearCustomSessionFields();
 }
 
 /**
  * Clear custom session data
  */
 function clearCustomSessionFields() {
-  // Clears all fields used in the 3d secure payment.
-  session.custom.paymentMethod = null;
-  session.custom.orderNo = null;
-  session.custom.brandCode = null;
-  session.custom.issuerId = null;
-  session.custom.adyenPaymentMethod = null;
-  session.custom.adyenIssuerName = null;
+    // Clears all fields used in the 3d secure payment.
+    session.custom.paymentMethod = null;
+    session.custom.orderNo = null;
+    session.custom.brandCode = null;
+    session.custom.issuer = null;
+    session.custom.adyenPaymentMethod = null;
+    session.custom.adyenIssuerName = null;
 }
 
-function getExternalPlatformVersion(){
+function getExternalPlatformVersion() {
     return EXTERNAL_PLATFORM_VERSION;
 }
 
diff --git a/cartridges/int_adyen_SFRA/cartridge/controllers/Checkout.js b/cartridges/int_adyen_SFRA/cartridge/controllers/Checkout.js
index 635620a14..5bc8e02e4 100644
--- a/cartridges/int_adyen_SFRA/cartridge/controllers/Checkout.js
+++ b/cartridges/int_adyen_SFRA/cartridge/controllers/Checkout.js
@@ -6,14 +6,14 @@ var server = require('server');
 server.extend(module.superModule);
 
 server.prepend('Begin',
-  server.middleware.https,
+    server.middleware.https,
     consentTracking.consent,
     csrfProtection.generateToken,
-  function (req, res, next) {
-    if (req.currentCustomer.raw.isAuthenticated()) {
-      require('int_adyen_overlay/cartridge/scripts/UpdateSavedCards').updateSavedCards({ CurrentCustomer: req.currentCustomer.raw });
-    }
-    next();
-  });
+    function (req, res, next) {
+        if (req.currentCustomer.raw.isAuthenticated()) {
+            require('int_adyen_overlay/cartridge/scripts/UpdateSavedCards').updateSavedCards({CurrentCustomer: req.currentCustomer.raw});
+        }
+        next();
+    });
 
 module.exports = server.exports();
diff --git a/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js b/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js
index 9356aa2bb..81ab73fa1 100644
--- a/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js
+++ b/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js
@@ -7,182 +7,179 @@ var COHelpers = require('*/cartridge/scripts/checkout/checkoutHelpers');
 var adyenHelpers = require('*/cartridge/scripts/checkout/adyenHelpers');
 
 server.replace('PlaceOrder', server.middleware.https, function (req, res, next) {
-  var BasketMgr = require('dw/order/BasketMgr');
-  var OrderMgr = require('dw/order/OrderMgr');
-  var Resource = require('dw/web/Resource');
-  var Transaction = require('dw/system/Transaction');
-  var URLUtils = require('dw/web/URLUtils');
-  var basketCalculationHelpers = require('*/cartridge/scripts/helpers/basketCalculationHelpers');
-  var hooksHelper = require('*/cartridge/scripts/helpers/hooks');
-
-  var currentBasket = BasketMgr.getCurrentBasket();
-  if (!currentBasket) {
-    res.json({
-      error: true,
-      cartError: true,
-      fieldErrors: [],
-      serverErrors: [],
-      redirectUrl: URLUtils.url('Cart-Show').toString()
-    });
-    return next();
-  }
-
-  if (req.session.privacyCache.get('fraudDetectionStatus')) {
-    res.json({
-      error: true,
-      cartError: true,
-      redirectUrl: URLUtils.url('Error-ErrorCode', 'err', '01').toString(),
-      errorMessage: Resource.msg('error.technical', 'checkout', null)
-    });
-
-    return next();
-  }
-
-  var validationOrderStatus = hooksHelper('app.validate.order', 'validateOrder', currentBasket, require('*/cartridge/scripts/hooks/validateOrder').validateOrder);
-  if (validationOrderStatus.error) {
-    res.json({
-      error: true,
-      errorMessage: validationOrderStatus.message
-    });
-    return next();
-  }
-  // Check to make sure there is a shipping address
-  if (currentBasket.defaultShipment.shippingAddress === null) {
-    res.json({
-      error: true,
-      errorStage: {
-        stage: 'shipping',
-        step: 'address'
-      },
-      errorMessage: Resource.msg('error.no.shipping.address', 'checkout', null)
-    });
-    return next();
-  }
-
-  // Check to make sure billing address exists
-  if (!currentBasket.billingAddress) {
-    res.json({
-      error: true,
-      errorStage: {
-        stage: 'payment',
-        step: 'billingAddress'
-      },
-      errorMessage: Resource.msg('error.no.billing.address', 'checkout', null)
-    });
-    return next();
-  }
-
-  // Calculate the basket
-  Transaction.wrap(function () {
-    basketCalculationHelpers.calculateTotals(currentBasket);
-  });
-
-  // Re-validates existing payment instruments
-  var validPayment = adyenHelpers.validatePayment(req, currentBasket);
-  if (validPayment.error) {
-    res.json({
-      error: true,
-      errorStage: {
-        stage: 'payment',
-        step: 'paymentInstrument'
-      },
-      errorMessage: Resource.msg('error.payment.not.valid', 'checkout', null)
-    });
-    return next();
-  }
-
-  // Re-calculate the payments.
-  var calculatedPaymentTransactionTotal = COHelpers.calculatePaymentTransaction(currentBasket);
-  if (calculatedPaymentTransactionTotal.error) {
-    res.json({
-      error: true,
-      errorMessage: Resource.msg('error.technical', 'checkout', null)
-    });
-    return next();
-  }
-
-  // Creates a new order.
-  var order = COHelpers.createOrder(currentBasket);
-  if (!order) {
-    res.json({
-      error: true,
-      errorMessage: Resource.msg('error.technical', 'checkout', null)
-    });
-    return next();
-  }
-
-  // Handles payment authorization
-  var handlePaymentResult = adyenHelpers.handlePayments(order, order.orderNo);
-  if (handlePaymentResult.error) {
-    res.json({
-      error: true,
-      errorMessage: Resource.msg('error.technical', 'checkout', null)
-    });
-    return next();
-  }
-
-  if (handlePaymentResult.issuerUrl != '' && handlePaymentResult.authorized3d) {
-    session.custom.MD = handlePaymentResult.md;
-    res.json({
-      error: false,
-      continueUrl: URLUtils.url('Adyen-Adyen3D', 'IssuerURL', handlePaymentResult.issuerUrl, 'PaRequest', handlePaymentResult.paRequest, 'MD', handlePaymentResult.md).toString()
-    });
-    return next();
-  }
-
-  var fraudDetectionStatus = hooksHelper('app.fraud.detection', 'fraudDetection', currentBasket, require('*/cartridge/scripts/hooks/fraudDetection').fraudDetection);
-  if (fraudDetectionStatus.status === 'fail') {
+    var BasketMgr = require('dw/order/BasketMgr');
+    var OrderMgr = require('dw/order/OrderMgr');
+    var Resource = require('dw/web/Resource');
+    var Transaction = require('dw/system/Transaction');
+    var URLUtils = require('dw/web/URLUtils');
+    var basketCalculationHelpers = require('*/cartridge/scripts/helpers/basketCalculationHelpers');
+    var hooksHelper = require('*/cartridge/scripts/helpers/hooks');
+
+    var currentBasket = BasketMgr.getCurrentBasket();
+    if (!currentBasket) {
+        res.json({
+            error: true,
+            cartError: true,
+            fieldErrors: [],
+            serverErrors: [],
+            redirectUrl: URLUtils.url('Cart-Show').toString()
+        });
+        return next();
+    }
+
+    if (req.session.privacyCache.get('fraudDetectionStatus')) {
+        res.json({
+            error: true,
+            cartError: true,
+            redirectUrl: URLUtils.url('Error-ErrorCode', 'err', '01').toString(),
+            errorMessage: Resource.msg('error.technical', 'checkout', null)
+        });
+
+        return next();
+    }
+
+    var validationOrderStatus = hooksHelper('app.validate.order', 'validateOrder', currentBasket, require('*/cartridge/scripts/hooks/validateOrder').validateOrder);
+    if (validationOrderStatus.error) {
+        res.json({
+            error: true,
+            errorMessage: validationOrderStatus.message
+        });
+        return next();
+    }
+    // Check to make sure there is a shipping address
+    if (currentBasket.defaultShipment.shippingAddress === null) {
+        res.json({
+            error: true,
+            errorStage: {
+                stage: 'shipping',
+                step: 'address'
+            },
+            errorMessage: Resource.msg('error.no.shipping.address', 'checkout', null)
+        });
+        return next();
+    }
+
+    // Check to make sure billing address exists
+    if (!currentBasket.billingAddress) {
+        res.json({
+            error: true,
+            errorStage: {
+                stage: 'payment',
+                step: 'billingAddress'
+            },
+            errorMessage: Resource.msg('error.no.billing.address', 'checkout', null)
+        });
+        return next();
+    }
+
+    // Calculate the basket
     Transaction.wrap(function () {
-      OrderMgr.failOrder(order);
+        basketCalculationHelpers.calculateTotals(currentBasket);
     });
 
-    // fraud detection failed
-    req.session.privacyCache.set('fraudDetectionStatus', true);
+    // Re-validates existing payment instruments
+    var validPayment = adyenHelpers.validatePayment(req, currentBasket);
+    if (validPayment.error) {
+        res.json({
+            error: true,
+            errorStage: {
+                stage: 'payment',
+                step: 'paymentInstrument'
+            },
+            errorMessage: Resource.msg('error.payment.not.valid', 'checkout', null)
+        });
+        return next();
+    }
+
+    // Re-calculate the payments.
+    var calculatedPaymentTransactionTotal = COHelpers.calculatePaymentTransaction(currentBasket);
+    if (calculatedPaymentTransactionTotal.error) {
+        res.json({
+            error: true,
+            errorMessage: Resource.msg('error.technical', 'checkout', null)
+        });
+        return next();
+    }
+
+    // Creates a new order.
+    var order = COHelpers.createOrder(currentBasket);
+    if (!order) {
+        res.json({
+            error: true,
+            errorMessage: Resource.msg('error.technical', 'checkout', null)
+        });
+        return next();
+    }
+
+    // Handles payment authorization
+    var handlePaymentResult = adyenHelpers.handlePayments(order, order.orderNo);
+    if (handlePaymentResult.error) {
+        res.json({
+            error: true,
+            errorMessage: Resource.msg('error.technical', 'checkout', null)
+        });
+        return next();
+    }
+
+    if (handlePaymentResult.redirectObject) {
+        //If authorized3d, then redirectObject from credit card, hence it is 3D Secure
+        if (handlePaymentResult.authorized3d) {
+            session.custom.MD = handlePaymentResult.redirectObject.data.MD;
+            res.json({
+                error: false,
+                continueUrl: URLUtils.url('Adyen-Adyen3D', 'IssuerURL', handlePaymentResult.redirectObject.url, 'PaRequest', handlePaymentResult.redirectObject.data.PaReq, 'MD', handlePaymentResult.redirectObject.data.MD).toString()
+            });
+            return next();
+        } else {
+            res.json({
+                error: false,
+                continueUrl: URLUtils.url('Adyen-Redirect', 'redirectUrl', handlePaymentResult.redirectObject.url).toString()
+            });
+            return next();
+        }
+    }
+
+    var fraudDetectionStatus = hooksHelper('app.fraud.detection', 'fraudDetection', currentBasket, require('*/cartridge/scripts/hooks/fraudDetection').fraudDetection);
+    if (fraudDetectionStatus.status === 'fail') {
+        Transaction.wrap(function () {
+            OrderMgr.failOrder(order);
+        });
+
+        // fraud detection failed
+        req.session.privacyCache.set('fraudDetectionStatus', true);
+
+        res.json({
+            error: true,
+            cartError: true,
+            redirectUrl: URLUtils.url('Error-ErrorCode', 'err', fraudDetectionStatus.errorCode).toString(),
+            errorMessage: Resource.msg('error.technical', 'checkout', null)
+        });
+
+        return next();
+    }
+
+    // Places the order
+    var placeOrderResult = adyenHelpers.placeOrder(order, fraudDetectionStatus);
+    if (placeOrderResult.error) {
+        res.json({
+            error: true,
+            errorMessage: Resource.msg('error.technical', 'checkout', null)
+        });
+        return next();
+    }
+
+    COHelpers.sendConfirmationEmail(order, req.locale.id);
+
+    // Reset usingMultiShip after successful Order placement
+    req.session.privacyCache.set('usingMultiShipping', false);
 
     res.json({
-      error: true,
-      cartError: true,
-      redirectUrl: URLUtils.url('Error-ErrorCode', 'err', fraudDetectionStatus.errorCode).toString(),
-      errorMessage: Resource.msg('error.technical', 'checkout', null)
+        error: false,
+        orderID: order.orderNo,
+        orderToken: order.orderToken,
+        continueUrl: URLUtils.url('Order-Confirm').toString()
     });
-
     return next();
-  }
-
-  // Places the order
-  var placeOrderResult = adyenHelpers.placeOrder(order, fraudDetectionStatus);
-  if (placeOrderResult.error) {
-    res.json({
-      error: true,
-      errorMessage: Resource.msg('error.technical', 'checkout', null)
-    });
-    return next();
-  }
-
-  // If payment is redirected, order is created first
-  if (placeOrderResult.order.paymentInstrument.paymentMethod == 'Adyen' && placeOrderResult.order_created) {
-    session.custom.orderNo = placeOrderResult.order.orderNo;
-    res.json({
-      error: false,
-      orderID: placeOrderResult.order.orderNo,
-      orderToken: placeOrderResult.order.orderToken,
-      continueUrl: URLUtils.url('Adyen-Redirect').toString()
-    });
-    return next();
-  }
-
-  COHelpers.sendConfirmationEmail(order, req.locale.id);
-
-  // Reset usingMultiShip after successful Order placement
-  req.session.privacyCache.set('usingMultiShipping', false);
-
-  res.json({
-    error: false,
-    orderID: order.orderNo,
-    orderToken: order.orderToken,
-    continueUrl: URLUtils.url('Order-Confirm').toString()
-  });
-  return next();
 });
 
 module.exports = server.exports();
diff --git a/cartridges/int_adyen_SFRA/cartridge/controllers/PaymentInstruments.js b/cartridges/int_adyen_SFRA/cartridge/controllers/PaymentInstruments.js
index 208a60a14..5745a9185 100644
--- a/cartridges/int_adyen_SFRA/cartridge/controllers/PaymentInstruments.js
+++ b/cartridges/int_adyen_SFRA/cartridge/controllers/PaymentInstruments.js
@@ -10,75 +10,74 @@ var csrfProtection = require('*/cartridge/scripts/middleware/csrf');
 var AdyenHelper = require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper');
 
 server.prepend('List', userLoggedIn.validateLoggedIn, consentTracking.consent, function (req, res, next) {
-  require('int_adyen_overlay/cartridge/scripts/UpdateSavedCards').updateSavedCards({ CurrentCustomer: req.currentCustomer.raw });
-  next();
+    require('int_adyen_overlay/cartridge/scripts/UpdateSavedCards').updateSavedCards({CurrentCustomer: req.currentCustomer.raw});
+    next();
 });
 
-function getEncryptedData() {
-  var paymentForm = server.forms.getForm('creditCard');
-  return paymentForm.adyenEncryptedData.value;
-}
-
 server.replace('SavePayment', csrfProtection.validateAjaxRequest, function (req, res, next) {
-  var viewData = res.getViewData();
-  viewData.adyenEncryptedData = getEncryptedData();
-  res.setViewData(viewData);
-
-  var paymentForm = server.forms.getForm('creditCard');
-  if (paymentForm.valid) {
-    this.on('route:BeforeComplete', function (req, res) {
-      var URLUtils = require('dw/web/URLUtils');
-      var CustomerMgr = require('dw/customer/CustomerMgr');
-      var Resource = require('dw/web/Resource');
-
-      var customer = CustomerMgr.getCustomerByCustomerNumber(
-        req.currentCustomer.profile.customerNo
-      );
-
-      var createRecurringPaymentAccountResult = AdyenHelper.createRecurringPaymentAccount({
-        Customer: customer
-      });
-
-      if (createRecurringPaymentAccountResult.error) {
-        res.json({
-          success: false,
-          error: [Resource.msg('error.card.information.error', 'creditCard', null)]
+    var viewData = res.getViewData();
+    var paymentForm = server.forms.getForm('creditCard');
+
+    viewData.adyenEncryptedCardNumber = paymentForm.adyenEncryptedCardNumber.value;
+    viewData.adyenEncryptedExpiryMonth = paymentForm.adyenEncryptedExpiryMonth.value;
+    viewData.adyenEncryptedExpiryYear = paymentForm.adyenEncryptedExpiryYear.value;
+    viewData.adyenEncryptedSecurityCode = paymentForm.adyenEncryptedSecurityCode.value;
+    res.setViewData(viewData);
+
+    if (paymentForm.valid) {
+        this.on('route:BeforeComplete', function (req, res) {
+            var URLUtils = require('dw/web/URLUtils');
+            var CustomerMgr = require('dw/customer/CustomerMgr');
+            var Resource = require('dw/web/Resource');
+
+            var customer = CustomerMgr.getCustomerByCustomerNumber(
+                req.currentCustomer.profile.customerNo
+            );
+
+            var createRecurringPaymentAccountResult = AdyenHelper.createRecurringPaymentAccount({
+                Customer: customer
+            });
+
+            if (createRecurringPaymentAccountResult.error) {
+                res.json({
+                    success: false,
+                    error: [Resource.msg('error.card.information.error', 'creditCard', null)]
+                });
+            } else {
+                res.json({
+                    success: true,
+                    redirectUrl: URLUtils.url('PaymentInstruments-List').toString()
+                });
+            }
         });
-      } else {
+    } else {
         res.json({
-          success: true,
-          redirectUrl: URLUtils.url('PaymentInstruments-List').toString()
+            success: false,
+            error: [Resource.msg('error.card.information.error', 'creditCard', null)]
         });
-      }
-    });
-  } else {
-    res.json({
-      success: false,
-      error: [Resource.msg('error.card.information.error', 'creditCard', null)]
-    });
-  }
-  return next();
+    }
+    return next();
 });
 
 server.append('DeletePayment', userLoggedIn.validateLoggedInAjax, function (req, res, next) {
-  var CustomerMgr = require('dw/customer/CustomerMgr');
-  var payment = res.getViewData();
-
-
-  if (!empty(payment)) {
-    var customer = CustomerMgr.getCustomerByCustomerNumber(
-      req.currentCustomer.profile.customerNo
-    );
-    var tokenToDelete = AdyenHelper.getCardToken(payment.UUID, customer);
-    if (!empty(tokenToDelete)) {
-      var result = require('int_adyen_overlay/cartridge/scripts/adyenDeleteRecurringPayment').deleteRecurringPayment({
-        Customer: customer,
-        RecurringDetailReference: tokenToDelete
-      });
+    var CustomerMgr = require('dw/customer/CustomerMgr');
+    var payment = res.getViewData();
+
+
+    if (!empty(payment)) {
+        var customer = CustomerMgr.getCustomerByCustomerNumber(
+            req.currentCustomer.profile.customerNo
+        );
+        var tokenToDelete = AdyenHelper.getCardToken(payment.UUID, customer);
+        if (!empty(tokenToDelete)) {
+            var result = require('int_adyen_overlay/cartridge/scripts/adyenDeleteRecurringPayment').deleteRecurringPayment({
+                Customer: customer,
+                RecurringDetailReference: tokenToDelete
+            });
+        }
     }
-  }
 
-  return next();
+    return next();
 });
 
 
diff --git a/cartridges/int_adyen_SFRA/cartridge/forms/default/adyenPayment.xml b/cartridges/int_adyen_SFRA/cartridge/forms/default/adyenPayment.xml
new file mode 100644
index 000000000..4e0cfa2c9
--- /dev/null
+++ b/cartridges/int_adyen_SFRA/cartridge/forms/default/adyenPayment.xml
@@ -0,0 +1,16 @@
+<?xml version="1.0"?>
+<form xmlns="http://www.demandware.com/xml/form/2008-04-19">
+    <!--Issuer details-->
+    <field formid="issuer" type="string" mandatory="false"/>
+
+    <!--Open Invoice details-->
+    <field formid="dateOfBirth" label="Date of Birth" type="string" mandatory="false"/>
+    <field formid="telephoneNumber" label="telephoneNumber" type="string" mandatory="false"/>
+    <field formid="gender" label="Gender" type="string" mandatory="false"/>
+    <field formid="socialSecurityNumber" label="Social Security Number" type="string" mandatory="false"/>
+
+    <!--ACH details-->
+    <field formid="bankAccountOwnerName" type="string" mandatory="false"/>
+    <field formid="bankAccountNumber" type="string" mandatory="false"/>
+    <field formid="bankLocationId" type="string" mandatory="false"/>
+</form>
diff --git a/cartridges/int_adyen_SFRA/cartridge/forms/default/billing.xml b/cartridges/int_adyen_SFRA/cartridge/forms/default/billing.xml
new file mode 100644
index 000000000..6ad656382
--- /dev/null
+++ b/cartridges/int_adyen_SFRA/cartridge/forms/default/billing.xml
@@ -0,0 +1,19 @@
+<?xml version="1.0"?>
+<form xmlns="http://www.demandware.com/xml/form/2008-04-19">
+
+    <field formid="shippingAddressUseAsBillingAddress" label="profile.billingSameAsShipping" type="boolean"
+           binding="shippingAddressUseAsBillingAddress" checked="true" />
+
+    <include formid="addressFields" name="address"/>
+
+    <include formid="contactInfoFields" name="contactInfo"/>
+
+    <field formid="paymentMethod" type="string" mandatory="true" />
+
+    <include formid="creditCardFields" name="creditCard"/>
+
+    <include formid="adyenPaymentFields" name="adyenPayment"/>
+
+    <field formid="subscribe" type="boolean" checked="false" default-value="false" mandatory="false" />
+
+</form>
diff --git a/cartridges/int_adyen_SFRA/cartridge/forms/default/creditCard.xml b/cartridges/int_adyen_SFRA/cartridge/forms/default/creditCard.xml
index 23c2d93c0..93d5c5f36 100644
--- a/cartridges/int_adyen_SFRA/cartridge/forms/default/creditCard.xml
+++ b/cartridges/int_adyen_SFRA/cartridge/forms/default/creditCard.xml
@@ -1,26 +1,19 @@
 <?xml version="1.0"?>
 <form xmlns="http://www.demandware.com/xml/form/2008-04-19">
-
-    <!-- field for edit credit card number -->
-    <field
-        formid="editNumber"
-        label="label.input.creditcard.number"
-        type="string"
-        mandatory="false"
-        max-length="16"/>
-
-    <field formid="paymentMethod" type="string" mandatory="true" />
+    <field formid="paymentMethod" type="string" mandatory="true"/>
 
     <field formid="cardType" label="profile.cardtype" type="string" mandatory="false" binding="cardType"
-           max-length="16" missing-error="error.message.required" />
+           max-length="16" missing-error="error.message.required"/>
 
-    <field formid="cardNumber" label="label.input.creditcard.number" type="string" mandatory="false" binding="cardNumber"
-           max-length="20" missing-error="error.message.required" parse-error="error.message.required" />
+    <field formid="cardNumber" label="label.input.creditcard.number" type="string" mandatory="false"
+           binding="cardNumber"
+           max-length="20" missing-error="error.message.required" parse-error="error.message.required"/>
 
     <field formid="cardOwner" label="label.input.creditcard.owner" type="string" mandatory="false" binding="cardOwner"
-           max-length="16" missing-error="error.message.required" />
+           max-length="22" missing-error="error.message.required"/>
 
-    <field formid="expirationMonth" label="label.input.payment.expirationmonth" type="integer" mandatory="false" binding="expirationMonth" missing-error="error.message.required"
+    <field formid="expirationMonth" label="label.input.payment.expirationmonth" type="integer" mandatory="false"
+           binding="expirationMonth" missing-error="error.message.required"
            value-error="address.field.invalid">
         <options>
             <option optionid="" label="select.default.month" value=""/>
@@ -47,18 +40,21 @@
     </field>
 
     <field formid="securityCode" label="profile.securitycode" type="string" mandatory="false" binding="securityCode"
-           max-length="4" missing-error="error.card.info.missing.securityCode" />
-
-    <field formid="email" label="profile.email" type="string" mandatory="true" binding="email"
-           max-length="254" missing-error="error.card.info.missing.email" />
-
-    <field formid="phone" label="profile.phone" description="address.phone.example" type="string" mandatory="true"
-           binding="phone" max-length="20" missing-error="error.card.info.missing.phone" />
-
-    <field formid="saveCard" label="label.save.card" binding="saveCard" type="boolean" mandatory="false" checked="false" />
-    <field formid="saveCardAdyen" label="label.save.card" binding="saveCardAdyen" type="boolean" mandatory="false" checked="true" />
-
-    <field formid="adyenEncryptedData" label="adyenEncryptedData" type="string" mandatory="false" binding="adyenEncryptedData"/>
+           max-length="4" missing-error="error.card.info.missing.securityCode"/>
+
+    <field formid="saveCard" label="label.save.card" binding="saveCard" type="boolean" mandatory="false"
+           checked="false"/>
+    <field formid="saveCardAdyen" label="label.save.card" binding="saveCardAdyen" type="boolean" mandatory="false"
+           checked="true"/>
+
+    <field formid="adyenEncryptedCardNumber" label="adyenEncryptedCardNumber" type="string" mandatory="false"
+           binding="adyenEncryptedCardNumber"/>
+    <field formid="adyenEncryptedExpiryMonth" label="adyenEncryptedExpiryMonth" type="string" mandatory="false"
+           binding="adyenEncryptedExpiryMonth"/>
+    <field formid="adyenEncryptedExpiryYear" label="adyenEncryptedExpiryYear" type="string" mandatory="false"
+           binding="adyenEncryptedExpiryYear"/>
+    <field formid="adyenEncryptedSecurityCode" label="adyenEncryptedSecurityCode" type="string" mandatory="false"
+           binding="adyenEncryptedSecurityCode"/>
 
     <!--  field  for  credit  card  recurring  payments  /  tokenization  -->
     <field formid="selectedCardID" mandatory="false" type="string"/>
diff --git a/cartridges/int_adyen_SFRA/cartridge/models/payment.js b/cartridges/int_adyen_SFRA/cartridge/models/payment.js
index 1c0a117a4..7da737173 100644
--- a/cartridges/int_adyen_SFRA/cartridge/models/payment.js
+++ b/cartridges/int_adyen_SFRA/cartridge/models/payment.js
@@ -14,10 +14,17 @@ function getSelectedPaymentInstruments(selectedPaymentInstruments) {
         var results = {
             paymentMethod: paymentInstrument.paymentMethod,
             amount: paymentInstrument.paymentTransaction.amount.value
-
         };
-        results.selectedAdyenPM = !empty(paymentInstrument.custom.adyenPaymentMethod) ? paymentInstrument.custom.adyenPaymentMethod : null;
-        results.selectedIssuerName = !empty(paymentInstrument.custom.adyenIssuerName) ? paymentInstrument.custom.adyenIssuerName : null;
+
+        if (paymentInstrument.custom.adyenPaymentMethod) {
+            results.selectedAdyenPM = paymentInstrument.custom.adyenPaymentMethod;
+        }
+        if (paymentInstrument.custom.adyenIssuerName) {
+            results.selectedIssuerName = paymentInstrument.custom.adyenIssuerName;
+        }
+        if (paymentInstrument.custom.adyenAdditionalPaymentData) {
+            results.adyenAdditionalPaymentData = JSON.parse(paymentInstrument.custom.adyenAdditionalPaymentData);
+        }
 
         if (paymentInstrument.paymentMethod === 'CREDIT_CARD') {
             results.lastFour = paymentInstrument.creditCardNumberLastDigits;
diff --git a/cartridges/int_adyen_SFRA/cartridge/scripts/adyenService.ds b/cartridges/int_adyen_SFRA/cartridge/scripts/adyenService.ds
index 262a10420..052c162d2 100644
--- a/cartridges/int_adyen_SFRA/cartridge/scripts/adyenService.ds
+++ b/cartridges/int_adyen_SFRA/cartridge/scripts/adyenService.ds
@@ -6,12 +6,12 @@ var Template = require('dw/util/Template');
 var Transaction = require('dw/system/Transaction');
 
 
-function submit(order){
+function submit(order) {
     var confirmationEmail = new Mail();
     var context = new HashMap();
 
     var savedOrderModel = order.custom.Adyen_CustomerEmail;
-    var orderObject = { order: JSON.parse(savedOrderModel) };
+    var orderObject = {order: JSON.parse(savedOrderModel)};
 
     confirmationEmail.addTo(order.customerEmail);
     confirmationEmail.setSubject(Resource.msg('subject.order.confirmation.email', 'order', null));
diff --git a/cartridges/int_adyen_SFRA/cartridge/scripts/checkout/adyenHelpers.js b/cartridges/int_adyen_SFRA/cartridge/scripts/checkout/adyenHelpers.js
index 89f97014f..2981f8aaf 100644
--- a/cartridges/int_adyen_SFRA/cartridge/scripts/checkout/adyenHelpers.js
+++ b/cartridges/int_adyen_SFRA/cartridge/scripts/checkout/adyenHelpers.js
@@ -15,53 +15,57 @@ var PaymentInstrument = require('dw/order/PaymentInstrument');
  * @returns {Object} an error object
  */
 function handlePayments(order, orderNumber) {
-  var result = {};
-  if (order.totalNetPrice !== 0.00) {
-    var paymentInstruments = order.paymentInstruments;
+    var result = {};
+    if (order.totalNetPrice !== 0.00) {
+        var paymentInstruments = order.paymentInstruments;
 
-    if (paymentInstruments.length === 0) {
-      Transaction.wrap(function () { OrderMgr.failOrder(order); });
-      result.error = true;
-    }
-    if (!result.error) {
-      for (var i = 0; i < paymentInstruments.length; i++) {
-        var paymentInstrument = paymentInstruments[i];
-        var paymentProcessor = PaymentMgr
-          .getPaymentMethod(paymentInstrument.paymentMethod)
-          .paymentProcessor;
-        var authorizationResult;
-        if (paymentProcessor === null) {
-          Transaction.begin();
-          paymentInstrument.paymentTransaction.setTransactionID(orderNumber);
-          Transaction.commit();
-        } else {
-          if (HookMgr.hasHook('app.payment.processor.'
-                        + paymentProcessor.ID.toLowerCase())) {
-            authorizationResult = HookMgr.callHook(
-              'app.payment.processor.' + paymentProcessor.ID.toLowerCase(),
-              'Authorize',
-              orderNumber,
-              paymentInstrument,
-              paymentProcessor
-            );
-          } else {
-            authorizationResult = HookMgr.callHook(
-              'app.payment.processor.default',
-              'Authorize'
-            );
-          }
-          result = authorizationResult;
-          if (authorizationResult.error) {
-            Transaction.wrap(function () { OrderMgr.failOrder(order); });
+        if (paymentInstruments.length === 0) {
+            Transaction.wrap(function () {
+                OrderMgr.failOrder(order);
+            });
             result.error = true;
-            break;
-          }
         }
-      }
+        if (!result.error) {
+            for (var i = 0; i < paymentInstruments.length; i++) {
+                var paymentInstrument = paymentInstruments[i];
+                var paymentProcessor = PaymentMgr
+                    .getPaymentMethod(paymentInstrument.paymentMethod)
+                    .paymentProcessor;
+                var authorizationResult;
+                if (paymentProcessor === null) {
+                    Transaction.begin();
+                    paymentInstrument.paymentTransaction.setTransactionID(orderNumber);
+                    Transaction.commit();
+                } else {
+                    if (HookMgr.hasHook('app.payment.processor.'
+                        + paymentProcessor.ID.toLowerCase())) {
+                        authorizationResult = HookMgr.callHook(
+                            'app.payment.processor.' + paymentProcessor.ID.toLowerCase(),
+                            'Authorize',
+                            orderNumber,
+                            paymentInstrument,
+                            paymentProcessor
+                        );
+                    } else {
+                        authorizationResult = HookMgr.callHook(
+                            'app.payment.processor.default',
+                            'Authorize'
+                        );
+                    }
+                    result = authorizationResult;
+                    if (authorizationResult.error) {
+                        Transaction.wrap(function () {
+                            OrderMgr.failOrder(order);
+                        });
+                        result.error = true;
+                        break;
+                    }
+                }
+            }
+        }
     }
-  }
 
-  return result;
+    return result;
 }
 
 /**
@@ -71,54 +75,54 @@ function handlePayments(order, orderNumber) {
  * @returns {Object} an object that has error information
  */
 function validatePayment(req, currentBasket) {
-  var applicablePaymentCards;
-  var applicablePaymentMethods;
-  var creditCardPaymentMethod = PaymentMgr.getPaymentMethod(PaymentInstrument.METHOD_CREDIT_CARD);
-  var paymentAmount = currentBasket.totalGrossPrice.value;
-  var countryCode = req.geolocation.countryCode;
-  var currentCustomer = req.currentCustomer.raw;
-  var paymentInstruments = currentBasket.paymentInstruments;
-  var result = {};
+    var applicablePaymentCards;
+    var applicablePaymentMethods;
+    var creditCardPaymentMethod = PaymentMgr.getPaymentMethod(PaymentInstrument.METHOD_CREDIT_CARD);
+    var paymentAmount = currentBasket.totalGrossPrice.value;
+    var countryCode = req.geolocation.countryCode;
+    var currentCustomer = req.currentCustomer.raw;
+    var paymentInstruments = currentBasket.paymentInstruments;
+    var result = {};
 
-  applicablePaymentMethods = PaymentMgr.getApplicablePaymentMethods(
-    currentCustomer,
-    countryCode,
-    paymentAmount
-  );
-  applicablePaymentCards = creditCardPaymentMethod.getApplicablePaymentCards(
-    currentCustomer,
-    countryCode,
-    paymentAmount
-  );
+    applicablePaymentMethods = PaymentMgr.getApplicablePaymentMethods(
+        currentCustomer,
+        countryCode,
+        paymentAmount
+    );
+    applicablePaymentCards = creditCardPaymentMethod.getApplicablePaymentCards(
+        currentCustomer,
+        countryCode,
+        paymentAmount
+    );
 
-  var invalid = true;
+    var invalid = true;
 
-  for (var i = 0; i < paymentInstruments.length; i++) {
-    var paymentInstrument = paymentInstruments[i];
-    if (PaymentInstrument.METHOD_GIFT_CERTIFICATE.equals(paymentInstrument.paymentMethod)) {
-      invalid = false;
-    }
+    for (var i = 0; i < paymentInstruments.length; i++) {
+        var paymentInstrument = paymentInstruments[i];
+        if (PaymentInstrument.METHOD_GIFT_CERTIFICATE.equals(paymentInstrument.paymentMethod)) {
+            invalid = false;
+        }
 
-    var paymentMethod = PaymentMgr.getPaymentMethod(paymentInstrument.getPaymentMethod());
-    if (paymentMethod && applicablePaymentMethods.contains(paymentMethod)) {
-      if (PaymentInstrument.METHOD_CREDIT_CARD.equals(paymentInstrument.paymentMethod)) {
-        var card = PaymentMgr.getPaymentCard(paymentInstrument.creditCardType);
-        // Checks whether payment card is still applicable or if there is a credit card token set.
-        if ((card && applicablePaymentCards.contains(card)) || paymentInstrument.getCreditCardToken()) {
-          invalid = false;
+        var paymentMethod = PaymentMgr.getPaymentMethod(paymentInstrument.getPaymentMethod());
+        if (paymentMethod && applicablePaymentMethods.contains(paymentMethod)) {
+            if (PaymentInstrument.METHOD_CREDIT_CARD.equals(paymentInstrument.paymentMethod)) {
+                var card = PaymentMgr.getPaymentCard(paymentInstrument.creditCardType);
+                // Checks whether payment card is still applicable or if there is a credit card token set.
+                if ((card && applicablePaymentCards.contains(card)) || paymentInstrument.getCreditCardToken()) {
+                    invalid = false;
+                }
+            } else {
+                invalid = false;
+            }
         }
-      } else {
-        invalid = false;
-      }
-    }
 
-    if (invalid) {
-      break; // there is an invalid payment instrument
+        if (invalid) {
+            break; // there is an invalid payment instrument
+        }
     }
-  }
 
-  result.error = invalid;
-  return result;
+    result.error = invalid;
+    return result;
 }
 
 /**
@@ -147,8 +151,7 @@ function placeOrder(order, fraudDetectionStatus) {
             order.setExportStatus(Order.EXPORT_STATUS_READY);
             Transaction.commit();
         }
-    }
-    catch
+    } catch
         (e) {
         Transaction.wrap(function () {
             OrderMgr.failOrder(order);
@@ -159,7 +162,7 @@ function placeOrder(order, fraudDetectionStatus) {
 }
 
 module.exports = {
-  handlePayments: handlePayments,
-  placeOrder: placeOrder,
-  validatePayment: validatePayment
+    handlePayments: handlePayments,
+    placeOrder: placeOrder,
+    validatePayment: validatePayment
 };
diff --git a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen.js b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen.js
index a247a5ca2..11fe918d6 100644
--- a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen.js
+++ b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen.js
@@ -3,24 +3,29 @@
  */
 
 'use strict';
-
+var server = require('server');
 var collections = require('*/cartridge/scripts/util/collections');
 var Transaction = require('dw/system/Transaction');
+var Resource = require('dw/web/Resource');
+var Logger = require('dw/system/Logger');
 
 function Handle(basket, paymentInformation) {
-  Transaction.wrap(function () {
-    collections.forEach(basket.getPaymentInstruments(), function (item) {
-      basket.removePaymentInstrument(item);
-    });
+    Transaction.wrap(function () {
+        collections.forEach(basket.getPaymentInstruments(), function (item) {
+            basket.removePaymentInstrument(item);
+        });
 
-    var paymentInstrument = basket.createPaymentInstrument(
-      'Adyen', basket.totalGrossPrice
-    );
-      paymentInstrument.custom.adyenPaymentMethod = session.custom.adyenPaymentMethod;
-      paymentInstrument.custom.adyenIssuerName = session.custom.adyenIssuerName;
-  });
+        var paymentInstrument = basket.createPaymentInstrument(
+            'Adyen', basket.totalGrossPrice
+        );
+        paymentInstrument.custom.adyenPaymentMethod = session.custom.adyenPaymentMethod;
+        if (session.custom.adyenIssuerName) {
+            paymentInstrument.custom.adyenIssuerName = session.custom.adyenIssuerName;
+        }
+
+    });
 
-  return { error: false };
+    return {error: false};
 }
 
 /**
@@ -33,11 +38,56 @@ function Handle(basket, paymentInformation) {
  */
 
 function Authorize(orderNumber, paymentInstrument, paymentProcessor) {
-  Transaction.wrap(function () {
-    paymentInstrument.paymentTransaction.transactionID = orderNumber;
-    paymentInstrument.paymentTransaction.paymentProcessor = paymentProcessor;
-  });
-    return { authorized: true, error: false };
+    Transaction.wrap(function () {
+        paymentInstrument.paymentTransaction.transactionID = orderNumber;
+        paymentInstrument.paymentTransaction.paymentProcessor = paymentProcessor;
+    });
+
+    var adyenPaymentForm = server.forms.getForm('billing').adyenPaymentFields;
+
+    var OrderMgr = require('dw/order/OrderMgr');
+    var order = OrderMgr.getOrder(orderNumber);
+
+    var adyenCheckout = require('int_adyen_overlay/cartridge/scripts/adyenCheckout');
+    Transaction.begin();
+
+    var result = adyenCheckout.alternativePaymentMethod({
+        Order: order,
+        Amount: paymentInstrument.paymentTransaction.amount,
+        PaymentInstrument: paymentInstrument,
+        PaymentType: session.custom.paymentType,
+        ratePayFingerprint: session.custom.ratePayFingerprint,
+        adyenFingerprint: session.forms.adyPaydata.adyenFingerprint.value,
+        adyenForm: adyenPaymentForm
+
+    });
+    if (result.error) {
+        var errors = [];
+        errors.push(Resource.msg('error.payment.processor.not.supported', 'checkout', null));
+        return {
+            authorized: false, fieldErrors: [], serverErrors: errors, error: true
+        };
+    }
+
+    if (result.ResultCode == 'RedirectShopper') {
+        Transaction.wrap(function () {
+            paymentInstrument.custom.adyenPaymentData = result.PaymentData;
+        });
+
+        return {
+            authorized: true,
+            order: order,
+            paymentInstrument: paymentInstrument,
+            redirectObject: result.RedirectObject
+        };
+    } else if (result.ResultCode == 'Authorised' || result.ResultCode == 'Received') {
+        return {authorized: true, error: false};
+    } else {
+        Logger.getLogger("Adyen").error("Payment failed, result: " + JSON.stringify(result));
+        return {
+            authorized: false, error: true
+        };
+    }
 }
 
 exports.Handle = Handle;
diff --git a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js
index 04372f6aa..94dc52587 100644
--- a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js
+++ b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js
@@ -16,15 +16,8 @@ function Handle(basket, paymentInformation) {
     var cardErrors = {};
     var serverErrors = [];
     var creditCardForm = server.forms.getForm('billing');
-    var cardType = paymentInformation.cardType.value;
+    var cardType = AdyenHelper.getSFCCCardType(paymentInformation.cardType.value);
     var tokenID = AdyenHelper.getCardToken(creditCardForm.creditCardFields.selectedCardID.value, customer);
-    var encryptedData = creditCardForm.creditCardFields.adyenEncryptedData.value;
-    var adyenCseEnabled = AdyenHelper.getAdyenCseEnabled();
-
-    if (empty(tokenID) && (!adyenCseEnabled || empty(encryptedData))) {
-        return {error: true};
-    }
-
     Transaction.wrap(function () {
         collections.forEach(currentBasket.getPaymentInstruments(), function (item) {
             currentBasket.removePaymentInstrument(item);
@@ -35,11 +28,12 @@ function Handle(basket, paymentInformation) {
         );
 
         paymentInstrument.setCreditCardNumber(paymentInformation.cardNumber.value);
-        paymentInstrument.setCreditCardExpirationMonth(paymentInformation.expirationMonth.value);
-        paymentInstrument.setCreditCardExpirationYear(paymentInformation.expirationYear.value);
         paymentInstrument.setCreditCardType(cardType);
 
         if (!empty(tokenID)) {
+            paymentInstrument.setCreditCardExpirationMonth(paymentInformation.expirationMonth.value);
+            paymentInstrument.setCreditCardExpirationYear(paymentInformation.expirationYear.value)
+            paymentInstrument.setCreditCardType(paymentInformation.cardType.value);
             paymentInstrument.setCreditCardToken(tokenID);
         }
 
@@ -61,12 +55,13 @@ function Authorize(orderNumber, paymentInstrument, paymentProcessor) {
     var Transaction = require('dw/system/Transaction');
     var order = OrderMgr.getOrder(orderNumber);
     var creditCardForm = server.forms.getForm('billing').creditCardFields;
-    var adyenCreditVerification = require('int_adyen_overlay/cartridge/scripts/adyenCreditVerification');
+    var adyenCheckout = require('int_adyen_overlay/cartridge/scripts/adyenCheckout');
     Transaction.wrap(function () {
         paymentInstrument.paymentTransaction.paymentProcessor = paymentProcessor;
     });
     Transaction.begin();
-    var result = adyenCreditVerification.verify({
+
+    var result = adyenCheckout.creditCard({
         Order: order,
         Amount: paymentInstrument.paymentTransaction.amount,
         CurrentSession: session,
@@ -84,8 +79,12 @@ function Authorize(orderNumber, paymentInstrument, paymentProcessor) {
         };
     }
 
-    if (result.IssuerUrl != '') {
+    if (result.RedirectObject != '') {
         Transaction.commit();
+        Transaction.wrap(function () {
+            paymentInstrument.custom.adyenPaymentData = result.PaymentData;
+        });
+
         session.custom.orderNo = order.orderNo;
         session.custom.paymentMethod = paymentInstrument.paymentMethod;
         return {
@@ -93,9 +92,7 @@ function Authorize(orderNumber, paymentInstrument, paymentProcessor) {
             authorized3d: true,
             order: order,
             paymentInstrument: paymentInstrument,
-            issuerUrl: result.IssuerUrl,
-            paRequest: result.PaRequest,
-            md: result.MD
+            redirectObject: result.RedirectObject
         };
     }
 
@@ -131,7 +128,7 @@ function Authorize(orderNumber, paymentInstrument, paymentProcessor) {
 
     Transaction.commit();
 
-    return { authorized: true, error: false };
+    return {authorized: true, error: false};
 }
 
 
diff --git a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit_form_processor.js b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit_form_processor.js
index 6ac4e47d5..f2c9aa66b 100644
--- a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit_form_processor.js
+++ b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit_form_processor.js
@@ -38,38 +38,33 @@ function processForm(req, paymentForm, viewFormData) {
         htmlName: paymentForm.paymentMethod.value
     };
 
+    viewData.adyenEncryptedCardNumber = paymentForm.creditCardFields.adyenEncryptedCardNumber.value;
+    viewData.adyenEncryptedExpiryMonth = paymentForm.creditCardFields.adyenEncryptedExpiryMonth.value;
+    viewData.adyenEncryptedExpiryYear = paymentForm.creditCardFields.adyenEncryptedExpiryYear.value;
+    viewData.adyenEncryptedSecurityCode = paymentForm.creditCardFields.adyenEncryptedSecurityCode.value;
+
     viewData.paymentInformation = {
         cardType: {
-            value: paymentForm.creditCardFields.cardType.value,
-            htmlName: paymentForm.creditCardFields.cardType.htmlName
+            value: paymentForm.creditCardFields.cardType.value
         },
         cardNumber: {
-            value: paymentForm.creditCardFields.cardNumber.value,
-            htmlName: paymentForm.creditCardFields.cardNumber.htmlName
-        },
-        securityCode: {
-            value: paymentForm.creditCardFields.securityCode.value,
-            htmlName: paymentForm.creditCardFields.securityCode.htmlName
+            value: paymentForm.creditCardFields.cardNumber.value
         },
         expirationMonth: {
-            value: parseInt(
-                paymentForm.creditCardFields.expirationMonth.selectedOption,
-                10
-            ),
-            htmlName: paymentForm.creditCardFields.expirationMonth.htmlName
+            value: parseInt(paymentForm.creditCardFields.expirationMonth.selectedOption, 10)
         },
         expirationYear: {
-            value: parseInt(paymentForm.creditCardFields.expirationYear.value, 10),
-            htmlName: paymentForm.creditCardFields.expirationYear.htmlName
+            value: parseInt(paymentForm.creditCardFields.expirationYear.value, 10)
+        },
+        securityCode: {
+            value: paymentForm.creditCardFields.adyenEncryptedSecurityCode.value
         }
     };
 
-    if (req.form.storedPaymentUUID) {
-        viewData.storedPaymentUUID = req.form.storedPaymentUUID;
+    if (paymentForm.creditCardFields.selectedCardID) {
+        viewData.storedPaymentUUID = paymentForm.creditCardFields.selectedCardID.value;
     }
 
-    viewData.adyenEncryptedData = getEncryptedData();
-
     viewData.saveCard = paymentForm.creditCardFields.saveCard.checked;
 
     // process payment information
diff --git a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_form_processor.js b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_form_processor.js
index b7d11c761..fad5170e8 100644
--- a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_form_processor.js
+++ b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_form_processor.js
@@ -1,7 +1,6 @@
 'use strict';
 
 var server = require('server');
-var Logger = require('dw/system/Logger');
 
 var COHelpers = require('*/cartridge/scripts/checkout/checkoutHelpers');
 
@@ -20,11 +19,17 @@ function processForm(req, paymentForm, viewFormData) {
         htmlName: paymentForm.paymentMethod.value
     };
 
-    // set selected brandCode & issuerId to session variable
-    session.custom.brandCode = req.form.brandCode;
-    session.custom.adyenPaymentMethod = req.form.adyenPaymentMethod;
-    session.custom.issuerId = req.form.issuerId;
-    session.custom.adyenIssuerName = req.form.adyenIssuerName;
+    session.custom.paymentType = req.form.brandCode;
+    if (typeof req.form.adyenPaymentMethod !== "undefined") {
+        session.custom.adyenPaymentMethod = req.form.adyenPaymentMethod;
+    } else {
+        session.custom.adyenPaymentMethod = null;
+    }
+    if (typeof req.form.adyenIssuerName !== "undefined") {
+        session.custom.adyenIssuerName = req.form.adyenIssuerName;
+    } else {
+        session.custom.adyenIssuerName = null;
+    }
 
     return {
         error: false,
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/account/payment/paymentForm.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/account/payment/paymentForm.isml
index 85adc3549..b122fe287 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/account/payment/paymentForm.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/account/payment/paymentForm.isml
@@ -1,120 +1,46 @@
 <isscript>
     var assets = require('*/cartridge/scripts/assets.js');
-    assets.addJs('/js/adyen-cse.js');
     assets.addCss('/css/adyenCss.css');
+    assets.addJs('/js/adyenSecureFields.js');
+    assets.addCss('/css/adyen-checkout-2.1.0.css');
 </isscript>
-<iscontent type="text/html" encoding="off" />
+<iscontent type="text/html" encoding="off"/>
 <isset name="AdyenHelper" value="${require('*/cartridge/scripts/util/AdyenHelper')}" scope="pdict"/>
-<script src="${pdict.AdyenHelper.getCSEJsUrl()}" type="text/javascript"></script>
-
-
+<script src="${pdict.AdyenHelper.getCheckoutUrl()}" type="text/javascript"></script>
 <form
-    action="${URLUtils.url('PaymentInstruments-SavePayment', 'UUID', pdict.UUID)}"
-    class="payment-form"
-    method="POST"
-    name="payment-form" ${pdict.paymentForm.attributes}>
-
-    <!-- Credit Card Type -->
-    <input type="hidden" class="form-control" id="cardType" value="" autocomplete="cc-type">
-
-    <input type="hidden" class="form-control adyenEncryptedData" id="adyenEncryptedData" ${pdict.paymentForm.adyenEncryptedData.attributes} >
-    <input type="hidden" value="${pdict.AdyenHelper.getAdyenCseDateField()}" data-encrypted-name="generationtime" id="adyen_generationtime"/>
-
-    <!-- Name on Card -->
-    <div class="form-group
-        <isif condition="${pdict.paymentForm.cardOwner.mandatory === true}">required</isif>">
-        <label class="form-control-label" for="holderName">
-            <isprint value="${pdict.paymentForm.cardOwner.label}" encoding="htmlcontent" />
-        </label>
-        <input type="text" class="form-control" id="holderName" data-encrypted-name="holderName"
-            autocomplete="cc-name">
-        <div class="invalid-feedback">
-            <isprint value="${pdict.paymentForm.cardOwner.error}" encoding="htmlcontent" />
-        </div>
-    </div>
-
-    <isif condition="${pdict.UUID}">
-        <!-- Edit Card Number -->
-        <div class="form-group">
-            ${pdict.paymentForm.editNumber.label}
-            <span class="info-icon">
-                <span class="icon">i</span>
-                <div class="tooltip">
-                    ${Resource.msg('msg.edit.card.tooltip','payment',null)}
-                </div>
-            </span>
-            <p class="masked-card-number">${pdict.paymentForm.editNumber.htmlValue}</p>
-        </div>
-        <iselse>
-        <!-- Card Number -->
-        <div class="form-group
-            <isif condition="${pdict.paymentForm.cardNumber.mandatory === true}">required</isif>">
-            <label class="form-control-label" for="cardNumber">
-                <isprint value="${pdict.paymentForm.cardNumber.label}" encoding="htmlcontent" />
-            </label>
-            <div class="card-number-wrapper">
-                <input type="text" class="form-control" id="cardNumber" data-encrypted-name="number"
-                    autocomplete="cc-number">
-                <div class="invalid-feedback">
-                    <isprint value="${pdict.paymentForm.cardNumber.error}" encoding="htmlcontent" />
-                </div>
-            </div>
-        </div>
-    </isif>
+        action="${URLUtils.url('PaymentInstruments-SavePayment', 'UUID', pdict.UUID)}"
+        class="payment-form"
+        method="POST"
+        name="payment-form" ${pdict.paymentForm.attributes}>
+
+    <input type="hidden" id="currentLocale" value="${request.locale}"/>
+    <iscontent type="text/html" encoding="off"/>
+    <input type="hidden" class="form-control cardNumber" id="cardNumber" ${pdict.paymentForm.cardNumber.attributes}>
+    <input type="hidden" class="form-control" id="cardType" ${pdict.paymentForm.cardType.attributes}>
+
+    <input type="hidden" class="form-control adyenEncryptedCardNumber" id="adyenEncryptedCardNumber"
+           ${pdict.paymentForm.adyenEncryptedCardNumber.attributes}>
+    <input type="hidden" class="form-control adyenEncryptedExpiryMonth" id="adyenEncryptedExpiryMonth"
+           ${pdict.paymentForm.adyenEncryptedExpiryMonth.attributes}>
+    <input type="hidden" class="form-control adyenEncryptedExpiryYear" id="adyenEncryptedExpiryYear"
+           ${pdict.paymentForm.adyenEncryptedExpiryYear.attributes}>
+    <input type="hidden" class="form-control adyenEncryptedSecurityCode" id="adyenEncryptedSecurityCode"
+           ${pdict.paymentForm.adyenEncryptedSecurityCode.attributes}>
 
-    <!-- Month -->
     <div class="row">
-        <div class="col-6">
-            <div class="form-group
-                <isif condition="${pdict.paymentForm.expirationMonth.mandatory === true}">required</isif>">
-                <label class="form-control-label" for="expirationMonth">
-                    <isprint value="${pdict.paymentForm.expirationMonth.label}" encoding="htmlcontent" />
-                </label>
-                <select class="form-control custom-select" id="expirationMonth" data-encrypted-name="expiryMonth" autocomplete="cc-exp-month">
-                    <isloop items=${pdict.paymentForm.expirationMonth.options} var="month">
-                        <option id="${month.id}" value="${month.htmlValue}" <isif condition="${month.selected}">selected</isif> >${month.label}</option>
-                    </isloop>
-                </select>
-                <div class="invalid-feedback">
-                    <isprint value="${pdict.paymentForm.expirationMonth.error}" encoding="htmlcontent" />
-                </div>
-            </div>
-        </div>
-
-        <div class="col-6">
-            <div class="form-group
-                <isif condition="${pdict.paymentForm.expirationYear.mandatory === true}">required</isif>">
-                <label class="form-control-label" for="expirationYear">
-                    <isprint value="${pdict.paymentForm.expirationYear.label}" encoding="htmlcontent" />
-                </label>
-                <select class="form-control custom-select" id="expirationYear" data-encrypted-name="expiryYear" autocomplete="cc-exp-year">
-                    <option value="${pdict.paymentForm.expirationYear.options[0].htmlValue}">${pdict.paymentForm.expirationYear.options[0].label}</option>
-                    <isloop items=${pdict.expirationYears} var="year">
-                        <option id="${year}" value="${year}" <isif condition="${year == pdict.paymentForm.expirationYear.value}">selected</isif> >${year}</option>
-                    </isloop>
-                </select>
-                <div class="invalid-feedback"></div>
-            </div>
-        </div>
-    </div>
-
-    <div class="row">
-        <div class="col-sm-6">
+        <div class="col-12">
             <div class="form-group">
-                <label class="form-control-label" for="securityCode">${Resource.msg('field.credit.card.security.code','creditCard',null)}</label>
-                <span class="info-icon">
-                <span class="icon">i</span>
-                <div class="tooltip">
-                    ${Resource.msg('tooltip.security.code','creditCard',null)}
-                </div>
-            </span>
-                <input type="text" class="form-control securityCode" id="securityCode"
-                       data-encrypted-name="cvc" >
+                <label class="form-control-label" for="cardOwner">${Resource.msg('field.credit.card.holderName','creditCard',null)}</label>
+                <input type="text" class="form-control cardOwner" id="cardOwner"
+                       ${pdict.paymentForm.cardOwner.attributes}>
                 <div class="invalid-feedback"></div>
             </div>
         </div>
     </div>
 
+    <span id="errorLoadComponent"></span>
+    <div id="card"></div>
+
     <input type="hidden" name="${pdict.csrf.tokenName}" value="${pdict.csrf.token}"/>
 
     <!-- Cancel and Save Buttons -->
@@ -123,7 +49,9 @@
             <a href="${URLUtils.url('PaymentInstruments-List')}" class="btn btn-block btn-outline-primary">${Resource.msg('button.cancel','account',null)}</a>
         </div>
         <div class="col">
-            <button type="submit" name="save" class="btn btn-save btn-block btn-primary" value="add-new-payment">${Resource.msg('button.save','account',null)}</button>
+            <button type="submit" name="save" class="btn btn-save btn-block btn-primary" value="add-new-payment">
+                ${Resource.msg('button.save','account',null)}
+            </button>
         </div>
     </div>
 
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/adyenform.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/adyenform.isml
index 638ddfba3..08178912e 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/adyenform.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/adyenform.isml
@@ -7,10 +7,12 @@
         </form>
         <script language="javascript">
             var loaded = false;
-            function load(){
+
+            function load() {
                 document.getElementById('3dform').submit();
                 loaded = true;
             }
+
             load();
         </script>
     </div>
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/alternativePaymentMethodForm.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/alternativePaymentMethodForm.isml
index 1c90b34d9..86253f169 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/alternativePaymentMethodForm.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/alternativePaymentMethodForm.isml
@@ -1,17 +1,31 @@
 <!--- TEMPLATENAME: alternativePaymentMethodForm.isml --->
 <iscontent compact="true"/>
-
-<isset name="directoryLookup" value="${dw.system.Site.getCurrent().getCustomPreferenceValue('Adyen_directoryLookup')}" scope="page"/>
-<input id="OpenInvoiceWhiteList" type="hidden" value="${dw.system.Site.getCurrent().getCustomPreferenceValue('Adyen_Open_Invoice_Whitelist')}">
-<input id="directoryLookup" type="hidden" value="${dw.system.Site.getCurrent().getCustomPreferenceValue('Adyen_directoryLookup')}">
+<iscontent type="text/html" encoding="off"/>
+<isset name="adyenPaymentFields" value="${pdict.forms.billingForm.adyenPaymentFields}" scope="page"/>
+<isset name="directoryLookup" value="${dw.system.Site.getCurrent().getCustomPreferenceValue('Adyen_directoryLookup')}"
+       scope="page"/>
+<input id="OpenInvoiceWhiteList" type="hidden"
+       value="${dw.system.Site.getCurrent().getCustomPreferenceValue('Adyen_Open_Invoice_Whitelist')}">
+<input id="directoryLookup" type="hidden"
+       value="${dw.system.Site.getCurrent().getCustomPreferenceValue('Adyen_directoryLookup')}">
 
 <input id="adyenPaymentMethod" type="hidden" name="adyenPaymentMethod"/>
 <input id="adyenIssuerName" type="hidden" name="adyenIssuerName"/>
+<input id="selectedIssuer" type="hidden" ${adyenPaymentFields.issuer.attributes}/>
+
+<input id="dateOfBirth" type="hidden" ${adyenPaymentFields.dateOfBirth.attributes}/>
+<input id="telephoneNumber" type="hidden" ${adyenPaymentFields.telephoneNumber.attributes}/>
+<input id="gender" type="hidden" ${adyenPaymentFields.gender.attributes}/>
+<input id="socialSecurityNumber" type="hidden" ${adyenPaymentFields.socialSecurityNumber.attributes}/>
+
+<input id="bankAccountOwnerName" type="hidden" ${adyenPaymentFields.bankAccountOwnerName.attributes}/>
+<input id="bankAccountNumber" type="hidden" ${adyenPaymentFields.bankAccountNumber.attributes}/>
+<input id="bankLocationId" type="hidden" ${adyenPaymentFields.bankLocationId.attributes}/>
 
 <isif condition="${directoryLookup}">
     <ul id="paymentMethodsUl">
     </ul>
     <span id="requiredBrandCode" class="invalid-feedback" style="display:none">${Resource.msg('hpp.noPaymentMethodSelected', 'hpp', null)}</span>
-<iselse>
-    <span>${Resource.msg('hpp.empty', 'hpp', null)}</span>
+    <iselse>
+        <span>${Resource.msg('hpp.empty', 'hpp', null)}</span>
 </isif>
\ No newline at end of file
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/creditCardForm.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/creditCardForm.isml
index a6aa0fd02..50723fd0a 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/creditCardForm.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/creditCardForm.isml
@@ -1,118 +1,33 @@
+<script src="${pdict.AdyenHelper.getCheckoutUrl()}" type="text/javascript"></script>
 
+<input type="hidden" id="currentLocale" value="${request.locale}"/>
+<iscontent type="text/html" encoding="off"/>
+<input type="hidden" class="form-control cardNumber" id="cardNumber" ${creditFields.cardNumber.attributes}>
+<input type="hidden" class="form-control" id="cardType" ${creditFields.cardType.attributes}>
 
-<!--- Hidden input for credit card type --->
-<input type="hidden" class="form-control" id="cardType"
-       name="${creditFields.cardType.htmlName}"
-       value="">
+<input type="hidden" class="form-control selectedCardID" value="" id="selectedCardID"
+       ${creditFields.selectedCardID.attributes}>
 
-<script src="${pdict.AdyenHelper.getCSEJsUrl()}" type="text/javascript"></script>
+<input type="hidden" class="form-control adyenEncryptedCardNumber" id="adyenEncryptedCardNumber"
+       ${creditFields.adyenEncryptedCardNumber.attributes}>
+<input type="hidden" class="form-control adyenEncryptedExpiryMonth" id="adyenEncryptedExpiryMonth"
+       ${creditFields.adyenEncryptedExpiryMonth.attributes}>
+<input type="hidden" class="form-control adyenEncryptedExpiryYear" id="adyenEncryptedExpiryYear"
+       ${creditFields.adyenEncryptedExpiryYear.attributes}>
+<input type="hidden" class="form-control adyenEncryptedSecurityCode" id="adyenEncryptedSecurityCode"
+       ${creditFields.adyenEncryptedSecurityCode.attributes}>
+<input type="hidden" class="form-control cardOwner" id="cardOwner" ${creditFields.cardOwner.attributes}>
 
-<iscontent type="text/html" encoding="off" />
-<input type="hidden" class="form-control adyenEncryptedData" id="adyenEncryptedData" ${creditFields.adyenEncryptedData.attributes} >
-
-<input type="hidden" value="${pdict.AdyenHelper.getAdyenCseDateField()}" data-encrypted-name="generationtime" id="adyen_generationtime"/>
-
-<input type="hidden" class="form-control selectedCardID" value="" id="selectedCardID"  ${creditFields.selectedCardID.attributes} >
-
-<div class="row">
-    <div class="col-12">
-        <div class="form-group
-            required">
-            <label class="form-control-label" for="holderName">${Resource.msg('field.credit.card.holderName','creditCard',null)}</label>
-            <input type="text" class="form-control holderName" id="holderName"
-
-                   data-encrypted-name="holderName">
-            <div class="invalid-feedback"></div>
-        </div>
-    </div>
-</div>
-
-<div class="row">
-    <div class="col-12">
-        <div class="form-group
-            <isif condition=${creditFields.cardNumber.mandatory === true}>required</isif>
-            ${creditFields.cardNumber.htmlName}">
-            <label class="form-control-label" for="cardNumber">${Resource.msg('field.credit.card.number','creditCard',null)}</label>
-            <div class="card-number-wrapper">
-                <input type="text" class="form-control cardNumber" autocomplete="cc-number" data-encrypted-name="number" value="" id="cardNumber" ${creditFields.cardNumber.attributes}>
-                <div class="invalid-feedback"></div>
-            </div>
-        </div>
-    </div>
-</div>
-
-<div class="row">
-    <div class="col-6">
-        <div class="form-group
-            <isif condition=${creditFields.expirationMonth.mandatory === true}>required</isif>
-            ${creditFields.expirationMonth.htmlName}">
-            <label class="form-control-label" for="expirationMonth">${Resource.msg('field.credit.card.expiration.month','creditCard',null)}</label>
-            <select class="form-control expirationMonth custom-select" id="expirationMonth" ${creditFields.expirationMonth.attributes}
-                    autocomplete="cc-exp-month" data-encrypted-name="expiryMonth">
-                <isloop items=${creditFields.expirationMonth.options} var="month">
-                    <option id="${month.id}" value="${month.htmlValue}"
-                    <isif condition="${pdict.order.billing.payment.selectedPaymentInstruments
-                            && pdict.order.billing.payment.selectedPaymentInstruments.length > 0
-                            && month.id == pdict.order.billing.payment.selectedPaymentInstruments[0].expirationMonth}">
-                        selected
-                    </isif> >
-                    ${month.label}
-                    </option>
-                </isloop>
-            </select>
-            <div class="invalid-feedback"></div>
-        </div>
-    </div>
-    <div class="col-6">
-        <div class="form-group
-            <isif condition=${creditFields.expirationYear.mandatory === true}>required</isif>
-            ${creditFields.expirationYear.htmlName}">
-            <label class="form-control-label" for="expirationYear">${Resource.msg('field.credit.card.expiration.year','creditCard',null)}</label>
-            <select class="form-control expirationYear custom-select" id="expirationYear"
-                    data-encrypted-name="expiryYear" ${creditFields.expirationYear.attributes} autocomplete="cc-exp-year">
-                <option value="${pdict.forms.billingForm.creditCardFields.expirationYear.options[0].htmlValue}">${pdict.forms.billingForm.creditCardFields.expirationYear.options[0].label}</option>
-                <isloop items=${pdict.expirationYears} var="year">
-                    <option id="${year.toFixed(0)}" value="${year.toFixed(0)}"
-                    <isif condition="${pdict.order.billing.payment.selectedPaymentInstruments
-                            && pdict.order.billing.payment.selectedPaymentInstruments.length > 0
-                            && year == pdict.order.billing.payment.selectedPaymentInstruments[0].expirationYear}">
-                        selected
-                    </isif> >
-                    <isprint value="${year}" formatter="####" /></option>
-                </isloop>
-            </select>
-            <div class="invalid-feedback"></div>
-        </div>
-    </div>
-</div>
-
-<div class="row">
-    <div class="col-sm-6">
-        <div class="form-group
-            <isif condition=${creditFields.securityCode.mandatory === true}>required</isif>
-            ${creditFields.securityCode.htmlName}">
-            <label class="form-control-label" for="securityCode">${Resource.msg('field.credit.card.security.code','creditCard',null)}</label>
-            <span class="info-icon">
-                <span class="icon">i</span>
-                <div class="tooltip">
-                    ${Resource.msg('tooltip.security.code','creditCard',null)}
-                </div>
-            </span>
-
-            <input type="text" class="form-control securityCode" id="securityCode"
-                   data-encrypted-name="cvc" >
-            <div class="invalid-feedback"></div>
-        </div>
-    </div>
-</div>
-<span id="invalidCardDetails" class="invalid-feedback" style="display:none">${Resource.msg('creditCard.invalidCardDetails', 'creditCard', null)}</span>
+<span id="errorLoadComponent"></span>
+<div id="card"></div>
 
 <div class="row">
     <div class="col">
         <isif condition="${pdict.customer.registeredUser}">
             <div class="form-check save-credit-card">
                 <label class="form-check-label">
-                    <input type="checkbox" class="form-check-input" name="${creditFields.saveCardAdyen.htmlName}" value="true" checked>
+                    <input type="checkbox" class="form-check-input" name="${creditFields.saveCardAdyen.htmlName}"
+                           value="true" checked>
                     ${creditFields.saveCardAdyen.label}
                 </label>
             </div>
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions.isml
index 6f25cb31e..49da2289e 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions.isml
@@ -1,16 +1,16 @@
 <isscript>
     var assets = require('*/cartridge/scripts/assets.js');
-    assets.addJs('/js/adyen-cse.js');
     assets.addCss('/css/adyenCss.css');
+    assets.addCss('/css/adyen-checkout-2.1.0.css');
 </isscript>
-<iscontent type="text/html" encoding="off" />
+<iscontent type="text/html" encoding="off"/>
 <div class="form-nav billing-nav payment-information"
      data-payment-method-id=""
      data-is-new-payment="${pdict.customer.registeredUser && pdict.customer.customerPaymentInstruments.length ? false : true}"
 >
 
     <ul class="nav nav-tabs nav-fill payment-options" id="paymentOptions" role="tablist">
-        <isinclude template="checkout/billing/paymentOptions/paymentOptionsTabs" />
+        <isinclude template="checkout/billing/paymentOptions/paymentOptionsTabs"/>
     </ul>
 </div>
 
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/alternativePaymentMethodSummary.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/alternativePaymentMethodSummary.isml
index 2820269de..0ac6d576b 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/alternativePaymentMethodSummary.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/alternativePaymentMethodSummary.isml
@@ -1,6 +1,3 @@
 <!--- TEMPLATENAME: alternativePaymentMethodSummary.isml --->
 <iscontent compact="true"/>
-<div>${payment.selectedAdyenPM}</div>
-<isif condition="${payment.selectedIssuerName != null}">
-        <div>${payment.selectedIssuerName}</div>
-</isif>
\ No newline at end of file
+<isinclude template="checkout/confirmation/adyenConfirmationDetails"/>
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/alternativePaymentMethodTab.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/alternativePaymentMethodTab.isml
index 4c49b8191..4608506df 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/alternativePaymentMethodTab.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/alternativePaymentMethodTab.isml
@@ -1,10 +1,10 @@
 <li class="nav-item" data-method-id="${paymentOption.ID}">
     <a class="nav-link adyen-tab" data-toggle="tab" href="#adyen-content" role="tab">
         <img class="adyen-option"
-                src="${URLUtils.staticURL('/images/payment-types.png')}"
-                height="32"
-                alt="${paymentOption.name}"
-                title="${paymentOption.name}"
+             src="${URLUtils.staticURL('/images/payment-types.png')}"
+             height="32"
+             alt="${paymentOption.name}"
+             title="${paymentOption.name}"
         >
     </a>
 </li>
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/creditCardSummary.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/creditCardSummary.isml
index 330776183..225600dd8 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/creditCardSummary.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/creditCardSummary.isml
@@ -2,9 +2,12 @@
     <span>${Resource.msg('msg.payment.type.credit', 'confirmation', null)}
     ${payment.type}</span>
 </div>
-<div class="credit-card-number">
-    ${payment.maskedCreditCardNumber}
-</div>
-<div class="credit-card-expiration-date">
-    <span>${Resource.msg('msg.card.type.ending', 'confirmation', null)} ${payment.expirationMonth}/${payment.expirationYear}</span>
-</div>
+<isif condition="${payment.expirationMonth && payment.expirationYear && payment.maskedCreditCardNumber}">
+    <div class="credit-card-number">
+        ${payment.maskedCreditCardNumber}
+    </div>
+    <div class="credit-card-expiration-date">
+        <span>${Resource.msg('msg.card.type.ending', 'confirmation', null)} ${payment.expirationMonth}/${payment.expirationYear}</span>
+    </div>
+</isif>
+
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/paymentOptionsContent.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/paymentOptionsContent.isml
index 2b9bd49bb..96aba1c95 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/paymentOptionsContent.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/paymentOptionsContent.isml
@@ -1,12 +1,12 @@
 <isset name="AdyenHelper" value="${require('*/cartridge/scripts/util/AdyenHelper')}" scope="pdict"/>
-<isset name="AdyenCseEnabled" value="${pdict.AdyenHelper.getAdyenCseEnabled()}" scope="page" />
-
+<isset name="AdyenCseEnabled" value="${pdict.AdyenHelper.getAdyenCseEnabled()}" scope="page"/>
+<script src="${pdict.AdyenHelper.getCheckoutUrl()}" type="text/javascript"></script>
 <isloop items="${pdict.order.billing.payment.applicablePaymentMethods}" var="paymentOption" status="loopSate">
     <isif condition="${paymentOption.ID === 'CREDIT_CARD'}">
-        <isinclude template="checkout/billing/paymentOptions/creditCardContent" />
+        <isinclude template="checkout/billing/paymentOptions/creditCardContent"/>
     </isif>
     <isif condition="${paymentOption.ID === 'Adyen'}">
-        <isinclude template="checkout/billing/paymentOptions/alternativePaymentMethodsContent" />
+        <isinclude template="checkout/billing/paymentOptions/alternativePaymentMethodsContent"/>
     </isif>
 </isloop>
 
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/paymentOptionsSummary.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/paymentOptionsSummary.isml
index 5109ee9d3..f0b831d45 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/paymentOptionsSummary.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/paymentOptionsSummary.isml
@@ -1,10 +1,10 @@
 <div class="payment-details">
     <isloop items="${pdict.order.billing.payment.selectedPaymentInstruments}" var="payment">
         <isif condition="${payment.paymentMethod === 'CREDIT_CARD'}">
-            <isinclude template="checkout/billing/paymentOptions/creditCardSummary" />
+            <isinclude template="checkout/billing/paymentOptions/creditCardSummary"/>
         </isif>
         <isif condition="${payment.paymentMethod === 'Adyen'}">
-            <isinclude template="checkout/billing/paymentOptions/alternativePaymentMethodSummary" />
+            <isinclude template="checkout/billing/paymentOptions/alternativePaymentMethodSummary"/>
         </isif>
     </isloop>
 </div>
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/paymentOptionsTabs.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/paymentOptionsTabs.isml
index 68bad3095..2e339586a 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/paymentOptionsTabs.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/paymentOptionsTabs.isml
@@ -1,10 +1,10 @@
 <isloop items="${pdict.order.billing.payment.applicablePaymentMethods}" var="paymentOption" status="loopSate">
     <isif condition="${paymentOption.ID === 'CREDIT_CARD'}">
-        <isinclude template="checkout/billing/paymentOptions/creditCardTab" />
-        <isslot id="available-payment-methods" description="Available Payment Methods" context="global" />
+        <isinclude template="checkout/billing/paymentOptions/creditCardTab"/>
+        <isslot id="available-payment-methods" description="Available Payment Methods" context="global"/>
     </isif>
     <isif condition="${paymentOption.ID === 'Adyen'}">
-        <isinclude template="checkout/billing/paymentOptions/alternativePaymentMethodTab" />
+        <isinclude template="checkout/billing/paymentOptions/alternativePaymentMethodTab"/>
     </isif>
 </isloop>
 
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/storedPaymentInstruments.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/storedPaymentInstruments.isml
new file mode 100644
index 000000000..46e63b884
--- /dev/null
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/storedPaymentInstruments.isml
@@ -0,0 +1,45 @@
+<isscript>
+    var assets = require('*/cartridge/scripts/assets.js');
+    assets.addCss('/css/adyen-checkout-2.1.0.css');
+</isscript>
+<iscontent type="text/html" encoding="off"/>
+<isloop items="${pdict.customer.customerPaymentInstruments}" var="paymentInstrument" status="loopSate">
+    <div class="row saved-payment-instrument ${loopSate.first ? 'selected-payment' : ''}"
+         data-uuid="${paymentInstrument.UUID}">
+        <div class="form-group saved-security-code col-6 col-md-3">
+            <img class="card-image ${loopSate.first ? 'checkout-hidden' : ''}"
+                 src="${paymentInstrument.cardTypeImage.src}"
+                 alt="${paymentInstrument.cardTypeImage.alt}"
+            >
+            <div class="security-code-input ${loopSate.first ? '' : 'checkout-hidden'}">
+                <label class="form-control-label">${Resource.msg('label.credit.card-security.code','checkout',null)}</label>
+                <span class="info-icon">
+                    <span class="icon">i</span>
+                    <div class="tooltip">
+                        ${Resource.msg('tooltip.security.code','creditCard',null)}
+                    </div>
+                </span>
+
+                <div id="cvc-${paymentInstrument.UUID}" class="cvc-container"></div>
+                <input type="hidden" class="saved-payment-security-code"
+                       id="saved-payment-security-code-${paymentInstrument.UUID}">
+            </div>
+        </div>
+        <div class="saved-payment-information col-6 col-md-9">
+            <div class="saved-credit-card-type">
+                <span id="cardType-${paymentInstrument.UUID}">
+                    ${paymentInstrument.creditCardType}
+                </span>
+            </div>
+            <div class="saved-credit-card-number">
+                ${paymentInstrument.maskedCreditCardNumber}
+            </div>
+            <div class="saved-credit-card-expiration-date">
+                <span>
+                    ${Resource.msg('msg.card.type.ending', 'confirmation', null)}
+                    ${paymentInstrument.creditCardExpirationMonth}/${paymentInstrument.creditCardExpirationYear}
+                </span>
+            </div>
+        </div>
+    </div>
+</isloop>
\ No newline at end of file
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/confirmation/adyenConfirmationDetails.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/confirmation/adyenConfirmationDetails.isml
new file mode 100644
index 000000000..cfe5ea435
--- /dev/null
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/confirmation/adyenConfirmationDetails.isml
@@ -0,0 +1,52 @@
+<div>${payment.selectedAdyenPM}</div>
+<isif condition="${payment.selectedIssuerName != null}">
+    <div>${payment.selectedIssuerName}</div>
+</isif>
+<br/>
+<isif condition="${payment.adyenAdditionalPaymentData}">
+    <isloop items="${payment.adyenAdditionalPaymentData}" var="additionalItem">
+
+        <!--- Payment details for Banktransfer --->
+        <isif condition="${additionalItem.key == 'bankTransfer.description'}">
+            <span class="summary-section-label">${Resource.msg('bankTransfer.description', 'checkout', null)}:</span><br/>
+            <br/>
+            <span class="summary-section-label">${Resource.msg('bankTransfer.amount', 'checkout', null)}:</span>
+            <span class="summary-details">${pdict.order.totals.grandTotal}</span><br/>
+        </isif>
+        <isif condition="${additionalItem.key == 'bankTransfer.reference'}">
+            <span class="summary-section-label">${Resource.msg('bankTransfer.reference', 'checkout', null)}:</span>
+            <span class="summary-details">${additionalItem.value}</span><br/>
+        </isif>
+        <isif condition="${additionalItem.key == 'bankTransfer.owner'}">
+            <span class="summary-section-label">${Resource.msg('bankTransfer.owner', 'checkout', null)}:</span>
+            <span class="summary-details">${additionalItem.value}</span><br/>
+        </isif>
+        <isif condition="${additionalItem.key == 'bankTransfer.iban'}">
+            <span class="summary-section-label">${Resource.msg('bankTransfer.iban', 'checkout', null)}:</span>
+            <span class="summary-details">${additionalItem.value}</span><br/>
+        </isif>
+
+        <!--- Payment details for Multibanco --->
+        <isif condition="${additionalItem.key == 'comprafacil.description'}">
+            <span class="summary-section-label">${Resource.msg('comprafacil.description', 'checkout', null)}:</span><br/>
+            <br/>
+        </isif>
+        <isif condition="${additionalItem.key == 'comprafacil.deadline'}">
+            <span class="summary-section-label">${Resource.msg('comprafacil.deadline', 'checkout', null)}:</span>
+            <span class="summary-details">${additionalItem.value}</span><br/>
+        </isif>
+        <isif condition="${additionalItem.key == 'comprafacil.reference'}">
+            <span class="summary-section-label">${Resource.msg('comprafacil.reference', 'checkout', null)}:</span>
+            <span class="summary-details">${additionalItem.value}</span><br/>
+        </isif>
+        <isif condition="${additionalItem.key == 'comprafacil.entity'}">
+            <span class="summary-section-label">${Resource.msg('comprafacil.entity', 'checkout', null)}:</span>
+            <span class="summary-details">${additionalItem.value}</span><br/>
+        </isif>
+        <isif condition="${additionalItem.key == 'comprafacil.amount'}">
+            <span class="summary-section-label">${Resource.msg('comprafacil.amount', 'checkout', null)}:</span>
+            <span class="summary-details">${pdict.order.totals.grandTotal}</span><br/>
+        </isif>
+    </isloop>
+</isif>
+
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/confirmation/confirmationEmail.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/confirmation/confirmationEmail.isml
index 966464717..8e71283e5 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/confirmation/confirmationEmail.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/confirmation/confirmationEmail.isml
@@ -39,7 +39,7 @@
 
         <isif condition="${pdict.order.shipping.length > 1}">
             <strong>${Resource.msg('label.order.products', 'confirmation', null)}:</strong> <br/>
-            <isloop items="${shippingModel.productLineItems.items}" var="lineItem" status="loopSate">
+            <isloop items="${shippingModel.productLineItems.items}" var="lineItem">
                 <p>
                     ${Resource.msg('label.order.product.name', 'confirmation', null)}: ${lineItem.productName}
                     <br/>
@@ -47,13 +47,13 @@
                     <isif condition="${lineItem.productType === 'bundle'}">
                         <isloop items="${lineItem.bundledProductLineItems}" var="bundledLineItem">
                             ${Resource.msg('label.order.bundled.item.name', 'confirmation', null)}: ${bundledLineItem.productName}
+                            <br/>
+                            <isloop items="${bundledLineItem.variationAttributes}" var="attribute">
+                                ${attribute.displayName}: ${attribute.displayValue}
                                 <br/>
-                                <isloop items="${bundledLineItem.variationAttributes}" var="attribute">
-                                    ${attribute.displayName}: ${attribute.displayValue}
-                                    <br/>
-                                </isloop>
+                            </isloop>
                         </isloop>
-                    <iselse/>
+                        <iselse/>
                         <isloop items="${lineItem.variationAttributes}" var="attribute">
                             ${attribute.displayName}: ${attribute.displayValue}
                             <br/>
@@ -93,22 +93,10 @@
         <div>
             <isloop items="${pdict.order.billing.payment.selectedPaymentInstruments}" var="payment">
                 <isif condition="${payment.paymentMethod === 'CREDIT_CARD'}">
-                    <div>
-                        <span>${Resource.msg('msg.payment.type.credit', 'confirmation', null)}
-                            ${payment.type}</span>
-                    </div>
-                    <div>
-                        ${payment.maskedCreditCardNumber}
-                    </div>
-                    <div>
-                        <span>${Resource.msg('msg.card.type.ending', 'confirmation', null)} ${payment.expirationMonth}/${payment.expirationYear}</span>
-                    </div>
+                    <isinclude template="checkout/billing/paymentOptions/creditCardSummary"/>
                 </isif>
                 <isif condition="${payment.paymentMethod === 'Adyen'}">
-                    <div>${payment.selectedAdyenPM}</div>
-                    <isif condition="${payment.selectedIssuerName != null}">
-                        <div>${payment.selectedIssuerName}</div>
-                    </isif>
+                    <isinclude template="checkout/confirmation/adyenConfirmationDetails"/>
                 </isif>
             </isloop>
         </div>
@@ -123,7 +111,7 @@
     <br/>
     <isif condition="${pdict.order.shipping.length === 1}">
         <strong>${Resource.msg('label.order.products', 'confirmation', null)}:</strong> <br/>
-        <isloop items="${pdict.order.items.items}" var="lineItem" status="loopSate">
+        <isloop items="${pdict.order.items.items}" var="lineItem">
             <p>
                 ${Resource.msg('label.order.product.name', 'confirmation', null)}: ${lineItem.productName}
                 <br/>
@@ -131,13 +119,13 @@
                 <isif condition="${lineItem.productType === 'bundle'}">
                     <isloop items="${lineItem.bundledProductLineItems}" var="bundledLineItem">
                         ${Resource.msg('label.order.bundled.item.name', 'confirmation', null)}: ${bundledLineItem.productName}
+                        <br/>
+                        <isloop items="${bundledLineItem.variationAttributes}" var="attribute">
+                            ${attribute.displayName}: ${attribute.displayValue}
                             <br/>
-                            <isloop items="${bundledLineItem.variationAttributes}" var="attribute">
-                                ${attribute.displayName}: ${attribute.displayValue}
-                                <br/>
-                            </isloop>
+                        </isloop>
                     </isloop>
-                <iselse/>
+                    <iselse/>
                     <isloop items="${lineItem.variationAttributes}" var="attribute">
                         ${attribute.displayName}: ${attribute.displayValue}
                         <br/>
@@ -145,8 +133,8 @@
                 </isif>
 
                 <isif condition="${lineItem.bonusProductLineItemUUID === 'bonus'}">
-                    <isloop items="${lineItem.bonusProducts}" var="bonusProduct" status="loopstate">
-                        <isif condition="${loopstate.first}">
+                    <isloop items="${lineItem.bonusProducts}" var="bonusProduct" status="loopState">
+                        <isif condition="${loopState.first}">
                             <br/>
                             ${Resource.msg('text.lineitem.bonus.msg','cart',null)}
                         </isif>
@@ -163,9 +151,9 @@
 
                         <!--- quantity --->
                         ${Resource.msg('field.selectquantity','cart',null)}
-                         - <isprint value="${bonusProduct.quantity}" formatter="##" />
+                        - <isprint value="${bonusProduct.quantity}" formatter="##" />
                         <br/>
-                        <isif condition="${loopstate.last}">
+                        <isif condition="${loopState.last}">
                             <br/>
                         </isif>
                     </isloop>
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/redirectHPP.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/redirectHPP.isml
index f88f78d4f..3ed8809d4 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/redirectHPP.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/redirectHPP.isml
@@ -18,14 +18,14 @@
 
     var hppType;
     switch (String(paymentSelection)) {
-        case "one":
-            hppType = 'pay';
-            break;
-        case "multi":
-            hppType = 'select';
-            break;
-        default:
-            hppType = 'pay';
+    case "one":
+    hppType = 'pay';
+    break;
+    case "multi":
+    hppType = 'select';
+    break;
+    default:
+    hppType = 'pay';
     }
 
     var inputType: String = Debug ? 'text' : 'hidden';
@@ -34,24 +34,24 @@
 
     if (directoryLookup) {
 
-        if (AdyenHelper.isOpenInvoiceMethod(paymentMethod) || AdyenHelper.isMolpayMethod(paymentMethod)) {
+    if (AdyenHelper.isOpenInvoiceMethod(paymentMethod) || AdyenHelper.isMolpayMethod(paymentMethod)) {
 
-            var url: String = "https://test.adyen.com/hpp/skipDetails.shtml";
-            if (Mode == "LIVE") {
-                url = "https://live.adyen.com/hpp/skipDetails.shtml";
-            }
-        } else {
-            var url: String = "https://test.adyen.com/hpp/details.shtml";
-            if (Mode == "LIVE") {
-                url = "https://live.adyen.com/hpp/details.shtml";
-            }
-        }
+    var url: String = "https://test.adyen.com/hpp/skipDetails.shtml";
+    if (Mode == "LIVE") {
+    url = "https://live.adyen.com/hpp/skipDetails.shtml";
+    }
+    } else {
+    var url: String = "https://test.adyen.com/hpp/details.shtml";
+    if (Mode == "LIVE") {
+    url = "https://live.adyen.com/hpp/details.shtml";
+    }
+    }
 
     } else {
-        var url: String = "https://test.adyen.com/hpp/" + hppType + ".shtml";
-        if (Mode == "LIVE") {
-            url = "https://live.adyen.com/hpp/" + hppType + ".shtml";
-        }
+    var url: String = "https://test.adyen.com/hpp/" + hppType + ".shtml";
+    if (Mode == "LIVE") {
+    url = "https://live.adyen.com/hpp/" + hppType + ".shtml";
+    }
     }
 </isscript>
 
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/resources/checkout.properties b/cartridges/int_adyen_SFRA/cartridge/templates/resources/checkout.properties
deleted file mode 100644
index ab94db37d..000000000
--- a/cartridges/int_adyen_SFRA/cartridge/templates/resources/checkout.properties
+++ /dev/null
@@ -1 +0,0 @@
-error.placeorder=An error occurred placing this order. Please contact the vendor.
\ No newline at end of file
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/resources/creditCard.properties b/cartridges/int_adyen_SFRA/cartridge/templates/resources/creditCard.properties
index 493f0f149..f203e519b 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/resources/creditCard.properties
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/resources/creditCard.properties
@@ -1,2 +1,3 @@
 field.credit.card.holderName=Cardholder name
+load.component.error=Error while loading Secured Fields component
 creditCard.invalidCardDetails=Invalid card details
\ No newline at end of file
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/resources/hpp.properties b/cartridges/int_adyen_SFRA/cartridge/templates/resources/hpp.properties
index a19d1d839..0b067b109 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/resources/hpp.properties
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/resources/hpp.properties
@@ -1,3 +1,3 @@
 hpp.noPaymentMethodSelected=Please select a payment method
-hpp.description.ideal = Dutch payment method example description
-hpp.description.paypal = PayPal example description
\ No newline at end of file
+hpp.description.ideal=Dutch payment method example description
+hpp.description.paypal=PayPal example description
\ No newline at end of file
diff --git a/cartridges/int_adyen_controllers/.DS_Store b/cartridges/int_adyen_controllers/.DS_Store
new file mode 100644
index 000000000..e69de29bb
diff --git a/cartridges/int_adyen_controllers/cartridge/.DS_Store b/cartridges/int_adyen_controllers/cartridge/.DS_Store
new file mode 100644
index 000000000..e69de29bb
diff --git a/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js b/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js
index 9eb1aef3d..570ded272 100644
--- a/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js
+++ b/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js
@@ -3,7 +3,7 @@
 /* API Includes */
 var Resource = require('dw/web/Resource');
 var URLUtils = require('dw/web/URLUtils');
-var Logger = require('dw/system/Logger');
+var logger = require('dw/system/Logger').getLogger('Adyen', 'adyen');
 var OrderMgr = require('dw/order/OrderMgr');
 var BasketMgr = require('dw/order/BasketMgr');
 var Site = require('dw/system/Site');
@@ -15,8 +15,9 @@ var Transaction = require('dw/system/Transaction');
 var app = require('app_storefront_controllers/cartridge/scripts/app');
 var guard = require('app_storefront_controllers/cartridge/scripts/guard');
 var AdyenHelper = require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper');
-
+var Logger = require('dw/system/Logger')
 var OrderModel = app.getModel('Order');
+var Logger = require('dw/system/Logger');
 
 const EXTERNAL_PLATFORM_VERSION = "SiteGenesis";
 /**
@@ -56,138 +57,95 @@ function notify() {
 /**
  * Redirect to Adyen after saving order etc.
  */
-function redirect(order) {
-	var	adyenVerificationSHA256 = require('int_adyen_overlay/cartridge/scripts/adyenRedirectVerificationSHA256'),
-	result;
-	
-	Transaction.wrap(function () {
-		result = adyenVerificationSHA256.verify({
-			'Order': order,
-			'OrderNo': order.orderNo,
-			'CurrentSession' : session,
-			'CurrentUser' : customer,
-			'PaymentInstrument' : order.paymentInstrument,
-			'brandCode': session.custom.brandCode,
-			'issuerId' : request.httpParameterMap.issuerId.value,
-			'dob' : session.forms.adyPaydata.dob.value,
-			'gender' : session.forms.adyPaydata.gender.value,
-			'houseNumber' : session.forms.adyPaydata.houseNumber.value,
-			'houseExtension' : session.forms.adyPaydata.houseExtension.value,
-			'personalNumber' : session.forms.adyPaydata.personalNumber.value,
-			'ratePayFingerprint' : session.custom.ratePayFingerprint,
-			'adyenFingerprint' : session.forms.adyPaydata.adyenFingerprint.value
-		});
-	});
-	if (result === PIPELET_ERROR) {
-		app.getView().render('error');
-    	return {};
-	}
-	
-	var pdict = {
-		'merchantSig' :	result.merchantSig,
-		'Amount100' : result.Amount100,
-		'shopperEmail' : result.shopperEmail,
-		'shopperReference' : result.shopperReference,
-		'ParamsMap' : result.paramsMap,
-		'SessionValidity' : result.sessionValidity,
-		'Order': order,
-		'OrderNo': order.orderNo
-	};
-
-	app.getView(pdict).render('redirect_sha256');
+function redirect(order, redirectUrl) {
+	response.redirect(redirectUrl);
 }
 
 /**
  * Show confirmation after return from Adyen
  */
 function showConfirmation() {
-	var order = null;
-	if (request.httpParameterMap.isParameterSubmitted('merchantReference')) {
-		order = OrderMgr.getOrder(request.httpParameterMap.merchantReference.toString());
-		var adyenOrderPaymentInstrument = AdyenHelper.getAdyenOrderPaymentInstrument(order);
-		if (adyenOrderPaymentInstrument) {
-			var transaction = adyenOrderPaymentInstrument.getPaymentTransaction();
-			Transaction.wrap(function () {
-				AdyenHelper.saveAuthResponseAttributes(transaction, request.httpParameterMap);
-			});
-		}
+	var payLoad = request.httpParameterMap.payload.value;
+	//redirect to payment/details
+	var adyenCheckout = require('int_adyen_overlay/cartridge/scripts/adyenCheckout');
+	var requestObject = {};
+	requestObject['details'] = {};
+	requestObject.details['payload'] = payLoad;
+	var result = adyenCheckout.doPaymentDetailsCall(requestObject);
+	var orderNumber = result.merchantReference;
+
+	if (result.resultCode == 'Authorised' || result.resultCode == 'Pending') {
+		orderConfirm(orderNumber);
+	} else {
+		var OrderMgr = require('dw/order/OrderMgr');
+		var order = OrderMgr.getOrder(orderNumber);
+		// fail order
+		Transaction.wrap(function () {
+			OrderMgr.failOrder(order);
+		});
+		Logger.getLogger("Adyen").error("Payment failed, result: " + JSON.stringify(result));
+		// should be assingned by previous calls or not
+		var errorStatus = new dw.system.Status(dw.system.Status.ERROR, "confirm.error.declined");
+
+		app.getController('COSummary').Start({
+			PlaceOrderError: errorStatus
+		});
 	}
-	
-	/*	AUTHORISED: The payment authorisation was successfully completed.
-		REFUSED: The payment was refused. Payment authorisation was unsuccessful.
-		CANCELLED: The payment was cancelled by the shopper before completion, or the shopper returned to the merchant's site before completing the transaction.
-		PENDING: It is not possible to obtain the final status of the payment.
-		This can happen if the systems providing final status information for the payment are unavailable, or if the shopper needs to take further action to complete the payment.
-		ERROR: An error occurred during the payment processing.
-	*/
-	if (request.httpParameterMap.authResult.value != 'CANCELLED') {
-
-		var requestMap = new Array();
-		for(var item in request.httpParameterMap) {
-			requestMap[item] = request.httpParameterMap.get(item).getStringValue();
-		}
-		
-		var	authorizeConfirmation = require('int_adyen_overlay/cartridge/scripts/authorizeConfirmationCallSHA256');
-    	var authorized = authorizeConfirmation.authorize(requestMap);
-    	if (!authorized) {
-    		app.getController('Error').Start();
-    		return {};
-    	}
+
+	return {};
+}
+
+/**
+ * Separated order confirm for Credit cards and APM's.
+ */
+function orderConfirm(orderNo){
+	var order = null;
+	if (orderNo) {
+		order = OrderMgr.getOrder(orderNo);
 	}
-	
 	if (!order) {
 		app.getController('Error').Start();
 		return {};
 	}
-	
-	//AUTHORISED: The payment authorisation was successfully completed.
-	if (request.httpParameterMap.authResult.value == 'AUTHORISED' || request.httpParameterMap.authResult.value == 'PENDING') {
-		pendingPayment(order);
-		app.getController('COSummary').ShowConfirmation(order);
-		return {};
-	}
-	
-	if (order.status != dw.order.Order.ORDER_STATUS_CREATED) {
-		// If the same order is tried to be cancelled more than one time, show Error page to user
-		if (request.httpParameterMap.authResult.value == 'CANCELLED') {
-			app.getController('Error').Start();
-		} else {
-			// TODO: check is there should be errro value { PlaceOrderError: pdict.PlaceOrderError }
-			app.getController('COSummary').Start();
-		}
-		return {};
-	}
-	
-	// Handle Cancelled or Refused payments
-	cancelledPayment(order);
-	refusedPayment(order);
-	// fail order
-	Transaction.wrap(function () {
-		OrderMgr.failOrder(order);
-	});
-	
-	// should be assingned by previous calls or not
-	var errorStatus = new dw.system.Status(dw.system.Status.ERROR, "confirm.error.declined");
-	
-	app.getController('COSummary').Start({
-            PlaceOrderError: errorStatus
-        });
-    return {};
+	app.getController('COSummary').ShowConfirmation(order);
 }
 
 /**
  * Make a request to Adyen to get payment methods based on countryCode. Called from COBilling-Start
  */
 function getPaymentMethods(cart) {
-    // TODO: check is that used CSE Enabled (AdyenCseEnabled) Site.getCurrent().getCustomPreferenceValue("AdyenCseEnabled");
-    // Site.getCurrent().getCustomPreferenceValue("Adyen_directoryLookup")
     if (Site.getCurrent().getCustomPreferenceValue("Adyen_directoryLookup")) {
-        var	getPaymentMethods = require('int_adyen_overlay/cartridge/scripts/getPaymentMethodsSHA256');
-        return getPaymentMethods.getMethods(cart.object);
+    	var Locale = require('dw/util/Locale');
+        var countryCode = Locale.getLocale(request.getLocale()).country;       
+        var currentBasket = BasketMgr.getCurrentBasket();
+        if (currentBasket.getShipments().length > 0 && currentBasket.getShipments()[0].shippingAddress) {
+            countryCode = currentBasket.getShipments()[0].shippingAddress.getCountryCode().value.toUpperCase();
+        }
+        var	getPaymentMethods = require('int_adyen_overlay/cartridge/scripts/adyenGetPaymentMethods');
+        var paymentMethods = getPaymentMethods.getMethods(cart.object, countryCode).paymentMethods;
+        return paymentMethods.filter(function (method) { 
+        	return !isMethodTypeBlocked(method.type); 
+        });
     }
+    
     return {};
 }
 
+/**
+ * Checks if payment method is blocked
+ */
+function isMethodTypeBlocked(methodType)
+{
+	if (methodType.indexOf('bcmc_mobile_QR') !== -1 ||
+		(methodType.indexOf('wechatpay') !== -1 && methodType.indexOf('wechatpayWeb') === -1) ||
+		methodType == "scheme"
+	) {
+		return true;
+	}
+	
+	return false;
+}
+
 /**
  * Make a request to Adyen to get payment methods based on countryCode. Meant for AJAX storefront requests
  */
@@ -377,68 +335,78 @@ function cancelOrRefund() {
  * 
  * @returns redering template or error
  */
-function authorizeWithForm()
-{
-	var	adyen3DVerification = require('int_adyen_overlay/cartridge/scripts/adyen3DVerification'), result, order, paymentInstrument,
-	adyenResponse  = session.custom.adyenResponse;
-
-	if(session.custom.orderNo && session.custom.paymentMethod) {
-		try {
-			order = OrderMgr.getOrder(session.custom.orderNo);
-			paymentInstrument = order.getPaymentInstruments(session.custom.paymentMethod)[0];
-		}
-		catch(e){
-			Logger.getLogger("Adyen").error("Unable to retrieve order data from session.");
-			Transaction.wrap(function () {
-				OrderMgr.failOrder(order);
-			});
-			app.getController('COSummary').Start({
-				PlaceOrderError: new Status(Status.ERROR, 'confirm.error.declined', '')
-			});
-			return {};
-		}
-
-		clearCustomSessionFields();
-		Transaction.begin();
-		result = adyen3DVerification.verify({
-			Order: order,
-			Amount: paymentInstrument.paymentTransaction.amount,
-			PaymentInstrument: paymentInstrument,
-			CurrentSession: session,
-			CurrentRequest: request,
-			MD: adyenResponse.MD,
-			PaResponse: adyenResponse.PaRes
-		});
-
-		if (result.error || result.Decision != 'ACCEPT') {
-			Transaction.rollback();
-			Transaction.wrap(function () {
-				OrderMgr.failOrder(order);
-			});
-			app.getController('COSummary').Start({
-				PlaceOrderError: new Status(Status.ERROR, 'confirm.error.declined', '')
-			});
-			return {};
-		}
-
-		order.setPaymentStatus(dw.order.Order.PAYMENT_STATUS_PAID);
-		order.setExportStatus(dw.order.Order.EXPORT_STATUS_READY);
-		paymentInstrument.paymentTransaction.transactionID = result.RequestToken;
-		Transaction.commit();
-
-		OrderModel.submit(order);
-		clearForms();
-		app.getController('COSummary').ShowConfirmation(order);
-		return {};
-	}
-	else {
-		Logger.getLogger("Adyen").error("Session variable does not exists");
-		app.getController('COSummary').Start({
-			PlaceOrderError: new Status(Status.ERROR, 'confirm.error.declined', '')
-		});
-		return {};
-	}
-
+function authorizeWithForm() {
+	var order;
+	var paymentInstrument;
+	var	adyenResponse = session.custom.adyenResponse;
+
+    if(session.custom.orderNo && session.custom.paymentMethod) {
+        try {
+            order = OrderMgr.getOrder(session.custom.orderNo);
+            paymentInstrument = order.getPaymentInstruments(session.custom.paymentMethod)[0];
+        } catch (e) {
+            Logger.getLogger("Adyen").error("Unable to retrieve order data from session.");
+            Transaction.wrap(function () {
+                OrderMgr.failOrder(order);
+            });
+            app.getController('COSummary').Start({
+                PlaceOrderError: new Status(Status.ERROR, 'confirm.error.declined', '')
+            });
+            return {};
+        }
+
+        clearCustomSessionFields();
+        Transaction.begin();
+        var adyenCheckout = require('int_adyen_overlay/cartridge/scripts/adyenCheckout');
+        var jsonRequest = {
+            "paymentData": paymentInstrument.custom.adyenPaymentData,
+            "details": {
+                "MD": adyenResponse.MD,
+                "PaRes": adyenResponse.PaRes
+            }
+        };
+
+        var result = adyenCheckout.doPaymentDetailsCall(jsonRequest);
+
+        if (result.error || result.resultCode != 'Authorised') {
+            Transaction.rollback();
+            Transaction.wrap(function () {
+                paymentInstrument.custom.adyenPaymentData = null;
+                OrderMgr.failOrder(order);
+            });
+            app.getController('COSummary').Start({
+                PlaceOrderError: new Status(Status.ERROR, 'confirm.error.declined', '')
+            });
+            return {};
+        }
+        if ('pspReference' in result && !empty(result.pspReference)) {
+            paymentInstrument.paymentTransaction.transactionID = result.pspReference;
+            order.custom.Adyen_pspReference = result.pspReference;
+        }
+        if ('resultCode' in result && !empty(result.resultCode)) {
+            paymentInstrument.paymentTransaction.custom.authCode = result.resultCode;
+        }
+
+        // Save full response to transaction custom attribute
+        paymentInstrument.paymentTransaction.custom.Adyen_log = JSON.stringify(result);
+
+        order.setPaymentStatus(dw.order.Order.PAYMENT_STATUS_PAID);
+        order.setExportStatus(dw.order.Order.EXPORT_STATUS_READY);
+        paymentInstrument.custom.adyenPaymentData = null;
+        Transaction.commit();
+
+        OrderModel.submit(order);
+        clearForms();
+        app.getController('COSummary').ShowConfirmation(order);
+        return {};
+    }
+    else {
+        Logger.getLogger("Adyen").error("Session variable does not exists");
+        app.getController('COSummary').Start({
+            PlaceOrderError: new Status(Status.ERROR, 'confirm.error.declined', '')
+        });
+        return {};
+    }
 }
 
 /**
@@ -497,6 +465,8 @@ exports.Afterpay = guard.ensure(['get'], afterpay);
 
 exports.ShowConfirmation = guard.httpsGet(showConfirmation);
 
+exports.OrderConfirm = guard.httpsGet(orderConfirm);
+
 exports.GetPaymentMethods = getPaymentMethods;
 
 exports.GetPaymentMethodsJSON = guard.ensure(['get'], getPaymentMethodsJSON);
diff --git a/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js b/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js
index f44209991..fcd83273e 100644
--- a/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js
+++ b/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js
@@ -6,6 +6,7 @@ var PaymentMgr = require('dw/order/PaymentMgr');
 var Resource = require('dw/web/Resource');
 var Site = require('dw/system/Site');
 var Transaction = require('dw/system/Transaction');
+var Logger = require('dw/system/Logger');
 
 /* Script Modules */
 var app = require(Resource.msg('scripts.app.js', 'require', null));
@@ -30,41 +31,14 @@ function Handle(args) {
     var creditCardForm = app.getForm('billing.paymentMethods.creditCard');
     var tokenID = AdyenHelper.getCardToken(creditCardForm.get('selectedCardID').value(), customer);
     var cardType = creditCardForm.get('type').value();
-    var encryptedData = creditCardForm.get('encrypteddata').value();
-    var paymentCard = PaymentMgr.getPaymentCard(cardType);
-    var cardNumber;
-    var cardSecurityCode;
-    var expirationMonth; 
-    var expirationYear;
-    var adyenCseEnabled = Site.getCurrent().getCustomPreferenceValue('AdyenCseEnabled');
-    if (empty(tokenID) && (!adyenCseEnabled || empty(encryptedData))) {
-        // Verify payment card 
-	      cardSecurityCode = creditCardForm.get('cvn').value();
-	      expirationMonth = creditCardForm.get('expiration.month').value();
-	      expirationYear = creditCardForm.get('expiration.year').value();
-	      cardNumber = creditCardForm.get('number').value();
-	      var creditCardStatus = paymentCard.verify(expirationMonth, expirationYear, cardNumber, cardSecurityCode);
-        if (creditCardStatus.error) {
-            var invalidatePaymentCardFormElements = require(Resource.msg('scripts.checkout.invalidatepaymentcardformelements.js', 'require', null));
-            invalidatePaymentCardFormElements.invalidatePaymentCardForm(creditCardStatus, creditCardForm);
-
-            return {error: true};
-        }
-    }
 
     // create payment instrument
     Transaction.wrap(function () {
         cart.removeExistingPaymentInstruments(dw.order.PaymentInstrument.METHOD_CREDIT_CARD);
         var paymentInstrument = cart.createPaymentInstrument(dw.order.PaymentInstrument.METHOD_CREDIT_CARD, cart.getNonGiftCertificateAmount());
-        if (!adyenCseEnabled) {
-            paymentInstrument.creditCardHolder = creditCardForm.get('owner').value();
-            paymentInstrument.creditCardNumber = cardNumber;
-            paymentInstrument.creditCardType = cardType;
-            paymentInstrument.creditCardExpirationMonth = expirationMonth;
-            paymentInstrument.creditCardExpirationYear = expirationYear;
-        } else {
-            paymentInstrument.creditCardType = cardType;
-        }
+
+        paymentInstrument.creditCardHolder = creditCardForm.get('owner').value();
+        paymentInstrument.creditCardType = cardType;
 
         if (!empty(tokenID)) {
             paymentInstrument.setCreditCardToken(tokenID);
@@ -78,13 +52,6 @@ function Handle(args) {
  * Call the  Adyen API to Authorize CC using details entered by shopper.
  */
 function Authorize(args) {
-    var AdyenHelper = require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper');
-
-    // TODO: check is that one needed
-    if (args.RequestID) {
-        return {authorized: true};
-    }
-
     var order = args.Order;
     var paymentInstrument = args.PaymentInstrument;
     var paymentProcessor = PaymentMgr.getPaymentMethod(paymentInstrument.getPaymentMethod()).getPaymentProcessor();
@@ -93,10 +60,11 @@ function Authorize(args) {
         paymentInstrument.paymentTransaction.paymentProcessor = paymentProcessor;
     });
 
-    // ScriptFile	adyenCreditVerification.ds
-    var adyenCreditVerification = require('int_adyen_overlay/cartridge/scripts/adyenCreditVerification');
+    // ScriptFile adyenCheckout.ds
+    var adyenCheckout = require('int_adyen_overlay/cartridge/scripts/adyenCheckout');
+
     Transaction.begin();
-    var result = adyenCreditVerification.verify({
+    var result = adyenCheckout.creditCard({
         Order: order,
         Amount: paymentInstrument.paymentTransaction.amount,
         CurrentSession: session,
@@ -116,23 +84,37 @@ function Authorize(args) {
         };
     }
 
-    if (result.IssuerUrl != '') {
-        Transaction.commit();
-        session.custom.orderNo = order.orderNo;
-        session.custom.paymentMethod = paymentInstrument.paymentMethod;
-        return {
-            authorized: true,
-            authorized3d: true,
-            view: app.getView({
-                ContinueURL: URLUtils.https('Adyen-CloseIFrame', 'utm_nooverride', '1'),
-                Basket: order,
-                issuerUrl: result.IssuerUrl,
-                paRequest: result.PaRequest,
-                md: result.MD
-            })};
+    if(result.RedirectObject != ''){
+	    if(result.RedirectObject.url && result.RedirectObject.data.PaReq && result.RedirectObject.data.MD){
+	        Transaction.commit();
+	        if(result.PaymentData){
+	            Transaction.wrap( function() {
+	            	paymentInstrument.custom.adyenPaymentData = result.PaymentData;
+	            });
+	        }
+            session.custom.orderNo = order.orderNo;
+            session.custom.paymentMethod = paymentInstrument.paymentMethod;
+	        return {
+	            authorized: true,
+	            authorized3d: true,
+	            redirectObject: result.RedirectObject,
+	            view: app.getView({
+	                ContinueURL: URLUtils.https('Adyen-CloseIFrame', 'utm_nooverride', '1'),
+	                Basket: order,
+	                issuerUrl : result.RedirectObject.url,
+	                paRequest : result.RedirectObject.data.PaReq,
+	                md : result.RedirectObject.data.MD
+	            })};
+	    }
+	    else{
+	    	Logger.getLogger("Adyen").error("3DS details incomplete");
+	    	 return {
+	             error: true,
+	             PlaceOrderError: ('AdyenErrorMessage' in result && !empty(result.AdyenErrorMessage) ? result.AdyenErrorMessage : '')
+	         };
+	    }
     }
-
-    if (result.Decision != 'ACCEPT') {
+	if (result.Decision != 'ACCEPT') {
         Transaction.rollback();
         return {
             error: true,
@@ -159,8 +141,7 @@ function Authorize(args) {
     }
     // Save full response to transaction custom attribute
     paymentInstrument.paymentTransaction.custom.Adyen_log = JSON.stringify(result);
-    
-    paymentInstrument.paymentTransaction.transactionID = result.PspReference;
+
     Transaction.commit();
 
     return {authorized: true};
diff --git a/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/Adyen.js b/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/Adyen.js
index 87ab96b69..8393df3fd 100644
--- a/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/Adyen.js
+++ b/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/Adyen.js
@@ -3,7 +3,7 @@
 /* API Includes */
 var PaymentMgr = require('dw/order/PaymentMgr');
 var Transaction = require('dw/system/Transaction');
-
+var Logger = require('dw/system/Logger');
 /* Script Modules */
 var app = require('app_storefront_controllers/cartridge/scripts/app');
 
@@ -41,12 +41,57 @@ function authorize(args) {
     var paymentInstrument = args.PaymentInstrument;
     var paymentProcessor = PaymentMgr.getPaymentMethod(paymentInstrument.getPaymentMethod()).getPaymentProcessor();
 
+    var OrderMgr = require('dw/order/OrderMgr');
+    var order = OrderMgr.getOrder(orderNo);
+    
     Transaction.wrap(function () {
         paymentInstrument.paymentTransaction.transactionID = orderNo;
         paymentInstrument.paymentTransaction.paymentProcessor = paymentProcessor;
     });
+    
+    var	adyenCheckout = require('int_adyen_overlay/cartridge/scripts/adyenCheckout'),
+	result;
+
+    Logger.getLogger("Adyen").error("Form = " + session.forms.adyPaydata.dateOfBirth.value);
+	Transaction.wrap(function () {
+		result = adyenCheckout.alternativePaymentMethod({
+			'Order': order,
+			'Amount': order.paymentInstrument.paymentTransaction.amount,
+			'OrderNo': order.orderNo,
+			'CurrentSession' : session,
+			'CurrentUser' : customer,
+			'PaymentInstrument' : order.paymentInstrument,
+			'PaymentType': session.custom.brandCode,
+			'ratePayFingerprint' : session.custom.ratePayFingerprint,
+			'adyenForm' : session.forms.adyPaydata
+		});
+	});
+	
+	 if (result.error) {
+	        var errors = [];
+	        errors.push(result.args.AdyenErrorMessage);
+	        return {
+	            authorized: false, fieldErrors: [], serverErrors: errors, error: true
+	        };
+	    }
 
-    return {authorized: true};
+	    if (result.ResultCode == 'RedirectShopper') {
+	        return {
+	            authorized: true,
+	            order: order,
+	            paymentInstrument: paymentInstrument,
+	            redirectObject : result.RedirectObject
+	        };
+	    }
+	    else if(result.ResultCode == 'Authorised' || result.ResultCode == 'Received'){
+	        return { authorized: true, error: false };
+	    }
+	    else {
+	        Logger.getLogger("Adyen").error("Payment failed, result: " + JSON.stringify(result));
+	        return {
+	            authorized: false, error: true
+	        };
+	    }
 }
 
 exports.Handle = handle;
diff --git a/cartridges/int_adyen_overlay/cartridge/forms/default/adyPaydata.xml b/cartridges/int_adyen_overlay/cartridge/forms/default/adyPaydata.xml
index 635456de5..a6e7e6f8a 100644
--- a/cartridges/int_adyen_overlay/cartridge/forms/default/adyPaydata.xml
+++ b/cartridges/int_adyen_overlay/cartridge/forms/default/adyPaydata.xml
@@ -6,20 +6,24 @@
     <field formid="Month" label="Month" type="number" mandatory="true" binding="Month" max-length="50"/>
     <field formid="Year" label="Year" type="string" mandatory="true" binding="Year" max-length="50"/>
     <field formid="shopperReference" label="Shopper Ref" type="string" mandatory="true" binding="shopperReference" max-length="50"/>
-    <field formid="shopperEmail" label="Shopper Email" type="string" mandatory="true" regexp="^[\w-\.]{1,}\@([\da-zA-Z-]{1,}\.){1,}[\da-zA-Z-]{2,3}$" parse-error="forms.contactus.email.parse-error" binding="shopperEmail" max-length="50"/>  
-	<field formid="gender" label="Gender"  type="string"  mandatory="false" >
-		<options>
-			<option optionid="Male" 	label="Male"	value="MALE"/>
-            <option optionid="Female" label="Female" value="FEMALE"/>
-            <option optionid="Other" label="Other" value="UNKNOWN"/>
-		</options>
-	</field>
-	<field formid="dob" label="Date of Birth"  type="string"  mandatory="true" />
-	<field formid="houseNumber" label="House Number"  type="string" mandatory="false" />
-	<field formid="houseExtension" label="House Extension"  type="string" mandatory="false" />
-	<field formid="personalNumber" label="Personal Number (last digits)"  type="string" mandatory="false" />
+    <field formid="shopperEmail" label="Shopper Email" type="string" mandatory="true" regexp="^[\w-\.]{1,}\@([\da-zA-Z-]{1,}\.){1,}[\da-zA-Z-]{2,3}$" parse-error="forms.contactus.email.parse-error" binding="shopperEmail" max-length="50"/>
+
+	<field formid="issuer" type="string" mandatory="false" />
 	<field formid="adyenFingerprint" type="string" mandatory="false" />
 	<field formid="terminalId" type="string" mandatory="false" />
+
+	<!--Open Invoice details-->
+	<field formid="gender" label="Gender"  type="string"  mandatory="false" />
+	<field formid="dateOfBirth" label="Date of Birth"  type="string"  mandatory="true" />
+	<field formid="telephoneNumber" label="Telephone number"  type="string"  mandatory="false" />
+	<field formid="houseNumber" label="House Number"  type="string" mandatory="false" />
+	<field formid="houseExtension" label="House Extension"  type="string" mandatory="false" />
+	<field formid="socialSecurityNumber" label="Personal Number (last digits)"  type="string" mandatory="false" />
+
+	<!--ACH details-->
+	<field formid="bankAccountOwnerName" label="Bank account holdername" type="string" mandatory="false"/>
+	<field formid="bankAccountNumber" label="Bank account number" type="string" mandatory="false"/>
+	<field formid="bankLocationId" label="Routing Number" type="string" mandatory="false"/>
 	
 	<action formid="Pay" valid-form="true"/>
 </form>
\ No newline at end of file
diff --git a/cartridges/int_adyen_overlay/cartridge/js/pages/checkout/adyen-cse.js b/cartridges/int_adyen_overlay/cartridge/js/pages/checkout/adyen-cse.js
index e63175f9d..de253333e 100644
--- a/cartridges/int_adyen_overlay/cartridge/js/pages/checkout/adyen-cse.js
+++ b/cartridges/int_adyen_overlay/cartridge/js/pages/checkout/adyen-cse.js
@@ -1,192 +1,219 @@
-/* eslint-disable */
-'use strict';
+    /* eslint-disable */
+    'use strict';
 
-var util = require('./util'),
-ajax = require('./ajax');
+    var util = require('./util'),
+        ajax = require('./ajax');
 
-function pad ( number ) {
-    if ( number < 10 ) {
-        return '0' + number;
+    function pad(number) {
+        if (number < 10) {
+            return '0' + number;
+        }
+        return number;
     }
-    return number;
-}
 
-/**
- * @function
- * @description Initializes Adyen CSE  Billing events
- */
-function initializeBillingEvents() {
-
-	$('#billing-submit').on('click', function (e) {
-		var radioVal = $('.payment-method-options').find(':checked').val();
-		if ('CREDIT_CARD' == radioVal){
-			e.preventDefault();
-			
-			var creditCard = $('[data-method="CREDIT_CARD"]'),
-	        		selectedCardID = creditCard.find('input[name$="_selectedCardID"]'),
-				encryptedData = $('#dwfrm_billing_paymentMethods_creditCard_encrypteddata'),
-				encryptedDataValue,
-	        		options = {};
-   
-	        /**
-	         * We need encrypt only CVC if we used already saved CC from dropdown list
-	         */
-	        if ($('#creditCard_number').val().indexOf('*') > -1 && selectedCardID != null && selectedCardID.val() !== '') {
-	        		var cardData = getCardData(true);
-	            options = { enableValidations: false};
-	        } else {
-	        		var cardData = getCardData(false);
-	        }
-            if (($('#creditCard_number').val().indexOf('*') > -1 || $('#creditCard_cvn').val().indexOf('*') > -1) && encryptedData != null && encryptedData.val() !== '') {
-            		encryptedDataValue = encryptedData.val();
-            } else {
-            		var cseInstance = adyen.createEncryption(options);
-            		encryptedDataValue = cseInstance.encrypt(cardData);
-            }
-            
-            // Clear selectedCardID field if user enter a card number
-            if ($('#creditCard_number').val().indexOf('*') === -1) {
-                selectedCardID.val('');
+    /**
+     * @function
+     * @description Initializes Adyen Secured Fields  Billing events
+     */
+    function initializeBillingEvents() {
+        var isOneClick = false;
+        $('#billing-submit').on('click', function (e) {
+            var radioVal = $('.payment-method-options').find(':checked').val();
+            if ('CREDIT_CARD' == radioVal) {
+
+                if (!window.CardValid) {
+                    return false;
+                }
+                clearCardData();
+                var oneClickCard = window.AdyenOneClick;
+                if (isOneClick) {
+                    $('#dwfrm_billing_paymentMethods_creditCard_selectedCardID').val($('#adyenCreditCardList option:selected').attr('id'));
+                    $('#dwfrm_billing_paymentMethods_creditCard_type').val($('#adyenCreditCardList option:selected').val());
+                    $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedSecurityCode').val(oneClickCard.paymentData.encryptedSecurityCode);
+                }
+                else {
+                    $('#dwfrm_billing_paymentMethods_creditCard_selectedCardID').val("");
+                    copyCardData(window.AdyenCard);
+                }
+            }	
+            else if (radioVal == "Adyen"){	
+                var selectedMethod = $('[name="brandCode"]:checked').val();	
+                return componentDetailsValid(selectedMethod);	
             }
+                
+            e.preventDefault();
+            $('.form-data-error').html('');
+            $('#billing-submit-hidden').trigger('click');
+        });
 
-            if (encryptedDataValue === false) {
-	        		$('.form-data-error').html(Resources.ADYEN_CC_VALIDATE);
-	        } else {
-		        	$('.form-data-error').html('');
-		        	encryptedData.val(encryptedDataValue);
-		        	$('#creditCard_number').val(maskValue($('#creditCard_number').val()));
-			    $('#billing-submit-hidden').trigger('click');
-	        }
-		}
-    });
-	$('#adyenCreditCardList').on('change', function () {
-		var cardUUID = $(this).val();
-		if (!cardUUID) {
-			// TODO: clear all fields
-			$('.checkout-billing').find('input[name$="_selectedCardID"]').val('');
-			$('#creditCard_owner').removeAttr("disabled").val('');
-			$('#dwfrm_billing_paymentMethods_creditCard_type').removeAttr("disabled").val($("#dwfrm_billing_paymentMethods_creditCard_type option:first").val());
-			$('#creditCard_number').removeAttr("disabled").val('');
-			$('#creditCard_expiration_month').val('');
-			$('#creditCard_expiration_year').val('');
-			$('#creditCard_expiration_cvn').val('');	
-			// show the save card input and label because it is a new card
-		    $('#dwfrm_billing_paymentMethods_creditCard_saveCard').show();
-		    $('label[for="dwfrm_billing_paymentMethods_creditCard_saveCard"]').show();
-		} else {
-			populateAdyenCreditCardForm(cardUUID);
-		}
-	});
-	
-	/**
-	 * @function
-	 * @description Fills the Credit Card form with the passed data-parameter and clears the former cvn input
-	 * @param {Object} data The Credit Card data (holder, type, masked number, expiration month/year)
-	 */
-	function setAdyenCCFields(data) {
-	    var $creditCard = $('[data-method="CREDIT_CARD"]');
-	    $('#creditCard_owner').val(data.holder).trigger('change').attr('disabled', 'disabled');
-	    $creditCard.find('select[name$="_type"]').val(data.type).trigger('change').attr('disabled', 'disabled');;
-	    $('#creditCard_number').val(data.maskedNumber).trigger('change').attr('disabled', 'disabled');
-	    $('#creditCard_expiration_month').val(data.expirationMonth).trigger('change');
-	    $('#creditCard_expiration_year').val(data.expirationYear).trigger('change');
-	    $('#creditCard_expiration_cvn').val('').trigger('change');
-	    $creditCard.find('[name$="creditCard_selectedCardID"]').val(data.selectedCardID).trigger('change');
-	    // hide the save card input and label because it is a stored card
-	    $('#dwfrm_billing_paymentMethods_creditCard_saveCard').hide();
-	    $('label[for="dwfrm_billing_paymentMethods_creditCard_saveCard"]').hide();
-	}
-
-	/**
-	 * @function
-	 * @description Updates the credit card form with the attributes of a given card
-	 * @param {String} cardID the credit card ID of a given card
-	 */
-	function populateAdyenCreditCardForm(cardID) {
-	    // load card details
-	    var url = util.appendParamToURL(Urls.billingSelectCC, 'creditCardUUID', cardID);
-	    ajax.getJson({
-	        url: url,
-	        callback: function (data) {
-	            if (!data) {
-	                window.alert(Resources.CC_LOAD_ERROR);
-	                return false;
-	            }
-	            setAdyenCCFields(data);
-	        }
-	    });
-	}
-}
+        $('#adyenCreditCardList').on('change', function () {
+        	var selectedCard = $('#adyenCreditCardList').val();
+        	var AdyenCheckoutObject = new AdyenCheckout(window.Configuration);
+        	if(window.AdyenOneClick){
+        		window.AdyenOneClick.unmount();
+        	}
+        	initializeOneClick(AdyenCheckoutObject, selectedCard);
+        	window.CardValid = false;
+            if (selectedCard !== "") {
+                isOneClick = true;
+                $("#selectedCard").slideDown("slow");
+                $("#newCard").slideUp("slow");
+                
+            }
+            else {
+                isOneClick = false;
+                $("#selectedCard").slideUp("slow");
+                $("#newCard").slideDown("slow");
+            }
+        });
+    }
+    
+    function initializeOneClick(AdyenCheckoutObject, selectedCard) {
+    	var hideCVC = false;
+    	if(selectedCard == "bcmc"){
+    		hideCVC = true;
+    	}
+    	
+	    var cardNode = document.getElementById('oneClickCard');
+        window.AdyenOneClick = AdyenCheckoutObject.create('card', {
+            // Mandatory fields
+            type: selectedCard,
+            details: (selectedCard == "bcmc") ? [] : [{"key": "cardDetails.cvc", "type": "cvc"}],
+            oneClick: true, //<--- enable oneClick 'mode'
+            hideCVC: hideCVC,
+            storedDetails: {
+                "card": {
+                    "expiryMonth": "",
+                    "expiryYear": "",
+                    "holderName": "",
+                    "number": ""
+                }
+            },
+            // Events
+            onChange: function(state) {
+                // checks whether card was valid then was changed to be invalid
+            	if(selectedCard == "maestro"){
+            		window.CardValid = true;
+            	}
+            	else {
+            		window.CardValid = state.isValid;
+            	}
+            }
+        });
+        window.AdyenOneClick.mount(cardNode);
+    }
+    
+    function parseOpenInvoiceComponentData(state) {
+    	$('#dwfrm_adyPaydata_dateOfBirth').val(state.data.personalDetails.dateOfBirth);
+    	$('#dwfrm_adyPaydata_telephoneNumber').val(state.data.personalDetails.telephoneNumber);
+    	$('#dwfrm_adyPaydata_gender').val(state.data.personalDetails.gender);
+    }
+    
+    //Check the validity of checkout component	
+    function componentDetailsValid(selectedMethod){	
+    	//set data from components	
+    	switch(selectedMethod) {
+    	  case "ideal":
+    		  if (idealComponent.componentRef.state.isValid) {	
+                  $('#dwfrm_adyPaydata_issuer').val(idealComponent.componentRef.state.data.issuer);	
+              }	
+              return idealComponent.componentRef.state.isValid;
+    	    break;
+    	  case "klarna":
+    		  if (klarnaComponent.componentRef.state.isValid) {	
+    			  parseOpenInvoiceComponentData(klarnaComponent.componentRef.state);
+                  if($('#ssnValue')){
+                      $('#dwfrm_adyPaydata_socialSecurityNumber').val($('#ssnValue').val());
+                  }
+    		  }
+    		  
+    		  return klarnaComponent.componentRef.state.isValid;
+    		break;
+    	  case "afterpay":
+    		  if (afterpayComponent.componentRef.state.isValid) {
+    			  parseOpenInvoiceComponentData(afterpayComponent.componentRef.state);
+    		  }
+    		  return afterpayComponent.componentRef.state.isValid;
+      	    break;
+    	  default:
+    	    return true;
+    	} 	
+    }
 
-/**
- * @function
- * @description Initializes Adyen CSE My Account events
- */
-function initializeAccountEvents() {
-    $('#add-card-submit').on('click', function (e) {
-    		// TODO: fix this to use IDs and we need to change template to not use name attributes
-        e.preventDefault();
-        var $creditCard = $('#CreditCardForm'),
-        		encryptedData = $('#dwfrm_paymentinstruments_creditcards_newcreditcard_encrypteddata'),
-        		encryptedDataValue,
-        		options = {};
-      
-        var cardData = getCardData(false);
+    function copyCardData(card) {
+        $('#dwfrm_billing_paymentMethods_creditCard_type').val(card.state.brand);
+        $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedCardNumber').val(card.paymentData.encryptedCardNumber);
+        $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedExpiryMonth').val(card.paymentData.encryptedExpiryMonth);
+        $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedExpiryYear').val(card.paymentData.encryptedExpiryYear);
+        $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedSecurityCode').val(card.paymentData.encryptedSecurityCode);
+        $('#dwfrm_billing_paymentMethods_creditCard_owner').val(card.paymentData.holderName);
+    }
     
-    		var cseInstance = adyen.createEncryption(options);
-    		encryptedDataValue = cseInstance.encrypt(cardData);
-           
-        if (encryptedDataValue === false) {
-        		$('.form-data-error').html(Resources.ADYEN_CC_VALIDATE);
-        } else {
-	        	$('.form-data-error').html('');
-	        	encryptedData.val(encryptedDataValue);
-	        	$('#creditCard_number').val(maskValue($('#creditCard_number').val()));
-		    $('#add-card-submit-hidden').trigger('click');
+    function clearCardData() {
+        $('#dwfrm_billing_paymentMethods_creditCard_type').val("");
+        $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedCardNumber').val("");
+        $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedExpiryMonth').val("");
+        $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedExpiryYear').val("");
+        $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedSecurityCode').val("");
+        $('#dwfrm_billing_paymentMethods_creditCard_owner').val("");
+    }
+
+    /**
+     * @function
+     * @description Initializes Adyen CSE My Account events
+     */
+    function initializeAccountEvents() {
+        $('#add-card-submit').on('click', function (e) {
+        	e.preventDefault();
+            if (window.AdyenCard.isValid()) {
+            	copyCardData(window.AdyenCard);
+            	$('#add-card-submit-hidden').trigger('click');
+            }
+        });
+    }
+
+
+    /**
+     * If selectedCard is used do not encrypt the number and holderName field
+     * @param selectedCard
+     * @returns
+     */
+    function getCardData(selectedCard) {
+
+        var cardData = {
+            cvc: $('#creditCard_cvn').val(),
+            expiryMonth: $('#creditCard_expiration_month').val(),
+            expiryYear: $('#creditCard_expiration_year').val(),
+            generationtime: $('#adyen_generationtime').val()
+        };
+
+        if (!selectedCard) {
+            cardData.number = $('#creditCard_number').val();
+            cardData.holderName = $('#creditCard_owner').val();
         }
-    });
-}
 
-/**
- * If selectedCard is used do not encrypt the number and holderName field
- * @param selectedCard
- * @returns
- */
-function getCardData(selectedCard) {
-	
-	var cardData = {
-            cvc : $('#creditCard_cvn').val(),
-            expiryMonth : $('#creditCard_expiration_month').val(),
-            expiryYear : $('#creditCard_expiration_year').val(),
-            generationtime : $('#adyen_generationtime').val()
-    };
-	
-	if (!selectedCard) {
-		cardData.number = $('#creditCard_number').val();
-		cardData.holderName = $('#creditCard_owner').val();
-	}
-	
-	return cardData;
-}
-
-
-function maskValue(value) {
-    if (value && value.length > 4) {
-        return value.replace(/\d(?=\d{4})/g, '*');
-    } else {
-        return '';
+        return cardData;
+    }
+
+    function maskValue(value) {
+        if (value && value.length > 4) {
+            return value.replace(/\d(?=\d{4})/g, '*');
+        } else {
+            return '';
+        }
     }
-}
 
 /**
  * @function
  * @description Initializes Adyen CSE billing events
  */
-exports.initBilling = function () {
+
+exports.initBilling = function() {
 	initializeBillingEvents();
-};
+};    
 
 exports.initAccount = function() {
 	initializeAccountEvents();
 };
 
+
diff --git a/cartridges/int_adyen_overlay/cartridge/js/pages/checkout/billing.js b/cartridges/int_adyen_overlay/cartridge/js/pages/checkout/billing.js
index 09acb997b..1a5e76283 100644
--- a/cartridges/int_adyen_overlay/cartridge/js/pages/checkout/billing.js
+++ b/cartridges/int_adyen_overlay/cartridge/js/pages/checkout/billing.js
@@ -1,275 +1,283 @@
+
 /*eslint-disable */
 
-'use strict';
-
-var ajax = require('../../ajax'),
-    formPrepare = require('./formPrepare'),
-    giftcard = require('../../giftcard'),
-    util = require('../../util'),
-    adyenCse = require('./adyen-cse');
-
-
-/**
- * @function
- * @description Fills the Credit Card form with the passed data-parameter and clears the former cvn input
- * @param {Object} data The Credit Card data (holder, type, masked number, expiration month/year)
- */
-function setCCFields(data) {
-    var $creditCard = $('[data-method="CREDIT_CARD"]');
-    $creditCard.find('input[name$="creditCard_owner"]').val(data.holder).trigger('change');
-    $creditCard.find('select[name$="_type"]').val(data.type).trigger('change');
-    $creditCard.find('input[name*="_creditCard_number"]').val(data.maskedNumber).trigger('change');
-    $creditCard.find('[name$="_month"]').val(data.expirationMonth).trigger('change');
-    $creditCard.find('[name$="_year"]').val(data.expirationYear).trigger('change');
-    $creditCard.find('input[name$="_cvn"]').val('').trigger('change');
-    $creditCard.find('[name$="creditCard_selectedCardID"]').val(data.selectedCardID).trigger('change');
-}
-
-/**
- * @function
- * @description Updates the credit card form with the attributes of a given card
- * @param {String} cardID the credit card ID of a given card
- */
-function populateCreditCardForm(cardID) {
-    // load card details
-    var url = util.appendParamToURL(Urls.billingSelectCC, 'creditCardUUID', cardID);
-    ajax.getJson({
-        url: url,
-        callback: function (data) {
-            if (!data) {
-                window.alert(Resources.CC_LOAD_ERROR);
-                return false;
-            }
-            setCCFields(data);
-        }
-    });
-}
-
-/**
- * @function
- * @description Changes the payment method form depending on the passed paymentMethodID
- * @param {String} paymentMethodID the ID of the payment method, to which the payment method form should be changed to
- */
-function updatePaymentMethod(paymentMethodID) {
-    var $paymentMethods = $('.payment-method');
-    $paymentMethods.removeClass('payment-method-expanded');
-
-    var $selectedPaymentMethod = $paymentMethods.filter('[data-method="' + paymentMethodID + '"]');
-    if ($selectedPaymentMethod.length === 0) {
-        $selectedPaymentMethod = $('[data-method="Custom"]');
-    }
-    $selectedPaymentMethod.addClass('payment-method-expanded');
-
-    // ensure checkbox of payment method is checked
-    $('input[name$="_selectedPaymentMethodID"]').removeAttr('checked');
-    $('input[value=' + paymentMethodID + ']').prop('checked', 'checked');
-
-    formPrepare.validateForm();
-}
-
-/**
- * @function
- * @description Changes the payment type or issuerId of the selected payment method
- * @param {String, Boolean} value of payment type or issuerId and a test value to see which one it is, to which the payment type or issuerId should be changed to
- */
-function updatePaymentType(selectedPayType, test) {
-	if (!test) {
-		$('input[name="brandCode"]').removeAttr('checked');
-	} else {
-		$('input[name="issuerId"]').removeAttr('checked');
+	'use strict';
+
+	var ajax = require('../../ajax'),
+	    formPrepare = require('./formPrepare'),
+	    giftcard = require('../../giftcard'),
+	    util = require('../../util'),
+	    adyenCse = require('../../adyen-cse');
+
+
+	/**
+	 * @function
+	 * @description Fills the Credit Card form with the passed data-parameter and clears the former cvn input
+	 * @param {Object} data The Credit Card data (holder, type, masked number, expiration month/year)
+	 */
+	function setCCFields(data) {
+	    var $creditCard = $('[data-method="CREDIT_CARD"]');
+	    $creditCard.find('input[name$="creditCard_owner"]').val(data.holder).trigger('change');
+	    $creditCard.find('select[name$="_type"]').val(data.type).trigger('change');
+	    $creditCard.find('input[name*="_creditCard_number"]').val(data.maskedNumber).trigger('change');
+	    $creditCard.find('[name$="_month"]').val(data.expirationMonth).trigger('change');
+	    $creditCard.find('[name$="_year"]').val(data.expirationYear).trigger('change');
+	    $creditCard.find('input[name$="_cvn"]').val('').trigger('change');
+	    $creditCard.find('[name$="creditCard_selectedCardID"]').val(data.selectedCardID).trigger('change');
+	}
+
+	/**
+	 * @function
+	 * @description Updates the credit card form with the attributes of a given card
+	 * @param {String} cardID the credit card ID of a given card
+	 */
+	function populateCreditCardForm(cardID) {
+	    // load card details
+	    var url = util.appendParamToURL(Urls.billingSelectCC, 'creditCardUUID', cardID);
+	    ajax.getJson({
+	        url: url,
+	        callback: function (data) {
+	            if (!data) {
+	                window.alert(Resources.CC_LOAD_ERROR);
+	                return false;
+	            }
+	            setCCFields(data);
+	        }
+	    });
+	}
+	
+	$('input[name="brandCode"]').on('change', function(e){
+		$("#dwfrm_adyPaydata_issuer").val("");
+		$('.checkoutComponent').hide();
+	    $('#component_' + $(this).val()).show();
+	});
+
+	/**
+	 * @function
+	 * @description Changes the payment method form depending on the passed paymentMethodID
+	 * @param {String} paymentMethodID the ID of the payment method, to which the payment method form should be changed to
+	 */
+	function updatePaymentMethod(paymentMethodID) {
+	    var $paymentMethods = $('.payment-method');
+	    $paymentMethods.removeClass('payment-method-expanded');
+
+	    var $selectedPaymentMethod = $paymentMethods.filter('[data-method="' + paymentMethodID + '"]');
+	    if ($selectedPaymentMethod.length === 0) {
+	        $selectedPaymentMethod = $('[data-method="Custom"]');
+	    }
+	    $selectedPaymentMethod.addClass('payment-method-expanded');
+
+	    // ensure checkbox of payment method is checked
+	    $('input[name$="_selectedPaymentMethodID"]').removeAttr('checked');
+	    $('input[value=' + paymentMethodID + ']').prop('checked', 'checked');
+
+	    formPrepare.validateForm();
 	}
-	$('input[value=' + selectedPayType + ']').prop('checked', 'checked');
-	formPrepare.validateForm();
-}
-
-/**
- * @function
- * @description Adyen - Initializes the visibility of HPP fields
- */
-function initializeHPPFields () {
-	if($('[name="brandCode"]:checked').hasClass('openInvoice')) {
-		$('.additionalfield').hide().find('input').val('');
-		$('.additionalfield.' + $('.checkout-billing').find('select.country').val()).show();
-	} else {
-		$('.additionalfield').hide().find('input').val('');
+
+	/**
+	 * @function
+	 * @description Changes the payment type or issuerId of the selected payment method
+	 * @param {String, Boolean} value of payment type or issuerId and a test value to see which one it is, to which the payment type or issuerId should be changed to
+	 */
+	function updatePaymentType(selectedPayType, issuerType) {
+		if(issuerType){
+			$('#dwfrm_adyPaydata_issuer').val(selectedPayType);
+		}
+		else{
+			$('input[name="brandCode"]').removeAttr('checked');
+			$('input[value=' + selectedPayType + ']').prop('checked', 'checked');
+		}
+		
+		// if the payment type has hidden fields reveal it
+		$('#component_' + selectedPayType).show(); 
+
+		formPrepare.validateForm();
 	}
-}
-
-/**
- * @function
- * @description loads billing address, Gift Certificates, Coupon and Payment methods
- */
-exports.init = function () {
-    var $checkoutForm = $('.checkout-billing');
-    var $addGiftCert = $('#add-giftcert');
-    var $giftCertCode = $('input[name$="_giftCertCode"]');
-    var $addCoupon = $('#add-coupon');
-    var $couponCode = $('input[name$="_couponCode"]');
-    var $selectPaymentMethod = $('.payment-method-options');
-    var selectedPaymentMethod = $selectPaymentMethod.find(':checked').val();
-    var $payType = $('[name="brandCode"]');
-	var $issuerId = $('[name="issuerId"]');
-	var $issuer = $('ul#issuer');
-	var selectedPayType = $payType.find(':checked').val();
-	var selectedIssuerId = $issuerId.find(':checked').val();
-
-
-    formPrepare.init({
-        formSelector: 'form[id$="billing"]',
-        continueSelector: '[name$="billing_save"]'
-    });
-
-    // default payment method to 'CREDIT_CARD'
-    updatePaymentMethod((selectedPaymentMethod) ? selectedPaymentMethod : 'CREDIT_CARD');
-    $selectPaymentMethod.on('click', 'input[type="radio"]', function () {
-        updatePaymentMethod($(this).val());
-        if ($(this).val() == 'Adyen' && $payType.length > 0) {
-        	//set payment type of Adyen to the first one
-        	updatePaymentType((selectedPayType) ? selectedPayType : $payType[0].value, false);
-        } else {
-        	$payType.removeAttr('checked');
-        	$issuerId.removeAttr('checked');
-        }
-    });
-    
-    $issuerId.on('click', function () {
-    	updatePaymentType($(this).val(), true);
-    });
-
-    // select credit card from list
-    $('#creditCardList').on('change', function () {
-        var cardUUID = $(this).val();
-        if (!cardUUID) {return;}
-        populateCreditCardForm(cardUUID);
-
-        // remove server side error
-        $('.required.error').removeClass('error');
-        $('.error-message').remove();
-    });
-
-    $('#check-giftcert').on('click', function (e) {
-        e.preventDefault();
-        var $balance = $('.balance');
-        if ($giftCertCode.length === 0 || $giftCertCode.val().length === 0) {
-            var error = $balance.find('span.error');
-            if (error.length === 0) {
-                error = $('<span>').addClass('error').appendTo($balance);
-            }
-            error.html(Resources.GIFT_CERT_MISSING);
-            return;
-        }
-
-        giftcard.checkBalance($giftCertCode.val(), function (data) {
-            if (!data || !data.giftCertificate) {
-                $balance.html(Resources.GIFT_CERT_INVALID).removeClass('success').addClass('error');
-                return;
-            }
-            $balance.html(Resources.GIFT_CERT_BALANCE + ' ' + data.giftCertificate.balance).removeClass('error').addClass('success');
-        });
-    });
-
-    $addGiftCert.on('click', function (e) {
-        e.preventDefault();
-        var code = $giftCertCode.val(),
-            $error = $checkoutForm.find('.giftcert-error');
-        if (code.length === 0) {
-            $error.html(Resources.GIFT_CERT_MISSING);
-            return;
-        }
-
-        var url = util.appendParamsToUrl(Urls.redeemGiftCert, {giftCertCode: code, format: 'ajax'});
-        $.getJSON(url, function (data) {
-            var fail = false;
-            var msg = '';
-            if (!data) {
-                msg = Resources.BAD_RESPONSE;
-                fail = true;
-            } else if (!data.success) {
-                msg = data.message.split('<').join('&lt;').split('>').join('&gt;');
-                fail = true;
-            }
-            if (fail) {
-                $error.html(msg);
-                return;
-            } else {
-                window.location.assign(Urls.billing);
-            }
-        });
-    });
-
-    $addCoupon.on('click', function (e) {
-        e.preventDefault();
-        var $error = $checkoutForm.find('.coupon-error'),
-            code = $couponCode.val();
-        if (code.length === 0) {
-            $error.html(Resources.COUPON_CODE_MISSING);
-            return;
-        }
-
-        var url = util.appendParamsToUrl(Urls.addCoupon, {couponCode: code, format: 'ajax'});
-        $.getJSON(url, function (data) {
-            var fail = false;
-            var msg = '';
-            if (!data) {
-                msg = Resources.BAD_RESPONSE;
-                fail = true;
-            } else if (!data.success) {
-                msg = data.message.split('<').join('&lt;').split('>').join('&gt;');
-                fail = true;
-            }
-            if (fail) {
-                $error.html(msg);
-                return;
-            }
-
-            //basket check for displaying the payment section, if the adjusted total of the basket is 0 after applying the coupon
-            //this will force a page refresh to display the coupon message based on a parameter message
-            if (data.success && data.baskettotal === 0) {
-                window.location.assign(Urls.billing);
-            }
-        });
-    });
-
-    // trigger events on enter
-    $couponCode.on('keydown', function (e) {
-        if (e.which === 13) {
-            e.preventDefault();
-            $addCoupon.click();
-        }
-    });
-    $giftCertCode.on('keydown', function (e) {
-        if (e.which === 13) {
-            e.preventDefault();
-            $addGiftCert.click();
-        }
-    });
-    
-    if (SitePreferences.ADYEN_CSE_ENABLED) {
-    	adyenCse.initBilling();
-    }
-
-    // Adyen - Click event for payment methods
-    $payType.on('click', function () {
-    	updatePaymentType($(this).val(), false);
-      	//if the payment type contains issuerId fields, expand form with the values
-    	if ($(this).siblings('#issuer').length > 0) {
-    	  $issuer.show();
-    	  updatePaymentType( 
-    (selectedIssuerId) ? selectedIssuerId : $issuerId[0].value, true);
-    	} else {
-    		$issuer.hide();
-    		$('input[name="issuerId"]').removeAttr('checked');
-    	}
-    	initializeHPPFields();
-     });
-    
-    var currentDate = new Date();
-    var currentYear = currentDate.getFullYear();
-    var initYear = currentYear - 100;
-    $('.openinvoiceInput input[name$="_dob"]').datepicker({
-        showOn: 'focus',
-        yearRange: initYear + ':' + currentYear,
-        changeYear: true,
-        dateFormat: "yyyy-mm-dd"
-    });
-};
+
+	/**
+	 * @function
+	 * @description Adyen - Initializes the visibility of HPP fields
+	 */
+	function initializeHPPFields () {
+		if($('[name="brandCode"]:checked').hasClass('openInvoice')) {
+			$('.additionalfield').hide().find('input').val('');
+			$('.additionalfield.' + $('.checkout-billing').find('select.country').val()).show();
+		} else {
+			$('.additionalfield').hide().find('input').val('');
+		}
+	}
+
+	/**
+	 * @function
+	 * @description loads billing address, Gift Certificates, Coupon and Payment methods
+	 */
+	exports.init = function () {
+	    var $checkoutForm = $('.checkout-billing');
+	    var $addGiftCert = $('#add-giftcert');
+	    var $giftCertCode = $('input[name$="_giftCertCode"]');
+	    var $addCoupon = $('#add-coupon');
+	    var $couponCode = $('input[name$="_couponCode"]');
+	    var $selectPaymentMethod = $('.payment-method-options');
+	    var selectedPaymentMethod = $selectPaymentMethod.find(':checked').val();
+	    var $payType = $('[name="brandCode"]');
+
+		var $issuer = $('.issuer');
+		var selectedPayType = $payType.find(':checked').val();
+
+	    formPrepare.init({
+	        formSelector: 'form[id$="billing"]',
+	        continueSelector: '[name$="billing_save"]'
+	    });
+
+	    // default payment method to 'CREDIT_CARD'
+	    updatePaymentMethod((selectedPaymentMethod) ? selectedPaymentMethod : 'CREDIT_CARD');
+	    $selectPaymentMethod.on('click', 'input[type="radio"]', function () {
+	        updatePaymentMethod($(this).val());
+	        if ($(this).val() == 'Adyen' && $payType.length > 0) {
+	        	//set payment type of Adyen to the first one
+	        	updatePaymentType((selectedPayType) ? selectedPayType : $payType[0].value, false);
+	        } else {
+	        	$payType.removeAttr('checked');
+
+	        }
+	    });
+
+	    $issuer.on('change', function () {
+	    	updatePaymentType($(this).val(), true);
+	    });
+	    
+
+	    $payType.on('change', function() {
+	    	$('#selectedIssuer').val("");  
+	    	$issuer.hide();
+	    	$('.checkoutComponent').hide();
+	    	$('#component_' + $(this).val()).show();  	
+	    	if($(this).siblings( ".issuer").length > 0){
+	    		$('#selectedIssuer').val($(this).siblings( ".issuer" ).val());
+	    		$(this).siblings('.issuer').show();
+	    	}
+	    });
+	    
+	    // select credit card from list
+	    $('#creditCardList').on('change', function () {
+	        var cardUUID = $(this).val();
+	        if (!cardUUID) {return;}
+	        populateCreditCardForm(cardUUID);
+
+	        // remove server side error
+	        $('.required.error').removeClass('error');
+	        $('.error-message').remove();
+	    });
+
+	    $('#check-giftcert').on('click', function (e) {
+	        e.preventDefault();
+	        var $balance = $('.balance');
+	        if ($giftCertCode.length === 0 || $giftCertCode.val().length === 0) {
+	            var error = $balance.find('span.error');
+	            if (error.length === 0) {
+	                error = $('<span>').addClass('error').appendTo($balance);
+	            }
+	            error.html(Resources.GIFT_CERT_MISSING);
+	            return;
+	        }
+
+	        giftcard.checkBalance($giftCertCode.val(), function (data) {
+	            if (!data || !data.giftCertificate) {
+	                $balance.html(Resources.GIFT_CERT_INVALID).removeClass('success').addClass('error');
+	                return;
+	            }
+	            $balance.html(Resources.GIFT_CERT_BALANCE + ' ' + data.giftCertificate.balance).removeClass('error').addClass('success');
+	        });
+	    });
+
+	    $addGiftCert.on('click', function (e) {
+	        e.preventDefault();
+	        var code = $giftCertCode.val(),
+	            $error = $checkoutForm.find('.giftcert-error');
+	        if (code.length === 0) {
+	            $error.html(Resources.GIFT_CERT_MISSING);
+	            return;
+	        }
+
+	        var url = util.appendParamsToUrl(Urls.redeemGiftCert, {giftCertCode: code, format: 'ajax'});
+	        $.getJSON(url, function (data) {
+	            var fail = false;
+	            var msg = '';
+	            if (!data) {
+	                msg = Resources.BAD_RESPONSE;
+	                fail = true;
+	            } else if (!data.success) {
+	                msg = data.message.split('<').join('&lt;').split('>').join('&gt;');
+	                fail = true;
+	            }
+	            if (fail) {
+	                $error.html(msg);
+	                return;
+	            } else {
+	                window.location.assign(Urls.billing);
+	            }
+	        });
+	    });
+
+	    $addCoupon.on('click', function (e) {
+	        e.preventDefault();
+	        var $error = $checkoutForm.find('.coupon-error'),
+	            code = $couponCode.val();
+	        if (code.length === 0) {
+	            $error.html(Resources.COUPON_CODE_MISSING);
+	            return;
+	        }
+
+	        var url = util.appendParamsToUrl(Urls.addCoupon, {couponCode: code, format: 'ajax'});
+	        $.getJSON(url, function (data) {
+	            var fail = false;
+	            var msg = '';
+	            if (!data) {
+	                msg = Resources.BAD_RESPONSE;
+	                fail = true;
+	            } else if (!data.success) {
+	                msg = data.message.split('<').join('&lt;').split('>').join('&gt;');
+	                fail = true;
+	            }
+	            if (fail) {
+	                $error.html(msg);
+	                return;
+	            }
+
+	            //basket check for displaying the payment section, if the adjusted total of the basket is 0 after applying the coupon
+	            //this will force a page refresh to display the coupon message based on a parameter message
+	            if (data.success && data.baskettotal === 0) {
+	                window.location.assign(Urls.billing);
+	            }
+	        });
+	    });
+
+	    // trigger events on enter
+	    $couponCode.on('keydown', function (e) {
+	        if (e.which === 13) {
+	            e.preventDefault();
+	            $addCoupon.click();
+	        }
+	    });
+	    $giftCertCode.on('keydown', function (e) {
+	        if (e.which === 13) {
+	            e.preventDefault();
+	            $addGiftCert.click();
+	        }
+	    });
+
+	    if (SitePreferences.ADYEN_CSE_ENABLED) {
+	    	adyenCse.initBilling();
+	    }
+
+	    var currentDate = new Date();
+	    var currentYear = currentDate.getFullYear();
+	    var initYear = currentYear - 100;
+	    $('.openinvoiceInput input[name$="_dob"]').datepicker({
+	        showOn: 'focus',
+	        yearRange: initYear + ':' + currentYear,
+	        changeYear: true
+
+	    });
+
+	};
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/UpdateSavedCards.ds b/cartridges/int_adyen_overlay/cartridge/scripts/UpdateSavedCards.ds
index 66c4313fb..7b7e5c59b 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/UpdateSavedCards.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/UpdateSavedCards.ds
@@ -55,7 +55,8 @@ function updateSavedCards(args) {
                             ccNum,
                             token,
                             ccType,
-                            ccHolder;
+                            ccHolder,
+                            adyenCardType;
 
                         // card expiration
                         expMonth = 'cardExpiryMonth' in payment && !empty(payment.cardExpiryMonth) ? payment.cardExpiryMonth : '';
@@ -72,7 +73,7 @@ function updateSavedCards(args) {
 
                         // card type
                         if ('cardType' in payment && !empty(payment.cardType)) {
-                            var adyenCardType = payment.cardType;
+                            adyenCardType = payment.cardType;
                             ccType = AdyenHelper.getSFCCCardType(adyenCardType);
                         }
 
@@ -84,7 +85,7 @@ function updateSavedCards(args) {
                             var newCreditCard = customer.getProfile().getWallet().createPaymentInstrument(PaymentInstrument.METHOD_CREDIT_CARD);
 
 							// custom throws error
-                            //newCreditCard.custom.AdyenPspReference = pspRef;
+                            newCreditCard.custom.adyenCreditCardType = adyenCardType;
                             newCreditCard.setCreditCardExpirationMonth(Number(expMonth));
                             newCreditCard.setCreditCardExpirationYear(Number(expYear));
                             newCreditCard.setCreditCardType(ccType);
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyen3DVerification.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyen3DVerification.ds
index 6d5adf306..98b50556e 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/adyen3DVerification.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyen3DVerification.ds
@@ -68,17 +68,13 @@ function verify( args : PipelineDictionary ) : Number {
 		if (shopperIp == null) { shopperIp = ''; }
 		 
 		// set-up the 3D Secure post call
-	   	var jsonRequest : JSON = {
-		  "browserInfo": {
-		    "acceptHeader": acceptHeader,
-		    "userAgent": userAgent
-		  },
-		  "md": args.MD,
-		  "merchantAccount": MERCHANTACCOUNT,
-		  "paResponse": args.PaResponse,
-		  "shopperEmail": order.customerEmail,
-		  "shopperIP": shopperIp,
-			"applicationInfo": AdyenHelper.getApplicationInfo()
+	   	var jsonRequest = {
+		  "paymentData": args.PaymentData,
+		  "details": {
+              "MD": args.MD,
+              "PaRes": args.PaResponse
+          },
+            "applicationInfo": AdyenHelper.getApplicationInfo()
 		};
   		
 		var callResult = null;
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds
new file mode 100644
index 000000000..668ab262b
--- /dev/null
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds
@@ -0,0 +1,386 @@
+/**
+* Passes on credit card details to Adyen using the Adyen PAL adapter
+* Receives a response and sets the order status accordingly
+* created on 23dec2014
+*
+* @input Order : dw.order.Order
+* @input Amount : dw.value.Money The amount to authorize
+* @input PaymentInstrument : dw.order.PaymentInstrument
+* @input CurrentSession : dw.system.Session
+* @input CurrentRequest : dw.system.Request
+* @input CreditCardForm : dw.web.Form
+* @input SaveCreditCard : Boolean
+*
+* @output Decision : String
+* @output PaymentStatus : String
+* @output AuthorizationCode :  String
+* @output AuthorizationAmount : String
+* @output PaRequest : String
+* @output PspReference : String
+* @output MD : String
+* @output ResultCode : String
+* @output IssuerUrl : String
+* @output AVSResultCode : String
+* @output AdyenErrorMessage : String
+* @output AdyenAmount : String
+* @output AdyenCardType : String
+*
+*/
+
+/* API Includes */
+var Logger = require('dw/system/Logger');
+var URLUtils = require('dw/web/URLUtils');
+
+/* Script Modules */
+var AdyenHelper = require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper');
+var AdyenGetOpenInvoiceData = require('int_adyen_overlay/cartridge/scripts/adyenGetOpenInvoiceData');
+
+function execute(args) {
+    return PIPELET_NEXT;  
+}
+
+function alternativePaymentMethod(args){
+    var paymentMethodObject = {
+        "type" : args.PaymentType
+    };
+   if(args.adyenForm.issuer.value !== null){
+        paymentMethodObject['issuer'] = args.adyenForm.issuer.value;
+    }
+
+   var returnUrl = URLUtils.https('Adyen-ShowConfirmation').toString();
+   return createPaymentRequest(args, paymentMethodObject, returnUrl); 
+}
+
+function creditCard(args) {
+    try {
+        var order = args.Order;
+        if (order == null) {
+            Logger.getLogger('Adyen').error('No order present.');
+            return {error: true};
+        }
+        var paymentInstrument = args.PaymentInstrument;
+        var saveCreditCard = args.SaveCreditCard;
+        var customer = order.getCustomer();
+        var profile = !empty(customer) && customer.registered && !empty(customer.getProfile()) ? customer.getProfile() : null;
+        var customerID = '';
+        if (!empty(profile) && !empty(profile.getCustomerNo())) {
+            customerID = profile.getCustomerNo();
+        }
+
+        var recurringType = AdyenHelper.getAdyenRecurringType();
+        var isOneClick = false;
+        if (paymentInstrument.getCreditCardToken()) {
+            isOneClick = true;
+        }
+        var paymentMethodObject = AdyenHelper.createCardObjectSF(isOneClick, 'billing');
+
+        if (AdyenHelper.getAdyenRecurringPaymentsEnabled()) {
+            if (!empty(paymentInstrument.getCreditCardToken()) && !empty(customerID)) {
+                paymentMethodObject['recurringDetailReference'] = paymentInstrument.getCreditCardToken();
+            }
+            else if (!empty(recurringType) && saveCreditCard) {
+                paymentMethodObject['storeDetails'] = true;
+            }
+        }
+        var returnUrl = URLUtils.https('Adyen-OrderConfirm').toString();
+        return createPaymentRequest(args, paymentMethodObject, returnUrl);
+
+    }
+    catch(e){
+        Logger.getLogger("Adyen").error('error processing creditCard. Error message: ' + e.message + " more details: "+ e.toString() + ' in ' + e.fileName + ':' + e.lineNumber);
+        return {error: true};
+    }
+}
+
+function createPaymentRequest(args, paymentMethodObject, returnUrl) {
+    var order = args.Order;
+    var recurringType = AdyenHelper.getAdyenRecurringType();
+    var saveCreditCard = !empty(args.SaveCreditCard) ? args.SaveCreditCard : false;
+    var jsonObject = AdyenHelper.createAdyenRequestObject(recurringType, order, saveCreditCard);
+    var customer = order.getCustomer();
+    var profile = !empty(customer) && customer.registered && !empty(customer.getProfile()) ? customer.getProfile() : null;
+    var customerID = '';
+
+    if (!empty(profile) && !empty(profile.getCustomerNo())) {
+        customerID = profile.getCustomerNo();
+    }
+
+    jsonObject['returnUrl'] = returnUrl;
+    jsonObject.additionalData = {
+        "executeThreeD": true
+    };
+
+    var myAmount = AdyenHelper.getCurrencyValueForApi(args.Amount); //args.Amount * 100;
+    jsonObject['amount'] = {
+        'currency': args.Amount.currencyCode,
+        'value': myAmount
+    };
+
+    var shippingAddr: OrderAddress = args.Order.defaultShipment.shippingAddress;
+    var houseNumberShip;
+    if (shippingAddr.address2) {
+        houseNumberShip = shippingAddr.address2;
+    }
+    else {
+        houseNumberShip = "N/A";
+    }
+    jsonObject["countryCode"] = shippingAddr.countryCode.value.toUpperCase();
+    
+    jsonObject.deliveryAddress = {
+        "city": shippingAddr.city,
+        "country": shippingAddr.countryCode.value.toUpperCase(),
+        "houseNumberOrName": houseNumberShip,
+        "postalCode": shippingAddr.postalCode,
+        "stateOrProvince": (!empty(shippingAddr.stateCode) ? shippingAddr.stateCode : 'NA'),
+        "street": shippingAddr.address1
+    };
+
+    var billingAddr: OrderAddress = args.Order.getBillingAddress();
+    var houseNumberBill;
+    if (billingAddr.address2) {
+        houseNumberBill = billingAddr.address2;
+    }
+    else {
+        houseNumberBill = "N/A";
+    }
+    jsonObject.billingAddress = {
+        "city": billingAddr.city,
+        "country": billingAddr.countryCode.value.toUpperCase(),
+        "houseNumberOrName": houseNumberBill,
+        "postalCode": billingAddr.postalCode,
+        "stateOrProvince": (!empty(billingAddr.stateCode) ? billingAddr.stateCode : 'NA'),
+        "street": billingAddr.address1
+    };
+
+    var shopperObject = AdyenHelper.createShopperObject({
+            Customer: customer,
+            Basket: order
+        });
+
+    jsonObject['paymentMethod'] = paymentMethodObject;
+    var shopperDetails = {
+        "firstName": billingAddr.firstName,
+        "gender": "UNKNOWN",
+        "infix": "",
+        "lastName": billingAddr.lastName
+    };
+
+    if(!empty(args.PaymentType) && args.PaymentType.toString().substring(0, 3) == "ach") {
+        if (!empty(args.adyenForm.bankAccountOwnerName.value)) {
+            var bankAccount = {
+                "countryCode" : shippingAddr.countryCode.value.toUpperCase(),
+                "ownerName" : args.adyenForm.bankAccountOwnerName.value,
+                "bankAccountNumber" : args.adyenForm.bankAccountNumber.value,
+                "bankLocationId" : args.adyenForm.bankLocationId.value
+            }
+            jsonObject["bankAccount"] = bankAccount;
+        }
+    }
+
+	if(!empty(args.PaymentType) && AdyenHelper.isOpenInvoiceMethod(args.PaymentType.toString())) {
+        jsonObject["lineItems"] = AdyenGetOpenInvoiceData.getLineItems(args);
+        if(args.ratePayFingerprint){
+            jsonObject["dfValue"] = args.ratePayFingerprint;
+        }
+        if(args.adyenFingerprint){
+            jsonObject["dfValue"] = args.adyenFingerprint
+        }
+
+        var personalDetails = AdyenGetOpenInvoiceData.getShopperData(args, shopperDetails);
+        jsonObject['paymentMethod'].personalDetails = personalDetails;
+    }
+	else {
+	    jsonObject['shopperName'] = shopperDetails;
+    }
+
+    var requestObject = AdyenHelper.extend(jsonObject, shopperObject);
+
+    // assign default values for the script output variables 
+    args.RedirectObject = '';
+    args.ResultCode = '';
+    args.AuthorizationCode = '';
+    args.PspReference = '';
+    args.PaymentStatus = '?';
+    args.AuthorizationAmount = '';
+    args.Decision = '';
+    args.AdyenErrorMessage = '';
+
+    // make API call
+    return doPaymentCall(args, requestObject);
+}
+
+function doPaymentCall(args, requestObject){
+    var errorMessage = '';
+    try {
+       var callResult = executeCall(AdyenHelper.SERVICE.PAYMENT, requestObject);
+        if (callResult.isOk() == false){
+            Logger.error('Adyen: Call error code' +  callResult.getError().toString() + ' Error => ResponseStatus: ' + callResult.getStatus()  + ' | ResponseErrorText: ' +  callResult.getErrorMessage() + ' | ResponseText: ' + callResult.getMsg());
+            args.AdyenErrorMessage = dw.web.Resource.msg('confirm.error.declined','checkout', null);
+            return {
+                error: true,
+                args: args
+            };
+        }
+        var resultObject = callResult.object;
+        var resultObj = {
+            statusCode: resultObject.getStatusCode(),
+            statusMessage: resultObject.getStatusMessage(),
+            text: resultObject.getText(),
+            errorText: resultObject.getErrorText(),
+            timeout: resultObject.getTimeout()
+        }
+
+        var resultText = ('text' in resultObj && !empty(resultObj.text) ? resultObj.text : null);
+        if (resultText == null) {
+            return {error: true};
+        }
+
+        // build the response object
+        var responseObj;
+        try {
+            responseObj = JSON.parse(resultText);
+        } catch (ex) {
+            Logger.error('error parsing response object ' + ex.message);
+            return {error: true};
+        }
+
+        // return the AVS result code
+        args.AVSResultCode = (!empty(responseObj.avsResultRaw) ? responseObj.avsResultRaw : '');
+
+        // if the card is enrolled in the 3-D Secure programme the response should contain these 4 fields
+        if ('redirect' in responseObj) {args.RedirectObject = responseObj.redirect;} // issuerUrl
+        args.ResultCode = responseObj.resultCode; // resultCode
+
+        args.PspReference = ('pspReference' in responseObj && !empty(responseObj.pspReference) ? responseObj.pspReference : '');
+        args.PaymentStatus = resultObj.errorText;
+        args.AuthorizationAmount = args.Amount.getValue().toFixed(2);
+        args.AdyenAmount = requestObject["amount"].value;
+        args.Decision = 'ERROR';
+
+        var resultCode = args.ResultCode;
+        var order = args.Order;
+
+        if (responseObj.resultCode.indexOf('Authorised') != -1 || (responseObj.resultCode.indexOf('RedirectShopper') != -1) ) {
+            args.Decision = 'ACCEPT';
+            args.PaymentStatus = resultCode;
+            args.PaymentData = responseObj.paymentData;
+            // if 3D Secure is used, the statuses will be updated later
+            if (responseObj.resultCode.indexOf('Authorised') != -1) {
+                order.setPaymentStatus(dw.order.Order.PAYMENT_STATUS_PAID);
+                order.setExportStatus(dw.order.Order.EXPORT_STATUS_READY);
+            }
+            Logger.getLogger('Adyen').info('Payment result: Authorised');
+            Logger.getLogger('Adyen').info('Decision: ' + args.Decision);
+
+            if (args.RedirectObject == '') { // if is not 3DSecure
+                Logger.getLogger('Adyen').debug('Adyen: ' + resultObj.statusCode + ' Error => ' + resultObj.statusMessage + ' | ' + resultObj.errorText);
+            }
+        }
+        else if(responseObj.resultCode.indexOf('Received') != -1) {
+            args.Decision = 'PENDING';
+            args.PaymentStatus = resultCode;
+            if(responseObj.additionalData['bankTransfer.owner']){
+                var bankTransferData = [{"key":"bankTransfer.description","value":"bankTransfer.description"}];
+                for (var data in responseObj.additionalData){
+                    if(data.indexOf('bankTransfer.') != -1) {
+                        bankTransferData.push({
+                            key: data,
+                            value: responseObj.additionalData[data]
+                        })
+                    }
+                }
+                args.PaymentInstrument.custom.adyenAdditionalPaymentData = JSON.stringify(bankTransferData);
+            }
+
+            if(responseObj.additionalData['comprafacil.entity']){
+                var multiBancoData = [{"key":"comprafacil.description","value":"comprafacil.description"}];
+                for (var data in responseObj.additionalData){
+                    if(data.indexOf('comprafacil.') != -1) {
+                        multiBancoData.push({
+                            key: data,
+                            value: responseObj.additionalData[data]
+                        })
+                    }
+                }
+                args.PaymentInstrument.custom.adyenAdditionalPaymentData = JSON.stringify(multiBancoData);
+            }
+
+            order.setPaymentStatus(dw.order.Order.PAYMENT_STATUS_NOTPAID);
+            order.setExportStatus(dw.order.Order.EXPORT_STATUS_NOTEXPORTED);
+        }
+        else  {
+            args.PaymentStatus = 'Refused';
+            args.Decision = 'REFUSED';
+
+            order.setPaymentStatus(dw.order.Order.PAYMENT_STATUS_NOTPAID);
+            order.setExportStatus(dw.order.Order.EXPORT_STATUS_NOTEXPORTED);
+
+            errorMessage = dw.web.Resource.msg('confirm.error.declined','checkout', null);
+            if ('refusalReason' in responseObj && !empty(responseObj.refusalReason)) {
+                errorMessage += ' (' + responseObj.refusalReason + ')';
+            }
+            args.AdyenErrorMessage = errorMessage;
+            Logger.getLogger('Adyen').info('Payment result: Refused');
+        }
+        return args;
+    }
+    catch (e) {
+        Logger.getLogger('Adyen').fatal('Adyen: ' + e.toString() + ' in ' + e.fileName + ':' + e.lineNumber);
+        return {error: true};
+    }
+}
+
+function doPaymentDetailsCall(requestObject){
+    var callResult = executeCall(AdyenHelper.SERVICE.PAYMENTDETAILS, requestObject);
+    if (callResult.isOk() == false){
+        Logger.error('Adyen: Call error code' +  callResult.getError().toString() + ' Error => ResponseStatus: ' + callResult.getStatus()  + ' | ResponseErrorText: ' +  callResult.getErrorMessage() + ' | ResponseText: ' + callResult.getMsg());
+        return {
+            error: true
+        };
+    }
+    var resultObject = callResult.object;
+    var resultObj = {
+        statusCode: resultObject.getStatusCode(),
+        statusMessage: resultObject.getStatusMessage(),
+        text: resultObject.getText(),
+        errorText: resultObject.getErrorText(),
+        timeout: resultObject.getTimeout()
+    }
+
+    var resultText = ('text' in resultObj && !empty(resultObj.text) ? resultObj.text : null);
+    if (resultText == null) {
+        return {error: true};
+    }
+
+    // build the response object
+    var responseObj;
+    try {
+        responseObj = JSON.parse(resultText);
+    } catch (ex) {
+        Logger.error('error parsing response object ' + ex.message);
+        return {error: true};
+    }
+
+    return responseObj;
+}
+
+function executeCall(serviceType, requestObject){
+    var service = AdyenHelper.getService(serviceType);
+    if (service == null) {
+        return {error: true};
+    }
+    var apiKey = AdyenHelper.getAdyenApiKey();
+    service.addHeader('Content-type','application/json');
+    service.addHeader('charset', 'UTF-8');
+    service.addHeader('X-API-KEY', apiKey);
+    var callResult = service.call(JSON.stringify(requestObject));
+    return callResult;
+
+}
+
+module.exports = {
+    'execute': execute,
+    'creditCard': creditCard,
+    'alternativePaymentMethod': alternativePaymentMethod,
+    'doPaymentDetailsCall': doPaymentDetailsCall
+}
\ No newline at end of file
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyenCreditVerification.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyenCreditVerification.ds
index 7a51e04f9..0cf9eda5d 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/adyenCreditVerification.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyenCreditVerification.ds
@@ -30,6 +30,7 @@
 /* API Includes */
 var Logger = require('dw/system/Logger');
 var Transaction = require('dw/system/Transaction');
+var URLUtils = require('dw/web/URLUtils');
 
 /* Script Modules */
 var AdyenHelper = require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper');
@@ -43,7 +44,7 @@ function execute(args) {
 }
 
 function verify(args) {
-    try {
+    try { 
         var order = args.Order;
         var paymentInstrument = args.PaymentInstrument;
         var tokenID = '';
@@ -63,30 +64,33 @@ function verify(args) {
             customerID = profile.getCustomerNo();
         }
 
-		// TODO: for new cards use the recurring type in the settings
 		// For oneclick cards use ONECICK
         var recurringType = AdyenHelper.getAdyenRecurringType();
-        
+        var isOneClick = false;
         if(paymentInstrument.getCreditCardToken()) {
         		recurringType = 'ONECLICK';
+                isOneClick = true;
         }
-        
-        var jsonObject = AdyenHelper.createAdyenRequestObject(recurringType, order, saveCreditCard);
 
+        var jsonObject = AdyenHelper.createAdyenRequestObject(recurringType, order, saveCreditCard);
         var cardType = (!empty(paymentInstrument.creditCardType) ? AdyenHelper.getAdyenCardType(paymentInstrument.creditCardType) : '');
+        var paymentMethodObject = AdyenHelper.createCardObjectSF(isOneClick, 'billing');
+        jsonObject['paymentMethod'] = paymentMethodObject;
 
-        var cardObject = AdyenHelper.createCardObject({
-            FormType: 'billing',
-            TokenID: paymentInstrument.getCreditCardToken()
-        });
-        if ('card' in cardObject) {
-            jsonObject['card'] = cardObject.card;
-        }
+        if (AdyenHelper.getAdyenRecurringPaymentsEnabled()) {
+            if(!empty(paymentInstrument.getCreditCardToken()) && !empty(customerID)) {
+                jsonObject['paymentMethod'].recurringDetailReference = paymentInstrument.getCreditCardToken();
+            }
+            else if (!empty(recurringType) && saveCreditCard) {
+                jsonObject['paymentMethod'].storeDetails = true;
+            }
 
-        if ('additionalData' in cardObject) {
-            jsonObject['additionalData'] = cardObject.additionalData;
         }
 
+        jsonObject['returnUrl'] = URLUtils.https('Order-Confirm').toString();
+        jsonObject.additionalData = {
+            "executeThreeD":true
+        };
         var shopperObject = AdyenHelper.createShopperObject({
             Customer: customer,
             Basket: order
@@ -139,14 +143,8 @@ function verify(args) {
             "lastName" : billingAddr.lastName
         };
 
-        if (AdyenHelper.getAdyenRecurringPaymentsEnabled() && !empty(paymentInstrument.getCreditCardToken()) && !empty(customerID)) {
-            jsonObject['selectedRecurringDetailReference'] = paymentInstrument.getCreditCardToken();
-        }
-
         // assign default values for the script output variables
-        args.PaRequest = '';
-        args.MD = '';
-        args.IssuerUrl = '';
+        args.RedirectObject = '';
         args.ResultCode = '';
         args.AuthorizationCode = '';
         args.PspReference = '';
@@ -158,7 +156,7 @@ function verify(args) {
 
         // make API call
         var requestObject = AdyenHelper.extend(jsonObject, shopperObject);
-        
+
         var callResult = null;
         var service = AdyenHelper.getService(AdyenHelper.SERVICE.PAYMENT);
         if (service == null) {
@@ -169,7 +167,6 @@ function verify(args) {
         service.addHeader('Content-type','application/json');
         service.addHeader('charset', 'UTF-8');
         callResult = service.call(JSON.stringify(requestObject));
-
         if (callResult.isOk() == false){
             Logger.error('Adyen: Call error code' +  callResult.getError().toString() + ' Error => ResponseStatus: ' + callResult.getStatus()  + ' | ResponseErrorText: ' +  callResult.getErrorMessage() + ' | ResponseText: ' + callResult.getMsg());
             args.AdyenErrorMessage = dw.web.Resource.msg('confirm.error.declined','checkout', null);
@@ -207,12 +204,9 @@ function verify(args) {
         args.AVSResultCode = (!empty(responseObj.avsResultRaw) ? responseObj.avsResultRaw : '');
 
         // if the card is enrolled in the 3-D Secure programme the response should contain these 4 fields
-        if ('paRequest' in responseObj) {args.PaRequest = responseObj.paRequest;} // paRequest
-        if ('md' in responseObj) {args.MD = responseObj.md;} // md
-        if ('issuerUrl' in responseObj) {args.IssuerUrl = responseObj.issuerUrl;} // issuerUrl
+        if ('redirect' in responseObj) {args.RedirectObject = responseObj.redirect;} // issuerUrl
         args.ResultCode = responseObj.resultCode; // resultCode
 
-        args.AuthorizationCode = ('authCode' in responseObj && !empty(responseObj.authCode) ? responseObj.authCode : '');
         args.PspReference = ('pspReference' in responseObj && !empty(responseObj.pspReference) ? responseObj.pspReference : '');
         args.PaymentStatus = resultObj.errorText;
         args.AuthorizationAmount = args.Amount.getValue().toFixed(2);
@@ -224,9 +218,9 @@ function verify(args) {
         if (resultCode.indexOf('Authorised') != -1 || (resultCode.indexOf('RedirectShopper') != -1) ) {
             args.Decision = 'ACCEPT';
             args.PaymentStatus = resultCode;
-
+            args.PaymentData = responseObj.paymentData;
             // if 3D Secure is used, the statuses will be updated later
-            if (!('issuerUrl' in responseObj)) {
+            if (!('redirect' in responseObj)) {
                 order.setPaymentStatus(dw.order.Order.PAYMENT_STATUS_PAID);
                 order.setExportStatus(dw.order.Order.EXPORT_STATUS_READY);
             }
@@ -234,7 +228,7 @@ function verify(args) {
             Logger.getLogger('Adyen').info('Payment result: Authorised');
             Logger.getLogger('Adyen').info('Decision: ' + args.Decision);
 
-            if (args.AuthorizationCode == '' && args.MD == '') { // if is not 3DSecure
+            if (args.RedirectObject == '') { // if is not 3DSecure
                 Logger.getLogger('Adyen').debug('Adyen: ' + resultObj.statusCode + ' Error => ' + resultObj.statusMessage + ' | ' + resultObj.errorText);
             }
         } else  {
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyenGetOpenInvoiceData.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyenGetOpenInvoiceData.ds
new file mode 100644
index 000000000..894ca882a
--- /dev/null
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyenGetOpenInvoiceData.ds
@@ -0,0 +1,168 @@
+/**
+* Generate the parameters needed for the redirect to the Adyen Hosted Payment Page.
+* A signature is calculated based on the configured HMAC code
+*
+* @input Order : dw.order.Order
+* @input OrderNo : String The order no
+* @input CurrentSession : dw.system.Session
+* @input CurrentUser : dw.customer.Customer
+* @input PaymentInstrument : dw.order.PaymentInstrument
+* @input brandCode : String
+* @input issuerId : String
+* @input dob : String
+* @input gender : String
+* @input telephoneNumber : String
+* @input houseNumber : String
+* @input houseExtension : String
+* @input socialSecurityNumber : String
+*
+* @output merchantSig : String;
+* @output Amount100 : String;
+* @output shopperEmail : String;
+* @output shopperReference : String;
+* @output paramsMap : dw.util.SortedMap;
+* @output sessionValidity : String;
+*
+*/
+importPackage( dw.crypto );
+importPackage( dw.system );
+importPackage( dw.order );
+importPackage( dw.util );
+importPackage( dw.value);
+importPackage( dw.net );
+importPackage( dw.web );
+
+//script include
+var AdyenHelper = require ("int_adyen_overlay/cartridge/scripts/util/AdyenHelper");
+
+function getShopperData(args, personalDetails){
+	if(args.adyenForm.socialSecurityNumber.value){
+		personalDetails.socialSecurityNumber = args.adyenForm.socialSecurityNumber.value;
+	}
+	if(args.adyenForm.dateOfBirth.value){
+		personalDetails.dateOfBirth = args.adyenForm.dateOfBirth.value;
+	}
+	if(args.adyenForm.gender.value){
+		personalDetails.gender = args.adyenForm.gender.value;
+	}
+	if(args.adyenForm.telephoneNumber){
+		personalDetails.telephoneNumber = args.adyenForm.telephoneNumber.value;
+	}
+	else if(args.Order.getDefaultShipment().getShippingAddress().getPhone()){
+		personalDetails.telephoneNumber = args.Order.getDefaultShipment().getShippingAddress().getPhone()
+	}
+	return personalDetails;
+}
+
+function getLineItems(args) {
+	var order;
+	if(args.Order){
+		order = args.Order;
+	}
+	else {
+		return null;
+	}
+		
+	// Add all product and shipping line items to request
+	var lineItems = [];
+	for each (var lineItem in order.getAllLineItems())
+	{
+		if ((lineItem instanceof dw.order.ProductLineItem && !lineItem.bonusProductLineItem)
+			|| lineItem instanceof dw.order.ShippingLineItem
+			|| (lineItem instanceof dw.order.PriceAdjustment && lineItem.promotion.promotionClass == dw.campaign.Promotion.PROMOTION_CLASS_ORDER)
+		) {
+			var lineItemObject = {};
+			var description = getDescription(lineItem),
+				id = getId(lineItem),
+				quantity = getQuantity(lineItem),
+				itemAmount: number = AdyenHelper.getCurrencyValueForApi(getItemAmount(lineItem)) / quantity,
+				vatAmount: number = AdyenHelper.getCurrencyValueForApi(getVatAmount(lineItem)) / quantity,
+				vatPercentage = getVatPercentage(lineItem);
+
+			lineItemObject["amountExcludingTax"] = itemAmount.toFixed();
+			lineItemObject["taxAmount"] = vatAmount.toFixed();
+			lineItemObject["description"] = description;
+			lineItemObject["id"] = id;
+			lineItemObject["quantity"] = quantity;
+			lineItemObject["taxCategory"] = "None";
+			lineItemObject["taxPercentage"] = (new Number(vatPercentage) * 10000).toFixed();
+
+			lineItems.push(lineItemObject);
+		} 
+	}
+
+   return lineItems;
+}
+
+function getDescription(lineItem) {
+	if (lineItem instanceof dw.order.ShippingLineItem) {
+		return lineItem.getID();
+	}
+	else if (lineItem instanceof dw.order.ProductLineItem){
+		return lineItem.product.name;
+	}
+	else if (lineItem instanceof dw.order.PriceAdjustment){
+		return "Discount";
+	}
+	
+	return null;			
+}
+
+function getId(lineItem){
+	if (lineItem instanceof dw.order.ShippingLineItem || lineItem instanceof dw.order.PriceAdjustment) {
+		return lineItem.UUID;
+	}
+	else if (lineItem instanceof dw.order.ProductLineItem) {
+		return lineItem.product.ID; 
+	}
+	
+	return null;
+}
+
+function getQuantity(lineItem) {
+	if (lineItem instanceof dw.order.ShippingLineItem) {
+		return "1";
+	}
+	else if (lineItem instanceof dw.order.ProductLineItem) {
+		return lineItem.quantityValue.toFixed();
+	}
+	else if (lineItem instanceof dw.order.PriceAdjustment) {
+		return lineItem.quantity.toFixed();
+	}
+	
+	return null;
+}
+
+function getVatPercentage(lineItem) {
+	var vatPercentage = 0;
+    if ( getVatAmount(lineItem) != 0 ) {
+        vatPercentage = lineItem.getTaxRate();
+    }
+	return vatPercentage;
+}
+
+function getVatAmount(lineItem) {
+	if(lineItem instanceof dw.order.ProductLineItem || lineItem instanceof dw.order.ShippingLineItem) {
+		return lineItem.getAdjustedTax();
+	} 
+	else if (lineItem instanceof dw.order.PriceAdjustment) {
+		return lineItem.tax;
+	}
+	return null;
+}
+
+function getItemAmount(lineItem) {
+	if(lineItem instanceof dw.order.ProductLineItem || lineItem instanceof dw.order.ShippingLineItem) {
+		return lineItem.adjustedNetPrice;
+	} 
+	else if (lineItem instanceof dw.order.PriceAdjustment) {
+		return lineItem.basePrice;
+	}
+	return null;
+	
+}
+
+module.exports = {
+	'getLineItems': getLineItems,
+	'getShopperData': getShopperData
+}
\ No newline at end of file
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyenGetOriginKey.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyenGetOriginKey.ds
new file mode 100644
index 000000000..4799cf5e5
--- /dev/null
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyenGetOriginKey.ds
@@ -0,0 +1,95 @@
+/**
+* Gets recurring payment list from Adyen
+*
+* @input Customer : dw.customer.Customer
+*
+*/
+
+/* API Includes */
+var Logger = require('dw/system/Logger');
+
+/* Script Modules */
+var AdyenHelper = require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper');
+
+function execute(args) {
+    var result = getOriginKey(args);
+    if (result == PIPELET_ERROR) {
+        return PIPELET_ERROR;
+    }
+    return PIPELET_NEXT;
+}
+
+function getOriginKey(args) {
+    try {
+
+        var requestObject = {};
+
+        var callResult = null,
+            resultObject = null,
+            service = AdyenHelper.getService(AdyenHelper.SERVICE.ORIGINKEYS);
+
+        if (service == null) {
+            return PIPELET_ERROR;
+        }
+
+        var domain = [];
+        domain.push(args);
+        requestObject['originDomains'] = domain;
+
+        var xapikey = AdyenHelper.getAdyenApiKey();
+
+        service.addHeader('Content-type', 'application/json');
+        service.addHeader('charset', 'UTF-8');
+        service.addHeader('X-API-key', xapikey);
+        callResult = service.call(JSON.stringify(requestObject));
+
+        if (callResult.isOk() == false) {
+            Logger.error(THIS_SCRIPT + ' Adyen: Call error code' +  callResult.getError().toString() + ' Error => ResponseStatus: ' + callResult.getStatus()  + ' | ResponseErrorText: ' +  callResult.getErrorMessage() + ' | ResponseText: ' + callResult.getMsg());
+            return PIPELET_ERROR;
+        }
+
+        resultObject = ('object' in callResult ? callResult.object : null);
+
+        var resultObj = {
+            statusCode: resultObject.getStatusCode(),
+            statusMessage: resultObject.getStatusMessage(),
+            text: resultObject.getText(),
+            errorText: resultObject.getErrorText(),
+            timeout: resultObject.getTimeout()
+        }
+
+        var resultText = ('text' in resultObj && !empty(resultObj.text) ? resultObj.text : null);
+        if (resultText == null) {
+            return PIPELET_ERROR;
+        }
+
+        // build the response object
+        var responseObj;
+        try {
+            responseObj = JSON.parse(resultText);
+        } catch (ex) {
+            Logger.error(THIS_SCRIPT + ' Adyen: error parsing response object ' + ex.message);
+            return PIPELET_ERROR;
+        }
+
+    } catch (e) {
+        Logger.getLogger('Adyen').fatal('Adyen: ' + e.toString() + ' in ' + e.fileName + ':' + e.lineNumber);
+        return PIPELET_ERROR;
+    }
+
+    return responseObj;
+}
+
+function getOriginKeyFromRequest(protocol, host) {
+	var origin = protocol + "://" + host;
+	var originKeysResponse = getOriginKey(origin);
+	
+	return originKeysResponse["originKeys"][origin];
+}
+
+
+module.exports = {
+    'execute': execute,
+    'getOriginKey': getOriginKey,
+    'getOriginKeyFromRequest': getOriginKeyFromRequest    
+}
\ No newline at end of file
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyenGetPaymentMethods.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyenGetPaymentMethods.ds
new file mode 100644
index 000000000..f9b00d8f1
--- /dev/null
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyenGetPaymentMethods.ds
@@ -0,0 +1,98 @@
+/**
+* Send request to adyen to get payment methods based on country code
+* A signature is calculated based on the configured HMAC code
+*
+
+* @input Basket : dw.order.Basket
+* @input CountryCode : String
+* @output PaymentMethods : Object
+*/
+
+importPackage(dw.system);
+importPackage(dw.order);
+
+//script include
+var AdyenHelper = require("int_adyen_overlay/cartridge/scripts/util/AdyenHelper");
+var Logger = require('dw/system/Logger');
+
+function execute(args) {
+    var result = getMethods(args.Basket, args.CountryCode);
+    if (result == PIPELET_ERROR) {
+        return PIPELET_ERROR;
+    }
+    return PIPELET_NEXT;
+}
+
+function getMethods (basket : dw.order.Basket, CountryCode) {
+    try {
+        var requestObject = {};
+
+        var callResult = null,
+            resultObject = null,
+            service = AdyenHelper.getService(AdyenHelper.SERVICE.CHECKOUTPAYMENTMETHODS);
+
+        if (service == null) {
+            return PIPELET_ERROR;
+        }
+        //
+        var merchantAccount = Site.getCurrent().getCustomPreferenceValue("Adyen_merchantCode");
+        var paymentAmount = basket.getTotalGrossPrice() ? AdyenHelper.getCurrencyValueForApi(basket.getTotalGrossPrice()) : 1000;
+
+        var currencyCode = basket.currencyCode;
+        requestObject['merchantAccount'] = merchantAccount;
+        requestObject['amount'] = {
+            currency: currencyCode,
+            value: paymentAmount
+        };
+        
+        if (CountryCode) {
+        	requestObject['countryCode'] = CountryCode;
+        }
+        	
+        var xapikey = AdyenHelper.getAdyenApiKey();
+        service.addHeader('Content-type', 'application/json');
+        service.addHeader('charset', 'UTF-8');
+        service.addHeader('X-API-key', xapikey);
+        callResult = service.call(JSON.stringify(requestObject));
+
+
+        if (callResult.isOk() == false) {
+            Logger.error(' Adyen: Call error code' +  callResult.getError().toString() + ' Error => ResponseStatus: ' + callResult.getStatus()  + ' | ResponseErrorText: ' +  callResult.getErrorMessage() + ' | ResponseText: ' + callResult.getMsg());
+            return PIPELET_ERROR;
+        }
+
+        resultObject = ('object' in callResult ? callResult.object : null);
+
+        var resultObj = {
+            statusCode: resultObject.getStatusCode(),
+            statusMessage: resultObject.getStatusMessage(),
+            text: resultObject.getText(),
+            errorText: resultObject.getErrorText(),
+            timeout: resultObject.getTimeout()
+        }
+
+        var resultText = ('text' in resultObj && !empty(resultObj.text) ? resultObj.text : null);
+        if (resultText == null) {
+            return PIPELET_ERROR;
+        }
+
+        try {
+            return JSON.parse(resultText);
+        }
+        catch (ex) {
+            Logger.error(THIS_SCRIPT + ' Adyen: error parsing response object ' + ex.message);
+            return PIPELET_ERROR;
+        }
+    } catch (e) {
+        Logger.getLogger('Adyen').fatal('Adyen: ' + e.toString() + ' in ' + e.fileName + ':' + e.lineNumber);
+        return PIPELET_ERROR;
+    }
+
+    return JSON.parse(resultObject.text);
+}
+
+
+module.exports = {
+    'execute': execute,
+    'getMethods': getMethods
+}
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyenRedirectVerificationSHA256.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyenRedirectVerificationSHA256.ds
index 7bb2cfb16..37c989de4 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/adyenRedirectVerificationSHA256.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyenRedirectVerificationSHA256.ds
@@ -11,9 +11,10 @@
 * @input issuerId : String
 * @input dob : String
 * @input gender : String
+* @input telephoneNumber : String
 * @input houseNumber : String
 * @input houseExtension : String
-* @input personalNumber : String
+* @input socialSecurityNumber : String
 *
 * @output merchantSig : String;
 * @output Amount100 : String;
@@ -176,13 +177,13 @@ function verify (args) {
 	}
 
 	//Open Invoice specific section
-	//requires Gender and Date Of Birth (DOB) from Open Invoice form on the Billing Page and Phone Number from Billing Form
+	//requires Gender, Date Of Birth (DOB) and if exits Phone Number from Open Invoice form on the Billing Page otherwise the Phone Number from Billing Form
 	if(!empty(args.brandCode) && Site.getCurrent().getCustomPreferenceValue("Adyen_Open_Invoice_Whitelist").indexOf(args.brandCode) > -1) {
 		
 		var billingAddr = order.getBillingAddress();	
 		adyenRequest.put("shopper.firstName", order.getBillingAddress().getFirstName() );
-		adyenRequest.put("shopper.lastName", order.getBillingAddress().getLastName() );
-		adyenRequest.put("shopper.telephoneNumber", order.getDefaultShipment().getShippingAddress().getPhone() );
+		adyenRequest.put("shopper.lastName", order.getBillingAddress().getLastName() );		
+		adyenRequest.put("shopper.telephoneNumber", (!empty(args.telephoneNumber)) ? args.telephoneNumber : order.getDefaultShipment().getShippingAddress().getPhone());
 		adyenRequest.put("shopperType", '1' );
 		adyenRequest.put("shopper.gender", (!empty(args.gender)) ? args.gender : 'UNKNOWN');
 
@@ -193,8 +194,8 @@ function verify (args) {
 			adyenRequest.put("shopper.dateOfBirthYear", dob[2] );
 		}
 
-		if( !empty(args.personalNumber)) {
-			adyenRequest.put("shopper.socialSecurityNumber", args.personalNumber );
+		if( !empty(args.socialSecurityNumber)) {
+			adyenRequest.put("shopper.socialSecurityNumber", args.socialSecurityNumber );
 		}
 
 		//open invoice line items
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
index d69b5109f..13537a7bd 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
@@ -1,53 +1,56 @@
 /**
-*
-*/
-var dwsvc		= require ("dw/svc");
-var dwnet		= require ("dw/net");
-var dwsystem	= require ("dw/system");
-var dwutil		= require ("dw/util");
+ *
+ */
+var dwsvc = require("dw/svc");
+var dwnet = require("dw/net");
+var dwsystem = require("dw/system");
+var dwutil = require("dw/util");
 
 var adyenCurrentSite = dwsystem.Site.getCurrent();
-
-var __AdyenHelper : Object = {
+var __AdyenHelper: Object = {
 
     //service constants
-    SERVICE : {
-        PAYMENT : "AdyenPayment",
-        PAYMENT_3DSECURE : "AdyenPayment3DSecure",
+    SERVICE: {
+        PAYMENT: "AdyenPayment",
+        PAYMENTDETAILS: "AdyenPaymentDetails",
+        PAYMENT_3DSECURE: "AdyenPayment3DSecure",
         RECURRING: "AdyenRecurring",
         RECURRING_DISABLE: "AdyenRecurringDisable",
-        PAYMENTMETHODS : "AdyenPaymentMethods",
-        POSPAYMENT : "AdyenPosPayment"
+        PAYMENTMETHODS: "AdyenPaymentMethods",
+        POSPAYMENT: "AdyenPosPayment",
+        ORIGINKEYS: "AdyenOriginKeys",
+        CHECKOUTPAYMENTMETHODS: "AdyenCheckoutPaymentMethods"
     },
-    MODE : {
-        TEST : "TEST",
-        LIVE : "LIVE"
+    MODE: {
+        TEST: "TEST",
+        LIVE: "LIVE"
     },
 
-    CSE_LIVE_URL: "https://live.adyen.com/hpp/cse/js/",
-    CSE_TEST_URL: "https://test.adyen.com/hpp/cse/js/",
-    CSE_URL_EXTENSION: ".shtml",
+    ADYEN_LIVE_URL: "https://live.adyen.com/",
+    ADYEN_TEST_URL: "https://test.adyen.com/",
+    LOADING_CONTEXT_TEST: "https://checkoutshopper-test.adyen.com/checkoutshopper/",
+    LOADING_CONTEXT_LIVE: "https://checkoutshopper-live.adyen.com/checkoutshopper/",
 
     VERSION: "18.3.0",
 
-    getService : function (service : String) : Object {
+    getService: function (service: String): Object {
         // Create the service config (used for all services)
         var adyenService = null;
 
         try {
-			var adyenService = dwsvc.LocalServiceRegistry.createService(service, {
-				createRequest: function(svc:HTTPService, args){
-					svc.setRequestMethod("POST");
-					if(args) {
-						return args;
-					} else {
-						return null;
-					}
-				},
-				parseResponse: function(svc:HTTPService, client:HTTPClient) {
-					return client;
-				}
-			 });
+            var adyenService = dwsvc.LocalServiceRegistry.createService(service, {
+                createRequest: function (svc: HTTPService, args) {
+                    svc.setRequestMethod("POST");
+                    if (args) {
+                        return args;
+                    } else {
+                        return null;
+                    }
+                },
+                parseResponse: function (svc: HTTPService, client: HTTPClient) {
+                    return client;
+                }
+            });
             dwsystem.Logger.getLogger("Adyen", "adyen").debug("Successfully retrive service with name {0}", service);
         } catch (e) {
             var ex = e;
@@ -57,106 +60,172 @@ var __AdyenHelper : Object = {
         return adyenService;
     },
 
-    getAdyenMode : function () : String {
-        var returnValue : String = "";
-        if(!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('Adyen_Mode'))) {
+    getAdyenMode: function (): String {
+        var returnValue: String = "";
+        if (!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('Adyen_Mode'))) {
             returnValue = adyenCurrentSite.getCustomPreferenceValue('Adyen_Mode').value;
         }
         return returnValue;
     },
 
-    getAdyenMerchantAccount : function () : String {
-        var returnValue : String = "";
-        if(!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('Adyen_merchantCode'))) {
+    getAdyenMerchantAccount: function (): String {
+        var returnValue: String = "";
+        if (!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('Adyen_merchantCode'))) {
             returnValue = adyenCurrentSite.getCustomPreferenceValue('Adyen_merchantCode');
         }
         return returnValue;
     },
 
-    getCSEJsUrl : function () : String {
-        var returnValue : String = "";
+    getAdyenUrl: function (): String {
+        var returnValue: String = "";
         switch (__AdyenHelper.getAdyenMode()) {
             case __AdyenHelper.MODE.TEST:
-                returnValue = __AdyenHelper.CSE_TEST_URL + adyenCurrentSite.getCustomPreferenceValue('AdyenCseLibraryToken') + __AdyenHelper.CSE_URL_EXTENSION;
+                returnValue = __AdyenHelper.ADYEN_TEST_URL;
                 break;
             case __AdyenHelper.MODE.LIVE:
-                returnValue = __AdyenHelper.CSE_LIVE_URL + adyenCurrentSite.getCustomPreferenceValue('AdyenCseLibraryToken') + __AdyenHelper.CSE_URL_EXTENSION;
+                returnValue = __AdyenHelper.ADYEN_LIVE_URL;
                 break;
         }
         return returnValue;
     },
 
-    getAdyenCseEnabled : function () : Boolean {
-        var returnValue : Boolean = false;
-        if(!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('AdyenCseEnabled'))) {
+    getAdyenCseEnabled: function (): Boolean {
+        var returnValue: Boolean = false;
+        if (!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('AdyenCseEnabled'))) {
             returnValue = adyenCurrentSite.getCustomPreferenceValue('AdyenCseEnabled');
         }
         return returnValue;
     },
 
-    getAdyenCseDateField : function () {
-        var currentDate = new Date();
-        return currentDate.toISOString();
-    },
-
-    getAdyenAVSEnabled : function () : Boolean {
-        var returnValue : Boolean = false;
-        if(!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('Adyen_enableAVS'))) {
-            returnValue = adyenCurrentSite.getCustomPreferenceValue('Adyen_enableAVS');
-        }
-        return returnValue;
-    },
-
-    getAdyenRecurringPaymentsEnabled : function () : Boolean {
-        var returnValue : Boolean = false;
-        if(!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('AdyenRecurringPaymentsEnabled'))) {
+    getAdyenRecurringPaymentsEnabled: function (): Boolean {
+        var returnValue: Boolean = false;
+        if (!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('AdyenRecurringPaymentsEnabled'))) {
             returnValue = adyenCurrentSite.getCustomPreferenceValue('AdyenRecurringPaymentsEnabled');
         }
         return returnValue;
     },
 
-    getAdyenRecurringType : function () : String {
-        var returnValue : String = "";
-        if(!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('Adyen_recurringType')) && !empty(__AdyenHelper.getAdyenRecurringPaymentsEnabled())) {
+    getAdyenRecurringType: function (): String {
+        var returnValue: String = "";
+        if (!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('Adyen_recurringType')) && !empty(__AdyenHelper.getAdyenRecurringPaymentsEnabled())) {
             returnValue = adyenCurrentSite.getCustomPreferenceValue('Adyen_recurringType').getValue();
         }
         return returnValue;
     },
-    
-    getAdyenGuestRecurringEnabled : function () : Boolean {
-        var returnValue : Boolean = false;
-        if(!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('AdyenGuestRecurringEnabled'))) {
+
+    getAdyenGuestRecurringEnabled: function (): Boolean {
+        var returnValue: Boolean = false;
+        if (!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('AdyenGuestRecurringEnabled'))) {
             returnValue = adyenCurrentSite.getCustomPreferenceValue('AdyenGuestRecurringEnabled');
         }
         return returnValue;
     },
 
-    getAdyenPOIID : function () : String {
-        var returnValue : String = "";
-        if(!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('Adyen_POIID'))) {
+    getAdyenPOIID: function (): String {
+        var returnValue: String = "";
+        if (!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('Adyen_POIID'))) {
             returnValue = adyenCurrentSite.getCustomPreferenceValue('Adyen_POIID');
         }
         return returnValue;
     },
 
-      getAdyenApiKey : function () : String {
-        var returnValue : String = "";
-        if(!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('Adyen_API_Key'))) {
+    getAdyenApiKey: function (): String {
+        var returnValue: String = "";
+        if (!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('Adyen_API_Key'))) {
             returnValue = adyenCurrentSite.getCustomPreferenceValue('Adyen_API_Key');
         }
         return returnValue;
     },
 
-    isOpenInvoiceMethod: function(paymentMethod){
-            if(paymentMethod.indexOf("afterpay") > -1 || paymentMethod.indexOf("klarna") > -1 || paymentMethod.indexOf("ratepay") > -1 ){
-                if(paymentMethod.indexOf("afterpaytouch") == -1 ){
-                    return true;
+    getCheckoutUrl: function (): String {
+        var checkoutUrl = this.getLoadingContext() + "sdk/2.1.0/adyen.js";
+        return checkoutUrl;
+    },
+
+    getLoadingContext: function (): String {
+        var returnValue: String = "";
+        switch (__AdyenHelper.getAdyenMode()) {
+            case __AdyenHelper.MODE.TEST:
+                returnValue = __AdyenHelper.LOADING_CONTEXT_TEST;
+                break;
+            case __AdyenHelper.MODE.LIVE:
+                returnValue = __AdyenHelper.LOADING_CONTEXT_LIVE;
+                break;
+        }
+        return returnValue;
+    },
+
+    hasCheckoutComponent: function (paymentMethod) {
+        if (paymentMethod.indexOf("ideal") > -1 ||
+            paymentMethod.indexOf("klarna") > -1 ||
+            paymentMethod.indexOf("afterpay") > -1
+        ) {
+            return true;
+        }
+        return false;
+    },
+
+    /**
+     * In the open invoice components we need to validate only the personal details and only the
+     * dateOfBirth, telephoneNumber and gender if it's set in the admin
+     * @param details
+     * @returns {Array}
+     */
+    filterOutOpenInvoiceComponentDetails: function (details) {
+        var methodDetailsObj = JSON.parse(details);
+
+        var filteredDetails = methodDetailsObj.details.map(function (parentDetail) {
+            if (parentDetail.key == "personalDetails") {
+                var detailObject = parentDetail.details.map(function (detail) {
+                    if (detail.key == 'dateOfBirth' ||
+                        detail.key == 'telephoneNumber' ||
+                        detail.key == 'gender') {
+                        return detail;
+                    }
+                });
+
+                if (!!detailObject) {
+                    return {
+                        "key": parentDetail.key,
+                        "type": parentDetail.type,
+                        "details": __AdyenHelper.filterUndefinedItemsInArray(detailObject)
+                    };
                 }
             }
-            return false;
+        });
+
+        methodDetailsObj = __AdyenHelper.filterUndefinedItemsInArray(filteredDetails);
+        return JSON.stringify(methodDetailsObj);
+    },
+    /**
+     * Helper function to filter out the undefined items from an array
+     * @param arr
+     * @returns {*}
+     */
+    filterUndefinedItemsInArray: function (arr) {
+        return arr.filter(function (item) {
+            return typeof item !== 'undefined';
+        });
+    },
+    getRatePayID: function (): String {
+
+        var returnValue: String = "";
+        if (!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('AdyenRatePayID'))) {
+            returnValue = adyenCurrentSite.getCustomPreferenceValue('AdyenRatePayID');
+        }
+        return returnValue;
+    },
+
+    isOpenInvoiceMethod: function (paymentMethod) {
+        if (paymentMethod.indexOf("afterpay") > -1 || paymentMethod.indexOf("klarna") > -1 || paymentMethod.indexOf("ratepay") > -1 || paymentMethod.indexOf("facilypay") > -1) {
+            if (paymentMethod.indexOf("afterpaytouch") == -1) {
+                return true;
+            }
+        }
+        return false;
     },
 
-    isMolpayMethod: function(paymentMethod) {
+    isMolpayMethod: function (paymentMethod) {
         if (paymentMethod.indexOf("molpay") > -1) {
             return true;
         }
@@ -167,12 +236,12 @@ var __AdyenHelper : Object = {
     // Get saved card token of customer saved card based on matched cardUUID
     getCardToken: function (cardUUID, CustomerObj) {
         var token = '';
-        if(!empty(CustomerObj) && CustomerObj.authenticated && !empty(cardUUID)) {
+        if (!empty(CustomerObj) && CustomerObj.authenticated && !empty(cardUUID)) {
             var wallet = CustomerObj.getProfile().getWallet();
             var paymentInstruments = wallet.getPaymentInstruments(dw.order.PaymentInstrument.METHOD_CREDIT_CARD);
             var creditCardInstrument;
             var instrumentsIter = paymentInstruments.iterator();
-            while(instrumentsIter.hasNext()) {
+            while (instrumentsIter.hasNext()) {
                 creditCardInstrument = instrumentsIter.next();
                 //find token ID exists for matching payment card
                 if (creditCardInstrument.UUID.equals(cardUUID) && !empty(creditCardInstrument.getCreditCardToken())) {
@@ -184,68 +253,52 @@ var __AdyenHelper : Object = {
         return token;
     },
 
-    createCardObject: function (params) {
-        var card,
-            cardObject = {},
-            formType = !empty(params) && 'FormType' in params && !empty(params.FormType) ? params.FormType : 'billing',
-            tokenID = !empty(params) && 'TokenID' in params && !empty(params.TokenID) ? params.TokenID : '';
-
+    createCardObjectSF: function (isOneClick, formType) {
+        var card;
+        var cardType = "scheme";
+        var paymentMethodObject = {};
         switch (formType) {
             case 'billing':
-                    var encryptedData;
-                if(session.forms.billing.paymentMethods) {
+                if (session.forms.billing.paymentMethods) {
                     card = session.forms.billing.paymentMethods.creditCard;
-                    encryptedData = card.encrypteddata.value;
-                }
-                else {
-                    //different form structure for SFRA
+                    paymentMethodObject['holderName'] = card.owner.value;
+                    if (card.type.value) {
+                        cardType = card.type.value;
+                    }
+                } else {
+                    // structure for SFRA
                     card = session.forms.billing.creditCardFields;
-                    encryptedData = card.adyenEncryptedData.value;
-                }
-
-                    if (__AdyenHelper.getAdyenCseEnabled() && !empty(encryptedData)) {
-                        cardObject['additionalData'] = {
-                            'card.encrypted.json': encryptedData
-                        };
-                    } else {
-                    		cardObject['card'] = {
-                            'number': card.number.value,
-                            'expiryMonth': card.expiration.month.value,
-                            'expiryYear': card.expiration.year.value,
-                            'cvc': card.cvn.value,
-                            'holderName': card.owner.value
-                    		};
+                    if (card.cardType.value && isOneClick) {
+                        cardType = __AdyenHelper.getAdyenCardType(card.cardType.value);
                     }
+                    paymentMethodObject['holderName'] = card.cardOwner.value;
+                }
                 break;
             case 'account':
-                var encryptedData;
-                    if(session.forms.paymentinstruments){
-                        card = session.forms.paymentinstruments.creditcards.newcreditcard;
-                        encryptedData = card.encrypteddata.value;
-                    }
-                    else {
-                        //different form structure for SFRA
-                        card = session.forms.creditCard;
-                        encryptedData = card.adyenEncryptedData.value;
-                    }
-
-                    if (__AdyenHelper.getAdyenCseEnabled() && !empty(encryptedData)) {
-                        cardObject['additionalData'] = {
-                            'card.encrypted.json': encryptedData
-                        };
-                    } else {
-                        cardObject['card'] = {
-                            'number': card.number.value,
-                            'expiryMonth': card.expiration.month.value,
-                            'expiryYear': card.expiration.year.value,
-                            'cvc': card.cvn.value,
-                            'holderName': card.owner.value
-                        };
-                    }
+                if (session.forms.paymentinstruments) {
+                    card = session.forms.paymentinstruments.creditcards.newcreditcard;
+                    paymentMethodObject['holderName'] = card.owner.value;
+                } else {
+                    // structure for SFRA
+                    card = session.forms.creditCard;
+                    paymentMethodObject['holderName'] = card.cardOwner.value;
+                }
                 break;
         }
 
-        return cardObject;
+        if (card.adyenEncryptedSecurityCode.value) {
+            paymentMethodObject['encryptedSecurityCode'] = card.adyenEncryptedSecurityCode.value;
+        }
+
+        paymentMethodObject['type'] = cardType;
+
+        if (!isOneClick) {
+            paymentMethodObject['encryptedCardNumber'] = card.adyenEncryptedCardNumber.value;
+            paymentMethodObject['encryptedExpiryMonth'] = card.adyenEncryptedExpiryMonth.value;
+            paymentMethodObject['encryptedExpiryYear'] = card.adyenEncryptedExpiryYear.value;
+        }
+
+        return paymentMethodObject;
     },
 
     createShopperObject: function (params) {
@@ -269,9 +322,9 @@ var __AdyenHelper : Object = {
         if (!empty(profile) && !empty(profile.getCustomerNo())) {
             customerID = profile.getCustomerNo();
         } else {
-        	if (!empty(basket.getCustomerNo())) {
-        		customerID = basket.getCustomerNo();	
-        	}	
+            if (!empty(basket.getCustomerNo())) {
+                customerID = basket.getCustomerNo();
+            }
         }
 
         var shopperIP = !empty(request) && !empty(request.getHttpRemoteAddress()) ? request.getHttpRemoteAddress() : '';
@@ -293,9 +346,9 @@ var __AdyenHelper : Object = {
 
     createAdyenRequestObject: function (recurringType, order, saveCreditCard) {
         var jsonObject = {},
-        		reference = '';
+            reference = '';
 
-        if(order && !empty(order.getOrderNo())) {
+        if (order && !empty(order.getOrderNo())) {
             reference = order.getOrderNo();
         } else {
             reference = 'recurringPayment-account';
@@ -317,13 +370,13 @@ var __AdyenHelper : Object = {
             } else {
                 // if save credit card hasn't been selected or guest order
                 if (__AdyenHelper.getAdyenGuestRecurringEnabled()) {
-                	jsonObject['recurring'] = {
-                    	'contract': 'RECURRING'
-                	};	
+                    jsonObject['recurring'] = {
+                        'contract': 'RECURRING'
+                    };
                 }
-              
+
             }
-        } 
+        }
 
         jsonObject['applicationInfo'] = __AdyenHelper.getApplicationInfo();
 
@@ -334,19 +387,15 @@ var __AdyenHelper : Object = {
         var tokenID = '',
             pspReference = '';
 
- 		var recurringType = __AdyenHelper.getAdyenRecurringType();
+        var recurringType = __AdyenHelper.getAdyenRecurringType();
 
         var jsonObject = __AdyenHelper.createAdyenRequestObject(recurringType, null, true);
 
-        var cardObject = __AdyenHelper.createCardObject({
-            FormType: 'account'
-        });
-        if ('card' in cardObject) {
-            jsonObject['card'] = cardObject.card;
-        }
-        if ('additionalData' in cardObject) {
-            jsonObject['additionalData'] = cardObject.additionalData;
-        }
+        var paymentMethodObject = __AdyenHelper.createCardObjectSF(false, 'account');
+        jsonObject['paymentMethod'] = paymentMethodObject;
+
+        jsonObject['enableOneClick'] = true;
+        jsonObject['paymentMethod'].storeDetails = true;
 
         var shopperObject = __AdyenHelper.createShopperObject({
             Customer: params.Customer
@@ -408,23 +457,27 @@ var __AdyenHelper : Object = {
         if (!empty(cardType)) {
             switch (cardType) {
                 case 'Visa':
-                    cardType='visa';
+                    cardType = 'visa';
                     break;
                 case 'Master':
                 case 'MasterCard':
-                    cardType='mc';
+                case 'Mastercard':
+                    cardType = 'mc';
                     break;
                 case 'Amex':
-                    cardType='amex';
+                    cardType = 'amex';
                     break;
                 case 'Discover':
-                    cardType='discover';
+                    cardType = 'discover';
                     break;
                 case 'Maestro':
-                    cardType='maestro';
+                    cardType = 'maestro';
                     break;
                 case 'Diners':
-                    cardType='diners';
+                    cardType = 'diners';
+                    break;
+                case 'Bancontact':
+                    cardType = 'bcmc';
                     break;
                 default:
                     cardType = cardType.toLowerCase();
@@ -441,23 +494,26 @@ var __AdyenHelper : Object = {
         if (!empty(cardType)) {
             switch (cardType) {
                 case 'visa':
-                    cardType='Visa';
+                    cardType = 'Visa';
                     break;
                 case 'mc':
-                    cardType='Mastercard';
+                    cardType = 'Mastercard';
                     break;
                 case 'amex':
-                    cardType='Amex';
+                    cardType = 'Amex';
                     break;
                 case 'discover':
-                    cardType='Discover';
+                    cardType = 'Discover';
                     break;
                 case 'maestro':
                 case 'maestrouk':
-                    cardType='Maestro';
+                    cardType = 'Maestro';
                     break;
                 case 'diners':
-                    cardType='Diners';
+                    cardType = 'Diners';
+                    break;
+                case 'bcmc':
+                    cardType = 'Bancontact';
                     break;
                 default:
                     cardType = '';
@@ -468,46 +524,29 @@ var __AdyenHelper : Object = {
             throw new Error('cardType argument is not passed to getSFCCCardType function');
         }
     },
-	getAdyenOrderPaymentInstrument : function(order : dw.order.Order) {
-		var adyenOrderPaymentInstrument = null;
-		if (order) {
-			var paymentInstruments : dw.util.Collection = order.getPaymentInstruments();
-			for each (let paymentInstrument in paymentInstruments) {
-				let paymentProcessor = paymentInstrument.getPaymentTransaction().getPaymentProcessor();
-	            let paymentProcessorID = paymentProcessor ? paymentProcessor.getID(): paymentInstrument.getPaymentMethod();
-				if (paymentProcessorID.equals("Adyen") || paymentProcessorID.equals("ADYEN_CREDIT")) {
-					adyenOrderPaymentInstrument = paymentInstrument;
-					break;
-				}
-			}
-		}
-
-		return adyenOrderPaymentInstrument;
-	},
-
-
-	saveAuthResponseAttributes : function(transaction : dw.order.PaymentTransaction, map : dw.web.HttpParameterMap) {
-		transaction.custom.Adyen_authResult = map.isParameterSubmitted('authResult') ? map.authResult.stringValue : '';
-		transaction.custom.Adyen_merchantReference = map.isParameterSubmitted('merchantReference') ? map.merchantReference.stringValue : '';
-		transaction.custom.Adyen_paymentMethod = map.isParameterSubmitted('paymentMethod') ? map.paymentMethod.stringValue : '';
-		transaction.custom.Adyen_pspReference = map.isParameterSubmitted('pspReference') ? map.pspReference.stringValue : '';
-		transaction.custom.Adyen_shopperLocale = map.isParameterSubmitted('shopperLocale') ? map.shopperLocale.stringValue : '';
-		transaction.custom.Adyen_skinCode = map.isParameterSubmitted('skinCode') ? map.skinCode.stringValue : '';
-		transaction.custom.Adyen_merchantSig = map.isParameterSubmitted('merchantSig') ? map.merchantSig.stringValue : '';
-		transaction.custom.Adyen_merchantReturnData = map.isParameterSubmitted('merchantReturnData') ? map.merchantReturnData.stringValue : '';
+
+    saveAuthResponseAttributes: function (transaction: dw.order.PaymentTransaction, map: dw.web.HttpParameterMap) {
+        transaction.custom.Adyen_authResult = map.isParameterSubmitted('authResult') ? map.authResult.stringValue : '';
+        transaction.custom.Adyen_merchantReference = map.isParameterSubmitted('merchantReference') ? map.merchantReference.stringValue : '';
+        transaction.custom.Adyen_paymentMethod = map.isParameterSubmitted('paymentMethod') ? map.paymentMethod.stringValue : '';
+        transaction.custom.Adyen_pspReference = map.isParameterSubmitted('pspReference') ? map.pspReference.stringValue : '';
+        transaction.custom.Adyen_shopperLocale = map.isParameterSubmitted('shopperLocale') ? map.shopperLocale.stringValue : '';
+        transaction.custom.Adyen_skinCode = map.isParameterSubmitted('skinCode') ? map.skinCode.stringValue : '';
+        transaction.custom.Adyen_merchantSig = map.isParameterSubmitted('merchantSig') ? map.merchantSig.stringValue : '';
+        transaction.custom.Adyen_merchantReturnData = map.isParameterSubmitted('merchantReturnData') ? map.merchantReturnData.stringValue : '';
 
     },
 
-	getCurrencyValueForApi : function ( amount ) : String {
-		var currencyCode = dwutil.Currency.getCurrency(amount.currencyCode);
-		var digitsNumber = __AdyenHelper.getFractionDigits(currencyCode.toString());
+    getCurrencyValueForApi: function (amount): String {
+        var currencyCode = dwutil.Currency.getCurrency(amount.currencyCode);
+        var digitsNumber = __AdyenHelper.getFractionDigits(currencyCode.toString());
         return Math.round(amount.multiply(Math.pow(10, digitsNumber)).value);
-	},
+    },
 
-	getFractionDigits : function (currencyCode) : Number {
-		var format;
-		switch(currencyCode) {
-			case "JPY":
+    getFractionDigits: function (currencyCode): Number {
+        var format;
+        switch (currencyCode) {
+            case "JPY":
             case "IDR":
             case "KRW":
             case "BYR":
@@ -540,11 +579,11 @@ var __AdyenHelper : Object = {
             default:
                 format = 2;
                 break;
-		}
-		return format;
-	},
+        }
+        return format;
+    },
 
-	getApplicationInfo : function () {
+    getApplicationInfo: function () {
 
         var externalPlatformVersion = "";
 
@@ -552,8 +591,8 @@ var __AdyenHelper : Object = {
             // AdyenController can be coming either from int_adyen_controllers or int_adyen_SFRA, depending on the cartridge path
             var AdyenController = require('*/cartridge/controllers/Adyen.js');
             externalPlatformVersion = AdyenController.getExternalPlatformVersion;
+        } catch (e) {
         }
-        catch(e){}
 
         var applicationInfo = {
             "adyenPaymentSource": {
@@ -577,4 +616,4 @@ function pad(num) {
     return num;
 }
 
-module.exports= __AdyenHelper;
+module.exports = __AdyenHelper;
\ No newline at end of file
diff --git a/cartridges/int_adyen_overlay/cartridge/static/default/css/adyenCSS.css b/cartridges/int_adyen_overlay/cartridge/static/default/css/adyenCSS.css
new file mode 100644
index 000000000..22f5c4a1b
--- /dev/null
+++ b/cartridges/int_adyen_overlay/cartridge/static/default/css/adyenCSS.css
@@ -0,0 +1,78 @@
+/*Credit Cards*/
+
+.adyen-checkout__label, .adyen-checkout__label__text {
+	float: none !important;
+	width: 100% !important;
+	text-align: left !important;
+}
+
+.creditCard {
+	margin-left: 27%;
+}
+
+.paymentMethod {
+	list-style-type: none;
+	margin: 10px 0 10px 0;
+}
+
+.paymentMethod_img {
+	margin: 0 5px 0 5px;
+}
+
+.additionalFields {
+	display: inline-block;
+	margin: 0 0 0 10px;
+}
+
+.hiddenFields {
+	display: none;
+}
+
+.security-code-input .adyen-checkout__field {
+	margin: 0 !important;
+}
+
+.security-code-input .adyen-checkout__field:first-child {
+	display: none;
+}
+
+/*Checkout Components*/
+
+.checkoutComponent {
+	display:none;
+	margin-top: 20px;
+}
+
+#component_ach .form-row label {
+	float: left;
+}
+
+#type {
+	list-style-type: none;
+}
+
+#ssnValue {
+    background: #fff;
+    border: 1px solid #b9c4c9;
+    border-radius: 3px;
+    color: #001b2b;
+    display: block;
+    font-family: inherit;
+    font-size: 16px;
+    height: 40px;
+    outline: none;
+    padding: 5px 8px;
+    position: relative;
+    transition: border .2s ease-out,box-shadow .2s ease-out;
+    width: 200px;
+}
+
+#ssn_klarna {
+	margin-top: 16px;
+}
+
+/*Summary page*/
+
+.summary-label{
+	font-weight: bold;
+}
\ No newline at end of file
diff --git a/cartridges/int_adyen_overlay/cartridge/static/default/css/checkout.css b/cartridges/int_adyen_overlay/cartridge/static/default/css/checkout.css
index 69c743996..31371e556 100644
--- a/cartridges/int_adyen_overlay/cartridge/static/default/css/checkout.css
+++ b/cartridges/int_adyen_overlay/cartridge/static/default/css/checkout.css
@@ -1,8 +1,829 @@
+.adyen-checkout__payment-method {
+    position: relative;
+    background: white;
+    border: 1px solid #edf0f3;
+    cursor: pointer;
+    margin-top: -1px;
+    width: 100%;
+    transition: opacity 0.3s ease-out;
+    /* transition: margin 100ms cubic-bezier(0.4, 0, 0.2, 1) 0ms; */
+}
+
+.adyen-checkout__payment-method:focus {
+    outline: 0;
+}
+
+.adyen-checkout__payment-method:first-child,
+.adyen-checkout__payment-method--selected + .adyen-checkout__payment-method {
+    margin-top: 0;
+    border-top-left-radius: 3px;
+    border-top-right-radius: 3px;
+}
+
+.adyen-checkout__payment-method--next-selected {
+    border-bottom-left-radius: 3px;
+    border-bottom-right-radius: 3px;
+}
+
+.adyen-checkout__payment-method--loading {
+    opacity: 0.2;
+}
+
+.adyen-checkout__payment-method--selected.adyen-checkout__payment-method--loading {
+    opacity: 0.9;
+}
+
+.adyen-checkout__payment-method--loading .adyen-checkout__spinner__wrapper {
+    position: absolute;
+    right: 0;
+    left: 0;
+    z-index: 1;
+}
+
+.adyen-checkout__payment-method__header {
+    display: flex;
+    align-items: center;
+    font-weight: 400;
+    font-size: 16px;
+    color: #00202e;
+    padding: 16px;
+    position: relative;
+    transition: background 0.1s ease-out;
+    width: 100%;
+}
+
+.adyen-checkout__payment-method__surcharge {
+    color: #687282;
+    margin-left: 5px;
+}
+
+.adyen-checkout__payment-method--selected {
+    transition: margin 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+
+    background: #f7f8f9;
+    border: 1px solid #d4d9db;
+    margin: 8px 0;
+    border-radius: 3px;
+    cursor: default;
+}
+
+.adyen-checkout__payment-method--selected .adyen-checkout__payment-method__header {
+    font-weight: 500;
+}
+
+.adyen-checkout__payment-method__details__content {
+    padding: 6px 16px 24px;
+}
+
+.adyen-checkout__payment-method__image__wrapper {
+    height: 26px;
+    position: relative;
+}
+
+.adyen-checkout__payment-method__image__wrapper:after {
+    content: '';
+    position: absolute;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    left: 0;
+    border-radius: 3px;
+    border: 1px solid rgba(0, 27, 43, 0.17);
+}
+
+.adyen-checkout__payment-method__image {
+    border-radius: 3px;
+}
+
+.adyen-checkout__payment-method__disable_oneclick {
+    background-color: transparent;
+    color: #687282;
+    cursor: pointer;
+    border: none;
+    display: block;
+    font-size: 13px;
+
+    padding: 0;
+    position: absolute;
+    right: 70px;
+    text-decoration: underline;
+}
+
+/*  Payment Method Radio Button */
+.adyen-checkout__payment-method__radio {
+    position: absolute;
+    background-color: #fff;
+    border: 1px solid #b9c4c9;
+    border-radius: 50%;
+    height: 18px;
+    width: 18px;
+    right: 20px;
+    transition: border-color 0.3s ease-out;
+    box-shadow: inset 0 1px 3px rgba(0, 27, 43, 0.15);
+}
+
+.adyen-checkout__payment-method__radio:after {
+    content: '';
+    display: block;
+    position: absolute;
+    margin: 0 auto;
+    left: 0;
+    right: 0;
+    top: 50%;
+    height: 6px;
+    width: 6px;
+    background-color: #fff;
+    border-radius: 50%;
+    transform: translateY(-50%) scale(0);
+    transition: transform 0.3s ease-out;
+    box-shadow: 0 1px 1px rgba(0, 15, 45, 0.25);
+}
+
+.adyen-checkout__payment-method__radio:hover {
+    border-color: #00a3ff;
+    cursor: pointer;
+}
+
+.adyen-checkout__payment-method__radio--selected {
+    background-color: #00a3ff;
+    border: 0px solid transparent;
+    transition: all 0.3s ease-out;
+    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.26);
+}
+
+.adyen-checkout__payment-method__radio--selected:after {
+    transform: translateY(-50%) scale(1);
+}
+/*  /Payment Method Radio Button */
+
+.adyen-checkout__spinner__wrapper {
+    height: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.adyen-checkout__spinner__wrapper--inline {
+    height: auto;
+    display: inline-block;
+    margin-right: 8px;
+}
+
+.adyen-checkout__spinner {
+    border: 2px solid #00a3ff;
+    border-radius: 50%;
+    height: 43px;
+    width: 43px;
+    border-top-color: transparent;
+    animation: rotateSpinner 2s infinite linear;
+}
+
+.adyen-checkout__spinner--large {
+    height: 43px;
+    width: 43px;
+}
+
+.adyen-checkout__spinner--small {
+    height: 16px;
+    width: 16px;
+}
+
+.adyen-checkout__spinner--medium {
+    height: 28px;
+    width: 28px;
+}
+
+@keyframes rotateSpinner {
+    0% {
+        transform: rotate(0deg);
+    }
+    100% {
+        transform: rotate(360deg);
+    }
+}
+
+.adyen-checkout__pay-button {
+    width: 100%;
+    padding: 16px;
+    border: 0;
+    border-radius: 3px;
+    background: #001b2b;
+    color: #fff;
+    font-weight: 700;
+    font-size: 1em;
+    transition: background 0.3s ease-out;
+    cursor: pointer;
+    box-shadow: 0 3px 4px rgba(0, 15, 45, 0.2);
+}
+
+.adyen-checkout__pay-button:disabled {
+    background: #e6e9eb;
+    box-shadow: none;
+}
+
+.adyen-checkout__pay-button--loading {
+    background: #4c5f6b;
+    box-shadow: none;
+    outline: 0;
+    user-select: none;
+    pointer-events: none;
+}
+
+.adyen-checkout__pay-button .adyen-checkout__spinner {
+    border-color: #fff;
+    border-width: 3px;
+    border-top-color: transparent;
+}
+
+.adyen-checkout__field {
+    display: block;
+    margin-bottom: 16px;
+}
+
+.adyen-checkout__field:last-child {
+    margin-bottom: 0;
+}
+
+.adyen-checkout__label__text,
+.adyen-checkout__helper-text {
+    color: #001b2b;
+    display: block;
+    font-size: 13px;
+    font-weight: normal;
+    line-height: 13px;
+    padding-bottom: 8px;
+}
+
+.adyen-checkout__helper-text {
+    color: #687282;
+}
+
+.adyen-checkout__label__text {
+    transition: color 0.2s ease-out;
+}
+
+.adyen-checkout__label--focused .adyen-checkout__label__text {
+    color: #0c527a;
+}
+
+.adyen-checkout__radio_group__input {
+    display: none;
+}
+
+.adyen-checkout__radio_group__label {
+    padding-left: 24px;
+    position: relative;
+    display: block;
+    margin-bottom: 8px;
+
+    font-size: 13px;
+    font-weight: normal;
+    line-height: 16px;
+}
+
+.adyen-checkout__radio_group__label:before {
+    content: '';
+    position: absolute;
+    background-color: #fff;
+    border: 1px solid #b9c4c9;
+    border-radius: 50%;
+    height: 16px;
+    width: 16px;
+    left: 0;
+    top: 0;
+    transition: border-color 0.3s ease-out;
+}
+
+.adyen-checkout__radio_group__label:after {
+    content: '';
+    display: block;
+    position: absolute;
+    margin: 0 auto;
+    left: 5px;
+    top: 5px;
+    height: 6px;
+    width: 6px;
+    background-color: #fff;
+    border-radius: 50%;
+    transform: scale(0);
+    transition: transform 0.3s ease-out;
+    box-shadow: 0 1px 1px rgba(0, 15, 45, 0.25);
+}
+
+.adyen-checkout__radio_group__label:hover {
+    border-color: #00a3ff;
+    cursor: pointer;
+}
+
+.adyen-checkout__radio_group__input:checked + .adyen-checkout__radio_group__label:before,
+.adyen-checkout__radio_group__label--selected {
+    background-color: #00a3ff;
+    border: 0px solid transparent;
+    transition: all 0.3s ease-out;
+    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.26);
+}
+
+.adyen-checkout__radio_group__input:checked + .adyen-checkout__radio_group__label:after {
+    transform: scale(1);
+}
+
+.adyen-checkout__checkbox {
+    display: block;
+}
+
+.adyen-checkout__checkbox > input[type='checkbox'] {
+    position: absolute;
+    opacity: 0;
+    pointer-events: none;
+}
+
+.adyen-checkout__checkbox__label {
+    position: relative;
+    padding-left: 24px;
+    cursor: pointer;
+    display: inline-block;
+    line-height: 16px;
+    font-size: 1rem;
+    color: #001b2b;
+    font-size: 13px;
+    font-weight: normal;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+}
+
+/*  Check */
+.adyen-checkout__checkbox__input + span:before {
+    content: '';
+    position: absolute;
+    top: 2px;
+    left: 1px;
+    width: 6px;
+    height: 11px;
+    border-top: 1px solid transparent;
+    border-left: 1px solid transparent;
+    border-right: 2px solid #fff;
+    border-bottom: 2px solid #fff;
+    -webkit-transform: rotateZ(37deg);
+    transform: rotateZ(37deg);
+    -webkit-transform-origin: 100% 100%;
+    transform-origin: 100% 100%;
+    z-index: 1;
+    border-radius: 0px 2px 1px 2px;
+    opacity: 0;
+    transition: opacity 0.2s ease-out;
+}
+
+.adyen-checkout__checkbox__input:checked + span:before {
+    opacity: 1;
+}
+
+/*  Box */
+.adyen-checkout__checkbox__input + span:after {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 16px;
+    height: 16px;
+    border-radius: 3px;
+    background-color: #fff;
+    border: 1px solid #b9c4c9;
+    z-index: 0;
+    transition: background 0.15s ease-out, border 0.05s ease-out, box-shadow 0.1s ease-out;
+}
+
+.adyen-checkout__checkbox__input:checked + span:after {
+    border: 1px solid #00a3ff;
+    background-color: #00a3ff;
+}
+
+.adyen-checkout__checkbox__input:focus + span:after {
+    border: 1px solid #00a3ff;
+    box-shadow: 0 0 0 2px #91d7ff;
+}
+
+.adyen-checkout__dropdown {
+    width: 100%;
+    max-width: 200px;
+    font-size: 16px;
+}
+
+.adyen-checkout__dropdown--small {
+    max-width: 130px;
+    width: 100%;
+}
+
+.adyen-checkout__dropdown--large {
+    max-width: 300px;
+    width: 100%;
+}
+
+.adyen-checkout__dropdown__button {
+    padding: 9px 20px 9px 8px;
+    border: 1px solid #b9c4c9;
+    background: #fff;
+    border-radius: 3px;
+    outline: 0;
+    width: 100%;
+    font-size: 16px;
+    height: 40px;
+    line-height: 20px;
+    transition: border 0.2s ease-out, box-shadow 0.2s ease-out;
+}
+
+.adyen-checkout__dropdown__button__icon {
+    margin-right: 8px;
+    max-width: 32px;
+    max-height: 20px;
+}
+.adyen-checkout__dropdown__button--active,
+.adyen-checkout__dropdown__button:active,
+.adyen-checkout__dropdown__button:focus {
+    border-color: #00a3ff;
+    box-shadow: 0 0 0 2px #91d7ff;
+}
+
+.adyen-checkout__dropdown__list {
+    z-index: 2;
+    border-radius: 3px;
+    margin-top: 2px;
+    box-shadow: 0px 2px 7px rgba(0, 15, 45, 0.3);
+}
+
+.adyen-checkout__dropdown__list.adyen-checkout__dropdown__list--active {
+    animation: expand 100ms ease-out;
+}
+
+.adyen-checkout__dropdown__element {
+    padding: 8px;
+    line-height: 20px;
+    border: 1px solid transparent;
+    border-bottom: 1px solid #e6e9eb;
+    word-break: break-word;
+    hyphens: auto;
+    cursor: pointer;
+    outline: 0;
+    transition: background 0.2s ease-out, border-color 0.2s ease-out;
+}
+
+.adyen-checkout__dropdown__element:last-child {
+    border-bottom: 0;
+}
+
+.adyen-checkout__dropdown__element:hover,
+.adyen-checkout__dropdown__element:focus,
+.adyen-checkout__dropdown__element:active {
+    background: #f0f2f4;
+}
+
+.adyen-checkout__dropdown__element:active,
+.adyen-checkout__dropdown__element:focus {
+    border-top-color: #00a3ff;
+    border-bottom-color: #00a3ff;
+}
+
+.adyen-checkout__dropdown__element__icon {
+    margin-right: 8px;
+    max-width: 32px;
+    max-height: 20px;
+}
+
+@keyframes expand {
+    0% {
+        -webkit-transform: scale3d(1, 0, 1);
+        transform: scale3d(1, 0, 1);
+    }
+    100% {
+        -webkit-transform: scale3d(1, 1, 1);
+        transform: scale3d(1, 1, 1);
+    }
+}
+
+.adyen-checkout__select-list {
+    padding: 0;
+}
+
+.adyen-checkout__select-list__item {
+    display: inline-block;
+    padding: 9px;
+    border-top: 1px solid #b9c4c9;
+    background: #fff;
+    outline: 0;
+    width: 100%;
+    font-size: 16px;
+    cursor: pointer;
+    line-height: 20px;
+}
+
+.adyen-checkout__select-list__item:first-child {
+    border-top: 0;
+}
+
+.adyen-checkout__select-list__item:hover,
+.adyen-checkout__select-list__item:focus,
+.adyen-checkout__select-list__item:active {
+    background: rgba(145, 215, 255, 0.5);
+}
+
+.adyen-checkout__select-list__item--selected {
+    background: rgba(145, 215, 255, 0.5);
+    font-weight: bold;
+}
+
+.adyen-checkout__input {
+    color: #001b2b;
+    font-size: 16px;
+    font-family: inherit;
+    display: block;
+    height: 40px;
+    background: white;
+    border: 1px solid #b9c4c9;
+    border-radius: 3px;
+    padding: 5px 8px;
+    position: relative;
+    outline: none;
+    width: 200px;
+    transition: border 0.2s ease-out, box-shadow 0.2s ease-out;
+}
+
+.adyen-checkout__input.adyen-checkout__input--small {
+    width: 130px;
+}
+
+.adyen-checkout__input.adyen-checkout__input--large {
+    width: 300px;
+}
+
+.adyen-checkout__input--error {
+    border-color: #d0021b;
+}
+
+.adyen-checkout__input::placeholder {
+    color: #90a2bd;
+    font-weight: 200;
+}
+
+.adyen-checkout__input:active,
+.adyen-checkout__input--active,
+.adyen-checkout__input:focus {
+    border: 1px solid #00a3ff;
+    box-shadow: 0 0 0 2px #91d7ff;
+}
+
+.adyen-checkout__input[readonly] {
+    background-color: #e6e9eb;
+    cursor: default;
+    border-color: transparent;
+}
+
+.open-invoice__field {
+    margin-bottom: 15px;
+}
+
+.open-invoice__field select {
+    background: #ffffff;
+    border: 1px solid #d8d8d8;
+    box-shadow: none;
+    font-size: 0.93333333333em;
+    height: 40px;
+    margin-top: 4px;
+    max-width: 420px;
+    width: 100%;
+    padding: 5px 8px;
+    display: block;
+}
+
+.open-invoice__field input[type='text'],
+.open-invoice__field input[type='date'] {
+    display: block;
+    height: 35px;
+    width: 100%;
+    max-width: 420px;
+}
+
+.adyen-checkout__fieldset {
+    display: block;
+    padding-bottom: 30px;
+    color: #687282;
+    width: 100%;
+}
+
+.adyen-checkout__fieldset--readonly {
+    color: #001b2b;
+    font-size: 13px;
+    list-style: 19px;
+    margin: 0;
+}
+
+.adyen-checkout__fieldset--deliveryAddress {
+    padding-top: 30px;
+}
+
+.adyen-checkout__fieldset__title {
+    display: block;
+    font-size: 11px;
+    font-weight: bold;
+    letter-spacing: 1px;
+    text-transform: uppercase;
+    padding: 0 0 20px;
+    margin: 0;
+    color: #687282;
+}
+
+.adyen-checkout-card__exp-cvc {
+    display: flex;
+}
+
+.adyen-checkout__card__cardNumber {
+    max-width: 400px;
+}
+
+.adyen-checkout__card__exp-date__input--oneclick {
+    line-height: 40px;
+    height: 40px;
+    font-weight: 400;
+}
+
+.adyen-checkout-card__exp-cvc .adyen-checkout__field {
+    margin-right: 24px;
+}
+
+.adyen-checkout__giropay__results {
+    background: #fff;
+    border: 1px solid #b9c4c9;
+    -moz-border-radius: 4px;
+    -webkit-border-radius: 4px;
+    border-radius: 4px;
+    max-height: 140px;
+    min-height: 100px;
+    overflow-y: scroll;
+    width: 100%;
+}
+
+.adyen-checkout__giropay__no-results {
+    color: #687282;
+    display: block;
+    font-size: 13px;
+    padding: 0 0 0 2px;
+}
+
+.adyen-checkout__giropay__placeholder {
+    color: #90a2bd;
+    display: block;
+    padding: 0 0 0 2px;
+    font-weight: 200;
+}
+
+.adyen-checkout__giropay__loading {
+    display: block;
+    min-height: 100px;
+}
+
+.adyen-checkout__giropay__loading .adyen-checkout__spinner__wrapper {
+    display: inline-block;
+    vertical-align: middle;
+}
+
+.adyen-checkout__giropay__loading-text {
+    color: #687282;
+    font-size: 13px;
+    line-height: 16px;
+    vertical-align: middle;
+}
+
+.adyen-checkout__giropay__error {
+    color: #d0021b;
+    font-size: 13px;    
+}
+
+.adyen-checkout-phone-input {
+    display: flex;
+}
+
+.adyen-checkout-phone-input__prefix {
+    margin-right: 0.5em;
+}
+
+.adyen-checkout__iban-input__number {
+    text-transform: uppercase;
+}
+
+.adyen-checkout__wechatpay {
+    background: #fff;
+    padding: 40px;
+    text-align: center;
+    border: 1px solid rgb(221, 225, 227);
+    border-radius: 3px;
+    min-height: 443px;
+}
+
+.adyen-checkout__wechatpay__brand-logo {
+    height: 20px;
+    width: 109px;
+}
+
+.adyen-checkout__wechatpay__subtitle {
+    margin-top: 32px;
+}
+
+.adyen-checkout__wechatpay__subtitle,
+.adyen-checkout__wechatpay__payment_amount {
+    color: #001b2b;
+    font-size: 16px;
+    line-height: 19px;
+}
+
+.adyen-checkout__wechatpay__progress {
+    height: 4px;
+    background: #d4d9db;
+    border-radius: 25px;
+    margin: 32px auto 12px auto;
+    width: 152px;
+    padding-right: 3%;
+}
+
+.adyen-checkout__wechatpay__progress > span {
+    display: block;
+    height: 100%;
+    border-radius: 25px;
+    background: #00a3ff;
+}
+
+.adyen-checkout__wechatpay__countdown {
+    color: #687282;
+    font-size: 13px;
+}
+
+.adyen-checkout__wechatpay .adyen-checkout__spinner__wrapper {
+    margin: 60px 0;
+}
+
+.adyen-checkout-alert {
+    background-color: #00a3ff;
+    align-items: flex-start;
+    border-radius: 3px;
+    color: #fff;
+    display: flex;
+    justify-content: space-between;
+    line-height: 1;
+    margin: 0;
+    padding: 12px;
+}
+
+.adyen-checkout-alert--error {
+    background-color: #d81b4a;
+}
+
+.adyen-checkout-alert--success {
+    background-color: #0abf53;
+}
+
+.adyen-checkout-alert--info {
+    background-color: #00a3ff;
+}
+
+.adyen-checkout-sdk,
+.adyen-checkout-sdk *,
+.adyen-checkout-sdk *:after,
+.adyen-checkout-sdk * :before {
+    box-sizing: border-box;
+}
+
+.adyen-checkout__payment-methods-list {
+    border-radius: 3px;
+}
+
+.adyen-checkout__payment-methods-list--loading {
+    user-select: none;
+    pointer-events: none;
+}
+
+/* Forms */
+
+.adyen-checkout__link {
+    color: #3b99fc;
+    text-decoration: none;
+}
+
+.adyen-checkout__link:hover {
+    text-decoration: underline;
+}
+
+.adyen-checkout__link__klarna--more-information {
+    clear: both;
+    display: block;
+    padding: 10px 0 25px;
+}
+
+/* Adyen CSS End */
+
 .payment-method #type {
   margin-left: 22%;
 }
 
-.payment-method #issuer {
+.payment-method .issuer {
   margin: 1% 5%;
   display: none;
 }
@@ -18,10 +839,17 @@
 .payment-method #type label {
   display: inline;
   float: none;
-  padding: 0.75em 6em 0;
   width: auto;
 }
 
+.payment_method_label{
+	padding: 0.75em 6em 0;
+}
+
 .openinvoiceInput {
 	display: none;
-}
\ No newline at end of file
+}
+
+.adyen-checkout__field {
+	display: table;
+}
diff --git a/cartridges/int_adyen_overlay/cartridge/static/default/images/bancontact-dark.svg b/cartridges/int_adyen_overlay/cartridge/static/default/images/bancontact-dark.svg
new file mode 100644
index 000000000..3d1e0d591
--- /dev/null
+++ b/cartridges/int_adyen_overlay/cartridge/static/default/images/bancontact-dark.svg
@@ -0,0 +1,57 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="120px" height="78px" viewBox="0 0 120 78" enable-background="new 0 0 120 78" xml:space="preserve">  <image id="image0" width="120" height="78" x="0" y="0"
+    xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAABOCAYAAADrR9JiAAAABGdBTUEAALGPC/xhBQAAACBjSFJN
+AAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QA/wD/AP+gvaeTAAAK
+0UlEQVR42u2de1xUZRrHv3NlGO4gVzVQQNPyhmZmVmAkpHlZy8vuesnVNF01tT6uVtunPpZZfaoV
+r3nZpHYrM3NT85JobpSGAZoJEqICwgByZ7jPMLN/oJO6piln5gyn8/1vzpl53uc8P573fc97Q6Ef
+v9aKjGRRiu2AjH2RBZY4ssASRxZY4sgCSxxZYIkjCyxxZIEljtqexrt39GZKTA/u6uyL3sWuRbVr
+quuaSTlTzJaDpykzNgpqW2GvkazJ0d1ZMysalVLhkCBJgXJjE2Ne30362VLBbNqliu7XxZ/VM2Vx
+bxU/Dxc+fe5RXLXC1XZ2EXjh6L6oVbK4t0Owr574qFDB7NlF4Ad6hjgsIFKkT1gHwWzZRWA/D53D
+giFFvPRawWzJr0lOiELA1k0WWOLIAkscCY8+WMCUCy1lgNiLVpSg6QoqP4eXLD2BLUaoXAU1W8Fc
+LrY3V+MzAzq87NAipSVw0ykwTAHzRbE9uT6Vm0AXBe6jHFakdNpgUw4UjndecS9Td8ihxUlDYEsl
+FE6BlhqxPbk5LRUOLU4CApvAMB1M+WI74pS0f4FLFkPDMbG9cFradyercjXUbBPElEXhg1nhIYgt
+JSbUliIxI2Oj/QpctxfKVwhiyqQMoe9bo8gsFOZ9+fxrPxPm6hwCt88quuknKJ4nyPiFVenOE4kj
+BRM3aVEZYa6HxY3PFbQ/gVuKwfAkWNq+tMWKkr8fnMDO48K49vaEJoZ23n7jLykcW2m2L4Gtja3i
+mksEMbcteyKv7RIm4JMHW1k46BMUN6sItHfaN0bX0L4ELp4LjacEMfVj5XAmrBemU9U/DN4f/x8U
+1pvUKuoO4D3dzkG6pkiHltYWypdD7T5BTJWaB3LPis6C2NLr1Ox8xoxK3/fGX9RGtIrr4AkHUQVO
+zsxn3Z5U8ktvPAK1bHQpMf5rBSmzURFO39f7YTK13ZZCAR8u+gMhEY6tdm8F0QQ+fCqP2Bc/pKXl
+xo3W7KFmov0/EKRMi9KX2DWxGCqFeYZXJ8cw9j7nFRdEbINf3/btTcUdEmlh9cjPUdD2dLMqXJj5
++eN8d0YY/yfF9OL5cUMcEao2IVoGZxWU3fB+sHcLB2YnobQKk26rfpjI5m+E+Xse3KMTm+aPtHuM
+hEC0DDa3WH71nlpl4fiSdHTkClLWocKxPPORMCs9QwO82PHCBFzUKkeEqc045WvSkcXnCNSmC2Lr
+fEMMD7/tL4gtD72WXS9NJMBLL2Z4bgmnfE16YkM4CkW4ILYM1cKsQVUq4aPnxtIrNEDM0NwyTilw
+frnzbXt5a9ojPHZPpNhu3DJOWUU7G9OH9WXRmEFiu3FbyALfhOheoaybM0JsN24b0QQO8nEX+9lv
+SmSIL9ufH49G1X7zQDTPxwxy7hGgqIgg/rtiKr7u7XsjnWidrMWPDybHUMGHX5/EKvbGgyvoFRbA
+7OEDmBkXJYkN7KIJ7KJWkbhwNAmz4ikoE3+5q0KhIMTXA283F7FdERTRX5O89C543SHMQITM/9N+
+ew8yvwlZYIkjqsBmi5Xq+iZMN5h4kGkborXBw1/5mH1pObYedGd/T56Ki+LFCQ/gTH3Xwgoj6TlF
+xEVFoFXfXj40NJtJzTHQwVNPj07CHbDyWxAtg388X4zVCnFR4cRFhVNurOelfx1mS9KPYrl0XeJe
++jejlm2l3Fh/2zbW7knlwb8lsuNolsP9F70X/d7cEYT6e/HuFyks2vQVR7MuMC22D/M37GNvWg61
+Dc10DfLhlT9HE9unC4dO5jLvvb0M6XkHGfml5JdWExcVztrZw9GolJwvqWLBxv2k5hjQu2hImBlP
+bN+uLPvkGz777jQtFguPDezGq5NicNWqmbl6N0ezCojvH8GOo1notGpenRTD8AGRDFi4kRxD627A
+6KWJbJw3ErVKyTMb9lFYbsRNp2HEgEjenPYIWrWSyrpGFm7cz6GTuaiUChY/fj/5pdW8n3QCgJU7
+UyitrufdGcMcFl/RMvhy1ZxbUkXmhTJOnCsGICLEF4ALZTX4e7kR4ufB0awCxi7/lNpGE+XGejLz
+y9iwL52a+iaq6xrZtP84O45mYQXGrfiMnSnZuOu0uLloqalvZvmn37Lsk2RyL1ZRVFnLOzu+Z0ni
+QQByiio5lVfKe/vScNdpycgrZdaa3SgUENu3C1pN68R+WKA3bjoNF6vqsFohPNiHytpGVu48RsKu
+FADmrt9L4sGTAPh6uFJV10hUeBAd/Txs14J9HTtEK1oGXz4qKHrpLwvqwgK9mD/yXgB2PD/edv3B
+JYkkZ+STVVCG4tIPpz7cmy0LRtsyPyO/lPsrjKTlFBEZ4kvW+r/a2vIec1pXZH77xjT8PF0J+0sC
+W5MzWPlUnK2MA8smcW+3jnSbtYYzhgoqjA28M30Y+9PPkplfxpYFown2cad/eDBjBnUHYNexbEYt
+28qx7ELbZ51WRebaObjrNDbbeRerSc8pZnJMbxaPHezQOIteRa96Oh6dRs26vamk5xSzJekETz/a
+n38mnWDNlz9QWG6kwtgAQEPzL4vvtJeWzHi4am33iipqgdZsu7KjVlBWg0atpF94EArA30tPSWXd
+Vb13F01rKNxt9szX9TevtJpnNx8gLcdA+SW/Gk0t1DWZMNY309nf8ypxxUb09+CRA7sxY1g/nh1z
+HwBf/5TL2eJKZiTsor7JxKZ5Ixnc47ctUtddOsSz2dxy1XW9iwZziwVjQzNmi5Xaxma0GiUq5a0/
+/rObD7D9u9PMjO/PiqkP265rVCqUSmgymW/Zpj0RPYO/On4OD1ctCbtaN3FHhvhScqmd6+Tnyd2h
+AVivmI2wXjMzceWnroE+uGhUHMsuZGtyJm46DXfd4U+fLkEcOH6OJVuS8HLT0dBkZkBkMNebS7jW
+/uXMLiirIdDbnaIKIwCD7+x01YJ9rVpJeJAvZwwVrPkylS5B3nTy86R3WIDNRml1PfVNZoeenS2a
+wK7a1mps5qrdtmvdO/kx77GBuOm0BPu6k3TiPF2mJ3BloimuOefvyk96FzUv/+khliYeYuKbrbv8
+1s0ZzvIpQ0k9Y2DdnjQA3HQa3ngy9rp+XWu/f0Qwx88WM3DRZj5/YRzx/SM4crqA6KUfcG0FsHzq
+UP745nbmrt8LwPxRA1n5VBwDIoIB+McXKZwtrmTnixMcFme7HAhe8/Gsm061ZeSXkpJdiLGhGVet
+mvAgH6J7hdl+Z6ioZfcP2QR6uxEa4M0ZQznD+oXT2Gzmm4w8unfsQO+wAC6U1fD9zwX0Cg3kzk6t
++36OnTGQllOEm05DfFQEAV56SqrqOHQyF3OLheheoXTu4AnAkawCCstrGD4gEjcXDYdP5VFWU8+o
+gd3RqpXUNZnYfuQ0xvpmxg3pib+Xnt3HsimuquOhu0M5mVtC5w6e3NutIwBZBeUkZ+ajVCiI6R1G
+10BvoHUnx0+5F+nXNYghPW/c5Gz8KoMFm5Pbt8Ayv46QAoveyZKxL7LAEkcWWOLYReDq+maxn6td
+Y2wQYPPyJewicEq2MGdo/F45XSDccYd2EXj1l8415deeqKk3sSctTzB7dhH48KlCXtuW6rCgSIXG
+5hamJRygqq5JMJsqzV0jXraHs8mZBo6fKyXE1x0/D9fbXg3xe6Citol96flMX3WQoz8XC2rbbv/a
+TsY5kNNK4sgCSxxZYIkjCyxxZIEljiywxJEFljiywBLnf2jDj5yiEE9BAAAAJXRFWHRkYXRlOmNy
+ZWF0ZQAyMDE5LTA0LTI5VDE2OjIxOjM5KzAzOjAwt9uPfgAAACV0RVh0ZGF0ZTptb2RpZnkAMjAx
+OS0wNC0yOVQxNjoyMTozOSswMzowMMaGN8IAAAAASUVORK5CYII=" />
+</svg>
diff --git a/cartridges/int_adyen_overlay/cartridge/static/default/images/maestro-dark.svg b/cartridges/int_adyen_overlay/cartridge/static/default/images/maestro-dark.svg
new file mode 100644
index 000000000..d5cfeddf6
--- /dev/null
+++ b/cartridges/int_adyen_overlay/cartridge/static/default/images/maestro-dark.svg
@@ -0,0 +1,66 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="120px" height="78px" viewBox="0 0 120 78" enable-background="new 0 0 120 78" xml:space="preserve">  <image id="image0" width="120" height="78" x="0" y="0"
+    xlink:href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAABOCAYAAADrR9JiAAAABGdBTUEAALGPC/xhBQAAACBjSFJN
+AAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAABmJLR0QA/wD/AP+gvaeTAAAM
+yUlEQVR42u2df1BUV5bHP+9BN03LbxB1lIGEJKIGMyg72SEaHc1ExgQwUrDWVM2sO7uVnyZT2Z3M
+VqWSTWq33NL4x1pa2U3V1GZqZydjLaNVYhgNVjaUOoszIpFgiKLIiIwBpWlpoIF+/ePsHx1ayPgL
+fa8vRfW36v7R8O65575vn/vj3HtOa4AQw4yFrlqBGKxFjOAZjhjBMxwxgmc4YgTPcMQInuGIETzD
+Ea9agZthAfEUEE8BNgqIJw2dEBAEgggGcA4/rV8VF0HzGp+VAgsKYMHCcEnJBLsD7ImgaTDogmtX
+wNMHXV9ARzOMDqt+ZTeExjRxdGholGCnGidPk0gK2pTq9xDiGD5+hZfj+KauQNYCKF4HxaXwwPIw
+kXcKCUFXG5w+Bsd+A1cuqn2ZE6Cc4HnE8WOSqCKR+cSZIrODAP/NCP/DCP23s+yF34byLfDwSvM6
+deY4NPwamg5CKGTh27s9lBFsR+N5kvgHknFO0VrvFKMI2xniPYYJfr2bDxVD1c/gob+wrpOXvoAP
+/gXO/t66Nm4DJQQ/gYOtpHG/SRZ7O5zGz6sM8BlGeC6t+hl8b/PUhuF7wcmP4L/eDM/dUUZUCY5D
+Yzup/DWzot7RELA97wHefWUbvsy5UW+fa1fg3ZfgfHNUm40D3o5GQ050fkEGlTij2sFxdN5fRGfZ
+a8zWEjmfmkgwWtY7jsQkeGwjeD3Q+VnUmo0KwVnE8RuyWEFC1Do2EZ8VruG3618kGB9PmhEgf3CM
+9lQnAT3KbgBdh0e+C8ZY1CzZcoLT0TlENosVbbnPPvQoH33/eWQCmbMCQXK9Y5xJnUVQj7IlAzy8
+AkaH4MIpy5uy9CusofHvZERtMfV1dOcs5uD6F5EbDMdzRww2dPWhqdok/uBNeLTM8mYsJfjvSeYJ
+RcPySGIKHz61hWDczUeOvOExHrs6oEQ/AH78rzAn19ImLCN4FQ7+kWRLlb8VDn3/ebyzUm/73Heu
+esjxjqlR0pEEL+6GeJtlTVhCcCIa75Jukfvi9jiz6DE673vkjp7VBNZ1u9FF0VidVwilf2eZeEsI
+/huSmKPooCoQb+fIik1TqpNh+CnqH1KiLwBPvQBJaZaINp0FJzpbSLL6ldwUp771JEMpGVOuV3LF
+gy2kyIqdyVD2kiWiTSd4M7OYrch6RdNpLlp3V3UTgyGWXPMq0RuAtT8EZ4rpYk1lQkfjJYXWez5/
++V1Z7ziW9Q8q0x1bAnz7KdPFmkpwETayFV4SaVu84p7qZ435mTNqKNOfFZWmizSVjbU4ovYuvo6g
+Hs+l3IfvWU7+4IiyPvDgcsicb6pIUwl+QiHB3TkFGPZ7bz9/SNGeeBwPLjNVnGkEZxLHt7Buw347
+9M7NN0VO9qihbk8MkF9kqjjTCH6AeGWODQBXVo4pcuJEyPAF1HVkuhKscnEF4DJx7socU7jQmr3A
+VHEmEqzmxGgcow7ztmeJQYVD9Kw0U8WZRrAq58Y4jATzbookqLwJGRcfvv1hEkxjJU0xwX6beceS
+tqDaq66Y+GU1jRU3al+KzTBve2PEqVwuYmqUhGkEX1VMcIJhnoPC0BWuJwIG+Mzri2kE95kZG3QX
+cI6Yd9znjVc43Xg9poqbMRac2f8n02T1O9Q5bOj9o6niTCO4Hb9SG57t6jZFTkCHawkKCe5sMVWc
+aQQPEqIJdQ6CeV92mCKnJ9GhNhqvw9yrtKZONv+LOkf9/C/PkzB27wf2F1LUHZggYvqFeJMJvou4
+XLM6IkHuv9h6z3IuJKsJrQHgi/8LB5WbCFMJPo1Bt8KZeEnb0Xuq3+NMULvA+t0+00Wavh/Yibrb
+ifddbCXD3XvX9T/NVHePm9GhcJipyTCd4D2M8CeFVrz800N3VW/IFsfZNIXD86Gfh4PSTIbpBPsR
+/k2hFS9tbSDd3TPlesfmpkc/pHQcHhd89J+WiLbEZbOHES4qsmJdgnz3yAdTqtObaOfz9OgHpUew
+f6ep7slJ78MKoX6EZ3Hjt/Kl3AL5nadYdKbxjp4NaBqHcjIVaQq0/S6csMUiWBYf3EsQN8L3FF3E
+y+v6nLMF38HnuLVlfvKNdC6kKJp7B12w40cw5g3fic4rDEc59F82rQlLveq/YJh9jFr+nm4EuzFK
+xYGd2G+xcDmT5uTTLPOjCe4IoSC89+r1fe+FU2HCXeaRC1FIwuJE5wBZPKLoxmXXNx9m38bX/ixO
++I/JiezLm01IxcJKQvAfP4E/1FnelOXnYiOE2ICLTxR5uXIvfU553W7iA9f95F1JDvbnqiJX4Oc/
+jQq5EKUkLAbCfkb5BnEUKrDkDPeXfLP7CzoeKKYlO50DubPV5OYY88J70bHccUTtZDuA8BOusYMh
+Jac1mT0dXD7wz3wi/Wos9/I5eKvcEm/VraAk090j2NlGKsXYo9JeAz5eY4AuAuFURuv+Fip/CrYo
+tB8Kwse/hL07wBf9BaeyXJUaGn+Fk38ixbIrty5CvImHvdzAiTD3PnjmVXj0KdAsGsg+a4A9W6Hn
+gjXy7wDKs80mo7MJJ9U4TYttasTgl3ipYxTf7bo3Jw/KXoS/rDDHov0+OPHbsPMiymkLbwTlBE/E
+g9i+yhftIH8KsU4GcAY/x/DxASN03I0PLcEZzkJXXApLV0HiFE6WvAPQ3gSfH4XfHwCvwkDyr2Fa
+ETwRDjQewsZC4lmEjVR0QshXGd/D7tB2ApzG4CwBAmZ2Q9PCCcIXLISchZA8IeO7rocPBwauwMDV
+cMrgy+fD259piGlLcAzmIPajHDMcMYJnOGIE3wClpaWUlJSoVsM0SKxMLqdPn5aamhrlephRopbx
+/WaYP38+Tz75JC6Xi40bN1JSUoLL5WJgYICioiKqq6spKCjg3LlzBALXUyvMmzePZ555hpKSEvr6
++li6dCk5OTl0d1+PcFi9ejVlZWVkZmbS2dmJTFjprly5ksrKSoqLi3E4HHR1dZGWlsa6devYsGED
+IkJ/fz8FBQV0dnaiaRrr16/HMAxKSkooLS2lvb0dn89HRkYG5eXlrFmzBpvNNkmH6QCl37CqqioR
+ETl//ry4XC4JhUIyMDAg77zzjhiGIW63W0REWlpaJCEhQQCpqKgQj8cj4/B4PNLT0yMff/yxAOJ0
+OqW+vl4Mw5Bz586J3++XhoYGsdvtAsi2bdtERKS7u1t6enpEROS5556T4uJiuREyMjIkKSlJREQ6
+OjrE7/eL2+0Wu90ua9eulb6+PhERGR4eFhGRurq6iK7ToEwPgrdv3y6ALFy4UHw+n/h8PikuLhZd
+1+X1118XEZHKykrJzs6WgYEB6evrk6qqKiksLJTdu3eLiEQI3rFjh3i9XiksLBRAli1bJj6fT155
+5RUB5OrVq3Lw4MGIDkVFReJwOETTNLHZbNLW1iY1NTWiaZpomiZAhOCmpiaZM2eO2O12SUpKkt7e
+Xjl58qTk5OSIpmlSWVkpfr9ftm7dqprY6UXwOBmAHD16VE6dOhX5nJOTIyIiW7ZsiTz/7LPPTpLT
+0tISIbi9vV0uX74sO3fujJS+vj7Zu3evAFJbWyuBQEBOnDgh77//vlRVVUWI5CZz8DjBb7zxRuRv
+a9asERGR0tLSSc/u3btXWltbVRMrgEybVfTE+dXj8eD3X3c3Dg6GXX+apqF/9dsLvb2TL7j39fVF
+5tj4+Hh0XZ9U9uzZw5EjRwCorq7mhRdeoL29nZKSEmpqanjrrbfuSM9xXQBstrDv3OudHBM1MjKC
+3R6dk7I7wbSw4EWLFkX+9uGHH8qJEycin1NTU0VE5OWXX5a5c+fK0NCQNDY2Snp6ugCyfv16CQQC
+cvjwYQFk165dMjo6KsuXLw9/i3V9kpWtXLlSEhMTI/+7dOmSHDp0KPL/48ePS1NTk+i6LtnZ2ZMs
+eHyYByQ9PV08Ho/U1tZG5twlS5bI4OCg7Nq1S7n1Mp2G6IkE19XV3ZRgQKqrq8Xr9cro6Kh0d3fL
+8PCwXLlyRerr6yNkNDY2it/vl9bWVunv75exsTFZunSppKWlidvtFo/HI83NzdLT0yN+v1/Ky8sj
+7b399tsiItLf3y+hUEiWLVsmycnJf0bwuC4jIyORudgwDDl58qSkpKRIVlaWVFRUTBr+o12U+6Jz
+c3NZtWoVtbW1eDzh9AWPP/44DoeDw4cPA+GhsLq6mubmZs6ePRupV1paitPppK6ujry8PAKBAA0N
+DQDous7TTz9NYWEhLpeL+vp6Ll68CEBmZiYVFRXk5ubidrupq6vjwoXrZ7aaprFp0yYWL15MZ2cn
+NTU1GIbB5s2baWxspK2tbVIf8vPzKSsrIzs7m5aWFvbt20cwGCQjI4PVq1ezf/9+QopSMyknOAZr
+MW0WWTFYgxjBMxwxgmc4YgTPcMQInuH4f1qfWfja11LLAAAAJXRFWHRkYXRlOmNyZWF0ZQAyMDE5
+LTA0LTI5VDE2OjIyOjAwKzAzOjAwR/t2TQAAACV0RVh0ZGF0ZTptb2RpZnkAMjAxOS0wNC0yOVQx
+NjoyMjowMCswMzowMDamzvEAAAAASUVORK5CYII=" />
+</svg>
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/account/payment/adyenpaymentinstrumentdetails.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/account/payment/adyenpaymentinstrumentdetails.isml
index 3ebf48c67..feb545f7c 100644
--- a/cartridges/int_adyen_overlay/cartridge/templates/default/account/payment/adyenpaymentinstrumentdetails.isml
+++ b/cartridges/int_adyen_overlay/cartridge/templates/default/account/payment/adyenpaymentinstrumentdetails.isml
@@ -1,8 +1,3 @@
-<script src="${pdict.AdyenHelper.getCSEJsUrl()}" type="text/javascript"></script>
-<isinputfield formfield="${pdict.CurrentForms.paymentinstruments.creditcards.newcreditcard.encrypteddata}" type="hidden"/>
-<input type="hidden" value="${pdict.AdyenHelper.getAdyenCseDateField()}" data-encrypted-name="generationtime" id="adyen_generationtime"/>
-<div  class="form-data-error  error"></div>
-<isinputfield formfield="${pdict.CurrentForms.paymentinstruments.creditcards.newcreditcard.type}" type="select"/>
 <isinclude template="checkout/billing/adyenpaymentfields"/>
 <button id="add-card-submit-hidden" type="hidden" style="display:none" name="${pdict.CurrentForms.paymentinstruments.creditcards.create.htmlName}" value="${Resource.msg('global.apply','locale',null)}">${Resource.msg('global.apply',   'locale', null)}</button>
 <button  id="add-card-submit"  type="submit" name="${pdict.CurrentForms.paymentinstruments.creditcards.create.htmlName}" value="${Resource.msg('global.apply','locale',null)}">${Resource.msg('global.apply',   'locale', null)}</button>
\ No newline at end of file
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/adyenOrderDetails.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/adyenOrderDetails.isml
new file mode 100755
index 000000000..b73136d12
--- /dev/null
+++ b/cartridges/int_adyen_overlay/cartridge/templates/default/adyenOrderDetails.isml
@@ -0,0 +1,50 @@
+<isscript>
+	var additionalPaymentData = JSON.parse(paymentInstr.custom.adyenAdditionalPaymentData);
+</isscript>
+<isif condition="${additionalPaymentData}">
+	<br/>
+	<isloop items="${additionalPaymentData}" var="additionalItem">
+		<!--- Payment details for Banktransfer --->
+		<isif condition="${additionalItem.key == 'bankTransfer.description'}">
+			<span class="summary-section-label">${Resource.msg('bankTransfer.description', 'checkout', null)}:</span><br/>
+			<br/>
+			<span class="summary-section-label">${Resource.msg('bankTransfer.amount', 'checkout', null)}:</span>
+			<span class="summary-details">${paymentInstr.paymentTransaction.amount}</span><br/>
+		</isif>
+		<isif condition="${additionalItem.key == 'bankTransfer.reference'}">
+			<span class="summary-section-label">${Resource.msg('bankTransfer.reference', 'checkout', null)}:</span>
+			<span class="summary-details">${additionalItem.value}</span><br/>
+		</isif>
+		<isif condition="${additionalItem.key == 'bankTransfer.owner'}">
+			<span class="summary-section-label">${Resource.msg('bankTransfer.owner', 'checkout', null)}:</span>
+			<span class="summary-details">${additionalItem.value}</span><br/>
+		</isif>
+		<isif condition="${additionalItem.key == 'bankTransfer.iban'}">
+			<span class="summary-section-label">${Resource.msg('bankTransfer.iban', 'checkout', null)}:</span>
+			<span class="summary-details">${additionalItem.value}</span><br/>
+		</isif>
+
+		<!--- Payment details for Multibanco --->
+		<isif condition="${additionalItem.key == 'comprafacil.description'}">
+			<span class="summary-section-label">${Resource.msg('comprafacil.description', 'checkout', null)}:</span><br/>
+			<br/>
+		</isif>
+		<isif condition="${additionalItem.key == 'comprafacil.deadline'}">
+			<span class="summary-section-label">${Resource.msg('comprafacil.deadline', 'checkout', null)}:</span>
+			<span class="summary-details">${additionalItem.value}</span><br/>
+		</isif>
+		<isif condition="${additionalItem.key == 'comprafacil.reference'}">
+			<span class="summary-section-label">${Resource.msg('comprafacil.reference', 'checkout', null)}:</span>
+			<span class="summary-details">${additionalItem.value}</span><br/>
+		</isif>
+		<isif condition="${additionalItem.key == 'comprafacil.entity'}">
+			<span class="summary-section-label">${Resource.msg('comprafacil.entity', 'checkout', null)}:</span>
+			<span class="summary-details">${additionalItem.value}</span><br/>
+		</isif>
+		<isif condition="${additionalItem.key == 'comprafacil.amount'}">
+			<span class="summary-section-label">${Resource.msg('comprafacil.amount', 'checkout', null)}:</span>
+			<span class="summary-details">${paymentInstr.paymentTransaction.amount}</span><br/>
+		</isif>
+	</isloop>
+	<br/>
+</isif>
\ No newline at end of file
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentfields.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentfields.isml
index 20655fcb5..372fd6214 100644
--- a/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentfields.isml
+++ b/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentfields.isml
@@ -1,94 +1,120 @@
 <!--- TEMPLATENAME: adyenpaymentfields.isml --->
 
-<div class="form-row ">
-	<label for="dwfrm_billing_paymentMethods_creditCard_selectedCardID"><span></span></label>
-	<div class="field-wrapper">
-		<input class=" " type="hidden"
-			id="dwfrm_billing_paymentMethods_creditCard_selectedCardID"
-			name="dwfrm_billing_paymentMethods_creditCard_selectedCardID"
-			value="">
-	</div>
-	<div class="form-caption"></div>
-</div>
-<div class="form-row  required" aria-required="true">
-	<label for="dwfrm_billing_paymentMethods_creditCard_owner"><span
-		class="required-indicator">• </span><span>${Resource.msg('creditcard.ownerlabel', 'forms', null)}</span></label>
-	<div class="field-wrapper">
-		<input class="input-text  required" type="text" id="creditCard_owner"
-			value="" aria-required="true" aria-invalid="true"
-			aria-describedby="dwfrm_billing_paymentMethods_creditCard_owner-error">
-	</div>
-	<div class="form-caption"></div>
-</div>
-<div class="form-row  required" aria-required="true">
-	<label for="creditCard_number"><span class="required-indicator">•
-	</span><span>Number</span></label>
-	<div class="field-wrapper">
-		<input class="input-text  required" type="text" id="creditCard_number"
-			value="" aria-required="true">
-	</div>
-	<div class="form-caption">Example: 4111111111111111</div>
-</div>
+<isset name="AdyenGetOriginKey" value="${require('int_adyen_overlay/cartridge/scripts/adyenGetOriginKey')}" scope="PAGE"/>
+<isset name="AdyenHelper" value="${require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper')}" scope="PAGE"/>
+<link rel="stylesheet" type="text/css" href="https://checkoutshopper-test.adyen.com/checkoutshopper/sdk/2.1.0/adyen.css"/>
+<link rel="stylesheet" href="${URLUtils.staticURL('/css/adyenCSS.css')}" /> 
 
-<div class="form-row required" aria-required="true">
-	<label> <span class="required-indicator">•</span> <span>Expiration
-			Date:</span>
-	</label>
-	<div class="form-row month required" aria-required="true">
-		<label for="creditCard_expiration_month"><span
-			class="required-indicator">• </span><span>${Resource.msg('resource.month', 'forms', null)}</span></label>
-		<div class="field-wrapper">
-			<select class="input-select  required"
-				id="creditCard_expiration_month" minlength="0"
-				maxlength="2147483647" aria-required="true">
-				<option class="select-option" value="1">${Resource.msg('month.january', 'forms', null)}</option>
-				<option class="select-option" value="2">${Resource.msg('month.february', 'forms', null)}</option>
-				<option class="select-option" value="3">${Resource.msg('month.march', 'forms', null)}</option>
-				<option class="select-option" value="4">${Resource.msg('month.april', 'forms', null)}</option>
-				<option class="select-option" value="5">${Resource.msg('month.may', 'forms', null)}</option>
-				<option class="select-option" value="6">${Resource.msg('month.june', 'forms', null)}</option>
-				<option class="select-option" value="7">${Resource.msg('month.july', 'forms', null)}</option>
-				<option class="select-option" value="8">${Resource.msg('month.august', 'forms', null)}</option>
-				<option class="select-option" value="9">${Resource.msg('month.september', 'forms', null)}</option>
-				<option class="select-option" value="10">${Resource.msg('month.october', 'forms', null)}</option>
-				<option class="select-option" value="11">${Resource.msg('month.november', 'forms', null)}</option>
-				<option class="select-option" value="12">${Resource.msg('month.december', 'forms', null)}</option></select>
-		</div>
-		<div class="form-caption"></div>
-	</div>
 
-	<div class="form-row year required" aria-required="true">
-		<label for="creditCard_expiration_year"><span
-			class="required-indicator">• </span><span>${Resource.msg('resource.year', 'forms', null)}</span></label>
-		<div class="field-wrapper">
-			<select class="input-select  required"
-				id="creditCard_expiration_year" minlength="0" maxlength="2147483647"
-				aria-required="true">
-				
-				<isscript>
-					var date = new Date();
-					var currentYear = date.getFullYear();
-					var years = [];
-					
-					for (i = 0; i < 6; i++) {
-						years.push(Number(currentYear + i).toFixed(0));
-					}
-				 </isscript>
-				<isloop iterator="${years}" alias="year">
-					<option class="select-option" value="${year}">${year}</option>
-				</isloop> 				
-			</select>
-		</div>
-		<div class="form-caption"></div>
-	</div>
-</div>
+<isset name="AdyenHelper" value="${require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper')}" scope="pdict"/>
+<isset name="AdyenCseEnabled" value="${pdict.AdyenHelper.getAdyenCseEnabled()}" scope="page" />
+<iscomment>display select box with stored credit cards if customer is authenticated</iscomment>
+<isif condition="${pdict.CurrentCustomer.authenticated && !empty(pdict.ApplicableCreditCards)}">
+
+    <div class="form-row">
+        <label class="label">${Resource.msg('billing.selectcreditcard','checkout',null)}</label>
+        <div class="field-wrapper">
+
+            <isif condition="${AdyenCseEnabled}">
+                <select id="adyenCreditCardList" class="input-select">
+                    <iselse/>
+                    <select name="${pdict.CurrentForms.billing.paymentMethods.creditCardList.htmlName}" id="creditCardList" class="input-select">
+            </isif>
+            <option value="" selected="selected">${Resource.msg('billing.creditcardlistselect','checkout',null)}</option>
+            <isloop items="${pdict.ApplicableCreditCards}" var="creditCardInstr">
+                <option id="${creditCardInstr.UUID}" value="${creditCardInstr.custom.adyenCreditCardType}">(<isprint value="${creditCardInstr.creditCardType}"/>) <isprint value="${creditCardInstr.maskedCreditCardNumber}"/> - ${Resource.msg('billing.creditcardlistexp','checkout',null)} <isprint value="${creditCardInstr.creditCardExpirationMonth}" formatter="00" />.<isprint value="${creditCardInstr.creditCardExpirationYear}" formatter="0000" /></option>
+            </isloop>
+            </select>
+        </div>
+    </div>
+
+    <div id="selectedCard" class="creditCard security-code-input" style="display:none">
+        <div id="oneClickCard"></div>
+    </div>
 
-<div class="form-row cvn required" aria-required="true">
-	<label for="creditCard_cvn"><span class="required-indicator">•
-	</span><span>${Resource.msg('creditcard.cvnlabel', 'forms', null)}</span></label>
-	<div class="field-wrapper">
-		<input class="input-text  required" type="text" id="creditCard_cvn"
-			value="" aria-required="true">
-	</div>
-	<div class="form-caption"></div>
+    <iscomment>
+        <isloop items="${pdict.ApplicableCreditCards}" var="creditCardInstr">
+            <a href="${URLUtils.https('COBilling-UpdateCreditCardSelection', 'creditCardUUID', creditCardInstr.UUID)}">
+                (<isprint value="${creditCardInstr.creditCardType}"/>)
+                <isprint value="${creditCardInstr.maskedCreditCardNumber}"/>
+                - ${Resource.msg('billing.creditcardlistexp','checkout',null)}
+                <isprint value="${creditCardInstr.creditCardExpirationMonth}" formatter="00" />
+                .<isprint value="${creditCardInstr.creditCardExpirationYear}" formatter="0000" />
+            </a>
+        </isloop>
+    </iscomment>
+</isif>
+
+<div id="newCard">
+    <div id="card" class="creditCard"></div>
+    <isif condition="${pdict.CurrentCustomer.authenticated}">
+        <isinputfield formfield="${pdict.CurrentForms.billing.paymentMethods.creditCard.saveCard}" type="checkbox"/>
+    </isif>
+    
+    <input type="hidden" id="${pdict.CurrentForms.billing.paymentMethods.creditCard.owner.htmlName}" name="${pdict.CurrentForms.billing.paymentMethods.creditCard.owner.htmlName}">
+    <input type="hidden" id="${pdict.CurrentForms.billing.paymentMethods.creditCard.type.htmlName}" name="${pdict.CurrentForms.billing.paymentMethods.creditCard.type.htmlName}">
+    <input type="hidden" id="${pdict.CurrentForms.billing.paymentMethods.creditCard.adyenEncryptedCardNumber.htmlName}" name="${pdict.CurrentForms.billing.paymentMethods.creditCard.adyenEncryptedCardNumber.htmlName}">
+    <input type="hidden" id="${pdict.CurrentForms.billing.paymentMethods.creditCard.adyenEncryptedExpiryMonth.htmlName}" name="${pdict.CurrentForms.billing.paymentMethods.creditCard.adyenEncryptedExpiryMonth.htmlName}">
+    <input type="hidden" id="${pdict.CurrentForms.billing.paymentMethods.creditCard.adyenEncryptedExpiryYear.htmlName}" name="${pdict.CurrentForms.billing.paymentMethods.creditCard.adyenEncryptedExpiryYear.htmlName}">
+    <input type="hidden" id="${pdict.CurrentForms.billing.paymentMethods.creditCard.adyenEncryptedSecurityCode.htmlName}" name="${pdict.CurrentForms.billing.paymentMethods.creditCard.adyenEncryptedSecurityCode.htmlName}">
+    <isinputfield formfield="${pdict.CurrentForms.billing.paymentMethods.creditCard.selectedCardID}" type="hidden"/>
 </div>
+
+
+<script type="text/javascript">
+
+	var originKey = "${AdyenGetOriginKey.getOriginKeyFromRequest(request.getHttpProtocol(), request.getHttpHost())}";
+	var loadingContext = "${AdyenHelper.getLoadingContext()}";
+	var locale = "${request.locale}";
+	
+	// Init Adyen checkout component js file
+	var scriptTag = document.createElement('script');
+	
+    scriptTag.src = "${AdyenHelper.getCheckoutUrl()}";
+    scriptTag.type = "text/javascript";
+    document.body.appendChild(scriptTag);
+	
+	// Wait for it to load
+	// Working for older browsers
+    if (scriptTag.readyState) {
+        scriptTag.onreadystatechange = function () {
+            if (script.readyState == "loaded" ||
+                script.readyState == "complete") {
+                script.onreadystatechange = null;
+                // Init Component
+                initializeCardComponent(originKey, loadingContext, locale);
+            }
+        };
+    }
+    // Working for new browsers
+    else {
+        scriptTag.onload = function () {
+            // Init Component
+            initializeCardComponent(originKey, loadingContext, locale);
+        };
+    }
+
+	function initializeCardComponent(originKey, loadingContext, locale) {
+		window.Configuration = {
+		        locale: locale,
+		        originKey: originKey,
+	        	loadingContext: loadingContext
+		};
+
+		var AdyenCheckoutObject = new AdyenCheckout(window.Configuration);
+		
+		window.CardValid = false;
+		window.AdyenCard = AdyenCheckoutObject.create('card', {
+	       	type: 'card',
+	        hasHolderName: true,
+            holderNameRequired: true,
+            groupTypes: ["bcmc", "maestro", "visa", "mc", "amex", "diners", "discover"],
+	        onChange: function(state) {
+	        	// checks whether card was valid then was changed to be invalid
+	        	window.CardValid = state.isValid;
+	        }
+	    });
+	    
+	    window.AdyenCard.mount(document.getElementById('card'));
+    };
+</script>
\ No newline at end of file
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentmethods.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentmethods.isml
index d98ad94fe..bdc1ca80a 100644
--- a/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentmethods.isml
+++ b/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentmethods.isml
@@ -1,7 +1,3 @@
-<script src="${pdict.AdyenHelper.getCSEJsUrl()}" type="text/javascript"></script>
-<isinputfield formfield="${pdict.CurrentForms.billing.paymentMethods.creditCard.encrypteddata}" type="hidden"/>
-<input type="hidden" value="${pdict.AdyenHelper.getAdyenCseDateField()}" data-encrypted-name="generationtime" id="adyen_generationtime"/>
 <input type="hidden" id="noPaymentNeeded" name="noPaymentNeeded" value="true"/>
-<div class="form-data-error error"></div> 
-<isinputfield formfield="${pdict.CurrentForms.billing.paymentMethods.creditCard.type}" type="select"/>
+<div class="form-data-error error"></div>
 <isinclude template="checkout/billing/adyenpaymentfields"/>
\ No newline at end of file
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/checkoutComponent.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/checkoutComponent.isml
new file mode 100644
index 000000000..ebddf0c6b
--- /dev/null
+++ b/cartridges/int_adyen_overlay/cartridge/templates/default/checkoutComponent.isml
@@ -0,0 +1,72 @@
+<iscontent type="text/html" charset="UTF-8" compact="true"/>
+
+<isset name="openInvoiceMethodDetails" value="${AdyenHelper.filterOutOpenInvoiceComponentDetails(methodDetails)}" scope="page">
+<div id="component_${method.type}" class="checkoutComponent"></div>
+<script type="text/javascript">
+
+switch("${method.type}"){
+	case "ideal": 
+		var paymentMethodDetails = JSON.parse("${methodDetails}".replace(/&quot;/g, '\"'));
+		var component = document.getElementById("component_ideal");
+		var idealContainer = document.createElement("div");
+       	var idealComponent = AdyenCheckoutObject.create('ideal', {
+               details: paymentMethodDetails.details
+           });
+           component.append(idealContainer);
+           idealComponent.mount(idealContainer);
+        break;
+     case "klarna":
+     	var paymentMethodDetails = JSON.parse("${openInvoiceMethodDetails}".replace(/&quot;/g, '\"'));
+     	var component = document.getElementById("component_klarna");
+		var klarnaContainer = document.createElement("div");
+       	var klarnaComponent = AdyenCheckoutObject.create('klarna', {
+               details: paymentMethodDetails,
+               visibility: {
+               		personalDetails: "editable"
+               },
+           });
+           component.append(klarnaContainer);
+           klarnaComponent.mount(klarnaContainer);
+
+         var billingCountry = document.getElementsByClassName("input-select country")[0].value;
+         if(isNordicCountry(billingCountry.toUpperCase())){
+             var ssnContainer = document.createElement("div");
+             ssnContainer.setAttribute("id", "ssn_klarna");
+             var socialSecurityNumberLabel = document.createElement("span");
+             socialSecurityNumberLabel.textContent = "Social Security Number";
+             var socialSecurityNumber = document.createElement("input");
+             socialSecurityNumber.setAttribute("id", "ssnValue");
+             socialSecurityNumber.setAttribute("class", "adyen-checkout__input");
+             socialSecurityNumber.setAttribute("type", "text");
+             
+             ssnContainer.append(socialSecurityNumberLabel);
+             ssnContainer.append(socialSecurityNumber);
+             klarnaContainer.append(ssnContainer);
+         }
+         
+        break;
+     case "afterpay_default":
+     	var paymentMethodDetails = JSON.parse("${openInvoiceMethodDetails}".replace(/&quot;/g, '\"'));
+     	var component = document.getElementById("component_${method.type}");
+		var afterpayContainer = document.createElement("div");
+       	var afterpayComponent = AdyenCheckoutObject.create('afterpay', {
+               details: paymentMethodDetails,
+               visibility: {
+               		personalDetails: "editable"
+               },
+           });
+           component.append(afterpayContainer);
+           afterpayComponent.mount(afterpayContainer);
+        break;
+     default:
+		//no component
+};
+
+function isNordicCountry(country){
+    if(country === "SE"|| country === "FI" || country === "DK" || country === "NO") {
+        return true;
+    }
+    return false;
+};
+
+</script>
\ No newline at end of file
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/components/order/orderdetails.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/components/order/orderdetails.isml
new file mode 100755
index 000000000..3d7ac7422
--- /dev/null
+++ b/cartridges/int_adyen_overlay/cartridge/templates/default/components/order/orderdetails.isml
@@ -0,0 +1,226 @@
+<iscontent type="text/html" charset="UTF-8" compact="true"/>
+
+<iscomment>
+	Displays order details, such as order number, creation date, payment information,
+	order totals and information for each contained shipment.
+	This template module can be used in order confirmation pages as well as in the
+	order history to render the details of a given order. Depending on the context
+	being used in, one might omit rendering certain information.
+
+	Parameters:
+
+	order		: the order whose details to render
+	orderstatus	: if set to true, the order status will be rendered
+				  if set to false or not existing, the order status will not be rendered
+</iscomment>
+
+<isset name="Order" value="${pdict.order}" scope="page"/>
+
+
+
+<div class="orderdetails">
+	<div class="order-information">
+		<h1 class="order-number">
+			<span class="label"><i class="fa fa-cube"></i>${Resource.msg('order.orderdetails.ordernumber','order',null)}</span>
+			<span class="value"><isprint value="${Order.orderNo}"/></span>
+		</h1>
+		<iscomment>Order Status</iscomment>
+		<isif condition="${!empty(pdict.orderstatus) && pdict.orderstatus == 'true'}">
+			<isinclude template="account/orderhistory/orderstatusinclude"/>
+		</isif>
+		<div class="order-date">
+			<span class="label">${Resource.msg('order.orderdetails.orderplaced','order',null)}</span>
+			<span class="value"><isprint value="${Order.creationDate}" style="DATE_LONG"/></span>
+		</div>
+	</div>
+	<div class="order-payment-summary">
+		<div class="label">${Resource.msg('order.orderdetails.paymenttotal','order',null)}</div>
+		<div class="order-detail-summary">
+			<isif condition="${Order.shipments.length > 1}">
+				<isordertotals p_lineitemctnr="${Order}" p_showshipmentinfo="${true}" p_shipmenteditable="${false}" p_totallabel="${Resource.msg('global.ordertotal','locale',null)}"/>
+			<iselse/>
+				<isordertotals p_lineitemctnr="${Order}" p_showshipmentinfo="${false}" p_shipmenteditable="${false}" p_totallabel="${Resource.msg('global.ordertotal','locale',null)}"/>
+			</isif>
+		</div>
+	</div>
+	<div class="order-payment-instruments">
+		<div class="label">
+			<isif condition="${Order.paymentInstruments.length == 1}">
+				${Resource.msg('order.orderdetails.paymentmethod','order',null)}
+			<iselse/>
+				${Resource.msg('order.orderdetails.paymentmethods','order',null)}
+			</isif>
+		</div>
+		<isloop items="${Order.getPaymentInstruments()}" var="paymentInstr">
+			<isif condition="${dw.order.PaymentInstrument.METHOD_GIFT_CERTIFICATE.equals(paymentInstr.paymentMethod)}">
+				<div class="orderpaymentinstrumentsgc">
+					<span class="label"><isprint value="${dw.order.PaymentMgr.getPaymentMethod(paymentInstr.paymentMethod).name}" /></span>
+					<span class="value"><isprint value="${paymentInstr.maskedGiftCertificateCode}"/></span>
+					<span class="payment-amount">
+						<span class="label">${Resource.msg('global.amount','locale',null)}:</span>
+						<span class="value"><isprint value="${paymentInstr.paymentTransaction.amount}"/></span>
+					</span>
+				</div>
+			<iselse/>
+				<div class="payment-type"><isprint value="${dw.order.PaymentMgr.getPaymentMethod(paymentInstr.paymentMethod).name}" /></div>
+				<isminicreditcard card="${paymentInstr}" show_expiration="${false}"/>
+				<div class="payment-amount">
+					<span class="label">${Resource.msg('global.amount','locale',null)}:</span>
+					<span class="value"><isprint value="${paymentInstr.paymentTransaction.amount}"/></span>
+					<br/>
+					<isinclude template="adyenOrderDetails" />
+				</div><!-- END: payment-amount -->
+			</isif>
+		</isloop>
+	</div>
+	<div class="order-billing">
+		<div class="label">${Resource.msg('order.orderdetails.billingaddress','order',null)}</div>
+		<isminiaddress p_address="${Order.billingAddress}"/>
+	</div>
+
+	<iscomment>render a box for each shipment</iscomment>
+	<div class="order-shipments">
+		<isloop items="${Order.shipments}" var="shipment" status="shipmentloopstate">
+			<h2>${Resource.msgf('multishippingshipments.shipment','checkout',null, shipmentloopstate.count)}</h2>
+
+			<isif condition="${shipment.productLineItems.size() > 0}">
+				<iscomment>Shipment Items</iscomment>
+				<div class="order-shipment-table">
+					<div class="order-shipment-details">
+						<div class="order-shipment-address">
+							<isif condition="${!empty(shipment.custom.shipmentType) && shipment.custom.shipmentType == 'instore'}">
+								<div class="label">${Resource.msg('cart.store.instorepickup','checkout',null)}</div>
+							<iselse/>
+								<div class="label">${Resource.msg('order.orderdetails.shippingto','order',null)}</div>
+							</isif>
+							<isminishippingaddress p_shipment="${shipment}" p_editable="${false}" p_showmethod="${false}" p_showpromos="${false}"/>
+						</div>
+						<isif condition="${shipment.custom.shipmentType != 'instore'}">
+							<div class="shipping-status">
+								<div class="label">${Resource.msg('order.orderdetails.shippingstatus','order',null)}</div>
+								<isif condition="${shipment.shippingStatus==dw.order.Shipment.SHIPPING_STATUS_NOTSHIPPED}">
+									<div class="value">${Resource.msg('order.orderdetails.notshipped','order',null)}</div>
+								<iselseif condition="${shipment.shippingStatus==dw.order.Shipment.SHIPPING_STATUS_SHIPPED}">
+									<div class="value">${Resource.msg('order.orderdetails.shipped','order',null)}</div>
+								<iselse/>
+									<div class="value">${Resource.msg('order.orderdetails.notknown','order',null)}</div>
+								</isif>
+							</div>
+						</isif>
+						<isif condition="${!empty(shipment.trackingNumber)}">
+							<div class="trackingnumber">
+								<div class="label">${Resource.msg('order.orderdetails.tracking','order',null)}</div>
+								<div class="value"><!-- Tracking Number --><isprint value="${shipment.trackingNumber}"/></div>
+							</div>
+						</isif>
+						<div class="shipping-method">
+							<div class="label">${Resource.msg('order.orderdetails.shippingmethod','order',null)}</div>
+							<isif condition="${!empty(shipment.shippingMethod)}">
+								<div class="value"><isprint value="${shipment.shippingMethod.displayName}"/></div>
+							<iselse/>
+								<div class="value"><isprint value="${shipment.shippingMethodID}"/></div>
+							</isif>
+						</div>
+						<iscomment>Shipment Gift Message</iscomment>
+						<isif condition="${shipment.gift}">
+							<isif condition="${!empty(shipment.giftMessage)}">
+								<div class="order-shipment-gift-message">
+									<div class="label">${Resource.msg('order.orderdetails.giftmessage','order',null)}</div>
+									<div class="value"><isprint value="${shipment.giftMessage}"/></div>
+								</div>
+							</isif>
+						</isif>
+					</div>
+					<div class="line-items">
+						<isloop items="${shipment.productLineItems}" var="productLineItem" status="pliloopstate">
+							<div class="line-item">
+								<div class="line-item-details">
+									<isif condition="${pliloopstate.first}">
+										<div class="label">${Resource.msg('global.item','locale',null)}</div>
+									</isif>
+									<iscomment>Display product line and product using module</iscomment>
+									<isdisplayliproduct p_productli="${productLineItem}" p_editable="${false}"/>
+								</div>
+								<div class="line-item-quantity">
+									<isif condition="${pliloopstate.first}">
+										<div class="label">${Resource.msg('global.qty','locale',null)}</div>
+									</isif>
+									<isprint value="${productLineItem.quantity}"/>
+								</div>
+								<div class="line-item-price">
+									<isif condition="${pliloopstate.first}">
+										<div class="label">${Resource.msg('global.price','locale',null)}</div>
+									</isif>
+									<iscomment>Render quantity. If it is a bonus product render word 'Bonus'</iscomment>
+									<isif condition="${productLineItem.bonusProductLineItem}">
+										<div class="bonus-item">
+											<isset name="bonusProductPrice" value="${productLineItem.getAdjustedPrice()}" scope="page"/>
+											<isinclude template="checkout/components/displaybonusproductprice" />
+											<isprint value="${bonusProductPriceValue}" />
+										</div>
+									<iselse/>
+										<isprint value="${productLineItem.adjustedPrice}"/>
+										<isif condition="${productLineItem.optionProductLineItems.size() > 0}">
+											<isloop items="${productLineItem.optionProductLineItems}" var="optionLI">
+												<div class="product-option-price">+ <isprint value="${optionLI.adjustedPrice}"/></div>
+											</isloop>
+										</isif>
+									</isif>
+								</div>
+							</div>
+						</isloop>
+					</div>
+				</div>
+			</isif>
+
+			<isif condition="${shipment.giftCertificateLineItems.size() > 0}">
+				<div class="order-shipment-table">
+					<div class="order-shipment-details">
+						<iscomment>Shipment Gift Certificate</iscomment>
+						<isloop items="${shipment.giftCertificateLineItems}" var="giftCertificateLineItem" status="gcliloopstate">
+							<div class="order-gift-cert-attributes order-shipment-address">
+								<div class="order-gift-cert-to">
+									<div class="label">${Resource.msg('order.orderdetails.giftcertto','order',null)}</div>
+									<div class="value"><isprint value="${giftCertificateLineItem.recipientName}"/></div>
+									<div class="value"><isprint value="${giftCertificateLineItem.recipientEmail}"/></div>
+								</div>
+								<div class="order-gift-cert-from">
+									<div class="label">${Resource.msg('order.orderdetails.giftcertfrom','order',null)}</div>
+									<div class="value"><isprint value="${giftCertificateLineItem.senderName}"/></div>
+									<div class="value"><isprint value="${Order.customerEmail}"/></div>
+								</div>
+							</div>
+							<div class="order-gift-cert-amount">
+								<div class="label">${Resource.msg('global.giftcertificate','locale',null)}</div>
+								<div class="value"><isprint value="${giftCertificateLineItem.price}"/></div>
+							</div>
+							<div class="shipping-method">
+								<div class="label">${Resource.msg('order.orderdetails.shippingmethod','order',null)}</div>
+								<div class="value">${Resource.msg('order.orderdetails.giftcertshipping','order',null)}</div>
+								<div class="value"><isprint value="${giftCertificateLineItem.recipientEmail}"/></div>
+							</div>
+						</isloop>
+
+						<iscomment>if shipment is marked as gift</iscomment>
+						<isif condition="${shipment.gift}">
+							<div class="order-shipment-gift-message">
+								<div class="label">${Resource.msg('order.orderdetails.giftmessage','order',null)}</div>
+								<isif condition="${!empty(shipment.giftMessage)}">
+									<div class="value"><isprint value="${shipment.giftMessage}"/></div>
+								</isif>
+							</div>
+						<iselse/>
+							<div class="order-shipment-gift-message">
+								<isset name="theGiftCert" value="${shipment.giftCertificateLineItems.iterator().next()}" scope="page"/>
+								<div class="label">${Resource.msg('order.orderdetails.giftmessage','order',null)}</div>
+								<isif condition="${!empty(theGiftCert.message)}">
+									<div class="value"><isprint value="${theGiftCert.message}"/></div>
+								</isif>
+							</div>
+						</isif>
+					</div>
+				</div>
+			</isif>
+		</isloop>
+	</div>
+</div>
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/components/order/orderdetailsemail.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/components/order/orderdetailsemail.isml
new file mode 100755
index 000000000..b535df93c
--- /dev/null
+++ b/cartridges/int_adyen_overlay/cartridge/templates/default/components/order/orderdetailsemail.isml
@@ -0,0 +1,256 @@
+<iscontent type="text/html" charset="UTF-8" compact="true"/>
+<iscomment>
+	Displays order details, such as order number, creation date, payment information,
+	order totals and information for each contained shipment.
+	This template module can be used in order confirmation pages as well as in the
+	order history to render the details of a given order. Depending on the context
+	being used in, one might omit rendering certain information.
+
+	Parameters:
+
+	order		: the order whose details to render
+	orderstatus	: if set to true, the order status will be rendered
+				  if set to false or not existing, the order status will not be rendered
+</iscomment>
+<isset name="Order" value="${pdict.order}" scope="page"/>
+
+<p>
+	${Resource.msg('order.orderdetails.orderplaced','order',null)}
+	<isprint value="${Order.creationDate}" style="DATE_LONG"/>
+</p>
+
+<p>
+	${Resource.msg('order.orderdetails.ordernumber','order',null)}
+	<isprint value="${Order.orderNo}"/>
+</p>
+
+<table style="background:#ffffff;border:1px solid #999999;width:680px;">
+	<tr>
+		<th style="background:#cccccc;padding:5px 20px;font-size:12px;font-family:arial;text-align:left;" colspan="3">${Resource.msg('order.orderdetails.paymentinfo','order',null)}</th>
+	</tr>
+	<tr>
+		<td style="font-size:12px;font-family:arial;padding:20px 10px;vertical-align:top;">
+			<b>${Resource.msg('order.orderdetails.billingaddress','order',null)}</b>
+			<isminiaddress p_address="${Order.billingAddress}"/>
+		</td>
+		<td style="font-size:12px;font-family:arial;padding:20px 10px;vertical-align:top;">
+
+			<isif condition="${Order.paymentInstruments.length == 1}">
+				<b>${Resource.msg('order.orderdetails.paymentmethod','order',null)}</b>
+			<iselse/>
+				<b>${Resource.msg('order.orderdetails.paymentmethods','order',null)}</b>
+			</isif>
+
+			<iscomment>Render All Payment Instruments</iscomment>
+			<isloop items="${Order.getPaymentInstruments()}" var="paymentInstr" status="piloopstate">
+				<div><isprint value="${dw.order.PaymentMgr.getPaymentMethod(paymentInstr.paymentMethod).name}" /></div>
+				<isif condition="${dw.order.PaymentInstrument.METHOD_GIFT_CERTIFICATE.equals(paymentInstr.paymentMethod)}">
+					<isprint value="${paymentInstr.maskedGiftCertificateCode}"/><br />
+				</isif>
+				<isminicreditcard card="${paymentInstr}" show_expiration="${false}"/>
+				<div>
+					<span class="label">${Resource.msg('global.amount','locale',null)}:</span>
+					<span class="value"><isprint value="${paymentInstr.paymentTransaction.amount}"/></span>
+                    <br/>
+                    <isinclude template="adyenOrderDetails" />
+				</div><!-- END: payment-amount -->
+			</isloop>
+		</td>
+		<td style="font-size:12px;font-family:arial;padding:20px 10px;vertical-align:top;">
+			<b>${Resource.msg('order.orderdetails.paymenttotal','order',null)}</b>
+			<isif condition="${Order.shipments.length > 1}">
+				<isemailordertotals p_lineitemctnr="${Order}" p_showshipmentinfo="${true}" p_shipmenteditable="${false}" p_totallabel="${Resource.msg('global.ordertotal','locale',null)}"/>
+			<iselse/>
+				<isemailordertotals p_lineitemctnr="${Order}" p_showshipmentinfo="${false}" p_shipmenteditable="${false}" p_totallabel="${Resource.msg('global.ordertotal','locale',null)}"/>
+				<br />
+			</isif>
+		</td>
+
+	</tr>
+</table>
+
+
+<iscomment>render a box for each shipment</iscomment>
+
+	<isloop items="${Order.shipments}" var="shipment" status="shipmentloopstate">
+
+		<p><b>${(Resource.msg('order.orderconfirmation-email.shipmentnumber','order',null)) + shipmentloopstate.count}</b></p>
+
+		<isif condition="${shipment.productLineItems.size() > 0}">
+
+			<iscomment>Shipment items table</iscomment>
+			<table style="background:#ffffff;border:1px solid #999999;width:680px;">
+				<thead>
+					<tr>
+						<th style="background:#cccccc;padding:5px 20px;font-size:12px;font-family:arial;text-align:left;">${Resource.msg('global.item','locale',null)}</th>
+						<th style="background:#cccccc;padding:5px 20px;font-size:12px;font-family:arial;text-align:left;">${Resource.msg('global.quantity','locale',null)}</th>
+						<th style="background:#cccccc;padding:5px 20px;font-size:12px;font-family:arial;text-align:left;">${Resource.msg('global.price','locale',null)}</th>
+						<isif condition="${empty(shipment.custom.shipmentType) || shipment.custom.shipmentType != 'instore'}"/>
+							<th style="background:#cccccc;padding:5px 20px;font-size:12px;font-family:arial;text-align:left;">${Resource.msg('order.orderdetails.shippingto','order',null)}</th>
+						<iselse/>
+							<th style="background:#cccccc;padding:5px 20px;font-size:12px;font-family:arial;text-align:left;">${Resource.msg('cart.store.instorepickup','checkout',null)}</th>
+						</isif>
+					</tr>
+				</thead>
+				<isloop items="${shipment.productLineItems}" var="productLineItem" status="pliloopstate">
+					<tr>
+
+						<td style="font-size:12px;font-family:arial;padding:20px 10px;vertical-align:top;">
+							<iscomment>Display product line and product using module</iscomment>
+							<isdisplayliproduct p_productli="${productLineItem}" p_editable="${false}"/>
+						</td>
+
+						<td style="font-size:12px;font-family:arial;padding:20px 10px;vertical-align:top;">
+							<isprint value="${productLineItem.quantity}"/>
+						</td>
+
+						<td style="font-size:12px;font-family:arial;padding:20px 10px;vertical-align:top;">
+							<iscomment>Render quantity. If it is a bonus product render word 'Bonus'</iscomment>
+							<isif condition="${productLineItem.bonusProductLineItem}">
+								<isset name="bonusProductPrice" value="${productLineItem.getAdjustedPrice()}" scope="page"/>
+								<isinclude template="checkout/components/displaybonusproductprice" />
+								<isprint value="${bonusProductPriceValue}" />
+							<iselse/>
+								<isprint value="${productLineItem.adjustedPrice}"/>
+								<isif condition="${productLineItem.optionProductLineItems.size() > 0}">
+									<isloop items="${productLineItem.optionProductLineItems}" var="optionLI">
+										<p style="color:#990000;">+ <isprint value="${optionLI.adjustedPrice}"/></p>
+									</isloop>
+								</isif>
+							</isif>
+						</td>
+
+						<iscomment>only show shipping address for first pli in shipment</iscomment>
+						<isif condition="${pliloopstate.first}">
+							<isset name="rowSpan" value="${shipment.productLineItems.size()}" scope="page"/>
+							<td rowspan="${rowSpan.toFixed()}" style="font-size:12px;font-family:arial;padding:20px 10px;vertical-align:top; border-left: 2px solid #cccccc;">
+								<div>
+									<isminishippingaddress p_shipment="${shipment}" p_editable="${false}" p_showmethod="${false}" p_showpromos="${false}"/>
+								</div>
+								<div>
+									${Resource.msg('order.orderdetails.shippingmethod','order',null)}
+									<isif condition="${!empty(shipment.shippingMethod)}">
+										<isprint value="${shipment.shippingMethod.displayName}"/>
+									<iselse/>
+										<isprint value="${shipment.shippingMethodID}"/>
+									</isif>
+								</div>
+								<div>
+									${Resource.msg('order.orderdetails.shippingstatus','order',null)}
+									<isif condition="${shipment.shippingStatus==dw.order.Shipment.SHIPPING_STATUS_NOTSHIPPED}">
+										${Resource.msg('order.orderdetails.notshipped','order',null)}
+									<iselseif condition="${shipment.shippingStatus==dw.order.Shipment.SHIPPING_STATUS_SHIPPED}">
+										${Resource.msg('order.orderdetails.shipped','order',null)}
+									<iselse/>
+										${Resource.msg('order.orderdetails.notknown','order',null)}
+									</isif>
+								</div>
+								<isif condition="${!empty(shipment.trackingNumber)}">
+									<div>
+										${Resource.msg('order.orderdetails.tracking','order',null)}
+										<!-- Tracking Number --><isprint value="${shipment.trackingNumber}"/>
+									</div>
+								</isif>
+							</td>
+						</isif>
+					</tr>
+				</isloop>
+			<iscomment>Shipment Gift Message</iscomment>
+			<isif condition="${shipment.gift}">
+				<tr>
+					<td colspan="4" style="font-size:12px;font-family:arial;padding:20px 10px;vertical-align:top;">
+						${Resource.msg('order.orderdetails.giftmessage','order',null)}
+					</td>
+				</tr>
+				<tr>
+					<td colspan="4" style="font-size:12px;font-family:arial;padding:20px 10px;vertical-align:top;">
+						<isif condition="${!empty(shipment.giftMessage)}">
+							<isprint value="${shipment.giftMessage}"/>
+						<iselse/>
+							&nbsp;
+						</isif>
+					</td>
+				</tr>
+			</isif>
+			</table>
+
+		</isif>
+
+		<isif condition="${shipment.giftCertificateLineItems.size() > 0}">
+
+			<iscomment>Shipment Gift Certificate</iscomment>
+			<table  style="background:#ffffff;border:1px solid #999999;width:680px;">
+				<thead>
+					<tr>
+						<th style="background:#cccccc;padding:5px 20px;font-size:12px;font-family:arial;text-align:left;">${Resource.msg('global.item','locale',null)}</th>
+						<th style="background:#cccccc;padding:5px 20px;font-size:12px;font-family:arial;text-align:left;">${Resource.msg('global.price','locale',null)}</th>
+						<th style="background:#cccccc;padding:5px 20px;font-size:12px;font-family:arial;text-align:left;">${Resource.msg('order.orderdetails.shippingto','order',null)}</th>
+					</tr>
+				</thead>
+				<isloop items="${shipment.giftCertificateLineItems}" var="giftCertificateLineItem" status="gcliloopstate">
+					<tr>
+						<td style="font-size:12px;font-family:arial;padding:20px 10px;vertical-align:top;">
+							${Resource.msg('global.giftcertificate','locale',null)}
+							<div>
+								${Resource.msg('order.orderdetails.giftcertto','order',null)}
+									<isprint value="${giftCertificateLineItem.recipientName}"/><br />
+									<isprint value="${giftCertificateLineItem.recipientEmail}"/>
+							</div>
+							<div>
+								${Resource.msg('order.orderdetails.giftcertfrom','order',null)}
+									<isprint value="${giftCertificateLineItem.senderName}"/><br />
+									<isprint value="${Order.customerEmail}"/>
+							</div>
+						</td>
+						<td style="font-size:12px;font-family:arial;padding:20px 10px;vertical-align:top;">
+							<isprint value="${giftCertificateLineItem.price}"/>
+						</td>
+						<td style="font-size:12px;font-family:arial;padding:20px 10px;vertical-align:top;">
+							<div>
+								${Resource.msg('order.orderdetails.giftcertshippingaddress','order',null)}
+								<div>
+									<isprint value="${giftCertificateLineItem.recipientName}"/>
+									<isprint value="${giftCertificateLineItem.recipientEmail}"/>
+								</div>
+							</div>
+							<div>
+								${Resource.msg('order.orderdetails.shippingmethod','order',null)}
+								${Resource.msg('order.orderdetails.giftcertshipping','order',null)}
+							</div>
+						</td>
+					</tr>
+				</isloop>
+
+				<iscomment>if shipment is marked as gift</iscomment>
+				<tr>
+					<td colspan="4" style="font-size:12px;font-family:arial;padding:20px 10px;vertical-align:top;">
+						${Resource.msg('order.orderdetails.giftmessage','order',null)}
+					</td>
+				</tr>
+
+				<isif condition="${shipment.gift}">
+					<tr>
+						<td colspan="4" style="font-size:12px;font-family:arial;padding:20px 10px;vertical-align:top;">
+							<isif condition="${!empty(shipment.giftMessage)}">
+								<isprint value="${shipment.giftMessage}"/>
+							<iselse/>
+								&nbsp;
+							</isif>
+						</td>
+					</tr>
+				<iselse/>
+					<tr>
+						<td colspan="4" style="font-size:12px;font-family:arial;padding:20px 10px;vertical-align:top;">
+							<isset name="theGiftCert" value="${shipment.giftCertificateLineItems.iterator().next()}" scope="page"/>
+							<isif condition="${!empty(theGiftCert.message)}">
+								<isprint value="${theGiftCert.message}"/>
+							<iselse/>
+								&nbsp;
+							</isif>
+						</td>
+					</tr>
+				</isif>
+			</table>
+
+		</isif>
+	</isloop>
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/hpp.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/hpp.isml
index afaa47db9..affa11acd 100644
--- a/cartridges/int_adyen_overlay/cartridge/templates/default/hpp.isml
+++ b/cartridges/int_adyen_overlay/cartridge/templates/default/hpp.isml
@@ -3,36 +3,45 @@
 
 <isset name="directoryLookup" value="${dw.system.Site.getCurrent().getCustomPreferenceValue('Adyen_directoryLookup')}" scope="page"/>
 <isset name="brandCode" value="" scope="session"/>
-<isset name="issuerId" value="" scope="session"/>
-<isset name="whitelistMethods" value="${dw.system.Site.getCurrent().getCustomPreferenceValue('Adyen_Open_Invoice_Whitelist')}" scope="page"/>
 
+<isinputfield formfield="${pdict.CurrentForms.adyPaydata.issuer}" type="hidden"/>
+
+<script src="${AdyenHelper.getCheckoutUrl()}" type="text/javascript"></script>
 <isif condition="${directoryLookup == true && !empty(pdict.AdyenHppPaymentMethods)}">
-	<isset name="methods" value="${pdict.AdyenHppPaymentMethods.paymentMethods}" scope="page"/>
+	<isset name="methods" value="${pdict.AdyenHppPaymentMethods}" scope="page"/>
 	
-	<iscomment>Loop through the returned payment methods after calling directory.shtml and print them</iscomment>
+	<iscomment>Loop through the returned payment methods after calling /paymentMethods and print them</iscomment>
 	<isif condition="${!empty(methods) && methods.length > 0}">
-	
+	<script type="text/javascript">
+		var AdyenCheckoutObject = new AdyenCheckout(window.Configuration);
+	</script>
 		<ul id="type">
 			<isloop items="${methods}" var="method" status="loopstate">
-				<li class="form-row row-${method.brandCode}">
-					<isif condition="${whitelistMethods.indexOf(method.brandCode) > -1}">
-						<input type="radio" class="input-radio openInvoice" name="brandCode" value="${method.brandCode}"/>
+				<li class="form-row row-${method.type}" id="li_${method.type}">
+					<input type="radio" class="input-radio" name="brandCode" value="${method.type}" id="${method.type}"/>
+					<img class="logo" src="${AdyenHelper.getAdyenUrl()}/hpp/img/pm/${method.type}.png" alt=""/>
+					<label class="payment_method_label" for="${method.type}">${method.name}</label>
+					<isscript>
+					    var methodDetails = JSON.stringify(method);
+					</isscript>
+					<isif condition="${AdyenHelper.hasCheckoutComponent(method.type)}">
+						<isinclude template="checkoutComponent"/>
 					<iselse/>
-						<input type="radio" class="input-radio" name="brandCode" value="${method.brandCode}"/>
-					</isif>
-					<img class="logo" src="${URLUtils.staticURL('/images/' + method.brandCode + '.png')}" alt=""/>
-					<label for="${method.brandCode}">${method.name}</label>
-
-					<isif condition="${typeof method.issuers !== 'undefined' && method.issuers.length > 0}">
-						<ul id="issuer">
-							<isloop items="${method.issuers}" var="issuer" status="loopstate">
-								<li class="form-row">
-									<input type="radio" class="input-radio" name="issuerId" value="${issuer.issuerId}"/>
-									<img class="logo" src="${URLUtils.staticURL('/images/' + issuer.name.replace(/\s+/g, '').toUpperCase() + '.png')}" alt=""/>
-								</li>
-							</isloop>
-						</ul>
-					</isif>
+						<isif condition="${method.details[0].key == 'issuer'}">
+							<select class="issuer" id="${method.type}_issuer">
+								<isloop items="${method.details[0].items}" var="selectedIssuer" status="loopstate">
+									<option label="${selectedIssuer.name}" value="${selectedIssuer.id}"/>
+								</isloop>
+							</select>
+						</isif>
+						<isif condition="${method.type.substring(0, 3) == 'ach'}">
+							<div id="component_ach" class="checkoutComponent">
+								<isinputfield formfield="${pdict.CurrentForms.adyPaydata.bankAccountOwnerName}" type="input"/>
+								<isinputfield formfield="${pdict.CurrentForms.adyPaydata.bankAccountNumber}" type="input"/>
+								<isinputfield formfield="${pdict.CurrentForms.adyPaydata.bankLocationId}" type="input"/>
+							</div>
+						</isif>
+					</isif> 
 				</li>
 			</isloop>
 		</ul>
@@ -40,22 +49,12 @@
 <iselse>
 	<span>${Resource.msg('hpp.empty', 'hpp', null)}</span>
 </isif>
-<div class="hppAdditionalFields">
-	<div class="openinvoiceInput additionalfield nl at de">
-		<isinputfield type="select" formfield="${pdict.CurrentForms.adyPaydata.gender}" />
-	</div>
-	<div class="openinvoiceInput additionalfield nl at de dk fi no se">
-		<isinputfield type="text" formfield="${pdict.CurrentForms.adyPaydata.dob}" />
-	</div>
-	<div class="openinvoiceInput additionalfield nl de">
-		<isinputfield type="text" formfield="${pdict.CurrentForms.adyPaydata.houseNumber}" />
-	</div>
-	<div class="openinvoiceInput additionalfield nl">
-		<isinputfield type="text" formfield="${pdict.CurrentForms.adyPaydata.houseExtension}" />
-	</div>
-	<div class="openinvoiceInput additionalfield dk fi no se">
-		<isinputfield type="text" formfield="${pdict.CurrentForms.adyPaydata.personalNumber}" />
-	</div>
+
+<div class="openinvoiceInput">
+	<isinputfield type="hidden" formfield="${pdict.CurrentForms.adyPaydata.gender}" />
+	<isinputfield type="hidden" formfield="${pdict.CurrentForms.adyPaydata.dateOfBirth}" />
+	<isinputfield type="hidden" formfield="${pdict.CurrentForms.adyPaydata.telephoneNumber}" />
+	<isinputfield type="hidden" formfield="${pdict.CurrentForms.adyPaydata.socialSecurityNumber}" />
 </div>
 
 <iscomment>
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/resources/checkout.properties b/cartridges/int_adyen_overlay/cartridge/templates/resources/checkout.properties
new file mode 100644
index 000000000..bf2bd4b70
--- /dev/null
+++ b/cartridges/int_adyen_overlay/cartridge/templates/resources/checkout.properties
@@ -0,0 +1,11 @@
+error.placeorder=An error occurred placing this order. Please contact the vendor.
+bankTransfer.owner=Beneficiary Name
+bankTransfer.iban=Bankaccount
+bankTransfer.reference=With reference
+bankTransfer.amount=Amount
+bankTransfer.description=Please transfer the amount using the reference below to the following bank account
+comprafacil.description=Please pay with the provided Multibanco reference and entity before payment deadline in order to complete payment
+comprafacil.deadline=Payment Deadline (in days)
+comprafacil.reference=Reference
+comprafacil.entity=Entity
+comprafacil.amount=Amount
\ No newline at end of file
diff --git a/metadata/site_import/meta/system-objecttype-extensions.xml b/metadata/site_import/meta/system-objecttype-extensions.xml
index 9c0ffaa16..4badf9d9b 100644
--- a/metadata/site_import/meta/system-objecttype-extensions.xml
+++ b/metadata/site_import/meta/system-objecttype-extensions.xml
@@ -75,6 +75,15 @@
                 <min-length>0</min-length>
                 <field-length>0</field-length>
             </attribute-definition>
+            <attribute-definition attribute-id="adyenAdditionalPaymentData">
+                <display-name xml:lang="x-default">adyenAdditionalPaymentData</display-name>
+                <description xml:lang="x-default">Additional data for payment method</description>
+                <type>string</type>
+                <mandatory-flag>false</mandatory-flag>
+                <externally-managed-flag>false</externally-managed-flag>
+                <min-length>0</min-length>
+                <field-length>0</field-length>
+            </attribute-definition>
             <attribute-definition attribute-id="adyenPaymentData">
                 <display-name xml:lang="x-default">adyenPaymentData</display-name>
                 <description xml:lang="x-default">Adyen PaymentData 3D Secure</description>
@@ -94,7 +103,25 @@
             </attribute-group>
         </group-definitions>
     </type-extension>
-
+    
+    <type-extension type-id="CustomerPaymentInstrument">
+            <custom-attribute-definitions>
+                <attribute-definition attribute-id="adyenCreditCardType">
+                    <display-name xml:lang="x-default">adyenCreditCardType</display-name>
+                    <description xml:lang="x-default">Adyen Credit card type</description>
+                    <type>string</type>
+                    <mandatory-flag>false</mandatory-flag>
+                    <externally-managed-flag>false</externally-managed-flag>
+                    <min-length>0</min-length>
+                </attribute-definition>
+            </custom-attribute-definitions>
+            <group-definitions>
+                <attribute-group group-id="AdyenPayment">
+                    <display-name xml:lang="x-default">AdyenPayment</display-name>
+                    <attribute attribute-id="adyenCreditCardType"/>
+                </attribute-group>
+            </group-definitions>
+        </type-extension>
 
     <type-extension type-id="PaymentTransaction">
         <system-attribute-definitions>
@@ -335,6 +362,7 @@
                 <type>boolean</type>
                 <mandatory-flag>false</mandatory-flag>
                 <externally-managed-flag>false</externally-managed-flag>
+                <default-value>true</default-value>
             </attribute-definition>
             <attribute-definition attribute-id="Adyen_merchantCode">
                 <display-name xml:lang="x-default">merchantCode</display-name>
@@ -415,29 +443,32 @@
                 <min-length>0</min-length>
                 <field-length>0</field-length>
             </attribute-definition>
+             <attribute-definition attribute-id="Adyen_live_prefix">
+                <display-name xml:lang="x-default">Live prefix</display-name>
+                <description xml:lang="x-default">Live prefix</description>
+                <type>string</type>
+                <mandatory-flag>false</mandatory-flag>
+                <externally-managed-flag>false</externally-managed-flag>
+                <min-length>0</min-length>
+                <field-length>0</field-length>
+            </attribute-definition>
         </custom-attribute-definitions>
         <group-definitions>
             <attribute-group group-id="Adyen">
                 <display-name xml:lang="x-default">Adyen Account Settings</display-name>
                 <attribute attribute-id="Adyen_merchantCode"/>
-                <attribute attribute-id="Adyen_Mode"/>
-                <attribute attribute-id="Adyen_skinCode"/>
-                <attribute attribute-id="Adyen_HMACkey"/>
+                <attribute attribute-id="Adyen_Mode"/>            
                 <attribute attribute-id="Adyen_Debug"/>
-                <attribute attribute-id="AdyenCseEnabled"/>
-                <attribute attribute-id="AdyenCseLibraryToken"/>
-                <attribute attribute-id="Adyen_directoryLookup"/>
-                <attribute attribute-id="Adyen_PaymentSelection"/>
                 <attribute attribute-id="AdyenRecurringPaymentsEnabled"/>
                 <attribute attribute-id="Adyen_recurringType"/>
                 <attribute attribute-id="AdyenGuestRecurringEnabled"/>
 	            <attribute attribute-id="Adyen_notification_user"/>
                 <attribute attribute-id="Adyen_notification_password"/>
-                <attribute attribute-id="Adyen_Open_Invoice_Whitelist"/>
                 <attribute attribute-id="AdyenRatePayID"/>
                 <attribute attribute-id="Adyen_POIID"/>
                 <attribute attribute-id="Adyen_API_Key"/>
                 <attribute attribute-id="Adyen_multi_terminals"/>
+                <attribute attribute-id="Adyen_live_prefix"/>
             </attribute-group>
         </group-definitions>
 </type-extension>
diff --git a/metadata/site_import/services.xml b/metadata/site_import/services.xml
index b629d73b5..84d9ae0eb 100644
--- a/metadata/site_import/services.xml
+++ b/metadata/site_import/services.xml
@@ -1,12 +1,17 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <services xmlns="http://www.demandware.com/xml/impex/services/2014-09-26">
      <service-credential service-credential-id="AdyenPayment">
-        <url>https://pal-test.adyen.com/pal/servlet/Payment/v40/authorise</url>
+        <url>https://checkout-test.adyen.com/checkout/v40/payments</url>
         <user-id>yourWebServiceUser</user-id>
         <password/>
-    </service-credential> 
+    </service-credential>
     <service-credential service-credential-id="AdyenPayment3DSecure">
-        <url>https://pal-test.adyen.com/pal/servlet/Payment/v40/authorise3d</url>
+        <url>https://checkout-test.adyen.com/checkout/v40/payments/details</url>
+        <user-id>yourWebServiceUser</user-id>
+        <password/>
+    </service-credential>
+    <service-credential service-credential-id="AdyenPaymentDetails">
+        <url>https://checkout-test.adyen.com/checkout/v40/payments/details</url>
         <user-id>yourWebServiceUser</user-id>
         <password/>
     </service-credential>
@@ -29,8 +34,18 @@
         <url>https://terminal-api-test.adyen.com/sync</url>
         <user-id></user-id>
         <password/>
-    </service-credential>   
-     
+    </service-credential>
+    <service-credential service-credential-id="AdyenOriginKeys">
+        <url>https://checkout-test.adyen.com/v1/originKeys</url>
+        <user-id></user-id>
+        <password/>
+    </service-credential>
+    <service-credential service-credential-id="AdyenCheckoutPaymentMethods">
+        <url>https://checkout-test.adyen.com/v40/paymentMethods</url>
+        <user-id></user-id>
+        <password/>
+    </service-credential>
+
      <service-profile service-profile-id="Adyen">
           <timeout-millis>30000</timeout-millis>
           <cb-enabled>false</cb-enabled>
@@ -53,6 +68,15 @@
         <mock-mode-enabled>false</mock-mode-enabled>
         <profile-id>Adyen</profile-id>
         <credential-id>AdyenPayment3DSecure</credential-id>
+    </service>
+    <service service-id="AdyenPaymentDetails">
+        <service-type>HTTP</service-type>
+        <enabled>true</enabled>
+        <log-prefix>adyen</log-prefix>
+        <comm-log-enabled>true</comm-log-enabled>
+        <mock-mode-enabled>false</mock-mode-enabled>
+        <profile-id>Adyen</profile-id>
+        <credential-id>AdyenPaymentDetails</credential-id>
     </service>
      <service service-id="AdyenRecurring">
         <service-type>HTTP</service-type>
@@ -72,6 +96,15 @@
         <profile-id></profile-id>
         <credential-id>AdyenPaymentMethods</credential-id>
     </service>
+    <service service-id="AdyenCheckoutPaymentMethods">
+        <service-type>HTTP</service-type>
+        <enabled>true</enabled>
+        <log-prefix>adyen</log-prefix>
+        <comm-log-enabled>true</comm-log-enabled>
+        <mock-mode-enabled>false</mock-mode-enabled>
+        <profile-id>Adyen</profile-id>
+        <credential-id>AdyenCheckoutPaymentMethods</credential-id>
+    </service>
     <service service-id="AdyenRecurringDisable">
         <service-type>HTTP</service-type>
         <enabled>true</enabled>
@@ -90,4 +123,13 @@
         <profile-id>Adyen</profile-id>
         <credential-id>AdyenPosPayment</credential-id>
     </service>
+    <service service-id="AdyenOriginKeys">
+        <service-type>HTTP</service-type>
+        <enabled>true</enabled>
+        <log-prefix>adyen</log-prefix>
+        <comm-log-enabled>true</comm-log-enabled>
+        <mock-mode-enabled>false</mock-mode-enabled>
+        <profile-id>Adyen</profile-id>
+        <credential-id>AdyenOriginKeys</credential-id>
+    </service>
 </services>
diff --git a/metadata/site_import/sites/yourSiteId/preferences.xml b/metadata/site_import/sites/yourSiteId/preferences.xml
deleted file mode 100644
index 4a30fb782..000000000
--- a/metadata/site_import/sites/yourSiteId/preferences.xml
+++ /dev/null
@@ -1,23 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<preferences xmlns="http://www.demandware.com/xml/impex/preferences/2007-03-31">
-    <custom-preferences>
-        <all-instances/>
-        <development>
-            <preference preference-id="AdyenCseEnabled">true</preference>
-            <preference preference-id="AdyenCseLibraryToken">Your CSE Library token you can retrieve this from Adyen Customer Area</preference>
-            <preference preference-id="Adyen_Debug">true</preference>
-            <preference preference-id="Adyen_HMACkey">yourHMAC</preference>
-            <preference preference-id="Adyen_Mode">TEST</preference>
-            <preference preference-id="Adyen_PaymentSelection">one</preference>
-            <preference preference-id="Adyen_directoryLookup">true</preference>
-            <preference preference-id="Adyen_merchantCode">yourMerchantAccount</preference>
-            <preference preference-id="Adyen_recurringType">ONECLICK</preference>
-            <preference preference-id="Adyen_skinCode">yourSkinCode</preference>
-            <preference preference-id="Adyen_notification_user">user</preference>
-            <preference preference-id="Adyen_notification_password">password</preference>
-        </development>
-        <staging/>
-        <production/>
-    </custom-preferences>
-</preferences>
-

From 04c49aa936d1c9a9848c67e0208312e7e2149e59 Mon Sep 17 00:00:00 2001
From: Bas Maassen <bas.maassen@adyen.com>
Date: Fri, 17 May 2019 14:06:20 -0700
Subject: [PATCH 11/22] Updated version number 19.1.0

---
 .../int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds   | 2 +-
 package.json                                                  | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
index 13537a7bd..5f6737205 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
@@ -31,7 +31,7 @@ var __AdyenHelper: Object = {
     LOADING_CONTEXT_TEST: "https://checkoutshopper-test.adyen.com/checkoutshopper/",
     LOADING_CONTEXT_LIVE: "https://checkoutshopper-live.adyen.com/checkoutshopper/",
 
-    VERSION: "18.3.0",
+    VERSION: "19.1.0",
 
     getService: function (service: String): Object {
         // Create the service config (used for all services)
diff --git a/package.json b/package.json
index a5e934ab2..3000948ef 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "int_adyen_SFRA",
-  "version": "0.0.1",
-  "description": "New SFRA cartridge",
+  "version": "19.1.0",
+  "description": "SFRA cartridge",
   "main": "index.js",
   "paths": {
     "base": "../storefront-reference-architecture/cartridges/app_storefront_base/"

From 561a6243a9d5c3dc26fd8f4bfdecf57c172937d8 Mon Sep 17 00:00:00 2001
From: Bas Maassen <bas.maassen@adyen.com>
Date: Fri, 17 May 2019 14:51:11 -0700
Subject: [PATCH 12/22] updated readme and package.json

---
 README.md    | 19 +++++++++----------
 package.json |  2 +-
 2 files changed, 10 insertions(+), 11 deletions(-)

diff --git a/README.md b/README.md
index b987a9844..d9fd5f54a 100755
--- a/README.md
+++ b/README.md
@@ -1,25 +1,24 @@
 # Salesforce Commerce Cloud Adyen Cartridge
 
-Adyen provides a LINK cartridge to integrate with a Salesforce Commerce Cloud (SCC). This cartridge enables a SCC store to use the Adyen payment service. This cartridge supports SFRA up to v3.3.0 and JS-Controllers.
+Adyen provides a LINK cartridge to integrate with Salesforce Commerce Cloud (SFCC). This cartridge enables a SFCC storefront to use the Adyen payment service. This cartridge supports SFRA version 4.0.0 and SiteGenesis JS-Controllers.
 
 ## Integration
-The plugin integrates Classic integration for all card payments. Local/redirect payment methods are integrated with DirectoryLookup and HPP. For Point Of Sale (POS) payments we use Terminal API using Cloud-based communication. 
+The cartridge integrates Secured Fields for all card payments. Local/redirect payment methods are integrated with Checkout API. For Point Of Sale (POS) payments in SiteGenesis, we use Terminal API using Cloud-based communication.
 
 ## Requirements
-  
-It is mandatory that the merchant has to open an account with Adyen and configure some items in Commerce Cloud Business Manager, as well as in the Adyen account to make the integration working properly.
-The integration is based on the Site Genesis demo store provided by Commerce Cloud.
-  
+
+It is required to have an Adyen account to use the cartridge. You can do this [here](https://www.adyen.com/signup).
+
 ## Installation, Usage and Configuration
 
-Installation, Usage and Configuration is explained in our [manual](https://docs.adyen.com/plugins/salesforce-commerce-cloud/).
+Installation, Usage and Configuration is explained in Adyen's [online documentation](https://docs.adyen.com/plugins/salesforce-commerce-cloud/).
 
-ApplePay configuration can be found [here](https://docs.adyen.com/plugins/salesforce-commerce-cloud/set-up-payment-methods/#set-up-apple-pay-on-the-web)
+Apple Pay configuration can be found [here](https://docs.adyen.com/plugins/salesforce-commerce-cloud/set-up-payment-methods/#set-up-apple-pay-on-the-web).
 
 ## Support
   
-In case of problems with the integration or connection to Adyen, contact the [Adyen Support Team](mailto:support@adyen.com) or your Adyen account manager.
-Supply as much information as possible: your merchant account, skin code, time, order number, PSP reference, etc.
+For further questions regarding the integration to Adyen, contact the [Adyen Support Team](mailto:support@adyen.com) or your Adyen account manager.
+Supply as much information as possible: your merchant account, timestamp, order number, PSP reference, etc.
 
 ## Licence
   
diff --git a/package.json b/package.json
index 3000948ef..aee83d34c 100644
--- a/package.json
+++ b/package.json
@@ -9,7 +9,7 @@
   "scripts": {
     "lint": "sgmf-scripts --lint js && sgmf-scripts --lint css",
     "upload": "sgmf-scripts --upload -- ",
-    "uploadCartridge": "sgmf-scripts --uploadCartridge int_adyen_SFRA",
+    "uploadCartridge": "sgmf-scripts --uploadCartridge int_adyen_SFRA && sgmf-scripts --uploadCartridge int_adyen_overlay",
     "watch": "sgmf-scripts --watch",
     "compile:js": "sgmf-scripts --compile js",
     "compile:scss": "sgmf-scripts --compile css"

From 77452a678f51dfb8b20a755d900f2f187cf65b46 Mon Sep 17 00:00:00 2001
From: Bas Maassen <bas.maassen@adyen.com>
Date: Fri, 17 May 2019 14:55:31 -0700
Subject: [PATCH 13/22] gitignore

---
 .gitignore | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.gitignore b/.gitignore
index 546cc3dbd..e0d0a43fb 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,3 @@
 .idea
-/.DS_Store
-/cartridges/int_adyen_SFRA/dw.json
\ No newline at end of file
+.DS_Store
+/cartridges/int_adyen_SFRA/dw.json

From 492768c5f2f37ae561b641c5f118d9652809faa1 Mon Sep 17 00:00:00 2001
From: Bas Maassen <maassenbas@hotmail.com>
Date: Wed, 26 Jun 2019 17:04:16 +0200
Subject: [PATCH 14/22] Feature 3DS2 (#168)

* Feature 3DS2
* Update components 3.0.0
* Klarna new integration compatibility
---
 .../cartridge/client/default/js/adyen-cse.js  | 185 ----
 .../client/default/js/adyenCheckout.js        |  60 +-
 .../client/default/js/checkout/billing.js     |   8 +-
 .../client/default/js/threeds2-js-utils.js    |   1 +
 .../default/scss/adyen-checkout-2.1.0.scss    | 987 ------------------
 .../default/scss/adyen-checkout-3.0.0.scss    |  25 +
 .../cartridge/controllers/Adyen.js            | 107 +-
 .../cartridge/controllers/CheckoutServices.js |   9 +-
 .../cartridge/forms/default/creditCard.xml    |   3 +
 .../hooks/payment/processor/adyen_credit.js   |  19 +-
 .../default/account/payment/paymentForm.isml  |   3 +-
 .../checkout/billing/creditCardForm.isml      |  14 +-
 .../checkout/billing/paymentOptions.isml      |   2 +-
 .../paymentOptions/creditCardSummary.isml     |   5 +-
 .../billing/storedPaymentInstruments.isml     |   6 +-
 .../templates/default/redirectHPP.isml        |  76 --
 .../cartridge/controllers/Adyen.js            | 149 ++-
 .../scripts/payment/processor/ADYEN_CREDIT.js |  24 +-
 .../scripts/payment/processor/Adyen.js        |   1 -
 .../cartridge/js/pages/checkout/adyen-cse.js  |  25 +-
 .../js/pages/checkout/threeds2-js-utils.js    |   1 +
 .../cartridge/scripts/adyenCheckout.ds        |  55 +-
 .../scripts/adyenGetOpenInvoiceData.ds        |  22 +-
 .../cartridge/scripts/util/AdyenHelper.ds     |  76 +-
 .../templates/default/adyenform.isml          |   2 -
 .../default/adyenpaymentredirect.isml         |   2 +
 .../checkout/billing/adyenpaymentfields.isml  |  21 +-
 .../templates/default/checkoutComponent.isml  |  53 +-
 .../cartridge/templates/default/hpp.isml      | 130 ++-
 .../default/payerauthentication.isml          |  28 -
 .../default/payerauthenticationredirect.isml  |  17 -
 .../cartridge/templates/default/redirect.isml |  83 --
 .../templates/default/redirect_sha256.isml    |  74 --
 .../templates/default/threeds2/adyen3ds2.isml | 118 +++
 .../meta/system-objecttype-extensions.xml     |  11 +-
 35 files changed, 729 insertions(+), 1673 deletions(-)
 delete mode 100644 cartridges/int_adyen_SFRA/cartridge/client/default/js/adyen-cse.js
 create mode 100644 cartridges/int_adyen_SFRA/cartridge/client/default/js/threeds2-js-utils.js
 delete mode 100644 cartridges/int_adyen_SFRA/cartridge/client/default/scss/adyen-checkout-2.1.0.scss
 create mode 100644 cartridges/int_adyen_SFRA/cartridge/client/default/scss/adyen-checkout-3.0.0.scss
 delete mode 100644 cartridges/int_adyen_SFRA/cartridge/templates/default/redirectHPP.isml
 create mode 100644 cartridges/int_adyen_overlay/cartridge/js/pages/checkout/threeds2-js-utils.js
 delete mode 100644 cartridges/int_adyen_overlay/cartridge/templates/default/payerauthentication.isml
 delete mode 100644 cartridges/int_adyen_overlay/cartridge/templates/default/payerauthenticationredirect.isml
 delete mode 100644 cartridges/int_adyen_overlay/cartridge/templates/default/redirect.isml
 delete mode 100644 cartridges/int_adyen_overlay/cartridge/templates/default/redirect_sha256.isml
 create mode 100644 cartridges/int_adyen_overlay/cartridge/templates/default/threeds2/adyen3ds2.isml

diff --git a/cartridges/int_adyen_SFRA/cartridge/client/default/js/adyen-cse.js b/cartridges/int_adyen_SFRA/cartridge/client/default/js/adyen-cse.js
deleted file mode 100644
index b554707da..000000000
--- a/cartridges/int_adyen_SFRA/cartridge/client/default/js/adyen-cse.js
+++ /dev/null
@@ -1,185 +0,0 @@
-$('button[value="submit-payment"]').on('click', function (e) {
-    if ($('#selectedPaymentOption').val() == 'CREDIT_CARD') {
-        var cardData;
-        var options = {};
-        var masked = "";
-
-        if (!$('.payment-information').data('is-new-payment')) {
-            $('#selectedCardID').val($('.selected-payment').data('uuid'));
-            cardData = getCardData(true);
-            options = {enableValidations: false};
-        } else {
-            $('#selectedCardID').val('');
-            cardData = getCardData(false);
-            masked = maskValue(cardData.number.replace(/\s/g, ''));
-        }
-
-        var validCard = encryptData(cardData, options);
-        if (!validCard) {
-            return false;
-        }
-        $('#cardNumber').val(masked);
-    }
-
-    if ($('#selectedPaymentOption').val() == 'Adyen' && $('#directoryLookup').val() == 'true' && !$("input[name='brandCode']:checked").val()) {
-        $('#requiredBrandCode').show();
-        return false;
-    }
-    if ($('#selectedPaymentOption').val() == 'Adyen' && $("input[name='brandCode']:checked").val()) {
-        $('#adyenPaymentMethod').val($("input[name='brandCode']:checked").closest(".paymentMethod").find("label").text());
-
-        if ($("input[name='brandCode']:checked").parent().find('#issuerList').length) {
-            $('#adyenIssuerName').val($('#issuerList :selected').attr('label'));
-        } else {
-            $('#issuerList').val("");
-            $('#adyenIssuerName').val("");
-        }
-    }
-});
-
-$('button[value="add-new-payment"]').on('click', function (e) {
-    var cardData = getCardData(false);
-    var options = {enableValidations: true};
-    encryptData(cardData, options);
-});
-
-function getCardData(selectedCard) {
-    var cardData = {};
-    if (!selectedCard) {
-        cardData.number = $('#cardNumber').val();
-        cardData.holderName = $('#holderName').val();
-        cardData.expiryMonth = $('#expirationMonth').val();
-        cardData.expiryYear = $('#expirationYear').val();
-        cardData.cvc = $('#securityCode').val();
-    } else {
-        cardData.cvc = $('.selected-payment #saved-payment-security-code').val();
-    }
-    return cardData;
-}
-
-function encryptData(cardData, options) {
-    var encryptedData = $('#adyenEncryptedData');
-    var encryptedDataValue;
-    var cseInstance = adyen.createEncryption(options);
-    var validationResult = cseInstance.validate(cardData);
-    $('#invalidCardDetails').hide();
-    if (!validationResult.valid) {
-        showValidation(validationResult);
-        return false;
-    } else {
-        cardData.generationtime = $('#adyen_generationtime').val();
-        encryptedDataValue = cseInstance.encrypt(cardData);
-        encryptedData.val(encryptedDataValue);
-        return true;
-    }
-}
-
-function showValidation(validationResult) {
-    clearValidations();
-    for (var key in validationResult) {
-        if (validationResult[key] === false) {
-            switch (key) {
-                case "holderName":
-                    $('#holderName').addClass('is-invalid');
-                    break;
-                case "number":
-                    $('#cardNumber').addClass('is-invalid');
-                    break;
-                case "expiryMonth":
-                    $('#expirationMonth').addClass('is-invalid');
-                    break;
-                case "expiryYear":
-                    $('#expirationYear').addClass('is-invalid');
-                    break;
-                case "cvc":
-                    $('#securityCode').addClass('is-invalid');
-                    break;
-                default:
-                    break;
-            }
-        }
-    }
-    $('#invalidCardDetails').show();
-}
-
-function clearValidations() {
-    $('#holderName').removeClass('is-invalid');
-    $('#cardNumber').removeClass('is-invalid');
-    $('#expirationMonth').removeClass('is-invalid');
-    $('#expirationYear').removeClass('is-invalid');
-    $('#securityCode').removeClass('is-invalid');
-}
-
-function maskValue(value) {
-    if (value && value.length > 4) {
-        return value.replace(/\d(?=\d{4})/g, '*');
-    }
-    return '';
-}
-
-$('button[value="submit-shipping"]').on('click', function (e) {
-    displayPaymentMethods();
-});
-
-$(document).ready(function () {
-    displayPaymentMethods();
-});
-
-function displayPaymentMethods() {
-    $('#paymentMethodsUl').empty();
-    if ($('#directoryLookup').val() == 'true') {
-        getPaymentMethods(function (data) {
-            jQuery.each(data.AdyenHppPaymentMethods, function (i, method) {
-                addPaymentMethod(method, data.ImagePath, data.AdyenDescriptions[i].description);
-            });
-
-            $('input[type=radio][name=brandCode]').change(function () {
-                $('.hppAdditionalFields').hide();
-                $('#extraFields_' + $(this).val()).show();
-            });
-        });
-    }
-}
-
-function getPaymentMethods(paymentMethods) {
-    $.ajax({
-        url: 'Adyen-GetPaymentMethods',
-        type: 'get',
-        success: function (data) {
-            paymentMethods(data);
-        }
-    });
-}
-
-function addPaymentMethod(paymentMethod, imagePath, description) {
-    var li = $('<li>').addClass('paymentMethod');
-    li.append($('<input>')
-        .attr('id', 'rb_' + paymentMethod.name)
-        .attr('type', 'radio')
-        .attr('name', 'brandCode')
-        .attr('value', paymentMethod.brandCode));
-    li.append($('<img>').addClass('paymentMethod_img').attr('src', imagePath + paymentMethod.brandCode + '.png'));
-    li.append($('<label>').text(paymentMethod.name).attr('for', 'rb_' + paymentMethod.name));
-    li.append($('<p>').text(description));
-
-    var additionalFields = $('<div>').addClass('hppAdditionalFields')
-        .attr('id', 'extraFields_' + paymentMethod.brandCode)
-        .attr('style', 'display:none');
-
-    if (paymentMethod.issuers) {
-        var issuers = $('<select>').attr('id', 'issuerList').attr('name', 'issuerId');
-        jQuery.each(paymentMethod.issuers, function (i, issuer) {
-            var issuer = $('<option>')
-                .attr('label', issuer.name)
-                .attr('value', issuer.issuerId);
-            issuers.append(issuer);
-        });
-        additionalFields.append(issuers);
-        li.append(additionalFields);
-    }
-    if ($('#OpenInvoiceWhiteList').val().indexOf(paymentMethod.brandCode) !== -1) {
-        // Display Additional Open Invoice fields
-        li.append(additionalFields);
-    }
-    $('#paymentMethodsUl').append(li);
-}
\ No newline at end of file
diff --git a/cartridges/int_adyen_SFRA/cartridge/client/default/js/adyenCheckout.js b/cartridges/int_adyen_SFRA/cartridge/client/default/js/adyenCheckout.js
index 7837f7e6f..6196015bc 100644
--- a/cartridges/int_adyen_SFRA/cartridge/client/default/js/adyenCheckout.js
+++ b/cartridges/int_adyen_SFRA/cartridge/client/default/js/adyenCheckout.js
@@ -1,7 +1,12 @@
+var threeDS2utils = require('./threeds2-js-utils.js');
+
 const configuration = {
     locale: $('#currentLocale').val(), // Defaults to en_US
     originKey: originKey,
-    loadingContext: loadingContext
+    environment: environment,
+    risk: {
+        enabled: false
+    }
 };
 
 const checkout = new AdyenCheckout(configuration);
@@ -13,18 +18,18 @@ var afterpayComponent;
 var klarnaComponent;
 var isValid = false;
 
-getConfigurationSecureFields();
+getConfigurationComponents();
 
 $(document).ready(function () {
     displayPaymentMethods();
 });
 
 var originKey = "";
-var loadingContext = "";
+var environment = "";
 
 function setConfigData(data, callback) {
     originKey = data.adyenOriginKey[Object.keys(data.adyenOriginKey)[0]];
-    loadingContext = data.adyenLoadingContext;
+    environment = data.adyenEnvironment;
     callback();
 };
 
@@ -32,11 +37,11 @@ function renderCardComponent() {
     card = checkout.create('card', {
         // Mandatory fields
         originKey: originKey,
-        loadingContext: loadingContext, // The environment where we should loads the secured fields from
+        environment: environment, // The environment where we should loads the secured fields from
         type: 'card',
         hasHolderName: true,
         holderNameRequired: true,
-        groupTypes: ["bcmc", "maestro", "visa", "mc", "amex", "diners", "discover"],
+        groupTypes: ["bcmc", "maestro", "visa", "mc", "amex", "diners", "discover", "jcb"],
 
         // Events
         onChange: function (state) {
@@ -44,7 +49,12 @@ function renderCardComponent() {
         }, // Gets triggered whenever a user changes input
         onBrand: function (brandObject) {
             $('#cardType').val(brandObject.brand);
-        } // Called once we detect the card brand
+        }, // Called once we detect the card brand
+        onFieldValid: function (data) {
+            if(data.endDigits){
+                $('#cardNumber').val("**********" + data.endDigits);
+            }
+        }
     });
     card.mount(cardNode);
 };
@@ -56,14 +66,13 @@ function renderOneClickComponents() {
     jQuery.each(componentContainers, function (i, oneClickCardNode) {
         var container = document.getElementById(oneClickCardNode.id);
         var cardId = container.id.split("-")[1];
-        var brandCode = document.getElementById('cardType-' + cardId).innerText;
-
+        var brandCode = document.getElementById('cardType-' + cardId).value;
         oneClickCard[i] = checkout.create('card', {
             //Get selected card, send in payment request
             originKey: originKey,
-            loadingContext: loadingContext, // The environment where we should loads the secured fields from
+            environment: environment, // The environment where we should loads the secured fields from
             // Specific for oneClick cards
-
+            type: brandCode,
             storedDetails: {
                 "card": {
                     "expiryMonth": "",
@@ -72,20 +81,20 @@ function renderOneClickComponents() {
                     "number": ""
                 }
             },
-            details: brandCode.includes('Bancontact') ? [] : [{"key": "cardDetails.cvc", "type": "cvc"}],
+            details: brandCode.includes('bcmc') ? [] : [{"key": "cardDetails.cvc", "type": "cvc"}],
             onChange: function (state) {
                 oneClickValid = state.isValid;
                 if (state.isValid) {
-                    $('#adyenEncryptedSecurityCode').val(state.data.encryptedSecurityCode);
+                    $('#adyenEncryptedSecurityCode').val(state.data.paymentMethod.encryptedSecurityCode);
                 }
             } // Gets triggered whenever a user changes input
         }).mount(container);
     });
 };
 
-function getConfigurationSecureFields() {
+function getConfigurationComponents() {
     $.ajax({
-        url: 'Adyen-GetConfigSecuredFields',
+        url: 'Adyen-GetConfigurationComponents',
         type: 'get',
         data: {protocol: window.location.protocol},
         success: function (data) {
@@ -101,6 +110,11 @@ function getConfigurationSecureFields() {
     });
 };
 
+function setBrowserData() {
+    var browserData = threeDS2utils.getBrowserInfo();
+    $('#browserInfo').val(JSON.stringify(browserData));
+};
+
 $('.payment-summary .edit-button').on('click', function (e) {
     jQuery.each(oneClickCard, function (i) {
         oneClickCard[i].unmount();
@@ -169,7 +183,7 @@ function addPaymentMethod(paymentMethod, imagePath, description) {
         idealComponent.mount(idealContainer);
     }
 
-    if (paymentMethod.type.indexOf("klarna") !== -1) {
+    if (paymentMethod.type.indexOf("klarna") !== -1 && paymentMethod.details) {
         var klarnaContainer = document.createElement("div");
         $(klarnaContainer).addClass('additionalFields').attr('id', 'component_' + paymentMethod.type).attr('style', 'display:none');
         klarnaComponent = checkout.create('klarna', {
@@ -333,6 +347,7 @@ $('button[value="submit-payment"]').on('click', function (e) {
                 document.getElementById('saved-payment-security-code-' + uuid).value = "000";
                 $('#cardType').val(selectedCardType)
                 $('#selectedCardID').val($('.selected-payment').data('uuid'));
+                setBrowserData();
                 return true;
             }
         }
@@ -362,7 +377,7 @@ function checkComponentDetails(selectedMethod) {
             $('#adyenIssuerName').val(idealComponent.componentRef.props.items.find(x => x.id == idealComponent.componentRef.state.data.issuer).name);
         }
         return idealComponent.componentRef.state.isValid;
-    } else if (selectedMethod.val().indexOf("klarna") > -1) {
+    } else if (selectedMethod.val().indexOf("klarna") > -1 && klarnaComponent) {
         if (klarnaComponent.componentRef.state.isValid) {
             setOpenInvoiceData(klarnaComponent);
             if ($('#ssnValue')) {
@@ -421,11 +436,12 @@ $('button[value="add-new-payment"]').on('click', function (e) {
 });
 
 function setPaymentData() {
-    $('#adyenEncryptedCardNumber').val(card.paymentData.encryptedCardNumber);
-    $('#adyenEncryptedExpiryMonth').val(card.paymentData.encryptedExpiryMonth);
-    $('#adyenEncryptedExpiryYear').val(card.paymentData.encryptedExpiryYear);
-    $('#adyenEncryptedSecurityCode').val(card.paymentData.encryptedSecurityCode);
-    $('#cardOwner').val(card.paymentData.holderName);
+    $('#adyenEncryptedCardNumber').val(card.state.data.encryptedCardNumber);
+    $('#adyenEncryptedExpiryMonth').val(card.state.data.encryptedExpiryMonth);
+    $('#adyenEncryptedExpiryYear').val(card.state.data.encryptedExpiryYear);
+    $('#adyenEncryptedSecurityCode').val(card.state.data.encryptedSecurityCode);
+    $('#cardOwner').val(card.state.data.holderName);
+    setBrowserData();
 }
 
 module.exports = {
diff --git a/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout/billing.js b/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout/billing.js
index 74d47fa99..0b10a099e 100644
--- a/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout/billing.js
+++ b/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout/billing.js
@@ -16,14 +16,10 @@ function updatePaymentInformation(order) {
                 + order.billing.payment.selectedPaymentInstruments[0].type
                 + '</span>';
 
-            if (order.billing.payment.selectedPaymentInstruments[0].maskedCreditCardNumber != null && order.billing.payment.selectedPaymentInstruments[0].expirationMonth != null) {
+            if (order.billing.payment.selectedPaymentInstruments[0].maskedCreditCardNumber != null) {
                 htmlToAppend += '<div>'
                     + order.billing.payment.selectedPaymentInstruments[0].maskedCreditCardNumber
-                    + '</div><div><span>'
-                    + order.resources.cardEnding + ' '
-                    + order.billing.payment.selectedPaymentInstruments[0].expirationMonth
-                    + '/' + order.billing.payment.selectedPaymentInstruments[0].expirationYear
-                    + '</span></div>';
+                    + '</div>';
             }
         } else if (order.billing.payment.selectedPaymentInstruments[0].paymentMethod == "Adyen") {
             htmlToAppend += '<div><span>'
diff --git a/cartridges/int_adyen_SFRA/cartridge/client/default/js/threeds2-js-utils.js b/cartridges/int_adyen_SFRA/cartridge/client/default/js/threeds2-js-utils.js
new file mode 100644
index 000000000..939262a6f
--- /dev/null
+++ b/cartridges/int_adyen_SFRA/cartridge/client/default/js/threeds2-js-utils.js
@@ -0,0 +1 @@
+!function(e,n){"object"===typeof exports&&"object"===typeof module?module.exports=n():"function"===typeof define&&define.amd?define([],n):"object"===typeof exports?exports.ThreedDS2Utils=n():e.ThreedDS2Utils=n()}(this,function(){return function(e){var n={};function t(r){if(n[r])return n[r].exports;var o=n[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,t),o.l=!0,o.exports}return t.m=e,t.c=n,t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{enumerable:!0,get:r})},t.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},t.t=function(e,n){if(1&n&&(e=t(e)),8&n)return e;if(4&n&&"object"===typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(t.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&n&&"string"!=typeof e)for(var o in e)t.d(r,o,function(n){return e[n]}.bind(null,o));return r},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},t.p="",t(t.s=0)}([function(e,n,t){"use strict";t.r(n);var r={container:void 0},o={"01":["250px","400px"],"02":["390px","400px"],"03":["500px","600px"],"04":["600px","400px"],"05":["100%","100%"]};function a(e){return o.hasOwnProperty(e)?e:"01"}var i={createIframe:function(e,n){var t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"0",o=arguments.length>3&&void 0!==arguments[3]?arguments[3]:"0",a=arguments.length>4?arguments[4]:void 0;if(!n||0===n.length)throw new Error("Name parameter missing for iframe");e instanceof HTMLElement?r.container=e:r.container=document.body;var i=document.createElement("iframe");i.classList.add(n+"Class"),i.width=t,i.height=o,i.name=n,i.setAttribute("frameborder","0"),i.setAttribute("border","0");var d=document.createTextNode("<p>Your browser does not support iframes.</p>");return i.appendChild(d),r.container.appendChild(i),function(e,n){e.attachEvent?e.attachEvent("onload",function(){n&&"function"===typeof n&&n(e.contentWindow)}):e.onload=function(){n&&"function"===typeof n&&n(e.contentWindow)}}(i,a),i},createForm:function(e,n,t,r,o){if(!e||!n||!t||!r||!o)throw new Error("Not all required parameters provided for form creation");if(0===e.length||0===n.length||0===t.length||0===r.length||0===o.length)throw new Error("Not all required parameters have suitable values");var a=document.createElement("form");a.style.display="none",a.name=e,a.action=n,a.method="POST",a.target=t;var i=document.createElement("input");return i.name=r,i.value=o,a.appendChild(i),a},getBrowserInfo:function(){var e=window&&window.screen?window.screen.width:"",n=window&&window.screen?window.screen.height:"",t=window&&window.screen?window.screen.colorDepth:"",r=window&&window.navigator?window.navigator.userAgent:"",o=!(!window||!window.navigator)&&navigator.javaEnabled(),a="";return window&&window.navigator&&(a=window.navigator.language?window.navigator.language:window.navigator.browserLanguage),{screenWidth:e,screenHeight:n,colorDepth:t,userAgent:r,timeZoneOffset:(new Date).getTimezoneOffset(),language:a,javaEnabled:o}},base64Url:{encode:function(e){var n=window.btoa(e).split("=")[0];return n=(n=n.replace("/+/g","-")).replace("///g","_")},decode:function(e){var n=e;switch((n=(n=n.replace("/-/g","+")).replace("/_/g","/")).length%4){case 0:break;case 2:n+="==";break;case 3:n+="=";break;default:window.console&&window.console.log&&window.console.log("### base64url::decodeBase64URL::  Illegal base64url string!")}try{return window.atob(n)}catch(e){throw new Error(e)}}},config:{challengeWindowSizes:o,validateChallengeWindowSize:a,getChallengeWindowSize:function(e){return o[a(e)]},THREEDS_METHOD_TIMEOUT:1e4,CHALLENGE_TIMEOUT:6e5}};n.default=i}]).default});
\ No newline at end of file
diff --git a/cartridges/int_adyen_SFRA/cartridge/client/default/scss/adyen-checkout-2.1.0.scss b/cartridges/int_adyen_SFRA/cartridge/client/default/scss/adyen-checkout-2.1.0.scss
deleted file mode 100644
index 5f7fb9024..000000000
--- a/cartridges/int_adyen_SFRA/cartridge/client/default/scss/adyen-checkout-2.1.0.scss
+++ /dev/null
@@ -1,987 +0,0 @@
-.adyen-checkout__spinner__wrapper {
-  align-items: center;
-  display: flex;
-  height: 100%;
-  justify-content: center
-}
-
-.adyen-checkout__spinner__wrapper--inline {
-  display: inline-block;
-  height: auto;
-  margin-right: 8px
-}
-
-.adyen-checkout__spinner {
-  -webkit-animation: rotateSpinner 2s infinite linear;
-  animation: rotateSpinner 2s infinite linear;
-  border: 2px solid #00a3ff;
-  border-radius: 50%;
-  border-top-color: transparent;
-  height: 43px;
-  width: 43px
-}
-
-.adyen-checkout__spinner--large {
-  height: 43px;
-  width: 43px
-}
-
-.adyen-checkout__spinner--small {
-  height: 16px;
-  width: 16px
-}
-
-.adyen-checkout__spinner--medium {
-  height: 28px;
-  width: 28px
-}
-
-@-webkit-keyframes rotateSpinner {
-  0% {
-    -webkit-transform: rotate(0deg);
-    transform: rotate(0deg)
-  }
-  to {
-    -webkit-transform: rotate(1turn);
-    transform: rotate(1turn)
-  }
-}
-
-@keyframes rotateSpinner {
-  0% {
-    -webkit-transform: rotate(0deg);
-    transform: rotate(0deg)
-  }
-  to {
-    -webkit-transform: rotate(1turn);
-    transform: rotate(1turn)
-  }
-}
-
-.adyen-checkout__pay-button {
-  background: #001b2b;
-  border: 0;
-  border-radius: 3px;
-  box-shadow: 0 3px 4px rgba(0, 15, 45, .2);
-  color: #fff;
-  cursor: pointer;
-  font-size: 1em;
-  font-weight: 700;
-  height: 48px;
-  padding: 15px;
-  transition: background .3s ease-out;
-  width: 100%
-}
-
-.adyen-checkout__pay-button:disabled {
-  -moz-user-select: all;
-  -ms-user-select: all;
-  -webkit-user-select: all;
-  background: #e6e9eb;
-  box-shadow: none;
-  cursor: not-allowed;
-  user-select: all
-}
-
-.adyen-checkout__pay-button--loading {
-  -moz-user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  background: #4c5f6b;
-  box-shadow: none;
-  outline: 0;
-  pointer-events: none;
-  user-select: none
-}
-
-.adyen-checkout__pay-button .adyen-checkout__spinner {
-  border-color: transparent #fff #fff;
-  border-width: 3px
-}
-
-.adyen-checkout__pay-button__content {
-  align-items: center;
-  display: flex;
-  justify-content: center
-}
-
-.adyen-checkout__payment-method {
-  background: #fff;
-  border: 1px solid #edf0f3;
-  cursor: pointer;
-  margin-top: -1px;
-  position: relative;
-  transition: opacity .3s ease-out;
-  width: 100%
-}
-
-.adyen-checkout__payment-method:focus {
-  outline: 0
-}
-
-.adyen-checkout__payment-method--selected + .adyen-checkout__payment-method, .adyen-checkout__payment-method:first-child {
-  border-top-left-radius: 3px;
-  border-top-right-radius: 3px;
-  margin-top: 0
-}
-
-.adyen-checkout__payment-method--next-selected {
-  border-bottom-left-radius: 3px;
-  border-bottom-right-radius: 3px
-}
-
-.adyen-checkout__payment-method--loading {
-  opacity: .2
-}
-
-.adyen-checkout__payment-method--selected.adyen-checkout__payment-method--loading {
-  opacity: .9
-}
-
-.adyen-checkout__payment-method--disabling {
-  opacity: .5
-}
-
-.adyen-checkout__payment-method__header {
-  align-items: center;
-  color: #00202e;
-  display: flex;
-  font-size: 16px;
-  font-weight: 400;
-  padding: 16px;
-  position: relative;
-  transition: background .1s ease-out;
-  width: 100%
-}
-
-.adyen-checkout__payment-method__surcharge {
-  color: #687282;
-  margin-left: 5px
-}
-
-.adyen-checkout__payment-method--selected {
-  background: #f7f8f9;
-  border: 1px solid #d4d9db;
-  border-radius: 3px;
-  cursor: default;
-  margin: 8px 0;
-  transition: margin .15s cubic-bezier(.4, 0, .2, 1) 0ms, opacity .3s ease-out
-}
-
-.adyen-checkout__payment-method--selected .adyen-checkout__payment-method__header {
-  font-weight: 500
-}
-
-.adyen-checkout__payment-method__details {
-  padding: 0 16px 16px
-}
-
-.adyen-checkout__payment-method__details__content {
-  padding: 6px 0 24px
-}
-
-.adyen-checkout__payment-method__image__wrapper {
-  height: 26px;
-  position: relative
-}
-
-.adyen-checkout__payment-method__image__wrapper:after {
-  border: 1px solid rgba(0, 27, 43, .17);
-  border-radius: 3px;
-  content: "";
-  height: 100%;
-  left: 0;
-  position: absolute;
-  top: 0;
-  width: 100%
-}
-
-.adyen-checkout__payment-method__image {
-  border-radius: 3px
-}
-
-.adyen-checkout__payment-method__disable_oneclick {
-  background-color: transparent;
-  border: none;
-  color: #687282;
-  cursor: pointer;
-  display: block;
-  font-size: 13px;
-  padding: 0;
-  position: absolute;
-  right: 70px;
-  text-decoration: underline
-}
-
-.adyen-checkout__payment-method__disable_oneclick:focus {
-  color: #00a3ff;
-  outline: 0
-}
-
-.adyen-checkout__payment-method__disable-confirmation {
-  align-items: center;
-  background: #e6e9eb;
-  color: #001b2b;
-  display: flex;
-  font-size: 15px;
-  justify-content: space-between;
-  margin-bottom: 10px;
-  padding: 8px 16px
-}
-
-.adyen-checkout__payment-method__disable-confirmation__buttons {
-  display: flex
-}
-
-.adyen-checkout__payment-method__disable-confirmation__button {
-  border: 1px solid transparent;
-  border-radius: 3px;
-  cursor: pointer;
-  font-size: 13px;
-  line-height: 15px;
-  margin: 0 0 0 8px;
-  padding: 8px
-}
-
-.adyen-checkout__payment-method__disable-confirmation__button--remove {
-  background: #d10244;
-  border-color: #d10244;
-  color: #fff
-}
-
-.adyen-checkout__payment-method__disable-confirmation__button--cancel {
-  background: transparent;
-  border-color: #001b2b;
-  color: #001b2b
-}
-
-.adyen-checkout__payment-method__radio {
-  background-color: #fff;
-  border: 1px solid #b9c4c9;
-  border-radius: 50%;
-  box-shadow: inset 0 1px 3px rgba(0, 27, 43, .15);
-  height: 18px;
-  position: absolute;
-  right: 20px;
-  transition: border-color .3s ease-out;
-  width: 18px
-}
-
-.adyen-checkout__payment-method__radio:after {
-  -webkit-transform: translateY(-50%) scale(0);
-  background-color: #fff;
-  border-radius: 50%;
-  box-shadow: 0 1px 1px rgba(0, 15, 45, .25);
-  content: "";
-  display: block;
-  height: 6px;
-  left: 0;
-  margin: 0 auto;
-  position: absolute;
-  right: 0;
-  top: 50%;
-  transform: translateY(-50%) scale(0);
-  transition: -webkit-transform .3s ease-out;
-  transition: transform .3s ease-out;
-  transition: transform .3s ease-out, -webkit-transform .3s ease-out;
-  width: 6px
-}
-
-.adyen-checkout__payment-method__radio:hover {
-  border-color: #00a3ff;
-  cursor: pointer
-}
-
-.adyen-checkout__payment-method__radio--selected {
-  background-color: #00a3ff;
-  border: 0 solid transparent;
-  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .26);
-  transition: all .3s ease-out
-}
-
-.adyen-checkout__payment-method__radio--selected:after {
-  -webkit-transform: translateY(-50%) scale(1);
-  transform: translateY(-50%) scale(1)
-}
-
-.adyen-checkout__field {
-  display: block;
-  margin-bottom: 16px
-}
-
-.adyen-checkout__field--error input {
-  border-color: #d81b4a;
-  color: #d81b4a
-}
-
-.adyen-checkout__field:last-child {
-  margin-bottom: 0
-}
-
-.adyen-checkout__helper-text, .adyen-checkout__label__text {
-  color: #001b2b;
-  display: block;
-  font-size: 13px;
-  font-weight: 400;
-  line-height: 13px;
-  padding-bottom: 8px
-}
-
-.adyen-checkout__helper-text {
-  color: #687282
-}
-
-.adyen-checkout__label__text {
-  transition: color .2s ease-out
-}
-
-.adyen-checkout__label--focused .adyen-checkout__label__text {
-  color: #07b
-}
-
-.adyen-checkout__error-text, .adyen-checkout__label__text--error {
-  align-items: center;
-  color: #d0021b;
-  display: flex;
-  font-size: 12px;
-  font-weight: 400;
-  margin-top: 4px
-}
-
-.adyen-checkout__icon svg {
-  fill: currentColor
-}
-
-.adyen-checkout__open-invoice .adyen-checkout__input--wrapper--socialSecurityNumber + .adyen-checkout__error-text {
-  max-width: 380px
-}
-
-.adyen-checkout__radio_group + .adyen-checkout-input__inline-validation {
-  display: none
-}
-
-.adyen-checkout__radio_group__input {
-  opacity: 0;
-  position: absolute
-}
-
-.adyen-checkout__radio_group__label {
-  display: block;
-  font-size: 13px;
-  font-weight: 400;
-  line-height: 16px;
-  margin-bottom: 8px;
-  padding-bottom: 0;
-  padding-left: 24px;
-  position: relative
-}
-
-.adyen-checkout__radio_group__label:before {
-  background-color: #fff;
-  border: 1px solid #b9c4c9;
-  border-radius: 50%;
-  content: "";
-  height: 16px;
-  left: 0;
-  position: absolute;
-  top: 0;
-  transition: border-color .3s ease-out;
-  width: 16px
-}
-
-.adyen-checkout__radio_group__label:after {
-  -webkit-transform: scale(0);
-  background-color: #fff;
-  border-radius: 50%;
-  box-shadow: 0 1px 1px rgba(0, 15, 45, .25);
-  content: "";
-  display: block;
-  height: 6px;
-  left: 5px;
-  margin: 0 auto;
-  position: absolute;
-  top: 5px;
-  transform: scale(0);
-  transition: -webkit-transform .3s ease-out;
-  transition: transform .3s ease-out;
-  transition: transform .3s ease-out, -webkit-transform .3s ease-out;
-  width: 6px
-}
-
-.adyen-checkout__radio_group__label:hover {
-  border-color: #00a3ff;
-  cursor: pointer
-}
-
-.adyen-checkout__radio_group__input:checked + .adyen-checkout__radio_group__label:before, .adyen-checkout__radio_group__label--selected {
-  background-color: #00a3ff;
-  border: 0 solid transparent;
-  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .26);
-  transition: all .3s ease-out
-}
-
-.adyen-checkout__radio_group__input:checked + .adyen-checkout__radio_group__label:after {
-  -webkit-transform: scale(1);
-  transform: scale(1)
-}
-
-.adyen-checkout__radio_group__label.adyen-checkout__radio_group__label--invalid:before {
-  border: 1px solid #d10244
-}
-
-.adyen-checkout__checkbox {
-  display: block
-}
-
-.adyen-checkout__checkbox > input[type=checkbox] {
-  opacity: 0;
-  pointer-events: none;
-  position: absolute
-}
-
-.adyen-checkout__checkbox__label {
-  -moz-user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  color: #001b2b;
-  cursor: pointer;
-  display: inline-block;
-  font-size: 13px;
-  font-weight: 400;
-  line-height: 16px;
-  padding-left: 24px;
-  position: relative;
-  user-select: none
-}
-
-.adyen-checkout__checkbox__input + span:before {
-  -webkit-transform: rotate(37deg);
-  -webkit-transform-origin: 100% 100%;
-  border-color: transparent #fff #fff transparent;
-  border-radius: 0 2px 1px 2px;
-  border-style: solid;
-  border-width: 1px 2px 2px 1px;
-  content: "";
-  height: 11px;
-  left: 1px;
-  opacity: 0;
-  position: absolute;
-  top: 2px;
-  transform: rotate(37deg);
-  transform-origin: 100% 100%;
-  transition: opacity .2s ease-out;
-  width: 6px;
-  z-index: 1
-}
-
-.adyen-checkout__checkbox__input:checked + .adyen-checkout__checkbox__label:before {
-  opacity: 1
-}
-
-.adyen-checkout__checkbox__input + .adyen-checkout__checkbox__label:after {
-  background-color: #fff;
-  border: 1px solid #b9c4c9;
-  border-radius: 3px;
-  content: "";
-  height: 16px;
-  left: 0;
-  position: absolute;
-  top: 0;
-  transition: background .15s ease-out, border .05s ease-out, box-shadow .1s ease-out;
-  width: 16px;
-  z-index: 0
-}
-
-.adyen-checkout__checkbox__input:checked + .adyen-checkout__checkbox__label:after {
-  background-color: #00a3ff;
-  border: 1px solid #00a3ff
-}
-
-.adyen-checkout__checkbox__input:focus + span:after {
-  border: 1px solid #00a3ff;
-  box-shadow: 0 0 0 2px #91d7ff
-}
-
-.adyen-checkout__checkbox__input.adyen-checkout__checkbox__input--invalid + .adyen-checkout__checkbox__label:after {
-  border: 1px solid #d10244
-}
-
-.adyen-checkout__dropdown {
-  font-size: 16px;
-  max-width: 100%;
-  width: 200px
-}
-
-.adyen-checkout__dropdown--small {
-  width: 130px
-}
-
-.adyen-checkout__dropdown--large {
-  width: 300px
-}
-
-.adyen-checkout__dropdown__button {
-  background: #fff;
-  border: 1px solid #b9c4c9;
-  border-radius: 3px;
-  font-size: 16px;
-  height: 40px;
-  line-height: 20px;
-  outline: 0;
-  padding: 9px 20px 9px 8px;
-  transition: border .2s ease-out, box-shadow .2s ease-out;
-  width: 100%
-}
-
-.adyen-checkout__dropdown__button__icon {
-  margin-right: 8px;
-  max-height: 20px;
-  max-width: 32px
-}
-
-.adyen-checkout__dropdown__button--active, .adyen-checkout__dropdown__button:active, .adyen-checkout__dropdown__button:focus {
-  border-color: #00a3ff;
-  box-shadow: 0 0 0 2px #91d7ff
-}
-
-.adyen-checkout__dropdown__button--readonly, .adyen-checkout__dropdown__button--readonly.adyen-checkout__dropdown__button--active {
-  background: #e6e9eb;
-  color: #001b2b;
-  cursor: not-allowed
-}
-
-.adyen-checkout__dropdown__button--invalid {
-  border-color: #d10244
-}
-
-.adyen-checkout__dropdown__button__text {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap
-}
-
-.adyen-checkout__dropdown__list {
-  border-radius: 3px;
-  box-shadow: 0 2px 7px rgba(0, 15, 45, .3);
-  margin-top: 2px;
-  z-index: 2
-}
-
-.adyen-checkout__dropdown__list.adyen-checkout__dropdown__list--active {
-  -webkit-animation: expand .1s ease-out;
-  animation: expand .1s ease-out
-}
-
-.adyen-checkout__dropdown__element {
-  -ms-hyphens: auto;
-  -webkit-hyphens: auto;
-  border: 1px solid transparent;
-  border-bottom-color: #e6e9eb;
-  cursor: pointer;
-  hyphens: auto;
-  line-height: 20px;
-  outline: 0;
-  padding: 8px;
-  transition: background .2s ease-out, border-color .2s ease-out;
-  word-break: break-word
-}
-
-.adyen-checkout__dropdown__element:last-child {
-  border-bottom: 0
-}
-
-.adyen-checkout__dropdown__element:active, .adyen-checkout__dropdown__element:focus, .adyen-checkout__dropdown__element:hover {
-  background: #f0f2f4
-}
-
-.adyen-checkout__dropdown__element:active, .adyen-checkout__dropdown__element:focus {
-  border-bottom-color: #00a3ff;
-  border-top-color: #00a3ff
-}
-
-.adyen-checkout__dropdown__element__icon {
-  margin-right: 8px;
-  max-height: 20px;
-  max-width: 32px
-}
-
-@-webkit-keyframes expand {
-  0% {
-    -webkit-transform: scaleY(0);
-    transform: scaleY(0)
-  }
-  to {
-    -webkit-transform: scaleX(1);
-    transform: scaleX(1)
-  }
-}
-
-@keyframes expand {
-  0% {
-    -webkit-transform: scaleY(0);
-    transform: scaleY(0)
-  }
-  to {
-    -webkit-transform: scaleX(1);
-    transform: scaleX(1)
-  }
-}
-
-.adyen-checkout__dropdown + .adyen-checkout-input__inline-validation {
-  right: 32px
-}
-
-.adyen-checkout__select-list {
-  margin: 0;
-  padding: 0
-}
-
-.adyen-checkout__select-list__item {
-  background: #fff;
-  border-top: 1px solid #b9c4c9;
-  cursor: pointer;
-  display: inline-block;
-  font-size: 16px;
-  line-height: 20px;
-  outline: 0;
-  padding: 9px;
-  width: 100%
-}
-
-.adyen-checkout__select-list__item:first-child {
-  border-top: 0
-}
-
-.adyen-checkout__select-list__item:active, .adyen-checkout__select-list__item:focus, .adyen-checkout__select-list__item:hover {
-  background: rgba(145, 215, 255, .5)
-}
-
-.adyen-checkout__select-list__item--selected {
-  background: rgba(145, 215, 255, .5);
-  font-weight: 700
-}
-
-.adyen-checkout__input {
-  background: #fff;
-  border: 1px solid #b9c4c9;
-  border-radius: 3px;
-  color: #001b2b;
-  display: block;
-  font-family: inherit;
-  font-size: 16px;
-  height: 40px;
-  outline: none;
-  padding: 5px 8px;
-  position: relative;
-  transition: border .2s ease-out, box-shadow .2s ease-out;
-  width: 200px
-}
-
-.adyen-checkout__input:required {
-  box-shadow: none
-}
-
-.adyen-checkout__input--wrapper {
-  display: inline-block;
-  position: relative
-}
-
-.adyen-checkout__input--wrapper--block {
-  display: block
-}
-
-.adyen-checkout-input__inline-validation {
-  -webkit-transform: translateY(-50%);
-  height: 16px;
-  position: absolute;
-  right: 14px;
-  top: 50%;
-  transform: translateY(-50%);
-  width: 16px
-}
-
-.adyen-checkout-input__inline-validation--valid {
-  color: #039450
-}
-
-.adyen-checkout-input__inline-validation--invalid {
-  color: #d10244
-}
-
-.adyen-checkout__input.adyen-checkout__input--small {
-  width: 130px
-}
-
-.adyen-checkout__input.adyen-checkout__input--large {
-  width: 300px
-}
-
-.adyen-checkout__input.adyen-checkout__input--invalid {
-  border-color: #d10244
-}
-
-.adyen-checkout__input.adyen-checkout__input--valid {
-  border-bottom-color: #04ba65
-}
-
-.adyen-checkout__input--error {
-  border-color: #d0021b
-}
-
-.adyen-checkout__input::-webkit-input-placeholder {
-  color: #90a2bd;
-  font-weight: 200
-}
-
-.adyen-checkout__input::-ms-input-placeholder {
-  color: #90a2bd;
-  font-weight: 200
-}
-
-.adyen-checkout__input::placeholder {
-  color: #90a2bd;
-  font-weight: 200
-}
-
-.adyen-checkout__input--active, .adyen-checkout__input:active, .adyen-checkout__input:focus {
-  border: 1px solid #00a3ff;
-  box-shadow: 0 0 0 2px #91d7ff
-}
-
-.adyen-checkout__input[readonly] {
-  background-color: #e6e9eb;
-  border-color: transparent;
-  color: #687282;
-  cursor: default
-}
-
-.adyen-checkout__fieldset {
-  color: #687282;
-  display: block;
-  padding-bottom: 30px;
-  width: 100%
-}
-
-.adyen-checkout__fieldset__title {
-  color: #687282;
-  display: block;
-  font-size: 11px;
-  font-weight: 700;
-  letter-spacing: 1px;
-  margin: 0;
-  padding: 0 0 20px;
-  text-transform: uppercase
-}
-
-.adyen-checkout__fieldset--readonly {
-  color: #001b2b;
-  font-size: 13px;
-  line-height: 19px;
-  margin: 0
-}
-
-.adyen-checkout__open-invoice .adyen-checkout__checkbox--consent-checkbox {
-  max-width: 540px
-}
-
-.adyen-checkout__open-invoice .adyen-checkout__checkbox + .adyen-checkout__open-invoice .adyen-checkout__fieldset {
-  padding-top: 30px
-}
-
-.adyen-checkout__open-invoice .adyen-checkout__checkbox {
-  margin: 0 0 20px
-}
-
-.adyen-checkout__applepay__button {
-  height: 40px;
-  width: 240px
-}
-
-.adyen-checkout__card-input__form {
-  transition: opacity .25s ease-out
-}
-
-.adyen-checkout__card__exp-cvc {
-  display: flex
-}
-
-.adyen-checkout__card__cardNumber {
-  max-width: 400px
-}
-
-.adyen-checkout__card__cardNumber__input {
-  padding: 5px 8px 5px 57px
-}
-
-.adyen-checkout__card__exp-date__input--oneclick {
-  font-weight: 400;
-  height: 40px;
-  line-height: 40px
-}
-
-.adyen-checkout__card__exp-cvc .adyen-checkout__field {
-  margin-bottom: 0;
-  margin-right: 24px
-}
-
-.adyen-checkout__card-input .adyen-checkout__store-details {
-  margin-top: 16px
-}
-
-.adyen-checkout__giropay__results {
-  background: #fff;
-  border: 1px solid #b9c4c9;
-  border-radius: 4px;
-  max-height: 140px;
-  min-height: 100px;
-  overflow-y: scroll;
-  width: 100%
-}
-
-.adyen-checkout__giropay__no-results {
-  color: #687282;
-  display: block;
-  font-size: 13px;
-  padding: 0 0 0 2px
-}
-
-.adyen-checkout__giropay__placeholder {
-  color: #90a2bd;
-  display: block;
-  font-weight: 200;
-  padding: 0 0 0 2px
-}
-
-.adyen-checkout__giropay__loading {
-  display: block;
-  min-height: 100px
-}
-
-.adyen-checkout__giropay__loading .adyen-checkout__spinner__wrapper {
-  display: inline-block;
-  vertical-align: middle
-}
-
-.adyen-checkout__giropay__loading-text {
-  color: #687282;
-  font-size: 13px;
-  line-height: 16px;
-  vertical-align: middle
-}
-
-.adyen-checkout__giropay__error {
-  color: #d0021b;
-  font-size: 13px
-}
-
-.adyen-checkout__phone-input {
-  display: flex
-}
-
-.adyen-checkout__phone-input__prefix {
-  margin-right: .5em
-}
-
-.adyen-checkout__phone-input .adyen-checkout__field {
-  margin-bottom: 0
-}
-
-.adyen-checkout__iban-input__number {
-  padding: 5px 36px 5px 8px;
-  text-transform: uppercase
-}
-
-.adyen-checkout__wechatpay {
-  background: #fff;
-  border: 1px solid #dde1e3;
-  border-radius: 3px;
-  min-height: 443px;
-  padding: 40px;
-  text-align: center
-}
-
-.adyen-checkout__wechatpay__brand-logo {
-  height: 20px;
-  width: 109px
-}
-
-.adyen-checkout__wechatpay__subtitle {
-  margin-top: 32px
-}
-
-.adyen-checkout__wechatpay__payment_amount, .adyen-checkout__wechatpay__subtitle {
-  color: #001b2b;
-  font-size: 16px;
-  line-height: 19px
-}
-
-.adyen-checkout__wechatpay__progress {
-  background: #d4d9db;
-  border-radius: 25px;
-  height: 4px;
-  margin: 32px auto 12px;
-  padding-right: 3%;
-  width: 152px
-}
-
-.adyen-checkout__wechatpay__progress > span {
-  background: #00a3ff;
-  border-radius: 25px;
-  display: block;
-  height: 100%
-}
-
-.adyen-checkout__wechatpay__countdown {
-  color: #687282;
-  font-size: 13px
-}
-
-.adyen-checkout__wechatpay .adyen-checkout__spinner__wrapper {
-  margin: 60px 0
-}
-
-.adyen-checkout__alert {
-  align-items: flex-start;
-  background-color: #00a3ff;
-  border-radius: 3px;
-  color: #fff;
-  display: flex;
-  justify-content: space-between;
-  line-height: 1;
-  margin: 0;
-  padding: 12px
-}
-
-.adyen-checkout__alert--error {
-  background-color: #d81b4a
-}
-
-.adyen-checkout__alert--success {
-  background-color: #0abf53
-}
-
-.adyen-checkout__alert--info {
-  background-color: #00a3ff
-}
-
-.adyen-checkout__sdk, .adyen-checkout__sdk *, .adyen-checkout__sdk * :before, .adyen-checkout__sdk :after {
-  box-sizing: border-box
-}
-
-.adyen-checkout__payment-methods-list {
-  border-radius: 3px
-}
-
-.adyen-checkout__payment-methods-list--loading {
-  -moz-user-select: none;
-  -ms-user-select: none;
-  -webkit-user-select: none;
-  pointer-events: none;
-  user-select: none
-}
-
-.adyen-checkout__link {
-  color: #687282;
-  font-size: 13px;
-  text-decoration: underline
-}
\ No newline at end of file
diff --git a/cartridges/int_adyen_SFRA/cartridge/client/default/scss/adyen-checkout-3.0.0.scss b/cartridges/int_adyen_SFRA/cartridge/client/default/scss/adyen-checkout-3.0.0.scss
new file mode 100644
index 000000000..59c30cf09
--- /dev/null
+++ b/cartridges/int_adyen_SFRA/cartridge/client/default/scss/adyen-checkout-3.0.0.scss
@@ -0,0 +1,25 @@
+.adyen-checkout__field{display:block;margin-bottom:16px}.adyen-checkout__field--error input{border-color:#d10244;color:#d10244}.adyen-checkout__field:last-child{margin-bottom:0}.adyen-checkout__helper-text,.adyen-checkout__label__text{color:#00112c;display:block;font-size:.81em;font-weight:400;line-height:13px;padding-bottom:8px}.adyen-checkout__helper-text{color:#687282}.adyen-checkout__label__text{transition:color .2s ease-out}.adyen-checkout__label--focused .adyen-checkout__label__text{color:#06f}.adyen-checkout__error-text{align-items:center;color:#d10244;display:flex;font-size:.75em;font-weight:400;margin-top:4px}
+.adyen-checkout__spinner__wrapper{align-items:center;display:flex;height:100%;justify-content:center}.adyen-checkout__spinner__wrapper--inline{display:inline-block;height:auto;margin-right:8px}.adyen-checkout__spinner{-webkit-animation:rotateSpinner 2s infinite linear;animation:rotateSpinner 2s infinite linear;border:2px solid #06f;border-radius:50%;border-top-color:transparent;height:43px;width:43px}.adyen-checkout__spinner--large{height:43px;width:43px}.adyen-checkout__spinner--small{height:16px;width:16px}.adyen-checkout__spinner--medium{height:28px;width:28px}@-webkit-keyframes rotateSpinner{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes rotateSpinner{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}
+.adyen-checkout__icon svg{fill:currentColor}
+.adyen-checkout__open-invoice .adyen-checkout__input-wrapper--socialSecurityNumber+.adyen-checkout__error-text{max-width:380px}
+.adyen-checkout__radio_group+.adyen-checkout-input__inline-validation{display:none}.adyen-checkout__radio_group__input{opacity:0;position:absolute}.adyen-checkout__radio_group__label{display:block;font-size:.81em;font-weight:400;line-height:16px;margin-bottom:8px;padding-bottom:0;padding-left:24px;position:relative}.adyen-checkout__radio_group__label:before{background-color:#fff;border:1px solid #b9c4c9;border-radius:50%;content:"";height:16px;left:0;position:absolute;top:0;transition:border-color .3s ease-out;width:16px}.adyen-checkout__radio_group__label:after{-webkit-transform:scale(0);background-color:#fff;border-radius:50%;box-shadow:0 1px 1px rgba(0,15,45,.25);content:"";display:block;height:6px;left:5px;margin:0 auto;position:absolute;top:5px;transform:scale(0);transition:-webkit-transform .3s ease-out;transition:transform .3s ease-out;transition:transform .3s ease-out,-webkit-transform .3s ease-out;width:6px}.adyen-checkout__radio_group__label:hover{border-color:#06f;cursor:pointer}.adyen-checkout__radio_group__input:checked+.adyen-checkout__radio_group__label:before,.adyen-checkout__radio_group__label--selected{background-color:#06f;border:0;box-shadow:inset 0 1px 2px rgba(0,0,0,.26);transition:all .3s ease-out}.adyen-checkout__radio_group__input:checked+.adyen-checkout__radio_group__label:after{-webkit-transform:scale(1);transform:scale(1)}.adyen-checkout__radio_group__label.adyen-checkout__radio_group__label--invalid:before{border:1px solid #d10244}
+.adyen-checkout__checkbox{display:block}.adyen-checkout__checkbox__input{opacity:0;pointer-events:none;position:absolute}.adyen-checkout__checkbox__label{-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;color:#00112c;cursor:pointer;display:inline-block;font-size:.81em;font-weight:400;line-height:16px;padding-left:24px;position:relative;user-select:none}.adyen-checkout__checkbox__input+span:before{-webkit-transform:rotate(37deg);-webkit-transform-origin:100% 100%;border-color:transparent #fff #fff transparent;border-radius:0 2px 1px 2px;border-style:solid;border-width:1px 2px 2px 1px;content:"";height:11px;left:1px;opacity:0;position:absolute;top:2px;transform:rotate(37deg);transform-origin:100% 100%;transition:opacity .2s ease-out;width:6px;z-index:1}.adyen-checkout__checkbox__input:checked+.adyen-checkout__checkbox__label:before{opacity:1}.adyen-checkout__checkbox__input+.adyen-checkout__checkbox__label:after{background-color:#fff;border:1px solid #b9c4c9;border-radius:3px;content:"";height:16px;left:0;position:absolute;top:0;transition:background .15s ease-out,border .05s ease-out,box-shadow .1s ease-out;width:16px;z-index:0}.adyen-checkout__checkbox__input--invalid+.adyen-checkout__checkbox__label:after{border:1px solid #d10244}.adyen-checkout__checkbox__input:checked+.adyen-checkout__checkbox__label:after{background-color:#06f;border:1px solid #06f}.adyen-checkout__checkbox__input:focus+span:after{border:1px solid #06f;box-shadow:0 0 0 2px #99c2ff}
+.adyen-checkout__dropdown{font-size:1em;max-width:100%;width:200px}.adyen-checkout__dropdown--small{width:130px}.adyen-checkout__dropdown--large{width:300px}.adyen-checkout__dropdown__button{background:#fff;border:1px solid #b9c4c9;border-radius:6px;font-size:1em;height:40px;line-height:20px;outline:0;padding:9px 20px 9px 8px;transition:border .2s ease-out,box-shadow .2s ease-out;width:100%}.adyen-checkout__dropdown__button__icon{margin-right:8px;max-height:26px;max-width:40px}.adyen-checkout__dropdown__button--active,.adyen-checkout__dropdown__button:active,.adyen-checkout__dropdown__button:focus{border-color:#06f;box-shadow:0 0 0 2px #99c2ff}.adyen-checkout__dropdown__button--readonly,.adyen-checkout__dropdown__button--readonly.adyen-checkout__dropdown__button--active{background:#e6e9eb;color:#00112c;cursor:not-allowed}.adyen-checkout__dropdown__button--invalid{border-color:#d10244}.adyen-checkout__dropdown__button__text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.adyen-checkout__dropdown__list{border-radius:6px;box-shadow:0 2px 7px rgba(0,15,45,.3);margin-top:2px;max-height:360px;z-index:2}.adyen-checkout__dropdown__element{-ms-hyphens:auto;-webkit-hyphens:auto;border:1px solid transparent;border-bottom-color:#e6e9eb;cursor:pointer;font-size:.81em;hyphens:auto;line-height:20px;outline:0;padding:8px;transition:background .2s ease-out,border-color .2s ease-out;word-break:break-word}.adyen-checkout__dropdown__element:last-child{border-bottom:0}.adyen-checkout__dropdown__element:active,.adyen-checkout__dropdown__element:focus,.adyen-checkout__dropdown__element:hover{background:rgba(230,233,235,.6)}.adyen-checkout__dropdown__element:active,.adyen-checkout__dropdown__element:focus{border-bottom-color:#06f;border-top-color:#06f}.adyen-checkout__dropdown__element.adyen-checkout__dropdown__element--active{background:rgba(0,102,255,.1)}.adyen-checkout__dropdown__element.adyen-checkout__dropdown__element--active:active,.adyen-checkout__dropdown__element.adyen-checkout__dropdown__element--active:focus,.adyen-checkout__dropdown__element.adyen-checkout__dropdown__element--active:hover{background:rgba(0,102,255,.15)}.adyen-checkout__dropdown__element__icon{border-radius:3px;margin-right:8px;max-height:26px;max-width:40px}.adyen-checkout__dropdown+.adyen-checkout-input__inline-validation{right:32px}
+.adyen-checkout__select-list{margin:0;padding:0}.adyen-checkout__select-list__item{background:#fff;border:1px solid transparent;border-bottom-color:#e6e9eb;cursor:pointer;display:inline-block;font-size:1em;line-height:20px;outline:0;padding:9px;width:100%}.adyen-checkout__select-list__item:first-child{border-top:0}.adyen-checkout__select-list__item:active,.adyen-checkout__select-list__item:focus,.adyen-checkout__select-list__item:hover{background:rgba(230,233,235,.6)}.adyen-checkout__select-list__item--selected{background:rgba(0,102,255,.1);font-weight:500}.adyen-checkout__select-list__item--selected:active,.adyen-checkout__select-list__item--selected:focus,.adyen-checkout__select-list__item--selected:hover{background:rgba(0,102,255,.15)}
+.adyen-checkout__input{background:#fff;border:1px solid #b9c4c9;border-radius:6px;color:#00112c;display:block;font-family:inherit;font-size:1em;height:40px;outline:none;padding:5px 8px;position:relative;transition:border .2s ease-out,box-shadow .2s ease-out;width:200px}.adyen-checkout__input:required{box-shadow:none}.adyen-checkout__input-wrapper{display:inline-block;position:relative}.adyen-checkout__input-wrapper--block{display:block}.adyen-checkout-input__inline-validation{-webkit-transform:translateY(-50%);height:16px;position:absolute;right:14px;top:50%;transform:translateY(-50%);width:16px}.adyen-checkout-input__inline-validation--valid{color:#0abf53}.adyen-checkout-input__inline-validation--invalid{color:#d10244}.adyen-checkout__input--small{width:134px}.adyen-checkout__input--large{width:300px}.adyen-checkout__input--invalid{border-color:#d10244}.adyen-checkout__input--valid{border-bottom-color:#0abf53}.adyen-checkout__input--error{border-color:#d10244}.adyen-checkout__input::-webkit-input-placeholder{color:#b9c4c9;font-weight:200}.adyen-checkout__input:-ms-input-placeholder{color:#b9c4c9;font-weight:200}.adyen-checkout__input::-ms-input-placeholder{color:#b9c4c9;font-weight:200}.adyen-checkout__input::placeholder{color:#b9c4c9;font-weight:200}.adyen-checkout__input--focus,.adyen-checkout__input:active,.adyen-checkout__input:focus{border:1px solid #06f;box-shadow:0 0 0 2px #99c2ff}.adyen-checkout__input[readonly]{background-color:#e6e9eb;border-color:transparent;color:#687282;cursor:default}
+.adyen-checkout__fieldset{color:#687282;display:block;padding-bottom:30px;width:100%}.adyen-checkout__fieldset__title{color:#687282;display:block;font-size:.68em;font-weight:700;letter-spacing:1px;margin:0;padding:0 0 20px;text-transform:uppercase}
+.adyen-checkout__fieldset--readonly{color:#00112c;font-size:.81em;line-height:19px;margin:0}
+.adyen-checkout__open-invoice .adyen-checkout__checkbox--consent-checkbox{max-width:540px}
+.adyen-checkout__open-invoice .adyen-checkout__checkbox{margin:0 0 20px}.adyen-checkout__link--more-information{font-size:.81em}
+.adyen-checkout__applepay__button{height:40px;width:240px}
+.adyen-checkout__card-input__form{transition:opacity .25s ease-out}.adyen-checkout__card__exp-cvc{display:flex}.adyen-checkout__card__cardNumber{max-width:400px}.adyen-checkout__card__cardNumber__input{padding:5px 8px 5px 57px}.adyen-checkout__card__exp-date__input--oneclick{font-weight:400;height:40px;line-height:40px}.adyen-checkout__card__exp-cvc .adyen-checkout__field{margin-bottom:0;margin-right:32px}.adyen-checkout__card-input .adyen-checkout__store-details{margin-top:16px}
+.adyen-checkout__giropay__results{background:#fff;border:1px solid #b9c4c9;border-radius:6px;max-height:140px;min-height:100px;min-width:300px;overflow-y:scroll;width:100%}.adyen-checkout__giropay__no-results{color:#687282;display:block;font-size:.81em;padding:0 0 0 2px}.adyen-checkout__giropay__placeholder{color:#b9c4c9;display:block;font-weight:200;padding:0 0 0 2px}.adyen-checkout__giropay__loading{display:block;min-height:100px}.adyen-checkout__giropay__loading .adyen-checkout__spinner__wrapper{display:inline-block;vertical-align:middle}.adyen-checkout__giropay__loading-text{color:#687282;font-size:.81em;line-height:16px;vertical-align:middle}.adyen-checkout__giropay__error{color:#d10244;font-size:.81em}
+.adyen-checkout__button{background:#00112c;border:0;border-radius:6px;box-shadow:0 3px 4px rgba(0,15,45,.2);color:#fff;cursor:pointer;font-size:1em;font-weight:700;height:48px;margin:0;padding:15px;transition:background .3s ease-out;width:100%}.adyen-checkout__button:disabled{-moz-user-select:all;-ms-user-select:all;-webkit-user-select:all;background:#e6e9eb;box-shadow:none;cursor:not-allowed;user-select:all}.adyen-checkout__button--loading{-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;background:#687282;box-shadow:none;outline:0;pointer-events:none;user-select:none}.adyen-checkout__button .adyen-checkout__spinner{border-color:transparent #fff #fff;border-width:3px}.adyen-checkout__button__content{align-items:center;display:flex;justify-content:center}
+.adyen-checkout__phone-input{display:flex}.adyen-checkout__phone-input__prefix{margin-bottom:0;margin-right:.5em}.adyen-checkout__input--phone-number{margin-bottom:0}
+.adyen-checkout__iban-input__number{padding:5px 36px 5px 8px;text-transform:uppercase}
+.adyen-checkout__threeds2__challenge,.adyen-checkout__threeds2__challenge-container{background-color:transparent;box-sizing:border-box;display:block;overflow:auto;width:100%}.adyen-checkout__threeds2__challenge-container--01{height:400px;width:250px}.adyen-checkout__threeds2__challenge-container--02{height:400px;width:390px}.adyen-checkout__threeds2__challenge-container--03{height:600px;width:500px}.adyen-checkout__threeds2__challenge-container--04{height:400px;width:600px}.adyen-checkout__threeds2_challenge-container--05{height:100%;width:100%}.adyen-checkout__threeds2__challenge.adyen-checkout__threeds2__challenge--05{overflow:hidden;padding-top:56.25%;position:relative}.adyen-checkout__threeds2__challenge.adyen-checkout__threeds2__challenge--05 .adyen-checkout__iframe--threeDSIframe{border:0;height:100%;left:0;position:absolute;top:0;width:100%}
+.adyen-checkout__qr-loader{background:#fff;border:1px solid #d4d9db;border-radius:6px;padding:40px;text-align:center}.adyen-checkout__qr-loader--app{border:0;border-radius:0;padding:0}.adyen-checkout__qr-loader__brand-logo{max-height:50px;width:110px}.adyen-checkout__qr-loader__subtitle{margin-top:32px}.adyen-checkout__qr-loader__payment_amount,.adyen-checkout__qr-loader__subtitle{color:#00112c;font-size:1em;line-height:19px}.adyen-checkout__qr-loader__payment_amount{font-weight:700}.adyen-checkout__qr-loader__progress{background:#d4d9db;border-radius:25px;height:4px;margin:32px auto 12px;padding-right:3%;width:152px}.adyen-checkout__qr-loader__percentage{background:#06f;border-radius:25px;display:block;height:100%}.adyen-checkout__qr-loader__countdown{color:#687282;font-size:.81em}.adyen-checkout__qr-loader>.adyen-checkout__spinner__wrapper{margin:60px 0}.adyen-checkout__qr-loader__separator__label{background:#fff;border-radius:100%;color:#687282;display:inline-block;height:34px;line-height:34px;position:relative;width:34px;z-index:1}.adyen-checkout__qr-loader__separator__line{-webkit-transform:translateY(-17px);border-top:1px solid #d4d9db;display:block;transform:translateY(-17px)}.adyen-checkout__button.adyen-checkout__button--qr-loader{display:block;text-decoration:none}
+.adyen-checkout__voucher-result{background:#fff;border:1px solid #d4d9db;border-radius:6px;box-sizing:border-box;padding:20px 16px 56px;text-align:center}.adyen-checkout__voucher-result__image{align-items:center;display:flex;justify-content:center;margin-bottom:16px;width:100%}.adyen-checkout__voucher-result__image__wrapper{display:inline-block;padding:8px;width:120px}.adyen-checkout__voucher-result__image__wrapper:nth-child(2){border-left:1px solid #d4d9db}.adyen-checkout__voucher-result__image__brand,.adyen-checkout__voucher-result__image__issuer{height:34px}.adyen-checkout__voucher-result__image__brand{height:60px}.adyen-checkout__voucher-result__introduction{color:#00112c;font-size:.81em;line-height:19px;margin:0 auto;max-width:400px;text-align:center}.adyen-checkout__voucher-result__amount{color:#00112c;font-size:1em;font-weight:700;margin:24px auto 0;text-align:center}.adyen-checkout__voucher-result__surcharge{color:#687282;display:block;font-size:.81em;font-weight:400;line-height:19px;text-align:center}.adyen-checkout__voucher-result__code__label{-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;display:block;font-weight:400;left:0;margin:0 auto;position:absolute;right:0;top:-14px;user-select:none;width:auto}.adyen-checkout__voucher-result__code__label__text{background:#fff;color:#00112c;font-size:13px;padding:0 8px}.adyen-checkout__voucher-result__code{-moz-user-select:all;-ms-user-select:all;-webkit-user-select:all;border:1px solid #e6e9eb;border-radius:6px;color:#00112c;display:inline-block;font-size:1.5em;font-weight:700;letter-spacing:1px;line-height:19px;margin:20px auto 16px;max-width:100%;min-width:200px;padding:28px 48px 24px;position:relative;text-align:center;user-select:all;width:300px}.adyen-checkout__voucher-result__details{list-style:none;margin:8px auto 0;max-width:300px;padding:0}.adyen-checkout__voucher-result__details__item{color:#00112c;display:flex;font-size:.81em;justify-content:space-between;margin-bottom:16px;word-break:break-word}.adyen-checkout__voucher-result__details__item:last-child{margin-bottom:0}.adyen-checkout__voucher-result__details__label{max-width:50%;text-align:left}.adyen-checkout__voucher-result__details__value{font-weight:700;max-width:50%;text-align:right}
+.adyen-checkout__payment-method{background:#fff;border:1px solid #d4d9db;cursor:pointer;margin-top:-1px;position:relative;transition:opacity .3s ease-out;width:100%}.adyen-checkout__payment-method:focus{outline:0}.adyen-checkout__payment-method--selected+.adyen-checkout__payment-method,.adyen-checkout__payment-method:first-child{border-top-left-radius:6px;border-top-right-radius:6px;margin-top:0}.adyen-checkout__payment-method--next-selected,.adyen-checkout__payment-method:last-child{border-bottom-left-radius:6px;border-bottom-right-radius:6px;margin-bottom:0}.adyen-checkout__payment-method--loading{opacity:.2}.adyen-checkout__payment-method--selected.adyen-checkout__payment-method--loading{opacity:.9}.adyen-checkout__payment-method--disabling{opacity:.5}.adyen-checkout__payment-method__header{align-items:center;color:#00112c;display:flex;font-size:1em;font-weight:400;padding:16px;position:relative;transition:background .1s ease-out;width:100%}.adyen-checkout__payment-method__surcharge{color:#687282;margin-left:5px}.adyen-checkout__payment-method--selected{background:#f7f8f9;border:1px solid #d4d9db;border-radius:6px;cursor:default;margin:8px 0;transition:margin .15s cubic-bezier(.4,0,.2,1) 0ms,opacity .3s ease-out}.adyen-checkout__payment-method__name--selected{font-weight:500}.adyen-checkout__payment-method__details{padding:0 16px}.adyen-checkout__payment-method__details__content{margin:6px 0 22px}.adyen-checkout__payment-method__image__wrapper{height:26px;position:relative}.adyen-checkout__payment-method__image__wrapper:after{border:1px solid rgba(0,27,43,.17);border-radius:3px;content:"";height:100%;left:0;position:absolute;top:0;width:100%}.adyen-checkout__payment-method__image{border-radius:3px}.adyen-checkout__payment-method__disable-confirmation{align-items:center;background:#e6e9eb;color:#00112c;display:flex;font-size:.94em;justify-content:space-between;margin-bottom:10px;padding:8px 16px}.adyen-checkout__payment-method__disable-confirmation__buttons{display:flex}.adyen-checkout__payment-method__disable-confirmation__button{border:1px solid transparent;border-radius:6px;cursor:pointer;font-size:.81em;line-height:15px;margin:0 0 0 8px;padding:8px}.adyen-checkout__payment-method__disable-confirmation__button--remove{background:#d10244;border-color:#d10244;color:#fff}.adyen-checkout__payment-method__disable-confirmation__button--cancel{background:transparent;border-color:#00112c;color:#00112c}.adyen-checkout__payment-method__radio{background-color:#fff;border:1px solid #b9c4c9;border-radius:50%;box-shadow:inset 0 1px 3px rgba(0,27,43,.15);height:18px;position:absolute;right:20px;transition:border-color .3s ease-out;width:18px}.adyen-checkout__payment-method__radio:after{-webkit-transform:translateY(-50%) scale(0);background-color:#fff;border-radius:50%;box-shadow:0 1px 1px rgba(0,15,45,.25);content:"";display:block;height:6px;left:0;margin:0 auto;position:absolute;right:0;top:50%;transform:translateY(-50%) scale(0);transition:-webkit-transform .3s ease-out;transition:transform .3s ease-out;transition:transform .3s ease-out,-webkit-transform .3s ease-out;width:6px}.adyen-checkout__payment-method__radio:hover{border-color:#06f;cursor:pointer}.adyen-checkout__payment-method__radio--selected{background-color:#06f;border:0;box-shadow:inset 0 1px 2px rgba(0,0,0,.26);transition:all .3s ease-out}.adyen-checkout__payment-method__radio--selected:after{-webkit-transform:translateY(-50%) scale(1);transform:translateY(-50%) scale(1)}.adyen-checkout__button--pay{margin-bottom:16px}
+.adyen-checkout__status{align-items:center;background-color:#fff;border:1px solid #d4d9db;border-radius:6px;color:#001b2b;display:flex;flex-direction:column;font-size:16px;height:350px;justify-content:center;margin:0;padding:32px;text-align:center}.adyen-checkout__status__icon{margin-bottom:24px}
+.adyen-checkout__dropin,.adyen-checkout__dropin *,.adyen-checkout__dropin :after,.adyen-checkout__dropin :before{box-sizing:border-box}.adyen-checkout__payment-methods-list--loading{-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;pointer-events:none;user-select:none}.adyen-checkout__link{color:#06f;text-decoration:none}.adyen-checkout__link:hover{text-decoration:underline}
\ No newline at end of file
diff --git a/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js b/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js
index 03799584f..78db05055 100644
--- a/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js
+++ b/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js
@@ -93,6 +93,103 @@ server.post('AuthorizeWithForm', server.middleware.https, function (req, res, ne
     return next();
 });
 
+server.get('Adyen3DS2', server.middleware.https, function (req, res, next) {
+    var resultCode = req.querystring.resultCode;
+    var token3ds2 = req.querystring.token3ds2;
+
+    res.render('/threeds2/adyen3ds2', {
+        resultCode: resultCode,
+        token3ds2: token3ds2
+    });
+    return next();
+});
+
+server.post('Authorize3DS2', server.middleware.https, function (req, res, next) {
+    var adyenCheckout = require('int_adyen_overlay/cartridge/scripts/adyenCheckout');
+    var paymentInstrument;
+    var order;
+
+    if (session.custom.orderNo && session.custom.paymentMethod) {
+        try {
+            order = OrderMgr.getOrder(session.custom.orderNo);
+            paymentInstrument = order.getPaymentInstruments(session.custom.paymentMethod)[0];
+        } catch (e) {
+            Logger.getLogger("Adyen").error("Unable to retrieve order data from session 3DS2.");
+            res.redirect(URLUtils.url('Checkout-Begin', 'stage', 'payment', 'paymentError', Resource.msg('error.payment.not.valid', 'checkout', null)));
+            return next();
+        }
+
+        var details = {};
+        if (req.form.resultCode == "IdentifyShopper" && req.form.fingerprintResult) {
+            details = {
+                "threeds2.fingerprint": req.form.fingerprintResult
+            }
+        } else if (req.form.resultCode == "ChallengeShopper" && req.form.challengeResult) {
+            details = {
+                "threeds2.challengeResult": req.form.challengeResult
+            }
+        }
+        else {
+            Logger.getLogger("Adyen").error("paymentDetails 3DS2 not available");
+            res.redirect(URLUtils.url('Checkout-Begin', 'stage', 'payment', 'paymentError', Resource.msg('error.payment.not.valid', 'checkout', null)));
+            return next();
+        }
+
+        var paymentDetailsRequest = {
+            "paymentData": paymentInstrument.custom.adyenPaymentData,
+            "details": details
+        };
+
+        var result = adyenCheckout.doPaymentDetailsCall(paymentDetailsRequest);
+        if ((result.error || result.resultCode != 'Authorised') && result.resultCode != 'ChallengeShopper') {
+            //Payment failed
+            Transaction.wrap(function () {
+                OrderMgr.failOrder(order);
+                paymentInstrument.custom.adyenPaymentData = null;
+            });
+            res.redirect(URLUtils.url('Checkout-Begin', 'stage', 'payment', 'paymentError', Resource.msg('error.payment.not.valid', 'checkout', null)));
+            return next();
+        } else if (result.resultCode == 'ChallengeShopper') {
+            //Redirect to ChallengeShopper
+            res.redirect(URLUtils.url('Adyen-Adyen3DS2', 'resultCode', result.resultCode, 'token3ds2', result.authentication['threeds2.challengeToken']));
+            return next();
+        }
+
+        //delete paymentData from requests
+        Transaction.wrap(function () {
+            paymentInstrument.custom.adyenPaymentData = null;
+        });
+
+        //custom fraudDetection
+        var fraudDetectionStatus = {status: 'success'};
+
+        // Places the order
+        var placeOrderResult = adyenHelpers.placeOrder(order, fraudDetectionStatus);
+        if (placeOrderResult.error) {
+            Transaction.wrap(function () {
+                OrderMgr.failOrder(order);
+            });
+            res.redirect(URLUtils.url('Checkout-Begin', 'stage', 'placeOrder', 'paymentError', Resource.msg('error.technical', 'checkout', null)));
+            return next();
+        }
+
+        Transaction.begin();
+        order.setPaymentStatus(dw.order.Order.PAYMENT_STATUS_PAID);
+        order.setExportStatus(dw.order.Order.EXPORT_STATUS_READY);
+        paymentInstrument.paymentTransaction.transactionID = result.pspReference;
+        Transaction.commit();
+        COHelpers.sendConfirmationEmail(order, req.locale.id);
+        clearForms();
+        res.redirect(URLUtils.url('Order-Confirm', 'ID', order.orderNo, 'token', order.orderToken).toString());
+        return next();
+    }
+
+    Logger.getLogger("Adyen").error("Session variables for 3DS2 do not exists");
+    res.redirect(URLUtils.url('Checkout-Begin', 'stage', 'payment', 'paymentError', Resource.msg('error.payment.not.valid', 'checkout', null)));
+    return next();
+});
+
+
 server.get('Redirect', server.middleware.https, function (req, res, next) {
     res.redirect(req.querystring.redirectUrl);
     return next();
@@ -113,7 +210,7 @@ server.get('ShowConfirmation', server.middleware.https, function (req, res, next
         paymentInstrument.custom.adyenPaymentData = null;
     });
     // Authorised: The payment authorisation was successfully completed.
-    if (result.resultCode == "Authorised") {
+    if (result.resultCode == "Authorised" || result.resultCode == 'Pending') {
         var OrderModel = require('*/cartridge/models/order');
         var Locale = require('dw/util/Locale');
         var currentLocale = Locale.getLocale(req.locale.id);
@@ -195,17 +292,20 @@ function isMethodTypeBlocked(methodType) {
 /**
  * Get OriginKey for Secured Fields
  */
-server.get('GetConfigSecuredFields', server.middleware.https, function (req, res, next) {
+server.get('GetConfigurationComponents', server.middleware.https, function (req, res, next) {
     var adyenGetOriginKey = require('*/cartridge/scripts/adyenGetOriginKey');
     var baseUrl = req.querystring.protocol + "//" + Site.getCurrent().getHttpsHostName();
     var originKey;
     var error = false;
     var errorMessage = "";
     var loadingContext = "";
+    var environment = "";
 
     try {
         originKey = adyenGetOriginKey.getOriginKey(baseUrl).originKeys;
         loadingContext = adyenHelper.getLoadingContext();
+        environment = adyenHelper.getAdyenMode().toLowerCase();
+
     } catch (err) {
         error = true;
         errorMessage = Resource.msg('load.component.error', 'creditCard', null);
@@ -214,7 +314,8 @@ server.get('GetConfigSecuredFields', server.middleware.https, function (req, res
         error: error,
         errorMessage: errorMessage,
         adyenOriginKey: originKey,
-        adyenLoadingContext: loadingContext
+        adyenLoadingContext: loadingContext,
+        adyenEnvironment: environment
     });
     return next();
 });
diff --git a/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js b/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js
index 81ab73fa1..d11219837 100644
--- a/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js
+++ b/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js
@@ -121,7 +121,14 @@ server.replace('PlaceOrder', server.middleware.https, function (req, res, next)
         return next();
     }
 
-    if (handlePaymentResult.redirectObject) {
+    if(handlePaymentResult.ThreeDS2) {
+        res.json({
+            error: false,
+            continueUrl: URLUtils.url('Adyen-Adyen3DS2', 'resultCode', handlePaymentResult.resultCode, 'token3ds2', handlePaymentResult.token3ds2).toString()
+        });
+        return next();
+    }
+    else if (handlePaymentResult.redirectObject) {
         //If authorized3d, then redirectObject from credit card, hence it is 3D Secure
         if (handlePaymentResult.authorized3d) {
             session.custom.MD = handlePaymentResult.redirectObject.data.MD;
diff --git a/cartridges/int_adyen_SFRA/cartridge/forms/default/creditCard.xml b/cartridges/int_adyen_SFRA/cartridge/forms/default/creditCard.xml
index 93d5c5f36..7a9b975d6 100644
--- a/cartridges/int_adyen_SFRA/cartridge/forms/default/creditCard.xml
+++ b/cartridges/int_adyen_SFRA/cartridge/forms/default/creditCard.xml
@@ -56,6 +56,9 @@
     <field formid="adyenEncryptedSecurityCode" label="adyenEncryptedSecurityCode" type="string" mandatory="false"
            binding="adyenEncryptedSecurityCode"/>
 
+    <field formid="browserInfo" label="browserInfo" type="string" mandatory="false"
+           binding="browserInfo"/>
+
     <!--  field  for  credit  card  recurring  payments  /  tokenization  -->
     <field formid="selectedCardID" mandatory="false" type="string"/>
 </form>
diff --git a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js
index 94dc52587..4f8b676b6 100644
--- a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js
+++ b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js
@@ -10,6 +10,7 @@ var PaymentInstrument = require('dw/order/PaymentInstrument');
 var Resource = require('dw/web/Resource');
 var Transaction = require('dw/system/Transaction');
 var AdyenHelper = require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper');
+var Logger = require('dw/system/Logger');
 
 function Handle(basket, paymentInformation) {
     var currentBasket = basket;
@@ -79,7 +80,23 @@ function Authorize(orderNumber, paymentInstrument, paymentProcessor) {
         };
     }
 
-    if (result.RedirectObject != '') {
+    if(result.ThreeDS2){
+        Transaction.commit();
+        Transaction.wrap(function () {
+            paymentInstrument.custom.adyenPaymentData = result.PaymentData;
+        });
+
+        session.custom.orderNo = order.orderNo;
+        session.custom.paymentMethod = paymentInstrument.paymentMethod;
+
+        return {
+            ThreeDS2: result.ThreeDS2,
+            resultCode: result.resultCode,
+            token3ds2: result.token3ds2,
+        }
+    }
+
+    else if (result.RedirectObject != '') {
         Transaction.commit();
         Transaction.wrap(function () {
             paymentInstrument.custom.adyenPaymentData = result.PaymentData;
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/account/payment/paymentForm.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/account/payment/paymentForm.isml
index b122fe287..2093d7f83 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/account/payment/paymentForm.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/account/payment/paymentForm.isml
@@ -1,8 +1,7 @@
 <isscript>
     var assets = require('*/cartridge/scripts/assets.js');
     assets.addCss('/css/adyenCss.css');
-    assets.addJs('/js/adyenSecureFields.js');
-    assets.addCss('/css/adyen-checkout-2.1.0.css');
+    assets.addCss('/css/adyen-checkout-3.0.0.css');
 </isscript>
 <iscontent type="text/html" encoding="off"/>
 <isset name="AdyenHelper" value="${require('*/cartridge/scripts/util/AdyenHelper')}" scope="pdict"/>
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/creditCardForm.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/creditCardForm.isml
index 50723fd0a..d8b22b715 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/creditCardForm.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/creditCardForm.isml
@@ -17,20 +17,8 @@
 <input type="hidden" class="form-control adyenEncryptedSecurityCode" id="adyenEncryptedSecurityCode"
        ${creditFields.adyenEncryptedSecurityCode.attributes}>
 <input type="hidden" class="form-control cardOwner" id="cardOwner" ${creditFields.cardOwner.attributes}>
+<input type="hidden" class="form-control browserInfo" id="browserInfo" ${creditFields.browserInfo.attributes}>
 
 <span id="errorLoadComponent"></span>
 <div id="card"></div>
 
-<div class="row">
-    <div class="col">
-        <isif condition="${pdict.customer.registeredUser}">
-            <div class="form-check save-credit-card">
-                <label class="form-check-label">
-                    <input type="checkbox" class="form-check-input" name="${creditFields.saveCardAdyen.htmlName}"
-                           value="true" checked>
-                    ${creditFields.saveCardAdyen.label}
-                </label>
-            </div>
-        </isif>
-    </div>
-</div>
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions.isml
index 49da2289e..811fc7ef7 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions.isml
@@ -1,7 +1,7 @@
 <isscript>
     var assets = require('*/cartridge/scripts/assets.js');
     assets.addCss('/css/adyenCss.css');
-    assets.addCss('/css/adyen-checkout-2.1.0.css');
+    assets.addCss('/css/adyen-checkout-3.0.0.css');
 </isscript>
 <iscontent type="text/html" encoding="off"/>
 <div class="form-nav billing-nav payment-information"
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/creditCardSummary.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/creditCardSummary.isml
index 225600dd8..32183d4ca 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/creditCardSummary.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/creditCardSummary.isml
@@ -2,12 +2,9 @@
     <span>${Resource.msg('msg.payment.type.credit', 'confirmation', null)}
     ${payment.type}</span>
 </div>
-<isif condition="${payment.expirationMonth && payment.expirationYear && payment.maskedCreditCardNumber}">
+<isif condition="${payment.maskedCreditCardNumber}">
     <div class="credit-card-number">
         ${payment.maskedCreditCardNumber}
     </div>
-    <div class="credit-card-expiration-date">
-        <span>${Resource.msg('msg.card.type.ending', 'confirmation', null)} ${payment.expirationMonth}/${payment.expirationYear}</span>
-    </div>
 </isif>
 
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/storedPaymentInstruments.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/storedPaymentInstruments.isml
index 46e63b884..2f011137c 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/storedPaymentInstruments.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/storedPaymentInstruments.isml
@@ -1,8 +1,9 @@
 <isscript>
     var assets = require('*/cartridge/scripts/assets.js');
-    assets.addCss('/css/adyen-checkout-2.1.0.css');
+    assets.addCss('/css/adyen-checkout-3.0.0.css');
 </isscript>
 <iscontent type="text/html" encoding="off"/>
+<isset name="AdyenHelper" value="${require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper')}" scope="PAGE"/>
 <isloop items="${pdict.customer.customerPaymentInstruments}" var="paymentInstrument" status="loopSate">
     <div class="row saved-payment-instrument ${loopSate.first ? 'selected-payment' : ''}"
          data-uuid="${paymentInstrument.UUID}">
@@ -27,7 +28,8 @@
         </div>
         <div class="saved-payment-information col-6 col-md-9">
             <div class="saved-credit-card-type">
-                <span id="cardType-${paymentInstrument.UUID}">
+                <input type="hidden" id="cardType-${paymentInstrument.UUID}" value="${AdyenHelper.getAdyenCardType(paymentInstrument.creditCardType)}"/>
+                <span id="cardType">
                     ${paymentInstrument.creditCardType}
                 </span>
             </div>
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/redirectHPP.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/redirectHPP.isml
deleted file mode 100644
index 3ed8809d4..000000000
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/redirectHPP.isml
+++ /dev/null
@@ -1,76 +0,0 @@
-<!--- TEMPLATENAME: redirectHPP.isml --->
-<iscontent compact="true"/>
-
-<head>
-    <title>${Resource.msg('redirect.payment','common',null)}</title>
-    <meta http-equiv="Robots" content="noindex, follow"/>
-</head>
-<body>
-
-<isscript>
-    importPackage(dw.system);
-    var directoryLookup: Boolean = Site.getCurrent().getCustomPreferenceValue("Adyen_directoryLookup");
-    var Mode: String = Site.getCurrent().getCustomPreferenceValue("Adyen_Mode");
-    var Debug: String = Site.getCurrent().getCustomPreferenceValue("Adyen_Debug");
-    var paymentSelection: String = Site.getCurrent().getCustomPreferenceValue("Adyen_PaymentSelection");
-
-    var AdyenHelper = require ("int_adyen_overlay/cartridge/scripts/util/AdyenHelper");
-
-    var hppType;
-    switch (String(paymentSelection)) {
-    case "one":
-    hppType = 'pay';
-    break;
-    case "multi":
-    hppType = 'select';
-    break;
-    default:
-    hppType = 'pay';
-    }
-
-    var inputType: String = Debug ? 'text' : 'hidden';
-
-    var paymentMethod = pdict.ParamsMap.brandCode;
-
-    if (directoryLookup) {
-
-    if (AdyenHelper.isOpenInvoiceMethod(paymentMethod) || AdyenHelper.isMolpayMethod(paymentMethod)) {
-
-    var url: String = "https://test.adyen.com/hpp/skipDetails.shtml";
-    if (Mode == "LIVE") {
-    url = "https://live.adyen.com/hpp/skipDetails.shtml";
-    }
-    } else {
-    var url: String = "https://test.adyen.com/hpp/details.shtml";
-    if (Mode == "LIVE") {
-    url = "https://live.adyen.com/hpp/details.shtml";
-    }
-    }
-
-    } else {
-    var url: String = "https://test.adyen.com/hpp/" + hppType + ".shtml";
-    if (Mode == "LIVE") {
-    url = "https://live.adyen.com/hpp/" + hppType + ".shtml";
-    }
-    }
-</isscript>
-
-<!--- TEMPLATENAME: redirect_sha256.isml --->
-<form name="adyenForm" id="adyenForm" action="${url}" method="post">
-
-    <isloop items="${pdict.ParamsMap.entrySet()}" var="keyvalue">
-        <input type="${inputType}" name="${keyvalue.key}" value="${keyvalue.value}"/> </br>
-    </isloop>
-
-    <isif condition="${Debug}">
-        <input type="submit" value='pay' style='margin-left:200px'/>
-    </isif>
-</form>
-
-<isif condition="${!Debug}">
-    <script>document.forms[0].submit();</script>
-</isif>
-
-
-</body>
-</html>
diff --git a/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js b/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js
index 570ded272..937a0315f 100644
--- a/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js
+++ b/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js
@@ -15,7 +15,6 @@ var Transaction = require('dw/system/Transaction');
 var app = require('app_storefront_controllers/cartridge/scripts/app');
 var guard = require('app_storefront_controllers/cartridge/scripts/guard');
 var AdyenHelper = require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper');
-var Logger = require('dw/system/Logger')
 var OrderModel = app.getModel('Order');
 var Logger = require('dw/system/Logger');
 
@@ -330,10 +329,127 @@ function cancelOrRefund() {
     return {sucess: true};
 }
 
+
+function redirect3ds2() {
+	app.getView({
+    	resultCode : request.httpParameterMap.get("resultCode").stringValue,
+		token3ds2 : request.httpParameterMap.get("token3ds2").stringValue,
+        ContinueURL: URLUtils.https('Adyen-Authorize3DS2')
+    }).render('/threeds2/adyen3ds2');
+}
+
+/**
+ * Make second call to /payments/details with IdentifyShopper or ChallengeShopper token
+ * 
+ * @returns rendering template or error
+ */
+function authorize3ds2() {
+	Transaction.begin();
+	var adyenCheckout = require('int_adyen_overlay/cartridge/scripts/adyenCheckout');
+    var paymentInstrument;
+    var order;
+
+    if (session.custom.orderNo && session.custom.paymentMethod) {
+        try {
+            order = OrderMgr.getOrder(session.custom.orderNo);
+            paymentInstrument = order.getPaymentInstruments(session.custom.paymentMethod)[0];
+        } catch (e) {
+            Logger.getLogger("Adyen").error("Unable to retrieve order data from session 3DS2.");
+            Transaction.wrap(function () {
+                OrderMgr.failOrder(order);
+            });
+            app.getController('COSummary').Start({
+                PlaceOrderError: new Status(Status.ERROR, 'confirm.error.declined', '')
+            });
+            return {};
+        }
+
+        var details = {};
+        
+        if (request.httpParameterMap.get("resultCode").stringValue == "IdentifyShopper" && request.httpParameterMap.get("fingerprintResult").stringValue) {
+            details = {
+                "threeds2.fingerprint": request.httpParameterMap.get("fingerprintResult").stringValue
+            }
+        } else if (request.httpParameterMap.get("resultCode").stringValue == "ChallengeShopper" && request.httpParameterMap.get("challengeResult").stringValue) {
+            details = {
+                "threeds2.challengeResult": request.httpParameterMap.get("challengeResult").stringValue
+            }
+        }
+        else {
+            Logger.getLogger("Adyen").error("paymentDetails 3DS2 not available");
+            Transaction.wrap(function () {
+                OrderMgr.failOrder(order);
+            });
+            app.getController('COSummary').Start({
+                PlaceOrderError: new Status(Status.ERROR, 'confirm.error.declined', '')
+            });
+            return {};
+        }
+
+        var paymentDetailsRequest = {
+            "paymentData": paymentInstrument.custom.adyenPaymentData,
+            "details": details
+        };
+
+        var result = adyenCheckout.doPaymentDetailsCall(paymentDetailsRequest);
+        if ((result.error || result.resultCode != 'Authorised') && result.resultCode != 'ChallengeShopper') {
+            //Payment failed
+            Transaction.wrap(function () {
+                OrderMgr.failOrder(order);
+                paymentInstrument.custom.adyenPaymentData = null;
+            });
+            app.getController('COSummary').Start({
+                PlaceOrderError: new Status(Status.ERROR, 'confirm.error.declined', '')
+            });
+            return {};
+        } else if (result.resultCode == 'ChallengeShopper') {        	
+        	app.getView({
+            	ContinueURL: URLUtils.https('Adyen-Redirect3DS2', 'utm_nooverride', '1'),
+            	resultCode: result.resultCode,
+                token3ds2: result.authentication['threeds2.challengeToken']
+            }).render('adyenpaymentredirect');
+        	return {};
+        }
+
+        //delete paymentData from requests
+        Transaction.wrap(function () {
+            paymentInstrument.custom.adyenPaymentData = null;
+        });
+       
+        if ('pspReference' in result && !empty(result.pspReference)) {
+            paymentInstrument.paymentTransaction.transactionID = result.pspReference;
+            order.custom.Adyen_pspReference = result.pspReference;
+        }
+        if ('resultCode' in result && !empty(result.resultCode)) {
+            paymentInstrument.paymentTransaction.custom.authCode = result.resultCode;
+        }
+
+        // Save full response to transaction custom attribute
+        paymentInstrument.paymentTransaction.custom.Adyen_log = JSON.stringify(result);
+
+        order.setPaymentStatus(dw.order.Order.PAYMENT_STATUS_PAID);
+        order.setExportStatus(dw.order.Order.EXPORT_STATUS_READY);
+        paymentInstrument.custom.adyenPaymentData = null;
+        Transaction.commit();
+
+        OrderModel.submit(order);
+        clearForms();
+        app.getController('COSummary').ShowConfirmation(order);
+        return {};
+    }
+
+    Logger.getLogger("Adyen").error("Session variables for 3DS2 do not exist");
+    app.getController('COSummary').Start({
+        PlaceOrderError: new Status(Status.ERROR, 'confirm.error.declined', '')
+    });
+    return {};
+}
+
+
 /**
  * Make second call to 3d verification system to complete authorization 
  * 
- * @returns redering template or error
+ * @returns rendering template or error
  */
 function authorizeWithForm() {
 	var order;
@@ -425,6 +541,29 @@ function closeIFrame() {
     }).render('adyenpaymentredirect');
 }
 
+function getConfigurationComponents() {
+	var adyenGetOriginKey = require('*/cartridge/scripts/adyenGetOriginKey'); 
+	var baseUrl = request.httpParameterMap.get("protocol").stringValue + "//" + Site.getCurrent().getHttpsHostName();
+	var originKey;
+	var error = false;
+	var errorMessage = "";
+	var loadingContext = "";
+	
+	try {
+	    originKey = adyenGetOriginKey.getOriginKey(baseUrl).originKeys;
+	    loadingContext = AdyenHelper.getLoadingContext();
+	} catch (err) {
+	    error = true;
+	    errorMessage = Resource.msg('load.component.error', 'creditCard', null);
+	}
+	return {
+	    error: error,
+	    errorMessage: errorMessage,
+	    adyenOriginKey: originKey,
+	    adyenLoadingContext: loadingContext
+	};
+}
+
 /**
  * Clear system session data 
  */
@@ -453,10 +592,16 @@ function getExternalPlatformVersion(){
 	return EXTERNAL_PLATFORM_VERSION;
 }
 
+exports.Authorize3DS2 = guard.ensure(['https', 'post'], authorize3ds2);
+
+exports.Redirect3DS2 = guard.ensure(['https', 'post'], redirect3ds2);
+
 exports.AuthorizeWithForm = guard.ensure(['https', 'post'], authorizeWithForm);
 
 exports.CloseIFrame = guard.ensure(['https', 'post'], closeIFrame);
 
+exports.GetConfigurationComponents = guard.ensure(['https', 'get'], getConfigurationComponents);
+
 exports.Notify = guard.ensure(['post'], notify);
 
 exports.Redirect = redirect;
diff --git a/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js b/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js
index fcd83273e..9fdca8ca3 100644
--- a/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js
+++ b/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js
@@ -71,7 +71,8 @@ function Authorize(args) {
         CurrentRequest: request,
         PaymentInstrument: paymentInstrument,
         CreditCardForm: app.getForm('billing.paymentMethods.creditCard'),
-        SaveCreditCard: customer.authenticated && app.getForm('billing').object.paymentMethods.creditCard.saveCard.value
+        SaveCreditCard: customer.authenticated && app.getForm('billing').object.paymentMethods.creditCard.saveCard.value,
+        adyenForm : session.forms.adyPaydata
     });
 
     if (result.error) {
@@ -83,6 +84,27 @@ function Authorize(args) {
             PlaceOrderError: (!empty(args) && 'AdyenErrorMessage' in args && !empty(args.AdyenErrorMessage) ? args.AdyenErrorMessage : '')
         };
     }
+    
+    if(result.ThreeDS2){
+        Transaction.commit();
+        Transaction.wrap(function () {
+            paymentInstrument.custom.adyenPaymentData = result.PaymentData;
+        });
+
+        session.custom.orderNo = order.orderNo;
+        session.custom.paymentMethod = paymentInstrument.paymentMethod;
+
+        return {
+            authorized: true,
+            authorized3d: true,
+            view : app.getView({
+            	ContinueURL: URLUtils.https('Adyen-Redirect3DS2', 'utm_nooverride', '1'),
+            	Basket: order,
+            	resultCode: result.resultCode,
+                token3ds2: result.token3ds2
+            })
+        }
+    }
 
     if(result.RedirectObject != ''){
 	    if(result.RedirectObject.url && result.RedirectObject.data.PaReq && result.RedirectObject.data.MD){
diff --git a/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/Adyen.js b/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/Adyen.js
index 8393df3fd..5147c1689 100644
--- a/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/Adyen.js
+++ b/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/Adyen.js
@@ -52,7 +52,6 @@ function authorize(args) {
     var	adyenCheckout = require('int_adyen_overlay/cartridge/scripts/adyenCheckout'),
 	result;
 
-    Logger.getLogger("Adyen").error("Form = " + session.forms.adyPaydata.dateOfBirth.value);
 	Transaction.wrap(function () {
 		result = adyenCheckout.alternativePaymentMethod({
 			'Order': order,
diff --git a/cartridges/int_adyen_overlay/cartridge/js/pages/checkout/adyen-cse.js b/cartridges/int_adyen_overlay/cartridge/js/pages/checkout/adyen-cse.js
index de253333e..62621bf35 100644
--- a/cartridges/int_adyen_overlay/cartridge/js/pages/checkout/adyen-cse.js
+++ b/cartridges/int_adyen_overlay/cartridge/js/pages/checkout/adyen-cse.js
@@ -10,7 +10,8 @@
         }
         return number;
     }
-
+    
+    var threeDS2utils = require('./threeds2-js-utils');
     /**
      * @function
      * @description Initializes Adyen Secured Fields  Billing events
@@ -26,10 +27,11 @@
                 }
                 clearCardData();
                 var oneClickCard = window.AdyenOneClick;
+                setBrowserData();
                 if (isOneClick) {
                     $('#dwfrm_billing_paymentMethods_creditCard_selectedCardID').val($('#adyenCreditCardList option:selected').attr('id'));
                     $('#dwfrm_billing_paymentMethods_creditCard_type').val($('#adyenCreditCardList option:selected').val());
-                    $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedSecurityCode').val(oneClickCard.paymentData.encryptedSecurityCode);
+                    $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedSecurityCode').val(oneClickCard.state.data.encryptedSecurityCode);
                 }
                 else {
                     $('#dwfrm_billing_paymentMethods_creditCard_selectedCardID').val("");
@@ -115,7 +117,7 @@
     	switch(selectedMethod) {
     	  case "ideal":
     		  if (idealComponent.componentRef.state.isValid) {	
-                  $('#dwfrm_adyPaydata_issuer').val(idealComponent.componentRef.state.data.issuer);	
+                  $('#dwfrm_adyPaydata_issuer').val(idealComponent.componentRef.state.data.issuer);
               }	
               return idealComponent.componentRef.state.isValid;
     	    break;
@@ -142,11 +144,11 @@
 
     function copyCardData(card) {
         $('#dwfrm_billing_paymentMethods_creditCard_type').val(card.state.brand);
-        $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedCardNumber').val(card.paymentData.encryptedCardNumber);
-        $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedExpiryMonth').val(card.paymentData.encryptedExpiryMonth);
-        $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedExpiryYear').val(card.paymentData.encryptedExpiryYear);
-        $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedSecurityCode').val(card.paymentData.encryptedSecurityCode);
-        $('#dwfrm_billing_paymentMethods_creditCard_owner').val(card.paymentData.holderName);
+        $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedCardNumber').val(card.state.data.encryptedCardNumber);
+        $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedExpiryMonth').val(card.state.data.encryptedExpiryMonth);
+        $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedExpiryYear').val(card.state.data.encryptedExpiryYear);
+        $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedSecurityCode').val(card.state.data.encryptedSecurityCode);
+        $('#dwfrm_billing_paymentMethods_creditCard_owner').val(card.state.data.holderName);
     }
     
     function clearCardData() {
@@ -157,6 +159,11 @@
         $('#dwfrm_billing_paymentMethods_creditCard_adyenEncryptedSecurityCode').val("");
         $('#dwfrm_billing_paymentMethods_creditCard_owner').val("");
     }
+    
+    function setBrowserData() {
+        var browserData = threeDS2utils.getBrowserInfo();
+        $('#dwfrm_billing_paymentMethods_creditCard_browserInfo').val(JSON.stringify(browserData));
+    };
 
     /**
      * @function
@@ -165,7 +172,7 @@
     function initializeAccountEvents() {
         $('#add-card-submit').on('click', function (e) {
         	e.preventDefault();
-            if (window.AdyenCard.isValid()) {
+            if (window.AdyenCard.isValid) {
             	copyCardData(window.AdyenCard);
             	$('#add-card-submit-hidden').trigger('click');
             }
diff --git a/cartridges/int_adyen_overlay/cartridge/js/pages/checkout/threeds2-js-utils.js b/cartridges/int_adyen_overlay/cartridge/js/pages/checkout/threeds2-js-utils.js
new file mode 100644
index 000000000..939262a6f
--- /dev/null
+++ b/cartridges/int_adyen_overlay/cartridge/js/pages/checkout/threeds2-js-utils.js
@@ -0,0 +1 @@
+!function(e,n){"object"===typeof exports&&"object"===typeof module?module.exports=n():"function"===typeof define&&define.amd?define([],n):"object"===typeof exports?exports.ThreedDS2Utils=n():e.ThreedDS2Utils=n()}(this,function(){return function(e){var n={};function t(r){if(n[r])return n[r].exports;var o=n[r]={i:r,l:!1,exports:{}};return e[r].call(o.exports,o,o.exports,t),o.l=!0,o.exports}return t.m=e,t.c=n,t.d=function(e,n,r){t.o(e,n)||Object.defineProperty(e,n,{enumerable:!0,get:r})},t.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},t.t=function(e,n){if(1&n&&(e=t(e)),8&n)return e;if(4&n&&"object"===typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(t.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&n&&"string"!=typeof e)for(var o in e)t.d(r,o,function(n){return e[n]}.bind(null,o));return r},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},t.p="",t(t.s=0)}([function(e,n,t){"use strict";t.r(n);var r={container:void 0},o={"01":["250px","400px"],"02":["390px","400px"],"03":["500px","600px"],"04":["600px","400px"],"05":["100%","100%"]};function a(e){return o.hasOwnProperty(e)?e:"01"}var i={createIframe:function(e,n){var t=arguments.length>2&&void 0!==arguments[2]?arguments[2]:"0",o=arguments.length>3&&void 0!==arguments[3]?arguments[3]:"0",a=arguments.length>4?arguments[4]:void 0;if(!n||0===n.length)throw new Error("Name parameter missing for iframe");e instanceof HTMLElement?r.container=e:r.container=document.body;var i=document.createElement("iframe");i.classList.add(n+"Class"),i.width=t,i.height=o,i.name=n,i.setAttribute("frameborder","0"),i.setAttribute("border","0");var d=document.createTextNode("<p>Your browser does not support iframes.</p>");return i.appendChild(d),r.container.appendChild(i),function(e,n){e.attachEvent?e.attachEvent("onload",function(){n&&"function"===typeof n&&n(e.contentWindow)}):e.onload=function(){n&&"function"===typeof n&&n(e.contentWindow)}}(i,a),i},createForm:function(e,n,t,r,o){if(!e||!n||!t||!r||!o)throw new Error("Not all required parameters provided for form creation");if(0===e.length||0===n.length||0===t.length||0===r.length||0===o.length)throw new Error("Not all required parameters have suitable values");var a=document.createElement("form");a.style.display="none",a.name=e,a.action=n,a.method="POST",a.target=t;var i=document.createElement("input");return i.name=r,i.value=o,a.appendChild(i),a},getBrowserInfo:function(){var e=window&&window.screen?window.screen.width:"",n=window&&window.screen?window.screen.height:"",t=window&&window.screen?window.screen.colorDepth:"",r=window&&window.navigator?window.navigator.userAgent:"",o=!(!window||!window.navigator)&&navigator.javaEnabled(),a="";return window&&window.navigator&&(a=window.navigator.language?window.navigator.language:window.navigator.browserLanguage),{screenWidth:e,screenHeight:n,colorDepth:t,userAgent:r,timeZoneOffset:(new Date).getTimezoneOffset(),language:a,javaEnabled:o}},base64Url:{encode:function(e){var n=window.btoa(e).split("=")[0];return n=(n=n.replace("/+/g","-")).replace("///g","_")},decode:function(e){var n=e;switch((n=(n=n.replace("/-/g","+")).replace("/_/g","/")).length%4){case 0:break;case 2:n+="==";break;case 3:n+="=";break;default:window.console&&window.console.log&&window.console.log("### base64url::decodeBase64URL::  Illegal base64url string!")}try{return window.atob(n)}catch(e){throw new Error(e)}}},config:{challengeWindowSizes:o,validateChallengeWindowSize:a,getChallengeWindowSize:function(e){return o[a(e)]},THREEDS_METHOD_TIMEOUT:1e4,CHALLENGE_TIMEOUT:6e5}};n.default=i}]).default});
\ No newline at end of file
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds
index 668ab262b..bd77c197b 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds
@@ -96,7 +96,7 @@ function createPaymentRequest(args, paymentMethodObject, returnUrl) {
     var order = args.Order;
     var recurringType = AdyenHelper.getAdyenRecurringType();
     var saveCreditCard = !empty(args.SaveCreditCard) ? args.SaveCreditCard : false;
-    var jsonObject = AdyenHelper.createAdyenRequestObject(recurringType, order, saveCreditCard);
+    var jsonObject = AdyenHelper.createAdyenRequestObject(recurringType, order, saveCreditCard, args.PaymentType);
     var customer = order.getCustomer();
     var profile = !empty(customer) && customer.registered && !empty(customer.getProfile()) ? customer.getProfile() : null;
     var customerID = '';
@@ -106,9 +106,6 @@ function createPaymentRequest(args, paymentMethodObject, returnUrl) {
     }
 
     jsonObject['returnUrl'] = returnUrl;
-    jsonObject.additionalData = {
-        "executeThreeD": true
-    };
 
     var myAmount = AdyenHelper.getCurrencyValueForApi(args.Amount); //args.Amount * 100;
     jsonObject['amount'] = {
@@ -154,17 +151,33 @@ function createPaymentRequest(args, paymentMethodObject, returnUrl) {
 
     var shopperObject = AdyenHelper.createShopperObject({
             Customer: customer,
-            Basket: order
+            Basket: order,
+            Args: args
         });
 
+    var gender = "UNKNOWN";
+    if(args.adyenForm && args.adyenForm.gender.value){
+        switch(args.adyenForm.gender.value){
+            case "M":
+                gender = "MALE";
+                break;
+            case "F":
+                gender = "FEMALE";
+                break;
+            default:
+                gender = "UNKNOWN";
+        }
+    }
     jsonObject['paymentMethod'] = paymentMethodObject;
     var shopperDetails = {
         "firstName": billingAddr.firstName,
-        "gender": "UNKNOWN",
+        "gender": gender,
         "infix": "",
         "lastName": billingAddr.lastName
     };
 
+    jsonObject['shopperName'] = shopperDetails;
+
     if(!empty(args.PaymentType) && args.PaymentType.toString().substring(0, 3) == "ach") {
         if (!empty(args.adyenForm.bankAccountOwnerName.value)) {
             var bankAccount = {
@@ -185,16 +198,9 @@ function createPaymentRequest(args, paymentMethodObject, returnUrl) {
         if(args.adyenFingerprint){
             jsonObject["dfValue"] = args.adyenFingerprint
         }
-
-        var personalDetails = AdyenGetOpenInvoiceData.getShopperData(args, shopperDetails);
-        jsonObject['paymentMethod'].personalDetails = personalDetails;
-    }
-	else {
-	    jsonObject['shopperName'] = shopperDetails;
     }
 
     var requestObject = AdyenHelper.extend(jsonObject, shopperObject);
-
     // assign default values for the script output variables 
     args.RedirectObject = '';
     args.ResultCode = '';
@@ -244,10 +250,7 @@ function doPaymentCall(args, requestObject){
             return {error: true};
         }
 
-        // return the AVS result code
-        args.AVSResultCode = (!empty(responseObj.avsResultRaw) ? responseObj.avsResultRaw : '');
-
-        // if the card is enrolled in the 3-D Secure programme the response should contain these 4 fields
+        // if the card is enrolled for 3D Secure, the response contains a redirect object
         if ('redirect' in responseObj) {args.RedirectObject = responseObj.redirect;} // issuerUrl
         args.ResultCode = responseObj.resultCode; // resultCode
 
@@ -259,8 +262,21 @@ function doPaymentCall(args, requestObject){
 
         var resultCode = args.ResultCode;
         var order = args.Order;
+        if (responseObj.resultCode.indexOf('IdentifyShopper') != -1 || (responseObj.resultCode.indexOf('ChallengeShopper') != -1) ) {
+            args.ThreeDS2 = true;
+            args.resultCode = responseObj.resultCode;
+            var token3ds2;
+            if(responseObj.authentication["threeds2.fingerprintToken"]) {
+                token3ds2 = responseObj.authentication["threeds2.fingerprintToken"]
+            }
+            else if (responseObj.authentication["threeds2.challengeToken"]){
+                token3ds2 = responseObj.authentication["threeds2.challengeToken"];
+            }
+            args.token3ds2 = token3ds2;
+            args.PaymentData = responseObj.paymentData;
+        }
 
-        if (responseObj.resultCode.indexOf('Authorised') != -1 || (responseObj.resultCode.indexOf('RedirectShopper') != -1) ) {
+        else if (responseObj.resultCode.indexOf('Authorised') != -1 || (responseObj.resultCode.indexOf('RedirectShopper') != -1) ) {
             args.Decision = 'ACCEPT';
             args.PaymentStatus = resultCode;
             args.PaymentData = responseObj.paymentData;
@@ -268,9 +284,8 @@ function doPaymentCall(args, requestObject){
             if (responseObj.resultCode.indexOf('Authorised') != -1) {
                 order.setPaymentStatus(dw.order.Order.PAYMENT_STATUS_PAID);
                 order.setExportStatus(dw.order.Order.EXPORT_STATUS_READY);
+                Logger.getLogger('Adyen').info('Payment result: Authorised');
             }
-            Logger.getLogger('Adyen').info('Payment result: Authorised');
-            Logger.getLogger('Adyen').info('Decision: ' + args.Decision);
 
             if (args.RedirectObject == '') { // if is not 3DSecure
                 Logger.getLogger('Adyen').debug('Adyen: ' + resultObj.statusCode + ' Error => ' + resultObj.statusMessage + ' | ' + resultObj.errorText);
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyenGetOpenInvoiceData.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyenGetOpenInvoiceData.ds
index 894ca882a..622d2eed4 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/adyenGetOpenInvoiceData.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyenGetOpenInvoiceData.ds
@@ -35,25 +35,6 @@ importPackage( dw.web );
 //script include
 var AdyenHelper = require ("int_adyen_overlay/cartridge/scripts/util/AdyenHelper");
 
-function getShopperData(args, personalDetails){
-	if(args.adyenForm.socialSecurityNumber.value){
-		personalDetails.socialSecurityNumber = args.adyenForm.socialSecurityNumber.value;
-	}
-	if(args.adyenForm.dateOfBirth.value){
-		personalDetails.dateOfBirth = args.adyenForm.dateOfBirth.value;
-	}
-	if(args.adyenForm.gender.value){
-		personalDetails.gender = args.adyenForm.gender.value;
-	}
-	if(args.adyenForm.telephoneNumber){
-		personalDetails.telephoneNumber = args.adyenForm.telephoneNumber.value;
-	}
-	else if(args.Order.getDefaultShipment().getShippingAddress().getPhone()){
-		personalDetails.telephoneNumber = args.Order.getDefaultShipment().getShippingAddress().getPhone()
-	}
-	return personalDetails;
-}
-
 function getLineItems(args) {
 	var order;
 	if(args.Order){
@@ -163,6 +144,5 @@ function getItemAmount(lineItem) {
 }
 
 module.exports = {
-	'getLineItems': getLineItems,
-	'getShopperData': getShopperData
+	'getLineItems': getLineItems
 }
\ No newline at end of file
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
index 5f6737205..bb763732e 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
@@ -97,6 +97,14 @@ var __AdyenHelper: Object = {
         return returnValue;
     },
 
+    getAdyen3DS2Enabled: function (): Boolean {
+        var returnValue: Boolean = false;
+        if (!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('Adyen3DS2Enabled'))) {
+            returnValue = adyenCurrentSite.getCustomPreferenceValue('Adyen3DS2Enabled');
+        }
+        return returnValue;
+    },
+
     getAdyenRecurringPaymentsEnabled: function (): Boolean {
         var returnValue: Boolean = false;
         if (!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('AdyenRecurringPaymentsEnabled'))) {
@@ -138,7 +146,7 @@ var __AdyenHelper: Object = {
     },
 
     getCheckoutUrl: function (): String {
-        var checkoutUrl = this.getLoadingContext() + "sdk/2.1.0/adyen.js";
+        var checkoutUrl = this.getLoadingContext() + "sdk/3.0.0/adyen.js";
         return checkoutUrl;
     },
 
@@ -207,20 +215,23 @@ var __AdyenHelper: Object = {
             return typeof item !== 'undefined';
         });
     },
+
     getRatePayID: function (): String {
 
         var returnValue: String = "";
         if (!empty(adyenCurrentSite) && !empty(adyenCurrentSite.getCustomPreferenceValue('AdyenRatePayID'))) {
             returnValue = adyenCurrentSite.getCustomPreferenceValue('AdyenRatePayID');
         }
+        if (!session.custom.ratePayFingerprint || session.custom.ratePayFingerprint == null) {
+            var sessionID = new dw.crypto.MessageDigest(dw.crypto.MessageDigest.DIGEST_MD5).digest(session.sessionID);
+            session.custom.ratePayFingerprint = sessionID;
+        }
         return returnValue;
     },
 
     isOpenInvoiceMethod: function (paymentMethod) {
         if (paymentMethod.indexOf("afterpay") > -1 || paymentMethod.indexOf("klarna") > -1 || paymentMethod.indexOf("ratepay") > -1 || paymentMethod.indexOf("facilypay") > -1) {
-            if (paymentMethod.indexOf("afterpaytouch") == -1) {
-                return true;
-            }
+            return true;
         }
         return false;
     },
@@ -341,10 +352,25 @@ var __AdyenHelper: Object = {
             shopperObject['shopperReference'] = customerID;
         }
 
+        if(params.Args.adyenForm) {
+            if(params.Args.adyenForm.socialSecurityNumber.value){
+                shopperObject['socialSecurityNumber'] = params.Args.adyenForm.socialSecurityNumber.value;
+            }
+            if(params.Args.adyenForm.dateOfBirth.value){
+                shopperObject['dateOfBirth'] = params.Args.adyenForm.dateOfBirth.value;
+            }
+            if(params.Args.adyenForm.telephoneNumber){
+                shopperObject['telephoneNumber'] = params.Args.adyenForm.telephoneNumber.value;
+            }
+            else if(params.Args.Order.getDefaultShipment().getShippingAddress().getPhone()){
+                shopperObject['telephoneNumber']= params.Args.Order.getDefaultShipment().getShippingAddress().getPhone()
+            }
+        }
+
         return shopperObject;
     },
 
-    createAdyenRequestObject: function (recurringType, order, saveCreditCard) {
+    createAdyenRequestObject: function (recurringType, order, saveCreditCard, paymentType) {
         var jsonObject = {},
             reference = '';
 
@@ -361,6 +387,10 @@ var __AdyenHelper: Object = {
             'userAgent': request.httpUserAgent
         };
 
+        if(__AdyenHelper.getAdyen3DS2Enabled() && empty(paymentType)){
+            jsonObject = __AdyenHelper.add3DS2Data(jsonObject);
+        }
+
         if (__AdyenHelper.getAdyenRecurringPaymentsEnabled() && !empty(recurringType)) {
 
             if (saveCreditCard) {
@@ -389,7 +419,7 @@ var __AdyenHelper: Object = {
 
         var recurringType = __AdyenHelper.getAdyenRecurringType();
 
-        var jsonObject = __AdyenHelper.createAdyenRequestObject(recurringType, null, true);
+        var jsonObject = __AdyenHelper.createAdyenRequestObject(recurringType, null, true, null);
 
         var paymentMethodObject = __AdyenHelper.createCardObjectSF(false, 'account');
         jsonObject['paymentMethod'] = paymentMethodObject;
@@ -446,6 +476,34 @@ var __AdyenHelper: Object = {
         return {error: true};
     },
 
+    add3DS2Data: function(jsonObject){
+        jsonObject["additionalData"] = {
+            allow3DS2: true
+        };
+        jsonObject["channel"] = "web";
+
+        var card;
+        if (session.forms.billing.paymentMethods) {
+            card = session.forms.billing.paymentMethods.creditCard;
+        }
+        else {
+            //different structure in SFRA
+            card = session.forms.billing.creditCardFields;
+        }
+
+        var browserInfo = JSON.parse(card.browserInfo.value);
+        browserInfo['acceptHeader'] = request.httpHeaders.get('accept') + request.httpHeaders.get('accept-encoding');
+        browserInfo['userAgent'] = request.httpUserAgent;
+        jsonObject["browserInfo"] = browserInfo;
+
+        var origin = request.getHttpProtocol() + "://" + request.getHttpHost();
+
+        jsonObject['origin'] = origin;
+        jsonObject.threeDS2RequestData = {"notificationURL" : ""};
+
+        return jsonObject;
+    },
+
     extend: function (obj, src) {
         for (var key in src) {
             if (src.hasOwnProperty(key)) obj[key] = src[key];
@@ -479,6 +537,9 @@ var __AdyenHelper: Object = {
                 case 'Bancontact':
                     cardType = 'bcmc';
                     break;
+                case 'JCB':
+                    cardType = 'jcb';
+                    break;
                 default:
                     cardType = cardType.toLowerCase();
                     break;
@@ -515,6 +576,9 @@ var __AdyenHelper: Object = {
                 case 'bcmc':
                     cardType = 'Bancontact';
                     break;
+                case 'jcb':
+                    cardType = 'JCB';
+                    break;
                 default:
                     cardType = '';
                     break;
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/adyenform.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/adyenform.isml
index 752cc396d..10c7c6688 100644
--- a/cartridges/int_adyen_overlay/cartridge/templates/default/adyenform.isml
+++ b/cartridges/int_adyen_overlay/cartridge/templates/default/adyenform.isml
@@ -3,8 +3,6 @@
 <iscontent type="text/html" charset="UTF-8" compact="true">
 <isinclude template="util/modules"/>
 
-<isset name="checkoutstep" value="${4}" scope="page"/>
-<isset name="checkoutname" value="${'PayerAuthentication'}" scope="page"/>
 <isinclude template="util/reporting/ReportCheckout.isml"/>
 <div class="checkout">
 	<div class="payerauth">
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/adyenpaymentredirect.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/adyenpaymentredirect.isml
index cda97788d..a4d16d33f 100644
--- a/cartridges/int_adyen_overlay/cartridge/templates/default/adyenpaymentredirect.isml
+++ b/cartridges/int_adyen_overlay/cartridge/templates/default/adyenpaymentredirect.isml
@@ -16,5 +16,7 @@
 	<form action="${URLUtils.continueURL()}" method="POST" name="RedirectForm" target="_parent">
 		<input type="hidden" name="PaReq" value="${pdict.paRequest}">
 		<input type="hidden" name="MD" value="${pdict.md}">
+		<input type="hidden" name="resultCode" value="${pdict.resultCode}">
+		<input type="hidden" name="token3ds2" value="${pdict.token3ds2}">
 	</form>
 </body>
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentfields.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentfields.isml
index 372fd6214..da0228216 100644
--- a/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentfields.isml
+++ b/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentfields.isml
@@ -2,7 +2,7 @@
 
 <isset name="AdyenGetOriginKey" value="${require('int_adyen_overlay/cartridge/scripts/adyenGetOriginKey')}" scope="PAGE"/>
 <isset name="AdyenHelper" value="${require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper')}" scope="PAGE"/>
-<link rel="stylesheet" type="text/css" href="https://checkoutshopper-test.adyen.com/checkoutshopper/sdk/2.1.0/adyen.css"/>
+<link rel="stylesheet" type="text/css" href="https://checkoutshopper-test.adyen.com/checkoutshopper/sdk/3.0.0/adyen.css"/>
 <link rel="stylesheet" href="${URLUtils.staticURL('/css/adyenCSS.css')}" /> 
 
 
@@ -58,6 +58,7 @@
     <input type="hidden" id="${pdict.CurrentForms.billing.paymentMethods.creditCard.adyenEncryptedExpiryYear.htmlName}" name="${pdict.CurrentForms.billing.paymentMethods.creditCard.adyenEncryptedExpiryYear.htmlName}">
     <input type="hidden" id="${pdict.CurrentForms.billing.paymentMethods.creditCard.adyenEncryptedSecurityCode.htmlName}" name="${pdict.CurrentForms.billing.paymentMethods.creditCard.adyenEncryptedSecurityCode.htmlName}">
     <isinputfield formfield="${pdict.CurrentForms.billing.paymentMethods.creditCard.selectedCardID}" type="hidden"/>
+    <isinputfield formfield="${pdict.CurrentForms.billing.paymentMethods.creditCard.browserInfo}" type="hidden"/>
 </div>
 
 
@@ -65,11 +66,11 @@
 
 	var originKey = "${AdyenGetOriginKey.getOriginKeyFromRequest(request.getHttpProtocol(), request.getHttpHost())}";
 	var loadingContext = "${AdyenHelper.getLoadingContext()}";
+	var environment = "${AdyenHelper.getAdyenMode().toLowerCase()}";
 	var locale = "${request.locale}";
-	
 	// Init Adyen checkout component js file
 	var scriptTag = document.createElement('script');
-	
+
     scriptTag.src = "${AdyenHelper.getCheckoutUrl()}";
     scriptTag.type = "text/javascript";
     document.body.appendChild(scriptTag);
@@ -82,7 +83,7 @@
                 script.readyState == "complete") {
                 script.onreadystatechange = null;
                 // Init Component
-                initializeCardComponent(originKey, loadingContext, locale);
+                initializeCardComponent(originKey, environment, locale);
             }
         };
     }
@@ -90,15 +91,19 @@
     else {
         scriptTag.onload = function () {
             // Init Component
-            initializeCardComponent(originKey, loadingContext, locale);
+            initializeCardComponent(originKey, environment, locale);
         };
     }
 
-	function initializeCardComponent(originKey, loadingContext, locale) {
+	function initializeCardComponent(originKey, environment, locale) {
+	console.log(environment);
 		window.Configuration = {
 		        locale: locale,
 		        originKey: originKey,
-	        	loadingContext: loadingContext
+	        	environment: environment,
+                risk: {
+                    enabled: false
+                }
 		};
 
 		var AdyenCheckoutObject = new AdyenCheckout(window.Configuration);
@@ -108,7 +113,7 @@
 	       	type: 'card',
 	        hasHolderName: true,
             holderNameRequired: true,
-            groupTypes: ["bcmc", "maestro", "visa", "mc", "amex", "diners", "discover"],
+            groupTypes: ["bcmc", "maestro", "visa", "mc", "amex", "diners", "discover", "jcb"],
 	        onChange: function(state) {
 	        	// checks whether card was valid then was changed to be invalid
 	        	window.CardValid = state.isValid;
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/checkoutComponent.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/checkoutComponent.isml
index ebddf0c6b..c5cbd63b7 100644
--- a/cartridges/int_adyen_overlay/cartridge/templates/default/checkoutComponent.isml
+++ b/cartridges/int_adyen_overlay/cartridge/templates/default/checkoutComponent.isml
@@ -17,33 +17,34 @@ switch("${method.type}"){
         break;
      case "klarna":
      	var paymentMethodDetails = JSON.parse("${openInvoiceMethodDetails}".replace(/&quot;/g, '\"'));
-     	var component = document.getElementById("component_klarna");
-		var klarnaContainer = document.createElement("div");
-       	var klarnaComponent = AdyenCheckoutObject.create('klarna', {
-               details: paymentMethodDetails,
-               visibility: {
-               		personalDetails: "editable"
-               },
-           });
-           component.append(klarnaContainer);
-           klarnaComponent.mount(klarnaContainer);
-
-         var billingCountry = document.getElementsByClassName("input-select country")[0].value;
-         if(isNordicCountry(billingCountry.toUpperCase())){
-             var ssnContainer = document.createElement("div");
-             ssnContainer.setAttribute("id", "ssn_klarna");
-             var socialSecurityNumberLabel = document.createElement("span");
-             socialSecurityNumberLabel.textContent = "Social Security Number";
-             var socialSecurityNumber = document.createElement("input");
-             socialSecurityNumber.setAttribute("id", "ssnValue");
-             socialSecurityNumber.setAttribute("class", "adyen-checkout__input");
-             socialSecurityNumber.setAttribute("type", "text");
-             
-             ssnContainer.append(socialSecurityNumberLabel);
-             ssnContainer.append(socialSecurityNumber);
-             klarnaContainer.append(ssnContainer);
+     	if(paymentMethodDetails){
+	     	var component = document.getElementById("component_klarna");
+			var klarnaContainer = document.createElement("div");
+	       	var klarnaComponent = AdyenCheckoutObject.create('klarna', {
+	               details: paymentMethodDetails,
+	               visibility: {
+	               		personalDetails: "editable"
+	               },
+	           });
+	           component.append(klarnaContainer);
+	           klarnaComponent.mount(klarnaContainer);
+	
+	         var billingCountry = document.getElementsByClassName("input-select country")[0].value;
+	         if(isNordicCountry(billingCountry.toUpperCase())){
+	             var ssnContainer = document.createElement("div");
+	             ssnContainer.setAttribute("id", "ssn_klarna");
+	             var socialSecurityNumberLabel = document.createElement("span");
+	             socialSecurityNumberLabel.textContent = "Social Security Number";
+	             var socialSecurityNumber = document.createElement("input");
+	             socialSecurityNumber.setAttribute("id", "ssnValue");
+	             socialSecurityNumber.setAttribute("class", "adyen-checkout__input");
+	             socialSecurityNumber.setAttribute("type", "text");
+	             
+	             ssnContainer.append(socialSecurityNumberLabel);
+	             ssnContainer.append(socialSecurityNumber);
+	             klarnaContainer.append(ssnContainer);
+	         }
          }
-         
         break;
      case "afterpay_default":
      	var paymentMethodDetails = JSON.parse("${openInvoiceMethodDetails}".replace(/&quot;/g, '\"'));
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/hpp.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/hpp.isml
index affa11acd..20ceea688 100644
--- a/cartridges/int_adyen_overlay/cartridge/templates/default/hpp.isml
+++ b/cartridges/int_adyen_overlay/cartridge/templates/default/hpp.isml
@@ -1,82 +1,72 @@
 <iscontent type="text/html" charset="UTF-8" compact="true"/>
 <isinclude template="util/modules"/>
 
-<isset name="directoryLookup" value="${dw.system.Site.getCurrent().getCustomPreferenceValue('Adyen_directoryLookup')}" scope="page"/>
+<isset name="ratePayID" value="${AdyenHelper.getRatePayID()}" scope="page"/>
 <isset name="brandCode" value="" scope="session"/>
 
 <isinputfield formfield="${pdict.CurrentForms.adyPaydata.issuer}" type="hidden"/>
 
 <script src="${AdyenHelper.getCheckoutUrl()}" type="text/javascript"></script>
-<isif condition="${directoryLookup == true && !empty(pdict.AdyenHppPaymentMethods)}">
-	<isset name="methods" value="${pdict.AdyenHppPaymentMethods}" scope="page"/>
-	
-	<iscomment>Loop through the returned payment methods after calling /paymentMethods and print them</iscomment>
-	<isif condition="${!empty(methods) && methods.length > 0}">
-	<script type="text/javascript">
-		var AdyenCheckoutObject = new AdyenCheckout(window.Configuration);
-	</script>
-		<ul id="type">
-			<isloop items="${methods}" var="method" status="loopstate">
-				<li class="form-row row-${method.type}" id="li_${method.type}">
-					<input type="radio" class="input-radio" name="brandCode" value="${method.type}" id="${method.type}"/>
-					<img class="logo" src="${AdyenHelper.getAdyenUrl()}/hpp/img/pm/${method.type}.png" alt=""/>
-					<label class="payment_method_label" for="${method.type}">${method.name}</label>
-					<isscript>
-					    var methodDetails = JSON.stringify(method);
-					</isscript>
-					<isif condition="${AdyenHelper.hasCheckoutComponent(method.type)}">
-						<isinclude template="checkoutComponent"/>
-					<iselse/>
-						<isif condition="${method.details[0].key == 'issuer'}">
-							<select class="issuer" id="${method.type}_issuer">
-								<isloop items="${method.details[0].items}" var="selectedIssuer" status="loopstate">
-									<option label="${selectedIssuer.name}" value="${selectedIssuer.id}"/>
-								</isloop>
-							</select>
-						</isif>
-						<isif condition="${method.type.substring(0, 3) == 'ach'}">
-							<div id="component_ach" class="checkoutComponent">
-								<isinputfield formfield="${pdict.CurrentForms.adyPaydata.bankAccountOwnerName}" type="input"/>
-								<isinputfield formfield="${pdict.CurrentForms.adyPaydata.bankAccountNumber}" type="input"/>
-								<isinputfield formfield="${pdict.CurrentForms.adyPaydata.bankLocationId}" type="input"/>
-							</div>
-						</isif>
-					</isif> 
-				</li>
-			</isloop>
-		</ul>
-	</isif>
-<iselse>
-	<span>${Resource.msg('hpp.empty', 'hpp', null)}</span>
+<isset name="methods" value="${pdict.AdyenHppPaymentMethods}" scope="page"/>
+<iscomment>Loop through the returned payment methods after calling /paymentMethods and print them</iscomment>
+<isif condition="${!empty(methods) && methods.length > 0}">
+    <script type="text/javascript">
+        var AdyenCheckoutObject = new AdyenCheckout(window.Configuration);
+    </script>
+    <ul id="type">
+        <isloop items="${methods}" var="method" status="loopstate">
+            <li class="form-row row-${method.type}" id="li_${method.type}">
+                <input type="radio" class="input-radio" name="brandCode" value="${method.type}" id="${method.type}"/>
+                <img class="logo" src="${AdyenHelper.getAdyenUrl()}/hpp/img/pm/${method.type}.png" alt=""/>
+                <label class="payment_method_label" for="${method.type}">${method.name}</label>
+                <isscript>
+                    var methodDetails = JSON.stringify(method);
+                </isscript>
+                <isif condition="${AdyenHelper.hasCheckoutComponent(method.type)}">
+                    <isinclude template="checkoutComponent"/>
+                    <iselse/>
+                    <isif condition="${method.details[0].key == 'issuer'}">
+                        <select class="issuer" id="${method.type}_issuer">
+                            <isloop items="${method.details[0].items}" var="selectedIssuer" status="loopstate">
+                                <option label="${selectedIssuer.name}" value="${selectedIssuer.id}"/>
+                            </isloop>
+                        </select>
+                    </isif>
+                    <isif condition="${method.type.substring(0, 3) == 'ach'}">
+                        <div id="component_ach" class="checkoutComponent">
+                            <isinputfield formfield="${pdict.CurrentForms.adyPaydata.bankAccountOwnerName}"
+                                          type="input"/>
+                            <isinputfield formfield="${pdict.CurrentForms.adyPaydata.bankAccountNumber}" type="input"/>
+                            <isinputfield formfield="${pdict.CurrentForms.adyPaydata.bankLocationId}" type="input"/>
+                        </div>
+                    </isif>
+                </isif>
+            </li>
+        </isloop>
+    </ul>
+<iselse/>
+    <span>${Resource.msg('hpp.empty', 'hpp', null)}</span>
 </isif>
 
-<div class="openinvoiceInput">
-	<isinputfield type="hidden" formfield="${pdict.CurrentForms.adyPaydata.gender}" />
-	<isinputfield type="hidden" formfield="${pdict.CurrentForms.adyPaydata.dateOfBirth}" />
-	<isinputfield type="hidden" formfield="${pdict.CurrentForms.adyPaydata.telephoneNumber}" />
-	<isinputfield type="hidden" formfield="${pdict.CurrentForms.adyPaydata.socialSecurityNumber}" />
-</div>
+    <div class="openinvoiceInput">
+        <isinputfield type="hidden" formfield="${pdict.CurrentForms.adyPaydata.gender}"/>
+        <isinputfield type="hidden" formfield="${pdict.CurrentForms.adyPaydata.dateOfBirth}"/>
+        <isinputfield type="hidden" formfield="${pdict.CurrentForms.adyPaydata.telephoneNumber}"/>
+        <isinputfield type="hidden" formfield="${pdict.CurrentForms.adyPaydata.socialSecurityNumber}"/>
+    </div>
 
-<iscomment>
-	Adyen RatePay Device Fingerprint Code
-</iscomment>
-<isif condition="${empty(session.custom.ratePayFingerprint)}">
-	<isscript>
-		var ratePayID = dw.system.Site.getCurrent().getCustomPreferenceValue('AdyenRatePayID');
-		var sessionID = new dw.crypto.MessageDigest(dw.crypto.MessageDigest.DIGEST_MD5).digest(session.sessionID);
-		session.custom.ratePayFingerprint = sessionID;
-	</isscript>
-	<script language="JavaScript">
-		var di = {t:'${sessionID}',v:'${ratePayID}',l:'Checkout'};
-	</script>
-	<script type="text/javascript" src="//d.ratepay.com/${ratePayID}/di.js"></script>
-</isif>
+    <iscomment>
+        Adyen RatePay Device Fingerprint Code
+    </iscomment>
+    <isif condition="${ratePayID}">
+        <script type="text/javascript" src="//d.ratepay.com/${ratePayID}/di.js"></script>
+    </isif>
 
-<iscomment>
-	Adyen Generic Device Fingerprint Code
-</iscomment>
-<script type="text/javascript" src="https://live.adyen.com/hpp/js/df.js?v=${session.sessionID}"></script>
-<isinputfield type="hidden" formfield="${pdict.CurrentForms.adyPaydata.adyenFingerprint}" />
-<script type="text/javascript">
-	dfDo('dwfrm_adyPaydata_adyenFingerprint');
-</script>
\ No newline at end of file
+    <iscomment>
+        Adyen Generic Device Fingerprint Code
+    </iscomment>
+    <script type="text/javascript" src="https://live.adyen.com/hpp/js/df.js?v=${session.sessionID}"></script>
+    <isinputfield type="hidden" formfield="${pdict.CurrentForms.adyPaydata.adyenFingerprint}"/>
+    <script type="text/javascript">
+        dfDo('dwfrm_adyPaydata_adyenFingerprint');
+    </script>
\ No newline at end of file
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/payerauthentication.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/payerauthentication.isml
deleted file mode 100644
index 4f466ba64..000000000
--- a/cartridges/int_adyen_overlay/cartridge/templates/default/payerauthentication.isml
+++ /dev/null
@@ -1,28 +0,0 @@
-<isdecorate template="checkout/pt_checkout">
-<iscontent type="text/html" charset="UTF-8" compact="true">
-<isinclude template="util/modules"/>
-
-<isset name="checkoutstep" value="${4}" scope="page"/>
-<isset name="checkoutname" value="${'PayerAuthentication'}" scope="page"/>
-<isinclude template="util/reporting/ReportCheckout.isml"/>
-<div class="checkout">
-	<div class="payerauth">
-		<div class="payerauthframe">
-			<iframe name="PAFrame" width="940" height="500" src="" style="border: none;margin:15px auto;">${Resource.msg('cart.payerauthentication.003','cart','')}</iframe>
-		</div> 
-		<form action="${pdict.issuerUrl}" method="POST" name="3dform" target="PAFrame" id="3dform">
-			<input type="hidden" name="TermUrl" value="${URLUtils.httpsContinue()}">
-			<input type="hidden" name="PaReq" value="${pdict.paRequest}">
-			<input type="hidden" name="MD" value="${pdict.md}">
-		</form>
-		<script language="javascript">
-			var loaded = false;
-			function load(){
-				document.getElementById('3dform').submit();
-				loaded = true;
-			}
-			load();
-		</script>
-	</div>
-</div>
-</isdecorate>
\ No newline at end of file
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/payerauthenticationredirect.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/payerauthenticationredirect.isml
deleted file mode 100644
index 6e37697af..000000000
--- a/cartridges/int_adyen_overlay/cartridge/templates/default/payerauthenticationredirect.isml
+++ /dev/null
@@ -1,17 +0,0 @@
-<iscontent type="text/html" charset="UTF-8" compact="true">
-
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml">
-<head>
-	<script language="javascript">
-		var loaded = false;
-		function load(){
-			document.getElementById('redirForm').submit();
-			loaded = true;
-		}
-	</script>
-</head>
-<body onload="load();">
-	<form action="${URLUtils.continueURL()}" method="POST" name="RedirectForm" id="redirForm" target="_parent">
-	</form>
-</body>
\ No newline at end of file
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/redirect.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/redirect.isml
deleted file mode 100644
index 557c18c2c..000000000
--- a/cartridges/int_adyen_overlay/cartridge/templates/default/redirect.isml
+++ /dev/null
@@ -1,83 +0,0 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml">
-<iscomment>
-	Redirects to Adyen by auto-submitting the form
-	
-	This creates a reporting entry for source codes in case a source code is available.
-	It relies on the fact, that the source code entry page is a special pipeline and
-	a redirect is executed at the end using this template.
-
-	If no source code is available in the session, no data is reported. So it is safe
-	to keep the include here and use the redirect for other purposes.
-</iscomment>
-<isinclude template="util/reporting/ReportSourceCodes.isml"/>
-
-<head>
-	<title>${Resource.msg('redirect.payment','common',null)}</title>
-	<meta http-equiv="Robots" content="noindex, follow" />
-</head>
-<body>
-	
-	<iscomment>
-		${Resource.msg('redirect.payment','common',null)}
-		<input type="hidden" name="countryCode"        	 value="DE" /> 
-		<input type="hidden" name="shopperLocale"        value="de" />
-		<input type="submit" value='pay'/>
-		<input type="hidden" name="currencyCode"         value="${pdict.Order.currencyCode}" /> 
-		<input type="hidden" name="currencyCode"         value="EUR" /> 
-	</iscomment>
-	
-	<isscript>
-		importPackage( dw.system );
-		var directoryLookup : Boolean = Site.getCurrent().getCustomPreferenceValue("Adyen_directoryLookup");
-		var Mode : String = Site.getCurrent().getCustomPreferenceValue("Adyen_Mode");
-		var Debug : String = Site.getCurrent().getCustomPreferenceValue("Adyen_Debug");
-		
-		if (directoryLookup) {
-			var url : String = "https://test.adyen.com/hpp/details.shtml";
-			if (Mode == "LIVE") {
-				url = "https://live.adyen.com/hpp/details.shtml";
-			}
-		} else {
-			var url : String = "https://test.adyen.com/hpp/pay.shtml";
-			if (Mode == "LIVE") {
-				url = "https://live.adyen.com/hpp/pay.shtml";
-			}
-		}
-		
-	</isscript>
-	
-	<!--- TEMPLATENAME: redirect.isml --->
-	<form name="shopForm" id="shopForm" action="${url}" method="post">      
-		<input type="hidden" name="skinCode"             value="${dw.system.Site.getCurrent().getCustomPreferenceValue('Adyen_skinCode')}" /> 
-		<input type="hidden" name="merchantAccount"      value="${dw.system.Site.getCurrent().getCustomPreferenceValue('Adyen_merchantCode')}" /> 
-		<input type="hidden" name="shopperEmail"         value="${pdict.shopperEmail}" /> 
-		<input type="hidden" name="shopperReference"     value="${pdict.shopperReference}" />  
-		<input type="hidden" name="recurringContract"    value="${dw.system.Site.getCurrent().getCustomPreferenceValue('Adyen_recurringType')}" /> 
-		<input type="hidden" name="merchantReference"    value="${pdict.OrderNo}" /> 
-		<input type="hidden" name="shipBeforeDate"       value="2019-04-06T18:10:29+02:00" />
-		<input type="hidden" name="sessionValidity"      value="2019-04-06T18:10:29+02:00" />
-		<input type="hidden" name="merchantSig"          value="${pdict.merchantSig}" /> 
-		<input type="hidden" name="paymentAmount"        value="${pdict.Amount100}" />
-		<input type="hidden" name="currencyCode"         value="${pdict.Order.currencyCode}" /> 
-		<input type="hidden" name="resURL"               value="${URLUtils.https('Adyen-ShowConfirmation', 'pc', pdict.Order.getBillingAddress().getPostalCode(), 'pn', pdict.Order.getBillingAddress().getPhone(), 'cn', pdict.Order.getCustomerNo(), 'ce', pdict.Order.getCustomerEmail())}" /> 
-        
-		<isif condition="${directoryLookup}">
-			<input type="hidden" name="brandCode" value="${pdict.CurrentHttpParameterMap.brandCode.value}" />
-			<isif condition="${!empty(pdict.CurrentHttpParameterMap.issuerId.value)}">
-				<input type="hidden" name="issuerId" value="${pdict.CurrentHttpParameterMap.issuerId.value}" />
-			</isif>
-		</isif>
-		
-		<isif condition="${Debug}">
-			<input type="submit" value='pay' style='margin-left:200px'/>
-		</isif>
-	</form>
-	
-	<isif condition="${!Debug}">
-		<script>document.forms[0].submit();</script>
-	</isif>    
-
-
-</body>
-</html>
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/redirect_sha256.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/redirect_sha256.isml
deleted file mode 100644
index 626c9ce0a..000000000
--- a/cartridges/int_adyen_overlay/cartridge/templates/default/redirect_sha256.isml
+++ /dev/null
@@ -1,74 +0,0 @@
-<!--- TEMPLATENAME: redirect_sha256.isml --->
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml">
-<iscomment>
-	Redirects to Adyen by auto-submitting the form
-	
-	This creates a reporting entry for source codes in case a source code is available.
-	It relies on the fact, that the source code entry page is a special pipeline and
-	a redirect is executed at the end using this template.
-
-	If no source code is available in the session, no data is reported. So it is safe
-	to keep the include here and use the redirect for other purposes.
-</iscomment>
-
-<head>
-	<title>${Resource.msg('redirect.payment','common',null)}</title>
-	<meta http-equiv="Robots" content="noindex, follow" />
-</head>
-<body>
-	
-	<isscript>
-		importPackage( dw.system );
-		var directoryLookup : Boolean = Site.getCurrent().getCustomPreferenceValue("Adyen_directoryLookup");
-		var Mode : String = Site.getCurrent().getCustomPreferenceValue("Adyen_Mode");
-		var Debug : String = Site.getCurrent().getCustomPreferenceValue("Adyen_Debug");
-		var paymentSelection : String = Site.getCurrent().getCustomPreferenceValue("Adyen_PaymentSelection");
-		
-		var hppType;
-		switch (paymentSelection) {
-			case 'one': 
-				hppType = 'pay';
-				break;
-			case 'multi':
-				hppType = 'select';
-				break;
-			default:
-				hppType = 'select';
-		}
-		
-		var inputType : String = Debug ? 'text' : 'hidden';
-		
-		if (directoryLookup) {
-			var url : String = "https://test.adyen.com/hpp/skipDetails.shtml";
-			if (Mode == "LIVE") {
-				url = "https://live.adyen.com/hpp/skipDetails.shtml";
-			}
-		} else {
-			var url : String = "https://test.adyen.com/hpp/" + hppType + ".shtml";
-			if (Mode == "LIVE") {
-				url = "https://live.adyen.com/hpp/" + hppType + ".shtml";
-			}
-		}
-		
-	</isscript>
-	
-	<!--- TEMPLATENAME: redirect_sha256.isml --->
-	<form name="adyenForm" id="adyenForm" action="${url}" method="post">
-
-		<isloop items="${pdict.ParamsMap.entrySet()}" var="keyvalue">
-			<input type="${inputType}" name="${keyvalue.key}" value="${keyvalue.value}" /> </br>
-		</isloop>
-		
-		<isif condition="${Debug}">
-			<input type="submit" value='pay' style='margin-left:200px'/>
-		</isif>
-	</form>
-	
-	<isif condition="${!Debug}">
-		<script>document.forms[0].submit();</script>
-	</isif>    
-
-
-</body>
-</html>
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/threeds2/adyen3ds2.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/threeds2/adyen3ds2.isml
new file mode 100644
index 000000000..c5ab5987f
--- /dev/null
+++ b/cartridges/int_adyen_overlay/cartridge/templates/default/threeds2/adyen3ds2.isml
@@ -0,0 +1,118 @@
+<isset name="resultCode" value="${pdict.resultCode}" scope="page"/>
+<isset name="token3ds2" value="${pdict.token3ds2}" scope="page"/>
+<isset name="authorise3DS2" value="${URLUtils.https('Adyen-Authorize3DS2')}" scope="page"/>
+<isset name="AdyenHelper" value="${require('*/cartridge/scripts/util/AdyenHelper')}" scope="pdict"/>
+
+<html>
+<head>
+    <script type="text/javascript" src="${pdict.AdyenHelper.getLoadingContext()}sdk/3.0.0/adyen.js"></script>
+    <script type="text/javascript" src="https://code.jquery.com/jquery-1.7.1.min.js"></script>
+    <link rel="stylesheet"  href="${pdict.AdyenHelper.getLoadingContext()}sdk/3.0.0/adyen.css"/>
+
+    <script type="text/javascript">
+        var resultCode = "${pdict.resultCode}";
+        var token3ds2 = "${pdict.token3ds2}";
+
+        function initiateCheckout ( locale, environment, originKey ) {
+            var configuration = {
+                locale: locale,// shopper's locale
+                environment: environment,
+                originKey: originKey,
+                risk: {
+                    enabled: false
+                }
+            };
+            this.checkout = new AdyenCheckout(configuration);
+        }
+
+        var originKey = "";
+        var environment = "";
+
+        function setConfigData(data) {
+            originKey = data.adyenOriginKey[Object.keys(data.adyenOriginKey)[0]];
+            environment = data.adyenEnvironment;
+        };
+
+        function initiateComponents () {
+            getConfigurationComponents();
+            initiateCheckout("en_US", environment, originKey);
+            if (resultCode == "ChallengeShopper") {
+                initiate3DS2ChallengeShopper(token3ds2);
+            } else if (resultCode == "IdentifyShopper") {
+                initiate3DS2IdentifyShopper(token3ds2);
+            }
+        }
+
+        function getConfigurationComponents() {
+            $.ajax({
+                url: 'Adyen-GetConfigurationComponents',
+                type: 'get',
+                data: {protocol: window.location.protocol},
+                success: function (data) {
+                    if (!data.error) {
+                        setConfigData(data);
+                    } else {
+                        $('#errorLoadComponent').text(data.errorMessage);
+                    }
+                }
+            });
+        };
+
+        function initiate3DS2IdentifyShopper (fingerprintToken) {
+            var threeDS2IdentifyShopperNode = document.getElementById('threeDS2');
+            var identifyShopperComponent = this.checkout.create('threeDS2DeviceFingerprint', {
+                fingerprintToken: fingerprintToken,
+                onComplete: function (fingerprintData) {
+                    var fingerprintResult = fingerprintData.data.details["threeds2.fingerprint"];
+                    var fingerprintResultField = document.getElementById('fingerprintResult');
+                    fingerprintResultField.value = fingerprintResult;
+                    document.getElementById("3ds2-form").submit();
+
+                }, // Gets triggered whenever the ThreeDS2 component has a result
+
+                onError: function (error) {
+                    console.log(JSON.stringify(error));
+                } // Gets triggered on error
+            });
+            identifyShopperComponent.mount(threeDS2IdentifyShopperNode);
+        }
+
+        function initiate3DS2ChallengeShopper (challengeToken) {
+            var threeDS2ChallengeShopperNode = document.getElementById('threeDS2');
+            var challengeShopperComponent = this.checkout
+                .create('threeDS2Challenge', {
+                    challengeToken: challengeToken,
+                    onComplete: function (challengeData) {
+                        var challengeResult = challengeData.data.details["threeds2.challengeResult"];
+                        var challengeResultField = document.getElementById('challengeResult');
+                        challengeResultField.value = challengeResult;
+                        document.getElementById("3ds2-form").submit();
+                    },
+                    onError: function (error) {
+                        console.log(JSON.stringify(error));
+
+                    }, // Gets triggered on error
+                    size: '05' // Defaults to '01'
+                });
+            challengeShopperComponent.mount(threeDS2ChallengeShopperNode);
+        }
+    </script>
+
+</head>
+<body onload=initiateComponents()>
+    <form method="post"
+          id="3ds2-form"
+          action="${authorise3DS2}">
+        <div class="row">
+            <div class="col-sm-6">
+                <div id="threeDS2"></div>
+                <span id="errorLoadComponent"></span>
+                <input type="hidden" name="resultCode" value="${resultCode}"/>
+                <input type="hidden" name="token3ds2" value="${token3ds2}"/>
+                <input type="hidden" id="fingerprintResult" name="fingerprintResult"/>
+                <input type="hidden" id="challengeResult" name="challengeResult"/>
+            </div>
+        </div>
+    </form>
+</body>
+</html>
\ No newline at end of file
diff --git a/metadata/site_import/meta/system-objecttype-extensions.xml b/metadata/site_import/meta/system-objecttype-extensions.xml
index 4badf9d9b..e445dda4e 100644
--- a/metadata/site_import/meta/system-objecttype-extensions.xml
+++ b/metadata/site_import/meta/system-objecttype-extensions.xml
@@ -87,7 +87,7 @@
             <attribute-definition attribute-id="adyenPaymentData">
                 <display-name xml:lang="x-default">adyenPaymentData</display-name>
                 <description xml:lang="x-default">Adyen PaymentData 3D Secure</description>
-                <type>string</type>
+                <type>text</type>
                 <mandatory-flag>false</mandatory-flag>
                 <externally-managed-flag>false</externally-managed-flag>
                 <min-length>0</min-length>
@@ -264,6 +264,13 @@
 
     <type-extension type-id="SitePreferences">
         <custom-attribute-definitions>
+            <attribute-definition attribute-id="Adyen3DS2Enabled">
+                <display-name xml:lang="x-default">3DS2 Enabled</display-name>
+                <type>boolean</type>
+                <mandatory-flag>false</mandatory-flag>
+                <externally-managed-flag>false</externally-managed-flag>
+                <default-value>true</default-value>
+            </attribute-definition>
             <attribute-definition attribute-id="AdyenCseEnabled">
                 <display-name xml:lang="x-default">CSE Enabled</display-name>
                 <type>boolean</type>
@@ -472,4 +479,4 @@
             </attribute-group>
         </group-definitions>
 </type-extension>
-</metadata>
\ No newline at end of file
+</metadata>

From 034e60c600acd6e99e22f625735e562b9d53326b Mon Sep 17 00:00:00 2001
From: Bas Maassen <bas.maassen@adyen.com>
Date: Thu, 27 Jun 2019 13:56:57 +0200
Subject: [PATCH 15/22] Small fixes release (#169)

* Small fixes release
---
 .../cartridge/client/default/js/adyenCheckout.js         | 2 +-
 .../cartridge/client/default/js/checkout/billing.js      | 9 ++++++++-
 cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js | 2 +-
 .../billing/paymentOptions/creditCardSummary.isml        | 5 +++++
 .../checkout/billing/storedPaymentInstruments.isml       | 2 +-
 .../cartridge/scripts/util/AdyenHelper.ds                | 7 +++----
 6 files changed, 19 insertions(+), 8 deletions(-)

diff --git a/cartridges/int_adyen_SFRA/cartridge/client/default/js/adyenCheckout.js b/cartridges/int_adyen_SFRA/cartridge/client/default/js/adyenCheckout.js
index 6196015bc..d2f213c28 100644
--- a/cartridges/int_adyen_SFRA/cartridge/client/default/js/adyenCheckout.js
+++ b/cartridges/int_adyen_SFRA/cartridge/client/default/js/adyenCheckout.js
@@ -343,7 +343,7 @@ $('button[value="submit-payment"]').on('click', function (e) {
             if (!oneClickValid) {
                 return false;
             } else {
-                var selectedCardType = document.getElementById('cardType-' + uuid).innerText;
+                var selectedCardType = document.getElementById('cardType-' + uuid).value;
                 document.getElementById('saved-payment-security-code-' + uuid).value = "000";
                 $('#cardType').val(selectedCardType)
                 $('#selectedCardID').val($('.selected-payment').data('uuid'));
diff --git a/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout/billing.js b/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout/billing.js
index 0b10a099e..ab1dc0f4a 100644
--- a/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout/billing.js
+++ b/cartridges/int_adyen_SFRA/cartridge/client/default/js/checkout/billing.js
@@ -16,11 +16,18 @@ function updatePaymentInformation(order) {
                 + order.billing.payment.selectedPaymentInstruments[0].type
                 + '</span>';
 
-            if (order.billing.payment.selectedPaymentInstruments[0].maskedCreditCardNumber != null) {
+            if (order.billing.payment.selectedPaymentInstruments[0].maskedCreditCardNumber) {
                 htmlToAppend += '<div>'
                     + order.billing.payment.selectedPaymentInstruments[0].maskedCreditCardNumber
                     + '</div>';
             }
+            if(order.billing.payment.selectedPaymentInstruments[0].expirationMonth && order.billing.payment.selectedPaymentInstruments[0].expirationYear){
+                htmlToAppend += '<div><span>'
+                + order.resources.cardEnding + ' '
+                + order.billing.payment.selectedPaymentInstruments[0].expirationMonth
+                + '/' + order.billing.payment.selectedPaymentInstruments[0].expirationYear
+                + '</span></div>';
+            }
         } else if (order.billing.payment.selectedPaymentInstruments[0].paymentMethod == "Adyen") {
             htmlToAppend += '<div><span>'
                 + order.billing.payment.selectedPaymentInstruments[0].selectedAdyenPM
diff --git a/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js b/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js
index 78db05055..b274d87c2 100644
--- a/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js
+++ b/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js
@@ -210,7 +210,7 @@ server.get('ShowConfirmation', server.middleware.https, function (req, res, next
         paymentInstrument.custom.adyenPaymentData = null;
     });
     // Authorised: The payment authorisation was successfully completed.
-    if (result.resultCode == "Authorised" || result.resultCode == 'Pending') {
+    if (result.resultCode == "Authorised" || result.resultCode == 'Pending' || result.resultCode == 'Received') {
         var OrderModel = require('*/cartridge/models/order');
         var Locale = require('dw/util/Locale');
         var currentLocale = Locale.getLocale(req.locale.id);
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/creditCardSummary.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/creditCardSummary.isml
index 32183d4ca..30774c8e2 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/creditCardSummary.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/paymentOptions/creditCardSummary.isml
@@ -7,4 +7,9 @@
         ${payment.maskedCreditCardNumber}
     </div>
 </isif>
+<isif condition="${payment.expirationMonth && payment.expirationYear}">
+    <div class="credit-card-expiration-date">
+        <span>${Resource.msg('msg.card.type.ending', 'confirmation', null)} ${payment.expirationMonth}/${payment.expirationYear}</span>
+    </div>
+</isif>
 
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/storedPaymentInstruments.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/storedPaymentInstruments.isml
index 2f011137c..669065ec9 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/storedPaymentInstruments.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/storedPaymentInstruments.isml
@@ -29,7 +29,7 @@
         <div class="saved-payment-information col-6 col-md-9">
             <div class="saved-credit-card-type">
                 <input type="hidden" id="cardType-${paymentInstrument.UUID}" value="${AdyenHelper.getAdyenCardType(paymentInstrument.creditCardType)}"/>
-                <span id="cardType">
+                <span id="span_cardType">
                     ${paymentInstrument.creditCardType}
                 </span>
             </div>
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
index bb763732e..1f50ebdb9 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
@@ -5,7 +5,6 @@ var dwsvc = require("dw/svc");
 var dwnet = require("dw/net");
 var dwsystem = require("dw/system");
 var dwutil = require("dw/util");
-
 var adyenCurrentSite = dwsystem.Site.getCurrent();
 var __AdyenHelper: Object = {
 
@@ -359,11 +358,11 @@ var __AdyenHelper: Object = {
             if(params.Args.adyenForm.dateOfBirth.value){
                 shopperObject['dateOfBirth'] = params.Args.adyenForm.dateOfBirth.value;
             }
-            if(params.Args.adyenForm.telephoneNumber){
+            if(params.Args.adyenForm.telephoneNumber.value){
                 shopperObject['telephoneNumber'] = params.Args.adyenForm.telephoneNumber.value;
             }
-            else if(params.Args.Order.getDefaultShipment().getShippingAddress().getPhone()){
-                shopperObject['telephoneNumber']= params.Args.Order.getDefaultShipment().getShippingAddress().getPhone()
+            else if(params.Args.Order.defaultShipment.shippingAddress.phone){
+                shopperObject['telephoneNumber']= params.Args.Order.defaultShipment.shippingAddress.phone
             }
         }
 

From 2220dbaad5ce82ed9681315e75f6cf272fac7f0d Mon Sep 17 00:00:00 2001
From: basm <bas.maassen@adyen.com>
Date: Fri, 28 Jun 2019 09:29:51 +0200
Subject: [PATCH 16/22] Deleted loggers, renamed function

---
 .../int_adyen_controllers/cartridge/controllers/Adyen.js    | 6 +++---
 .../cartridge/scripts/payment/processor/ADYEN_CREDIT.js     | 2 +-
 .../cartridge/scripts/adyenRedirectVerificationSHA256.ds    | 3 ---
 3 files changed, 4 insertions(+), 7 deletions(-)

diff --git a/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js b/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js
index 937a0315f..f3cc65edc 100644
--- a/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js
+++ b/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js
@@ -526,11 +526,11 @@ function authorizeWithForm() {
 }
 
 /**
- * Close IFrame where was 3d secure form
+  Post the retrieved 3ds data
  * 
  * @returns template
  */
-function closeIFrame() {
+function closeThreeDS() {
 	var adyenResponse = {
 			MD : request.httpParameterMap.get("MD").stringValue,
 			PaRes : request.httpParameterMap.get("PaRes").stringValue
@@ -598,7 +598,7 @@ exports.Redirect3DS2 = guard.ensure(['https', 'post'], redirect3ds2);
 
 exports.AuthorizeWithForm = guard.ensure(['https', 'post'], authorizeWithForm);
 
-exports.CloseIFrame = guard.ensure(['https', 'post'], closeIFrame);
+exports.CloseThreeDS = guard.ensure(['https', 'post'], closeThreeDS);
 
 exports.GetConfigurationComponents = guard.ensure(['https', 'get'], getConfigurationComponents);
 
diff --git a/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js b/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js
index 9fdca8ca3..6bdf73307 100644
--- a/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js
+++ b/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js
@@ -121,7 +121,7 @@ function Authorize(args) {
 	            authorized3d: true,
 	            redirectObject: result.RedirectObject,
 	            view: app.getView({
-	                ContinueURL: URLUtils.https('Adyen-CloseIFrame', 'utm_nooverride', '1'),
+	                ContinueURL: URLUtils.https('Adyen-CloseThreeDS', 'utm_nooverride', '1'),
 	                Basket: order,
 	                issuerUrl : result.RedirectObject.url,
 	                paRequest : result.RedirectObject.data.PaReq,
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyenRedirectVerificationSHA256.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyenRedirectVerificationSHA256.ds
index 37c989de4..b2e14a083 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/adyenRedirectVerificationSHA256.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyenRedirectVerificationSHA256.ds
@@ -293,11 +293,8 @@ function verify (args) {
     msg = "DW2AdyenRedir v " + VERSION + " - Payment info\n================================================================";
     msg += "\nMode : " + Mode;
     msg += "\nRecurring : " + setRecurringType;
-    msg += "\nSessionID : " + args.CurrentSession.sessionID;
     msg += "\nmRef : " + orderNo ;
-    msg += "\nShopper email : " + order.customerEmail + " , ID : " + customerID;
 	msg += "\nAmount : " + args.Amount100 ;//+ " , " + args.Amount.currencyCode;
-	msg += "\nPaydata : " + requestString ;
 	msg += "\nSignature : " + merchantSig ;
 
 	//Log those information just when custom logs debug mode is enabled

From f0a7657dbd944505f9d3881460707e12b6a9018d Mon Sep 17 00:00:00 2001
From: Bas Maassen <bas.maassen@adyen.com>
Date: Tue, 2 Jul 2019 10:15:56 +0200
Subject: [PATCH 17/22] v41 and shopperLocale (#170)

---
 .../cartridge/scripts/util/AdyenHelper.ds                 | 4 ++++
 metadata/site_import/services.xml                         | 8 ++++----
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
index 1f50ebdb9..5909c704f 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
@@ -351,6 +351,10 @@ var __AdyenHelper: Object = {
             shopperObject['shopperReference'] = customerID;
         }
 
+        if(request.getLocale()){
+            shopperObject['shopperLocale'] = request.getLocale();
+        }
+
         if(params.Args.adyenForm) {
             if(params.Args.adyenForm.socialSecurityNumber.value){
                 shopperObject['socialSecurityNumber'] = params.Args.adyenForm.socialSecurityNumber.value;
diff --git a/metadata/site_import/services.xml b/metadata/site_import/services.xml
index 84d9ae0eb..e2fc83f36 100644
--- a/metadata/site_import/services.xml
+++ b/metadata/site_import/services.xml
@@ -1,17 +1,17 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <services xmlns="http://www.demandware.com/xml/impex/services/2014-09-26">
      <service-credential service-credential-id="AdyenPayment">
-        <url>https://checkout-test.adyen.com/checkout/v40/payments</url>
+        <url>https://checkout-test.adyen.com/checkout/v41/payments</url>
         <user-id>yourWebServiceUser</user-id>
         <password/>
     </service-credential>
     <service-credential service-credential-id="AdyenPayment3DSecure">
-        <url>https://checkout-test.adyen.com/checkout/v40/payments/details</url>
+        <url>https://checkout-test.adyen.com/checkout/v41/payments/details</url>
         <user-id>yourWebServiceUser</user-id>
         <password/>
     </service-credential>
     <service-credential service-credential-id="AdyenPaymentDetails">
-        <url>https://checkout-test.adyen.com/checkout/v40/payments/details</url>
+        <url>https://checkout-test.adyen.com/checkout/v41/payments/details</url>
         <user-id>yourWebServiceUser</user-id>
         <password/>
     </service-credential>
@@ -41,7 +41,7 @@
         <password/>
     </service-credential>
     <service-credential service-credential-id="AdyenCheckoutPaymentMethods">
-        <url>https://checkout-test.adyen.com/v40/paymentMethods</url>
+        <url>https://checkout-test.adyen.com/v41/paymentMethods</url>
         <user-id></user-id>
         <password/>
     </service-credential>

From 73c1d25b7c492dbc8e5f585788494f4774957cc5 Mon Sep 17 00:00:00 2001
From: Bas Maassen <bas.maassen@adyen.com>
Date: Wed, 3 Jul 2019 13:13:10 +0200
Subject: [PATCH 18/22] Add credit card in My Account (#171)

* browserInfo my account credit card
---
 .../controllers/PaymentInstruments.js         |  1 +
 .../default/account/payment/paymentForm.isml  | 15 ++-----
 .../cartridge/js/pages/checkout/adyen-cse.js  |  1 +
 .../cartridge/scripts/adyenCheckout.ds        |  4 ++
 .../scripts/adyenCreateRecurringPayment.ds    |  5 ++-
 .../cartridge/scripts/util/AdyenHelper.ds     | 43 ++++++++++++-------
 .../checkout/billing/adyenpaymentfields.isml  |  2 +-
 7 files changed, 42 insertions(+), 29 deletions(-)

diff --git a/cartridges/int_adyen_SFRA/cartridge/controllers/PaymentInstruments.js b/cartridges/int_adyen_SFRA/cartridge/controllers/PaymentInstruments.js
index 5745a9185..55a11c6f3 100644
--- a/cartridges/int_adyen_SFRA/cartridge/controllers/PaymentInstruments.js
+++ b/cartridges/int_adyen_SFRA/cartridge/controllers/PaymentInstruments.js
@@ -22,6 +22,7 @@ server.replace('SavePayment', csrfProtection.validateAjaxRequest, function (req,
     viewData.adyenEncryptedExpiryMonth = paymentForm.adyenEncryptedExpiryMonth.value;
     viewData.adyenEncryptedExpiryYear = paymentForm.adyenEncryptedExpiryYear.value;
     viewData.adyenEncryptedSecurityCode = paymentForm.adyenEncryptedSecurityCode.value;
+    viewData.browserInfo = paymentForm.browserInfo.value;
     res.setViewData(viewData);
 
     if (paymentForm.valid) {
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/account/payment/paymentForm.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/account/payment/paymentForm.isml
index 2093d7f83..2cfc887b3 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/account/payment/paymentForm.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/account/payment/paymentForm.isml
@@ -1,5 +1,6 @@
 <isscript>
     var assets = require('*/cartridge/scripts/assets.js');
+    assets.addJs('/js/adyenCheckout.js');
     assets.addCss('/css/adyenCss.css');
     assets.addCss('/css/adyen-checkout-3.0.0.css');
 </isscript>
@@ -25,17 +26,9 @@
            ${pdict.paymentForm.adyenEncryptedExpiryYear.attributes}>
     <input type="hidden" class="form-control adyenEncryptedSecurityCode" id="adyenEncryptedSecurityCode"
            ${pdict.paymentForm.adyenEncryptedSecurityCode.attributes}>
-
-    <div class="row">
-        <div class="col-12">
-            <div class="form-group">
-                <label class="form-control-label" for="cardOwner">${Resource.msg('field.credit.card.holderName','creditCard',null)}</label>
-                <input type="text" class="form-control cardOwner" id="cardOwner"
-                       ${pdict.paymentForm.cardOwner.attributes}>
-                <div class="invalid-feedback"></div>
-            </div>
-        </div>
-    </div>
+    <input type="hidden" class="form-control cardOwner" id="cardOwner"
+           ${pdict.paymentForm.cardOwner.attributes}>
+    <input type="hidden" class="form-control browserInfo" id="browserInfo" ${pdict.paymentForm.browserInfo.attributes}>
 
     <span id="errorLoadComponent"></span>
     <div id="card"></div>
diff --git a/cartridges/int_adyen_overlay/cartridge/js/pages/checkout/adyen-cse.js b/cartridges/int_adyen_overlay/cartridge/js/pages/checkout/adyen-cse.js
index 62621bf35..7bfdeb503 100644
--- a/cartridges/int_adyen_overlay/cartridge/js/pages/checkout/adyen-cse.js
+++ b/cartridges/int_adyen_overlay/cartridge/js/pages/checkout/adyen-cse.js
@@ -174,6 +174,7 @@
         	e.preventDefault();
             if (window.AdyenCard.isValid) {
             	copyCardData(window.AdyenCard);
+                setBrowserData();
             	$('#add-card-submit-hidden').trigger('click');
             }
         });
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds
index bd77c197b..f0b48af37 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds
@@ -101,6 +101,10 @@ function createPaymentRequest(args, paymentMethodObject, returnUrl) {
     var profile = !empty(customer) && customer.registered && !empty(customer.getProfile()) ? customer.getProfile() : null;
     var customerID = '';
 
+    if(AdyenHelper.getAdyen3DS2Enabled() && empty(args.PaymentType)){
+        jsonObject = AdyenHelper.add3DS2Data(jsonObject, 'billing');
+    }
+
     if (!empty(profile) && !empty(profile.getCustomerNo())) {
         customerID = profile.getCustomerNo();
     }
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyenCreateRecurringPayment.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyenCreateRecurringPayment.ds
index f202bdf9e..f26b170b0 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/adyenCreateRecurringPayment.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyenCreateRecurringPayment.ds
@@ -45,8 +45,11 @@ function createRecurringPayment(args) {
         args.PspReference = '';
         args.AdyenErrorMessage = '';
 
-        service.addHeader('Content-type', 'application/json');
+        var apiKey = AdyenHelper.getAdyenApiKey();
+        service.addHeader('Content-type','application/json');
         service.addHeader('charset', 'UTF-8');
+        service.addHeader('X-API-KEY', apiKey);
+
         callResult = service.call(JSON.stringify(requestObject));
 
         if (callResult.isOk() == false) {
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
index 5909c704f..7ced80493 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
@@ -285,8 +285,8 @@ var __AdyenHelper: Object = {
                 }
                 break;
             case 'account':
-                if (session.forms.paymentinstruments) {
-                    card = session.forms.paymentinstruments.creditcards.newcreditcard;
+                if (session.forms.billing.paymentMethods) {
+                    card = session.forms.billing.paymentMethods.creditCard;
                     paymentMethodObject['holderName'] = card.owner.value;
                 } else {
                     // structure for SFRA
@@ -355,7 +355,7 @@ var __AdyenHelper: Object = {
             shopperObject['shopperLocale'] = request.getLocale();
         }
 
-        if(params.Args.adyenForm) {
+        if(params.Args && params.Args.adyenForm) {
             if(params.Args.adyenForm.socialSecurityNumber.value){
                 shopperObject['socialSecurityNumber'] = params.Args.adyenForm.socialSecurityNumber.value;
             }
@@ -390,10 +390,6 @@ var __AdyenHelper: Object = {
             'userAgent': request.httpUserAgent
         };
 
-        if(__AdyenHelper.getAdyen3DS2Enabled() && empty(paymentType)){
-            jsonObject = __AdyenHelper.add3DS2Data(jsonObject);
-        }
-
         if (__AdyenHelper.getAdyenRecurringPaymentsEnabled() && !empty(recurringType)) {
 
             if (saveCreditCard) {
@@ -419,12 +415,16 @@ var __AdyenHelper: Object = {
     createRecurringPaymentAccount: function (params) {
         var tokenID = '',
             pspReference = '';
-
+        var formType = 'account';
         var recurringType = __AdyenHelper.getAdyenRecurringType();
 
         var jsonObject = __AdyenHelper.createAdyenRequestObject(recurringType, null, true, null);
 
-        var paymentMethodObject = __AdyenHelper.createCardObjectSF(false, 'account');
+        if(__AdyenHelper.getAdyen3DS2Enabled()){
+            jsonObject = __AdyenHelper.add3DS2Data(jsonObject, formType);
+        }
+
+        var paymentMethodObject = __AdyenHelper.createCardObjectSF(false, formType);
         jsonObject['paymentMethod'] = paymentMethodObject;
 
         jsonObject['enableOneClick'] = true;
@@ -479,19 +479,30 @@ var __AdyenHelper: Object = {
         return {error: true};
     },
 
-    add3DS2Data: function(jsonObject){
+    add3DS2Data: function(jsonObject, formType){
         jsonObject["additionalData"] = {
             allow3DS2: true
         };
         jsonObject["channel"] = "web";
 
         var card;
-        if (session.forms.billing.paymentMethods) {
-            card = session.forms.billing.paymentMethods.creditCard;
-        }
-        else {
-            //different structure in SFRA
-            card = session.forms.billing.creditCardFields;
+        switch (formType) {
+            case 'billing':
+                if (session.forms.billing.paymentMethods) {
+                    card = session.forms.billing.paymentMethods.creditCard;
+                } else {
+                    // structure for SFRA
+                    card = session.forms.billing.creditCardFields;
+                }
+                break;
+            case 'account':
+                if (session.forms.billing.paymentMethods) {
+                    card = session.forms.billing.paymentMethods.creditCard;
+                } else {
+                    // structure for SFRA
+                    card = session.forms.creditCard;
+                }
+                break;
         }
 
         var browserInfo = JSON.parse(card.browserInfo.value);
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentfields.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentfields.isml
index da0228216..a0d7b5256 100644
--- a/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentfields.isml
+++ b/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentfields.isml
@@ -57,8 +57,8 @@
     <input type="hidden" id="${pdict.CurrentForms.billing.paymentMethods.creditCard.adyenEncryptedExpiryMonth.htmlName}" name="${pdict.CurrentForms.billing.paymentMethods.creditCard.adyenEncryptedExpiryMonth.htmlName}">
     <input type="hidden" id="${pdict.CurrentForms.billing.paymentMethods.creditCard.adyenEncryptedExpiryYear.htmlName}" name="${pdict.CurrentForms.billing.paymentMethods.creditCard.adyenEncryptedExpiryYear.htmlName}">
     <input type="hidden" id="${pdict.CurrentForms.billing.paymentMethods.creditCard.adyenEncryptedSecurityCode.htmlName}" name="${pdict.CurrentForms.billing.paymentMethods.creditCard.adyenEncryptedSecurityCode.htmlName}">
+    <input type="hidden" id="${pdict.CurrentForms.billing.paymentMethods.creditCard.browserInfo.htmlName}" name="${pdict.CurrentForms.billing.paymentMethods.creditCard.browserInfo.htmlName}">
     <isinputfield formfield="${pdict.CurrentForms.billing.paymentMethods.creditCard.selectedCardID}" type="hidden"/>
-    <isinputfield formfield="${pdict.CurrentForms.billing.paymentMethods.creditCard.browserInfo}" type="hidden"/>
 </div>
 
 

From 520e6d40fd1300a9e88c2e35ae0a282abcedcd7e Mon Sep 17 00:00:00 2001
From: Bas Maassen <bas.maassen@adyen.com>
Date: Thu, 4 Jul 2019 11:43:53 +0200
Subject: [PATCH 19/22] Refactor code for My Account (#173)

* Refactor code for My Account
---
 .../hooks/payment/processor/adyen_credit.js   |   3 +-
 .../scripts/payment/processor/ADYEN_CREDIT.js |   1 -
 .../cartridge/scripts/adyenCheckout.ds        | 113 ++++----------
 .../cartridge/scripts/util/AdyenHelper.ds     | 146 ++++++++++++------
 4 files changed, 125 insertions(+), 138 deletions(-)

diff --git a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js
index 4f8b676b6..7bc78a257 100644
--- a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js
+++ b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js
@@ -64,7 +64,6 @@ function Authorize(orderNumber, paymentInstrument, paymentProcessor) {
 
     var result = adyenCheckout.creditCard({
         Order: order,
-        Amount: paymentInstrument.paymentTransaction.amount,
         CurrentSession: session,
         CurrentRequest: request,
         PaymentInstrument: paymentInstrument,
@@ -80,6 +79,7 @@ function Authorize(orderNumber, paymentInstrument, paymentProcessor) {
         };
     }
 
+    //Trigger 3DS2.0 flow
     if(result.ThreeDS2){
         Transaction.commit();
         Transaction.wrap(function () {
@@ -96,6 +96,7 @@ function Authorize(orderNumber, paymentInstrument, paymentProcessor) {
         }
     }
 
+    //Trigger 3DS flow
     else if (result.RedirectObject != '') {
         Transaction.commit();
         Transaction.wrap(function () {
diff --git a/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js b/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js
index 6bdf73307..0670c40c1 100644
--- a/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js
+++ b/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js
@@ -66,7 +66,6 @@ function Authorize(args) {
     Transaction.begin();
     var result = adyenCheckout.creditCard({
         Order: order,
-        Amount: paymentInstrument.paymentTransaction.amount,
         CurrentSession: session,
         CurrentRequest: request,
         PaymentInstrument: paymentInstrument,
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds
index f0b48af37..04bccef21 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds
@@ -94,94 +94,41 @@ function creditCard(args) {
 
 function createPaymentRequest(args, paymentMethodObject, returnUrl) {
     var order = args.Order;
-    var recurringType = AdyenHelper.getAdyenRecurringType();
     var saveCreditCard = !empty(args.SaveCreditCard) ? args.SaveCreditCard : false;
-    var jsonObject = AdyenHelper.createAdyenRequestObject(recurringType, order, saveCreditCard, args.PaymentType);
-    var customer = order.getCustomer();
-    var profile = !empty(customer) && customer.registered && !empty(customer.getProfile()) ? customer.getProfile() : null;
-    var customerID = '';
 
+    //Create general request object
+    var jsonObject = AdyenHelper.createAdyenRequestObject(order, saveCreditCard);
+
+    //Get 3DS2 data
     if(AdyenHelper.getAdyen3DS2Enabled() && empty(args.PaymentType)){
         jsonObject = AdyenHelper.add3DS2Data(jsonObject, 'billing');
     }
 
-    if (!empty(profile) && !empty(profile.getCustomerNo())) {
-        customerID = profile.getCustomerNo();
-    }
-
+    //Different returnUrl for APM's and credit cards
     jsonObject['returnUrl'] = returnUrl;
 
-    var myAmount = AdyenHelper.getCurrencyValueForApi(args.Amount); //args.Amount * 100;
+    var myAmount = AdyenHelper.getCurrencyValueForApi(args.PaymentInstrument.paymentTransaction.amount); //args.Amount * 100;
     jsonObject['amount'] = {
-        'currency': args.Amount.currencyCode,
+        'currency': args.PaymentInstrument.paymentTransaction.amount.currencyCode,
         'value': myAmount
     };
 
-    var shippingAddr: OrderAddress = args.Order.defaultShipment.shippingAddress;
-    var houseNumberShip;
-    if (shippingAddr.address2) {
-        houseNumberShip = shippingAddr.address2;
+    //Create billing and delivery address objects for new orders, no address fields for credit cards through My Account
+    if(order){
+        jsonObject = AdyenHelper.createAddressObjects(order, jsonObject);
     }
-    else {
-        houseNumberShip = "N/A";
-    }
-    jsonObject["countryCode"] = shippingAddr.countryCode.value.toUpperCase();
-    
-    jsonObject.deliveryAddress = {
-        "city": shippingAddr.city,
-        "country": shippingAddr.countryCode.value.toUpperCase(),
-        "houseNumberOrName": houseNumberShip,
-        "postalCode": shippingAddr.postalCode,
-        "stateOrProvince": (!empty(shippingAddr.stateCode) ? shippingAddr.stateCode : 'NA'),
-        "street": shippingAddr.address1
-    };
-
-    var billingAddr: OrderAddress = args.Order.getBillingAddress();
-    var houseNumberBill;
-    if (billingAddr.address2) {
-        houseNumberBill = billingAddr.address2;
-    }
-    else {
-        houseNumberBill = "N/A";
-    }
-    jsonObject.billingAddress = {
-        "city": billingAddr.city,
-        "country": billingAddr.countryCode.value.toUpperCase(),
-        "houseNumberOrName": houseNumberBill,
-        "postalCode": billingAddr.postalCode,
-        "stateOrProvince": (!empty(billingAddr.stateCode) ? billingAddr.stateCode : 'NA'),
-        "street": billingAddr.address1
-    };
 
+    //Create shopper data fields
     var shopperObject = AdyenHelper.createShopperObject({
             Customer: customer,
-            Basket: order,
+            Order: order,
             Args: args
         });
 
-    var gender = "UNKNOWN";
-    if(args.adyenForm && args.adyenForm.gender.value){
-        switch(args.adyenForm.gender.value){
-            case "M":
-                gender = "MALE";
-                break;
-            case "F":
-                gender = "FEMALE";
-                break;
-            default:
-                gender = "UNKNOWN";
-        }
-    }
+    //Set payment method object
     jsonObject['paymentMethod'] = paymentMethodObject;
-    var shopperDetails = {
-        "firstName": billingAddr.firstName,
-        "gender": gender,
-        "infix": "",
-        "lastName": billingAddr.lastName
-    };
-
-    jsonObject['shopperName'] = shopperDetails;
 
+    //Set additional data for ACH
     if(!empty(args.PaymentType) && args.PaymentType.toString().substring(0, 3) == "ach") {
         if (!empty(args.adyenForm.bankAccountOwnerName.value)) {
             var bankAccount = {
@@ -194,6 +141,7 @@ function createPaymentRequest(args, paymentMethodObject, returnUrl) {
         }
     }
 
+    //Set open invoice data
 	if(!empty(args.PaymentType) && AdyenHelper.isOpenInvoiceMethod(args.PaymentType.toString())) {
         jsonObject["lineItems"] = AdyenGetOpenInvoiceData.getLineItems(args);
         if(args.ratePayFingerprint){
@@ -205,15 +153,6 @@ function createPaymentRequest(args, paymentMethodObject, returnUrl) {
     }
 
     var requestObject = AdyenHelper.extend(jsonObject, shopperObject);
-    // assign default values for the script output variables 
-    args.RedirectObject = '';
-    args.ResultCode = '';
-    args.AuthorizationCode = '';
-    args.PspReference = '';
-    args.PaymentStatus = '?';
-    args.AuthorizationAmount = '';
-    args.Decision = '';
-    args.AdyenErrorMessage = '';
 
     // make API call
     return doPaymentCall(args, requestObject);
@@ -260,12 +199,11 @@ function doPaymentCall(args, requestObject){
 
         args.PspReference = ('pspReference' in responseObj && !empty(responseObj.pspReference) ? responseObj.pspReference : '');
         args.PaymentStatus = resultObj.errorText;
-        args.AuthorizationAmount = args.Amount.getValue().toFixed(2);
         args.AdyenAmount = requestObject["amount"].value;
         args.Decision = 'ERROR';
-
         var resultCode = args.ResultCode;
-        var order = args.Order;
+
+        //Check the response object from /payment call
         if (responseObj.resultCode.indexOf('IdentifyShopper') != -1 || (responseObj.resultCode.indexOf('ChallengeShopper') != -1) ) {
             args.ThreeDS2 = true;
             args.resultCode = responseObj.resultCode;
@@ -285,9 +223,9 @@ function doPaymentCall(args, requestObject){
             args.PaymentStatus = resultCode;
             args.PaymentData = responseObj.paymentData;
             // if 3D Secure is used, the statuses will be updated later
-            if (responseObj.resultCode.indexOf('Authorised') != -1) {
-                order.setPaymentStatus(dw.order.Order.PAYMENT_STATUS_PAID);
-                order.setExportStatus(dw.order.Order.EXPORT_STATUS_READY);
+            if (args.Order && responseObj.resultCode.indexOf('Authorised') != -1) {
+                args.Order.setPaymentStatus(dw.order.Order.PAYMENT_STATUS_PAID);
+                args.Order.setExportStatus(dw.order.Order.EXPORT_STATUS_READY);
                 Logger.getLogger('Adyen').info('Payment result: Authorised');
             }
 
@@ -324,15 +262,17 @@ function doPaymentCall(args, requestObject){
                 args.PaymentInstrument.custom.adyenAdditionalPaymentData = JSON.stringify(multiBancoData);
             }
 
-            order.setPaymentStatus(dw.order.Order.PAYMENT_STATUS_NOTPAID);
-            order.setExportStatus(dw.order.Order.EXPORT_STATUS_NOTEXPORTED);
+            args.Order.setPaymentStatus(dw.order.Order.PAYMENT_STATUS_NOTPAID);
+            args.Order.setExportStatus(dw.order.Order.EXPORT_STATUS_NOTEXPORTED);
         }
         else  {
             args.PaymentStatus = 'Refused';
             args.Decision = 'REFUSED';
 
-            order.setPaymentStatus(dw.order.Order.PAYMENT_STATUS_NOTPAID);
-            order.setExportStatus(dw.order.Order.EXPORT_STATUS_NOTEXPORTED);
+            if(args.Order){
+                args.Order.setPaymentStatus(dw.order.Order.PAYMENT_STATUS_NOTPAID);
+                args.Order.setExportStatus(dw.order.Order.EXPORT_STATUS_NOTEXPORTED);
+            }
 
             errorMessage = dw.web.Resource.msg('confirm.error.declined','checkout', null);
             if ('refusalReason' in responseObj && !empty(responseObj.refusalReason)) {
@@ -401,5 +341,6 @@ module.exports = {
     'execute': execute,
     'creditCard': creditCard,
     'alternativePaymentMethod': alternativePaymentMethod,
+    'doPaymentCall' : doPaymentCall,
     'doPaymentDetailsCall': doPaymentDetailsCall
 }
\ No newline at end of file
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
index 7ced80493..7b9756e91 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
@@ -313,48 +313,8 @@ var __AdyenHelper: Object = {
 
     createShopperObject: function (params) {
         var shopperObject = {};
-        var customer = !empty(params) && 'Customer' in params && !empty(params.Customer) ? params.Customer : null;
-        var basket = !empty(params) && 'Basket' in params && !empty(params.Basket) ? params.Basket : null;
-        if (empty(customer) && !empty(basket)) {
-            customer = basket.getCustomer();
-        }
-        var profile = !empty(customer) && customer.registered && !empty(customer.getProfile()) ? customer.getProfile() : null;
-
-        var customerEmail = '';
-        if (!empty(basket) && !empty(basket.customerEmail)) {
-            customerEmail = basket.customerEmail;
-        }
-        if (empty(customerEmail) && !empty(profile) && !empty(profile.getEmail())) {
-            customerEmail = profile.getEmail();
-        }
-
-        var customerID = '';
-        if (!empty(profile) && !empty(profile.getCustomerNo())) {
-            customerID = profile.getCustomerNo();
-        } else {
-            if (!empty(basket.getCustomerNo())) {
-                customerID = basket.getCustomerNo();
-            }
-        }
-
-        var shopperIP = !empty(request) && !empty(request.getHttpRemoteAddress()) ? request.getHttpRemoteAddress() : '';
-
-        if (!empty(shopperIP)) {
-            shopperObject['shopperIP'] = shopperIP;
-        }
-
-        if (!empty(customerEmail)) {
-            shopperObject['shopperEmail'] = customerEmail;
-        }
-
-        if (!empty(customerID)) {
-            shopperObject['shopperReference'] = customerID;
-        }
-
-        if(request.getLocale()){
-            shopperObject['shopperLocale'] = request.getLocale();
-        }
 
+        var gender = "UNKNOWN";
         if(params.Args && params.Args.adyenForm) {
             if(params.Args.adyenForm.socialSecurityNumber.value){
                 shopperObject['socialSecurityNumber'] = params.Args.adyenForm.socialSecurityNumber.value;
@@ -362,18 +322,99 @@ var __AdyenHelper: Object = {
             if(params.Args.adyenForm.dateOfBirth.value){
                 shopperObject['dateOfBirth'] = params.Args.adyenForm.dateOfBirth.value;
             }
+            if(params.Args.adyenForm.gender.value){
+                switch(params.Args.adyenForm.gender.value){
+                    case "M":
+                        gender = "MALE";
+                        break;
+                    case "F":
+                        gender = "FEMALE";
+                        break;
+                    default:
+                        gender = "UNKNOWN";
+                }
+            }
             if(params.Args.adyenForm.telephoneNumber.value){
                 shopperObject['telephoneNumber'] = params.Args.adyenForm.telephoneNumber.value;
             }
             else if(params.Args.Order.defaultShipment.shippingAddress.phone){
                 shopperObject['telephoneNumber']= params.Args.Order.defaultShipment.shippingAddress.phone
             }
+
+        }
+
+        var customer = !empty(params) && 'Customer' in params && !empty(params.Customer) ? params.Customer : null;
+        var order = !empty(params) && 'Order' in params && !empty(params.Order) ? params.Order : null;
+        var profile = !empty(customer) && customer.registered && !empty(customer.getProfile()) ? customer.getProfile() : null;
+
+        if(order) {
+            if (customer) {
+                customer = order.getCustomer();
+            }
+            if (order.customerEmail) {
+                shopperObject['shopperEmail'] = order.customerEmail;
+            }
+            if (empty(order.customerEmail) && profile && profile.getEmail()) {
+                shopperObject['shopperEmail'] = profile.getEmail();
+            }
+
+            var shopperDetails = {
+                "firstName": order.getBillingAddress().firstName,
+                "gender": gender,
+                "infix": "",
+                "lastName": order.getBillingAddress().lastName
+            };
+
+            shopperObject['shopperName'] = shopperDetails;
+        }
+
+        if (profile && profile.getCustomerNo()) {
+            shopperObject['shopperReference'] = profile.getCustomerNo();
+        } else {
+            if (order && order.getCustomerNo()) {
+                shopperObject['shopperReference'] = order.getCustomerNo();
+            }
+        }
+
+        var shopperIP = !empty(request) && !empty(request.getHttpRemoteAddress()) ? request.getHttpRemoteAddress() : null;
+        if (shopperIP) {
+            shopperObject['shopperIP'] = shopperIP;
+        }
+
+        if(request.getLocale()){
+            shopperObject['shopperLocale'] = request.getLocale();
         }
 
         return shopperObject;
     },
 
-    createAdyenRequestObject: function (recurringType, order, saveCreditCard, paymentType) {
+    createAddressObjects: function (order, jsonObject) {
+        var shippingAddress = order.defaultShipment.shippingAddress;
+        jsonObject["countryCode"] = shippingAddress.countryCode.value.toUpperCase();
+
+        jsonObject.deliveryAddress = {
+            "city": (!empty(shippingAddress.city) ? shippingAddress.city : "N/A"),
+            "country": (!empty(shippingAddress.countryCode) ? shippingAddress.countryCode.value.toUpperCase() : "ZZ"),
+            "houseNumberOrName": (!empty(shippingAddress.address2) ? shippingAddress.address2 : ""),
+            "postalCode": (!empty(shippingAddress.postalCode) ? shippingAddress.postalCode : ""),
+            "stateOrProvince": (!empty(shippingAddress.stateCode) ? shippingAddress.stateCode : ""),
+            "street": (!empty(shippingAddress.address1) ? shippingAddress.address1 : "N/A")
+        };
+
+        var billingAddress = order.getBillingAddress();
+        jsonObject.billingAddress = {
+            "city": (!empty(billingAddress.city) ? billingAddress.city : "N/A"),
+            "country": (!empty(billingAddress.countryCode) ? billingAddress.countryCode.value.toUpperCase() : "ZZ"),
+            "houseNumberOrName": (!empty(billingAddress.address2) ? billingAddress.address2 : ""),
+            "postalCode": (!empty(billingAddress.postalCode) ? billingAddress.postalCode : ""),
+            "stateOrProvince": (!empty(billingAddress.stateCode) ? billingAddress.stateCode : ""),
+            "street": (!empty(billingAddress.address1) ? billingAddress.address1 : "N/A")
+        };
+
+        return jsonObject;
+    },
+
+    createAdyenRequestObject: function (order, saveCreditCard) {
         var jsonObject = {},
             reference = '';
 
@@ -390,6 +431,10 @@ var __AdyenHelper: Object = {
             'userAgent': request.httpUserAgent
         };
 
+        jsonObject['applicationInfo'] = __AdyenHelper.getApplicationInfo();
+
+        //Set recurring type
+        var recurringType = __AdyenHelper.getAdyenRecurringType();
         if (__AdyenHelper.getAdyenRecurringPaymentsEnabled() && !empty(recurringType)) {
 
             if (saveCreditCard) {
@@ -407,8 +452,6 @@ var __AdyenHelper: Object = {
             }
         }
 
-        jsonObject['applicationInfo'] = __AdyenHelper.getApplicationInfo();
-
         return jsonObject;
     },
 
@@ -416,19 +459,19 @@ var __AdyenHelper: Object = {
         var tokenID = '',
             pspReference = '';
         var formType = 'account';
-        var recurringType = __AdyenHelper.getAdyenRecurringType();
 
-        var jsonObject = __AdyenHelper.createAdyenRequestObject(recurringType, null, true, null);
+        var jsonObject = __AdyenHelper.createAdyenRequestObject(null, true);
 
         if(__AdyenHelper.getAdyen3DS2Enabled()){
             jsonObject = __AdyenHelper.add3DS2Data(jsonObject, formType);
         }
 
+        //Create credit card and enable OneClick
         var paymentMethodObject = __AdyenHelper.createCardObjectSF(false, formType);
         jsonObject['paymentMethod'] = paymentMethodObject;
-
-        jsonObject['enableOneClick'] = true;
         jsonObject['paymentMethod'].storeDetails = true;
+        jsonObject['enableOneClick'] = true;
+
 
         var shopperObject = __AdyenHelper.createShopperObject({
             Customer: params.Customer
@@ -440,9 +483,12 @@ var __AdyenHelper: Object = {
         };
 
         var requestObject = __AdyenHelper.extend(jsonObject, shopperObject);
-        var CreateRecurringPayment = require('int_adyen_overlay/cartridge/scripts/adyenCreateRecurringPayment.ds');
-        var createRecurringPaymentResult = CreateRecurringPayment.createRecurringPayment({RequestObject: requestObject});
 
+        //Send payment request to /payments endpoints
+        var adyenCheckout = require('int_adyen_overlay/cartridge/scripts/adyenCheckout.ds');
+        var createRecurringPaymentResult = adyenCheckout.doPaymentCall({}, requestObject);
+
+        //Check the result of the initial recurring payment
         if (createRecurringPaymentResult === PIPELET_ERROR || createRecurringPaymentResult.Decision == 'ERROR') {
             return {
                 error: true

From 24583a1ff96c567d6c54a72af9cb9b0fc0adcc8b Mon Sep 17 00:00:00 2001
From: basm <bas.maassen@adyen.com>
Date: Thu, 4 Jul 2019 14:16:45 +0200
Subject: [PATCH 20/22] api key for disableRecurring

---
 .../cartridge/scripts/adyenDeleteRecurringPayment.ds         | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyenDeleteRecurringPayment.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyenDeleteRecurringPayment.ds
index 26348616b..1a8408f93 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/adyenDeleteRecurringPayment.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyenDeleteRecurringPayment.ds
@@ -44,8 +44,11 @@ function deleteRecurringPayment(args) {
             return PIPELET_ERROR;
         }
 
-        service.addHeader('Content-type', 'application/json');
+        var apiKey = AdyenHelper.getAdyenApiKey();
+        service.addHeader('Content-type','application/json');
         service.addHeader('charset', 'UTF-8');
+        service.addHeader('X-API-KEY', apiKey);
+
         callResult = service.call(JSON.stringify(requestObject));
 
         if (callResult.isOk() == false) {

From b8425bc1c6af638c46ff8ce18ef941aadce4a605 Mon Sep 17 00:00:00 2001
From: Bas Maassen <bas.maassen@adyen.com>
Date: Fri, 5 Jul 2019 16:16:11 +0200
Subject: [PATCH 21/22] Cartridge paths, deprecated API usage (#174)

---
 .../cartridge/controllers/Account.js          |  2 +-
 .../cartridge/controllers/Adyen.js            | 29 +++++++++------
 .../cartridge/controllers/Checkout.js         |  2 +-
 .../cartridge/controllers/CheckoutServices.js |  2 +-
 .../controllers/PaymentInstruments.js         |  6 +--
 .../scripts/checkout/adyenHelpers.js          | 37 -------------------
 .../scripts/hooks/payment/processor/adyen.js  |  2 +-
 .../hooks/payment/processor/adyen_credit.js   |  4 +-
 .../billing/storedPaymentInstruments.isml     |  2 +-
 .../cartridge/scripts/adyenCapture.ds         |  1 -
 .../scripts/adyenCreateRecurringPayment.ds    |  4 +-
 .../scripts/adyenGetRecurringDetailsList.ds   |  2 +-
 .../cartridge/scripts/adyenPosVerification.ds |  2 +-
 .../scripts/getPaymentMethodsSHA256.ds        |  2 +-
 .../cartridge/scripts/util/AdyenHelper.ds     |  4 +-
 15 files changed, 35 insertions(+), 66 deletions(-)

diff --git a/cartridges/int_adyen_SFRA/cartridge/controllers/Account.js b/cartridges/int_adyen_SFRA/cartridge/controllers/Account.js
index 483a377fd..a42c9fd72 100644
--- a/cartridges/int_adyen_SFRA/cartridge/controllers/Account.js
+++ b/cartridges/int_adyen_SFRA/cartridge/controllers/Account.js
@@ -12,7 +12,7 @@ server.append(
     userLoggedIn.validateLoggedIn,
     consentTracking.consent,
     function (req, res, next) {
-        require('int_adyen_overlay/cartridge/scripts/UpdateSavedCards').updateSavedCards({CurrentCustomer: req.currentCustomer.raw});
+        require('*/cartridge/scripts/UpdateSavedCards').updateSavedCards({CurrentCustomer: req.currentCustomer.raw});
         next();
     }
 );
diff --git a/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js b/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js
index b274d87c2..c89568214 100644
--- a/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js
+++ b/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js
@@ -29,7 +29,7 @@ server.get('Adyen3D', server.middleware.https, function (req, res, next) {
 });
 
 server.post('AuthorizeWithForm', server.middleware.https, function (req, res, next) {
-    var adyenCheckout = require('int_adyen_overlay/cartridge/scripts/adyenCheckout');
+    var adyenCheckout = require('*/cartridge/scripts/adyenCheckout');
     var paymentInstrument;
     var order;
 
@@ -68,7 +68,7 @@ server.post('AuthorizeWithForm', server.middleware.https, function (req, res, ne
             var fraudDetectionStatus = {status: 'success'};
 
             // Places the order
-            var placeOrderResult = adyenHelpers.placeOrder(order, fraudDetectionStatus);
+            var placeOrderResult = COHelpers.placeOrder(order, fraudDetectionStatus);
             if (placeOrderResult.error) {
                 Transaction.wrap(function () {
                     OrderMgr.failOrder(order);
@@ -105,7 +105,7 @@ server.get('Adyen3DS2', server.middleware.https, function (req, res, next) {
 });
 
 server.post('Authorize3DS2', server.middleware.https, function (req, res, next) {
-    var adyenCheckout = require('int_adyen_overlay/cartridge/scripts/adyenCheckout');
+    var adyenCheckout = require('*/cartridge/scripts/adyenCheckout');
     var paymentInstrument;
     var order;
 
@@ -164,7 +164,7 @@ server.post('Authorize3DS2', server.middleware.https, function (req, res, next)
         var fraudDetectionStatus = {status: 'success'};
 
         // Places the order
-        var placeOrderResult = adyenHelpers.placeOrder(order, fraudDetectionStatus);
+        var placeOrderResult = COHelpers.placeOrder(order, fraudDetectionStatus);
         if (placeOrderResult.error) {
             Transaction.wrap(function () {
                 OrderMgr.failOrder(order);
@@ -199,16 +199,23 @@ server.get('ShowConfirmation', server.middleware.https, function (req, res, next
     var payLoad = req.querystring.payload;
 
     //redirect to payment/details
-    var adyenCheckout = require('int_adyen_overlay/cartridge/scripts/adyenCheckout');
+    var adyenCheckout = require('*/cartridge/scripts/adyenCheckout');
     var requestObject = {};
     requestObject['details'] = {};
     requestObject.details['payload'] = payLoad;
     var result = adyenCheckout.doPaymentDetailsCall(requestObject);
     var order = OrderMgr.getOrder(result.merchantReference);
-    var paymentInstrument = order.getPaymentInstrument();
-    Transaction.wrap(function () {
-        paymentInstrument.custom.adyenPaymentData = null;
-    });
+
+    var paymentInstruments = order.getPaymentInstruments("Adyen");
+    var adyenPaymentInstrument;
+    var instrumentsIter = paymentInstruments.iterator();
+    while (instrumentsIter.hasNext()) {
+        adyenPaymentInstrument = instrumentsIter.next();
+        Transaction.wrap(function () {
+            adyenPaymentInstrument.custom.adyenPaymentData = null;
+        });
+    }
+
     // Authorised: The payment authorisation was successfully completed.
     if (result.resultCode == "Authorised" || result.resultCode == 'Pending' || result.resultCode == 'Received') {
         var OrderModel = require('*/cartridge/models/order');
@@ -324,13 +331,13 @@ server.get('GetConfigurationComponents', server.middleware.https, function (req,
  * Called by Adyen to update status of payments. It should always display [accepted] when finished.
  */
 server.post('Notify', server.middleware.https, function (req, res, next) {
-    var checkAuth = require('int_adyen_overlay/cartridge/scripts/checkNotificationAuth');
+    var checkAuth = require('*/cartridge/scripts/checkNotificationAuth');
     var status = checkAuth.check(req);
     if (!status) {
         res.render('/adyen/error');
         return {};
     }
-    var handleNotify = require('int_adyen_overlay/cartridge/scripts/handleNotify');
+    var handleNotify = require('*/cartridge/scripts/handleNotify');
     Transaction.begin();
     var success = handleNotify.notify(req.form);
 
diff --git a/cartridges/int_adyen_SFRA/cartridge/controllers/Checkout.js b/cartridges/int_adyen_SFRA/cartridge/controllers/Checkout.js
index 5bc8e02e4..8b156bb5e 100644
--- a/cartridges/int_adyen_SFRA/cartridge/controllers/Checkout.js
+++ b/cartridges/int_adyen_SFRA/cartridge/controllers/Checkout.js
@@ -11,7 +11,7 @@ server.prepend('Begin',
     csrfProtection.generateToken,
     function (req, res, next) {
         if (req.currentCustomer.raw.isAuthenticated()) {
-            require('int_adyen_overlay/cartridge/scripts/UpdateSavedCards').updateSavedCards({CurrentCustomer: req.currentCustomer.raw});
+            require('*/cartridge/scripts/UpdateSavedCards').updateSavedCards({CurrentCustomer: req.currentCustomer.raw});
         }
         next();
     });
diff --git a/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js b/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js
index d11219837..ec2ada328 100644
--- a/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js
+++ b/cartridges/int_adyen_SFRA/cartridge/controllers/CheckoutServices.js
@@ -166,7 +166,7 @@ server.replace('PlaceOrder', server.middleware.https, function (req, res, next)
     }
 
     // Places the order
-    var placeOrderResult = adyenHelpers.placeOrder(order, fraudDetectionStatus);
+    var placeOrderResult = COHelpers.placeOrder(order, fraudDetectionStatus);
     if (placeOrderResult.error) {
         res.json({
             error: true,
diff --git a/cartridges/int_adyen_SFRA/cartridge/controllers/PaymentInstruments.js b/cartridges/int_adyen_SFRA/cartridge/controllers/PaymentInstruments.js
index 55a11c6f3..1fcbce585 100644
--- a/cartridges/int_adyen_SFRA/cartridge/controllers/PaymentInstruments.js
+++ b/cartridges/int_adyen_SFRA/cartridge/controllers/PaymentInstruments.js
@@ -7,10 +7,10 @@ var userLoggedIn = require('*/cartridge/scripts/middleware/userLoggedIn');
 var consentTracking = require('*/cartridge/scripts/middleware/consentTracking');
 var csrfProtection = require('*/cartridge/scripts/middleware/csrf');
 
-var AdyenHelper = require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper');
+var AdyenHelper = require('*/cartridge/scripts/util/AdyenHelper');
 
 server.prepend('List', userLoggedIn.validateLoggedIn, consentTracking.consent, function (req, res, next) {
-    require('int_adyen_overlay/cartridge/scripts/UpdateSavedCards').updateSavedCards({CurrentCustomer: req.currentCustomer.raw});
+    require('*/cartridge/scripts/UpdateSavedCards').updateSavedCards({CurrentCustomer: req.currentCustomer.raw});
     next();
 });
 
@@ -71,7 +71,7 @@ server.append('DeletePayment', userLoggedIn.validateLoggedInAjax, function (req,
         );
         var tokenToDelete = AdyenHelper.getCardToken(payment.UUID, customer);
         if (!empty(tokenToDelete)) {
-            var result = require('int_adyen_overlay/cartridge/scripts/adyenDeleteRecurringPayment').deleteRecurringPayment({
+            var result = require('*/cartridge/scripts/adyenDeleteRecurringPayment').deleteRecurringPayment({
                 Customer: customer,
                 RecurringDetailReference: tokenToDelete
             });
diff --git a/cartridges/int_adyen_SFRA/cartridge/scripts/checkout/adyenHelpers.js b/cartridges/int_adyen_SFRA/cartridge/scripts/checkout/adyenHelpers.js
index 2981f8aaf..74b4c094c 100644
--- a/cartridges/int_adyen_SFRA/cartridge/scripts/checkout/adyenHelpers.js
+++ b/cartridges/int_adyen_SFRA/cartridge/scripts/checkout/adyenHelpers.js
@@ -125,44 +125,7 @@ function validatePayment(req, currentBasket) {
     return result;
 }
 
-/**
- * Attempts to place the order
- * @param {dw.order.Order} order - The order object to be placed
- * @returns {Object} an error object
- */
-function placeOrder(order, fraudDetectionStatus) {
-    var result = {error: false, order: order, order_created: false};
-
-    try {
-        if (order.paymentInstrument.paymentMethod == 'Adyen') {
-            result.order_created = true;
-        } else {
-            Transaction.begin();
-            var placeOrderStatus = OrderMgr.placeOrder(order);
-            if (placeOrderStatus === Status.ERROR) {
-                throw new Error();
-            }
-            if (fraudDetectionStatus.status === 'flag') {
-                order.setConfirmationStatus(Order.CONFIRMATION_STATUS_NOTCONFIRMED);
-            } else {
-                order.setConfirmationStatus(Order.CONFIRMATION_STATUS_CONFIRMED);
-            }
-
-            order.setExportStatus(Order.EXPORT_STATUS_READY);
-            Transaction.commit();
-        }
-    } catch
-        (e) {
-        Transaction.wrap(function () {
-            OrderMgr.failOrder(order);
-        });
-        result.error = true;
-    }
-    return result;
-}
-
 module.exports = {
     handlePayments: handlePayments,
-    placeOrder: placeOrder,
     validatePayment: validatePayment
 };
diff --git a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen.js b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen.js
index 11fe918d6..0abe4d936 100644
--- a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen.js
+++ b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen.js
@@ -48,7 +48,7 @@ function Authorize(orderNumber, paymentInstrument, paymentProcessor) {
     var OrderMgr = require('dw/order/OrderMgr');
     var order = OrderMgr.getOrder(orderNumber);
 
-    var adyenCheckout = require('int_adyen_overlay/cartridge/scripts/adyenCheckout');
+    var adyenCheckout = require('*/cartridge/scripts/adyenCheckout');
     Transaction.begin();
 
     var result = adyenCheckout.alternativePaymentMethod({
diff --git a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js
index 7bc78a257..772876d59 100644
--- a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js
+++ b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js
@@ -9,7 +9,7 @@ var collections = require('*/cartridge/scripts/util/collections');
 var PaymentInstrument = require('dw/order/PaymentInstrument');
 var Resource = require('dw/web/Resource');
 var Transaction = require('dw/system/Transaction');
-var AdyenHelper = require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper');
+var AdyenHelper = require('*/cartridge/scripts/util/AdyenHelper');
 var Logger = require('dw/system/Logger');
 
 function Handle(basket, paymentInformation) {
@@ -56,7 +56,7 @@ function Authorize(orderNumber, paymentInstrument, paymentProcessor) {
     var Transaction = require('dw/system/Transaction');
     var order = OrderMgr.getOrder(orderNumber);
     var creditCardForm = server.forms.getForm('billing').creditCardFields;
-    var adyenCheckout = require('int_adyen_overlay/cartridge/scripts/adyenCheckout');
+    var adyenCheckout = require('*/cartridge/scripts/adyenCheckout');
     Transaction.wrap(function () {
         paymentInstrument.paymentTransaction.paymentProcessor = paymentProcessor;
     });
diff --git a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/storedPaymentInstruments.isml b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/storedPaymentInstruments.isml
index 669065ec9..a5911ed78 100644
--- a/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/storedPaymentInstruments.isml
+++ b/cartridges/int_adyen_SFRA/cartridge/templates/default/checkout/billing/storedPaymentInstruments.isml
@@ -3,7 +3,7 @@
     assets.addCss('/css/adyen-checkout-3.0.0.css');
 </isscript>
 <iscontent type="text/html" encoding="off"/>
-<isset name="AdyenHelper" value="${require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper')}" scope="PAGE"/>
+<isset name="AdyenHelper" value="${require('*/cartridge/scripts/util/AdyenHelper')}" scope="PAGE"/>
 <isloop items="${pdict.customer.customerPaymentInstruments}" var="paymentInstrument" status="loopSate">
     <div class="row saved-payment-instrument ${loopSate.first ? 'selected-payment' : ''}"
          data-uuid="${paymentInstrument.UUID}">
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyenCapture.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyenCapture.ds
index 8103f44f6..adab3e4a0 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/adyenCapture.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyenCapture.ds
@@ -74,7 +74,6 @@ function capture( order : Order ) : Number
 	
 	try {
 		// Send a request
-		// TODO: fix this to new implementation
 		var params="action=" + "Payment.capture" +
 			"&modificationRequest.reference=" + encodeURIComponent(orderNo) +
 			"&modificationRequest.merchantAccount=" + encodeURIComponent(merchantAccount) +
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyenCreateRecurringPayment.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyenCreateRecurringPayment.ds
index f26b170b0..2aa0b4fc5 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/adyenCreateRecurringPayment.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyenCreateRecurringPayment.ds
@@ -12,8 +12,8 @@
 var Logger = require('dw/system/Logger');
 
 /* Script Modules */
-var AdyenHelper = require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper');
-var THIS_SCRIPT = 'int_adyen_overlay/scripts/adyenCreateRecurringPayment.ds';
+var AdyenHelper = require('*/cartridge/scripts/util/AdyenHelper');
+var THIS_SCRIPT = '*/scripts/adyenCreateRecurringPayment.ds';
 
 function execute(args) {
     var result = createRecurringPayment(args);
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyenGetRecurringDetailsList.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyenGetRecurringDetailsList.ds
index b558385a5..18723a41b 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/adyenGetRecurringDetailsList.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyenGetRecurringDetailsList.ds
@@ -11,7 +11,7 @@ var HashMap = require('dw/util/HashMap');
 var Logger = require('dw/system/Logger');
 
 /* Script Modules */
-var AdyenHelper = require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper');
+var AdyenHelper = require('*/cartridge/scripts/util/AdyenHelper');
 var THIS_SCRIPT = 'int_adyen_overlay/scripts/adyenGetRecurringDetailsList.ds';
 
 function execute(args) {
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyenPosVerification.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyenPosVerification.ds
index 584efbb21..d50b2a35b 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/adyenPosVerification.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyenPosVerification.ds
@@ -14,7 +14,7 @@ var Logger = require('dw/system/Logger');
 var Transaction = require('dw/system/Transaction');
 
 /* Script Modules */
-var AdyenHelper = require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper');
+var AdyenHelper = require('*/cartridge/scripts/util/AdyenHelper');
 
 function execute(args) {
     var result = verify(args);
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/getPaymentMethodsSHA256.ds b/cartridges/int_adyen_overlay/cartridge/scripts/getPaymentMethodsSHA256.ds
index f63543c42..55e59a0fa 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/getPaymentMethodsSHA256.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/getPaymentMethodsSHA256.ds
@@ -15,7 +15,7 @@ importPackage(dw.util);
 importPackage( dw.svc );
 
 //script include
-var AdyenHelper = require("int_adyen_overlay/cartridge/scripts/util/AdyenHelper");
+var AdyenHelper = require("*/cartridge/scripts/util/AdyenHelper");
 var PaymentMgr = require('dw/order/PaymentMgr');
 var PaymentInstrument = require('dw/order/PaymentInstrument');
 
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
index 7b9756e91..115b3d871 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
@@ -485,7 +485,7 @@ var __AdyenHelper: Object = {
         var requestObject = __AdyenHelper.extend(jsonObject, shopperObject);
 
         //Send payment request to /payments endpoints
-        var adyenCheckout = require('int_adyen_overlay/cartridge/scripts/adyenCheckout.ds');
+        var adyenCheckout = require('*/cartridge/scripts/adyenCheckout.ds');
         var createRecurringPaymentResult = adyenCheckout.doPaymentCall({}, requestObject);
 
         //Check the result of the initial recurring payment
@@ -497,7 +497,7 @@ var __AdyenHelper: Object = {
 
         if (createRecurringPaymentResult.Decision == 'ACCEPT' && ('PspReference' in createRecurringPaymentResult) && !empty(createRecurringPaymentResult.PspReference)) {
             pspReference = createRecurringPaymentResult.PspReference;
-            var GetRecurringDetailsList = require('int_adyen_overlay/cartridge/scripts/adyenGetRecurringDetailsList.ds');
+            var GetRecurringDetailsList = require('*/cartridge/scripts/adyenGetRecurringDetailsList.ds');
             var getRecurringDetailsListResult = GetRecurringDetailsList.getRecurringDetailsList({
                 Customer: params.Customer
             });

From 33fed9308ede1bfc04e2748bb1166f9785555dde Mon Sep 17 00:00:00 2001
From: Bas Maassen <bas.maassen@adyen.com>
Date: Mon, 8 Jul 2019 12:10:52 +0200
Subject: [PATCH 22/22] Save payment details (#175)

* Save payment details
---
 .../cartridge/controllers/Adyen.js            | 13 +++---
 .../scripts/hooks/payment/processor/adyen.js  |  4 +-
 .../hooks/payment/processor/adyen_credit.js   | 23 +---------
 .../cartridge/controllers/Adyen.js            | 43 ++++++++++++-------
 .../scripts/payment/processor/ADYEN_CREDIT.js | 22 +---------
 .../scripts/payment/processor/Adyen.js        |  6 +--
 .../cartridge/scripts/adyenCheckout.ds        |  9 ++--
 .../cartridge/scripts/util/AdyenHelper.ds     | 27 +++++++++++-
 .../checkout/billing/adyenpaymentfields.isml  |  1 -
 9 files changed, 72 insertions(+), 76 deletions(-)

diff --git a/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js b/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js
index c89568214..3fc3ba8ba 100644
--- a/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js
+++ b/cartridges/int_adyen_SFRA/cartridge/controllers/Adyen.js
@@ -9,7 +9,7 @@ var OrderMgr = require('dw/order/OrderMgr');
 var Resource = require('dw/web/Resource');
 var Site = require('dw/system/Site');
 var Logger = require('dw/system/Logger');
-var adyenHelper = require('*/cartridge/scripts/util/AdyenHelper');
+var AdyenHelper = require('*/cartridge/scripts/util/AdyenHelper');
 
 const EXTERNAL_PLATFORM_VERSION = "SFRA";
 
@@ -78,9 +78,9 @@ server.post('AuthorizeWithForm', server.middleware.https, function (req, res, ne
             }
 
             Transaction.begin();
+            AdyenHelper.savePaymentDetails(paymentInstrument, order, result);
             order.setPaymentStatus(dw.order.Order.PAYMENT_STATUS_PAID);
             order.setExportStatus(dw.order.Order.EXPORT_STATUS_READY);
-            paymentInstrument.paymentTransaction.transactionID = result.pspReference;
             Transaction.commit();
             COHelpers.sendConfirmationEmail(order, req.locale.id);
             clearForms();
@@ -174,9 +174,9 @@ server.post('Authorize3DS2', server.middleware.https, function (req, res, next)
         }
 
         Transaction.begin();
+        AdyenHelper.savePaymentDetails(paymentInstrument, order, result);
         order.setPaymentStatus(dw.order.Order.PAYMENT_STATUS_PAID);
         order.setExportStatus(dw.order.Order.EXPORT_STATUS_READY);
-        paymentInstrument.paymentTransaction.transactionID = result.pspReference;
         Transaction.commit();
         COHelpers.sendConfirmationEmail(order, req.locale.id);
         clearForms();
@@ -226,6 +226,7 @@ server.get('ShowConfirmation', server.middleware.https, function (req, res, next
         //Save orderModel to custom object during session
         Transaction.wrap(function () {
             order.custom.Adyen_CustomerEmail = JSON.stringify(orderModel);
+            AdyenHelper.savePaymentDetails(adyenPaymentInstrument, order, result);
         });
 
         clearForms();
@@ -273,7 +274,7 @@ server.get('GetPaymentMethods', server.middleware.https, function (req, res, nex
         });
     })
 
-    var adyenURL = adyenHelper.getAdyenUrl() + "hpp/img/pm/";
+    var adyenURL = AdyenHelper.getAdyenUrl() + "hpp/img/pm/";
 
     res.json({
         AdyenHppPaymentMethods: paymentMethods,
@@ -310,8 +311,8 @@ server.get('GetConfigurationComponents', server.middleware.https, function (req,
 
     try {
         originKey = adyenGetOriginKey.getOriginKey(baseUrl).originKeys;
-        loadingContext = adyenHelper.getLoadingContext();
-        environment = adyenHelper.getAdyenMode().toLowerCase();
+        loadingContext = AdyenHelper.getLoadingContext();
+        environment = AdyenHelper.getAdyenMode().toLowerCase();
 
     } catch (err) {
         error = true;
diff --git a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen.js b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen.js
index 0abe4d936..015916880 100644
--- a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen.js
+++ b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen.js
@@ -69,7 +69,7 @@ function Authorize(orderNumber, paymentInstrument, paymentProcessor) {
         };
     }
 
-    if (result.ResultCode == 'RedirectShopper') {
+    if (result.resultCode == 'RedirectShopper') {
         Transaction.wrap(function () {
             paymentInstrument.custom.adyenPaymentData = result.PaymentData;
         });
@@ -80,7 +80,7 @@ function Authorize(orderNumber, paymentInstrument, paymentProcessor) {
             paymentInstrument: paymentInstrument,
             redirectObject: result.RedirectObject
         };
-    } else if (result.ResultCode == 'Authorised' || result.ResultCode == 'Received') {
+    } else if (result.resultCode == 'Authorised' || result.resultCode == 'Received') {
         return {authorized: true, error: false};
     } else {
         Logger.getLogger("Adyen").error("Payment failed, result: " + JSON.stringify(result));
diff --git a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js
index 772876d59..a6be958ca 100644
--- a/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js
+++ b/cartridges/int_adyen_SFRA/cartridge/scripts/hooks/payment/processor/adyen_credit.js
@@ -122,28 +122,7 @@ function Authorize(orderNumber, paymentInstrument, paymentProcessor) {
         };
     }
 
-    order.custom.Adyen_eventCode = 'AUTHORISATION';
-    if ('PspReference' in result && !empty(result.PspReference)) {
-        paymentInstrument.paymentTransaction.transactionID = result.PspReference;
-        order.custom.Adyen_pspReference = result.PspReference;
-    }
-
-    if ('AuthorizationCode' in result && !empty(result.AuthorizationCode)) {
-        paymentInstrument.paymentTransaction.custom.authCode = result.AuthorizationCode;
-    }
-
-    if ('AdyenAmount' in result && !empty(result.AdyenAmount)) {
-        order.custom.Adyen_value = result.AdyenAmount;
-    }
-
-    if ('AdyenCardType' in result && !empty(result.AdyenCardType)) {
-        order.custom.Adyen_paymentMethod = result.AdyenCardType;
-    }
-    // Save full response to transaction custom attribute
-    paymentInstrument.paymentTransaction.custom.Adyen_log = JSON.stringify(result);
-    paymentInstrument.paymentTransaction.transactionID = result.PspReference;
-    paymentInstrument.paymentTransaction.paymentProcessor = paymentProcessor;
-
+    AdyenHelper.savePaymentDetails(paymentInstrument, order, result);
     Transaction.commit();
 
     return {authorized: true, error: false};
diff --git a/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js b/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js
index f3cc65edc..96fe61b75 100644
--- a/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js
+++ b/cartridges/int_adyen_controllers/cartridge/controllers/Adyen.js
@@ -72,24 +72,37 @@ function showConfirmation() {
 	requestObject.details['payload'] = payLoad;
 	var result = adyenCheckout.doPaymentDetailsCall(requestObject);
 	var orderNumber = result.merchantReference;
+    var order = OrderMgr.getOrder(orderNumber);
 
-	if (result.resultCode == 'Authorised' || result.resultCode == 'Pending') {
-		orderConfirm(orderNumber);
-	} else {
-		var OrderMgr = require('dw/order/OrderMgr');
-		var order = OrderMgr.getOrder(orderNumber);
-		// fail order
-		Transaction.wrap(function () {
-			OrderMgr.failOrder(order);
-		});
-		Logger.getLogger("Adyen").error("Payment failed, result: " + JSON.stringify(result));
-		// should be assingned by previous calls or not
-		var errorStatus = new dw.system.Status(dw.system.Status.ERROR, "confirm.error.declined");
+    var paymentInstruments = order.getPaymentInstruments("Adyen");
+    var adyenPaymentInstrument;
+    var instrumentsIter = paymentInstruments.iterator();
+    while (instrumentsIter.hasNext()) {
+        adyenPaymentInstrument = instrumentsIter.next();
+        Transaction.wrap(function () {
+            adyenPaymentInstrument.custom.adyenPaymentData = null;
+        });
+    }
 
-		app.getController('COSummary').Start({
-			PlaceOrderError: errorStatus
-		});
+	if (result.resultCode == 'Authorised' || result.resultCode == 'Pending' || result.resultCode == 'Received') {
+        Transaction.wrap(function () {
+            AdyenHelper.savePaymentDetails(adyenPaymentInstrument, order, result);
+        });
+		orderConfirm(orderNumber);
 	}
+	else {
+        // fail order
+        Transaction.wrap(function () {
+            OrderMgr.failOrder(order);
+        });
+        Logger.getLogger("Adyen").error("Payment failed, result: " + JSON.stringify(result));
+        // should be assingned by previous calls or not
+        var errorStatus = new dw.system.Status(dw.system.Status.ERROR, "confirm.error.declined");
+
+        app.getController('COSummary').Start({
+            PlaceOrderError: errorStatus
+        });
+    }
 
 	return {};
 }
diff --git a/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js b/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js
index 0670c40c1..43104541d 100644
--- a/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js
+++ b/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/ADYEN_CREDIT.js
@@ -11,13 +11,13 @@ var Logger = require('dw/system/Logger');
 /* Script Modules */
 var app = require(Resource.msg('scripts.app.js', 'require', null));
 var Cart = require(Resource.msg('script.models.cartmodel', 'require', null));
+var AdyenHelper = require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper');
 
 /**
  * Creates a Adyen payment instrument for the given basket
  */
 function Handle(args) {
     var cart = Cart.get(args.Basket);
-    var AdyenHelper = require('int_adyen_overlay/cartridge/scripts/util/AdyenHelper');
     var adyenRemovePreviousPI = require('int_adyen_overlay/cartridge/scripts/adyenRemovePreviousPI');
     var result;
 
@@ -143,25 +143,7 @@ function Authorize(args) {
         };
     }
 
-    order.custom.Adyen_eventCode = 'AUTHORISATION';
-    if ('PspReference' in result && !empty(result.PspReference)) {
-        paymentInstrument.paymentTransaction.transactionID = result.PspReference;
-        order.custom.Adyen_pspReference = result.PspReference;
-    }
-
-    if ('AuthorizationCode' in result && !empty(result.AuthorizationCode)) {
-        paymentInstrument.paymentTransaction.custom.authCode = result.AuthorizationCode;
-    }
-
-    if ('AdyenAmount' in result && !empty(result.AdyenAmount)) {
-        order.custom.Adyen_value = result.AdyenAmount;
-    }
-
-    if ('AdyenCardType' in result && !empty(result.AdyenCardType)) {
-        order.custom.Adyen_paymentMethod = result.AdyenCardType;
-    }
-    // Save full response to transaction custom attribute
-    paymentInstrument.paymentTransaction.custom.Adyen_log = JSON.stringify(result);
+    AdyenHelper.savePaymentDetails(paymentInstrument, order, result);
 
     Transaction.commit();
 
diff --git a/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/Adyen.js b/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/Adyen.js
index 5147c1689..53768c70d 100644
--- a/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/Adyen.js
+++ b/cartridges/int_adyen_controllers/cartridge/scripts/payment/processor/Adyen.js
@@ -65,7 +65,7 @@ function authorize(args) {
 			'adyenForm' : session.forms.adyPaydata
 		});
 	});
-	
+
 	 if (result.error) {
 	        var errors = [];
 	        errors.push(result.args.AdyenErrorMessage);
@@ -74,7 +74,7 @@ function authorize(args) {
 	        };
 	    }
 
-	    if (result.ResultCode == 'RedirectShopper') {
+	    if (result.resultCode == 'RedirectShopper') {
 	        return {
 	            authorized: true,
 	            order: order,
@@ -82,7 +82,7 @@ function authorize(args) {
 	            redirectObject : result.RedirectObject
 	        };
 	    }
-	    else if(result.ResultCode == 'Authorised' || result.ResultCode == 'Received'){
+	    else if(result.resultCode == 'Authorised' || result.resultCode == 'Received'){
 	        return { authorized: true, error: false };
 	    }
 	    else {
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds b/cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds
index 04bccef21..cc44306eb 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/adyenCheckout.ds
@@ -194,14 +194,13 @@ function doPaymentCall(args, requestObject){
         }
 
         // if the card is enrolled for 3D Secure, the response contains a redirect object
-        if ('redirect' in responseObj) {args.RedirectObject = responseObj.redirect;} // issuerUrl
-        args.ResultCode = responseObj.resultCode; // resultCode
-
-        args.PspReference = ('pspReference' in responseObj && !empty(responseObj.pspReference) ? responseObj.pspReference : '');
+        args.RedirectObject = ('redirect' in responseObj && !empty(responseObj.redirect) ? responseObj.redirect : '');
+        args.resultCode = responseObj.resultCode; // resultCode
+        args.pspReference = ('pspReference' in responseObj && !empty(responseObj.pspReference) ? responseObj.pspReference : '');
         args.PaymentStatus = resultObj.errorText;
         args.AdyenAmount = requestObject["amount"].value;
         args.Decision = 'ERROR';
-        var resultCode = args.ResultCode;
+        var resultCode = args.resultCode;
 
         //Check the response object from /payment call
         if (responseObj.resultCode.indexOf('IdentifyShopper') != -1 || (responseObj.resultCode.indexOf('ChallengeShopper') != -1) ) {
diff --git a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
index 115b3d871..f0010fa7c 100644
--- a/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
+++ b/cartridges/int_adyen_overlay/cartridge/scripts/util/AdyenHelper.ds
@@ -495,8 +495,8 @@ var __AdyenHelper: Object = {
             };
         }
 
-        if (createRecurringPaymentResult.Decision == 'ACCEPT' && ('PspReference' in createRecurringPaymentResult) && !empty(createRecurringPaymentResult.PspReference)) {
-            pspReference = createRecurringPaymentResult.PspReference;
+        if (createRecurringPaymentResult.Decision == 'ACCEPT' && ('pspReference' in createRecurringPaymentResult) && !empty(createRecurringPaymentResult.pspReference)) {
+            pspReference = createRecurringPaymentResult.pspReference;
             var GetRecurringDetailsList = require('*/cartridge/scripts/adyenGetRecurringDetailsList.ds');
             var getRecurringDetailsListResult = GetRecurringDetailsList.getRecurringDetailsList({
                 Customer: params.Customer
@@ -649,6 +649,29 @@ var __AdyenHelper: Object = {
         }
     },
 
+    savePaymentDetails: function (paymentInstrument, order, result) {
+        if ('pspReference' in result && !empty(result.pspReference)) {
+            paymentInstrument.paymentTransaction.transactionID = result.pspReference;
+            order.custom.Adyen_pspReference = result.pspReference;
+        }
+
+        if ('resultCode' in result && !empty(result.resultCode)) {
+            paymentInstrument.paymentTransaction.custom.authCode = result.resultCode;
+        }
+
+        if ('AdyenAmount' in result && !empty(result.AdyenAmount)) {
+            order.custom.Adyen_value = result.AdyenAmount;
+        }
+
+        if ('AdyenCardType' in result && !empty(result.AdyenCardType)) {
+            order.custom.Adyen_paymentMethod = result.AdyenCardType;
+        }
+        // Save full response to transaction custom attribute
+        paymentInstrument.paymentTransaction.custom.Adyen_log = JSON.stringify(result);
+
+        return true;
+    },
+
     saveAuthResponseAttributes: function (transaction: dw.order.PaymentTransaction, map: dw.web.HttpParameterMap) {
         transaction.custom.Adyen_authResult = map.isParameterSubmitted('authResult') ? map.authResult.stringValue : '';
         transaction.custom.Adyen_merchantReference = map.isParameterSubmitted('merchantReference') ? map.merchantReference.stringValue : '';
diff --git a/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentfields.isml b/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentfields.isml
index a0d7b5256..158390cb5 100644
--- a/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentfields.isml
+++ b/cartridges/int_adyen_overlay/cartridge/templates/default/checkout/billing/adyenpaymentfields.isml
@@ -96,7 +96,6 @@
     }
 
 	function initializeCardComponent(originKey, environment, locale) {
-	console.log(environment);
 		window.Configuration = {
 		        locale: locale,
 		        originKey: originKey,