first commit

green4cloud

@@ -0,0 +1 @@
+Subproject commit 8607bbef2b0e3d5fb9a3c2b7c2702d3fc5e912fe

index.php

@@ -0,0 +1,3 @@
+<?php
+header("Location: ../index.php");
+?>

orderforms/cloud_slider/css/style.css

@@ -0,0 +1,421 @@
+/**
+ * Cloud Slider order form style sheet
+ *
+ * Contains styling specific to the Cloud Slider order form template.
+ *
+ * @project   WHMCS
+ * @version   1.0
+ * @author    WHMCS Limited <development@whmcs.com>
+ * @copyright Copyright (c) WHMCS Limited 2005-2015
+ * @license   http://www.whmcs.com/license/
+ * @link      http://www.whmcs.com/
+ *
+ */
+
+/* General Layout */
+
+div#order-cloud_slider {
+	padding:0 0 0 0;
+	margin:0 0 20px 0;
+    height: 100%;
+    width: 100%;
+	line-height:18px;
+	font-size:14px;
+	color:#666666;
+	background-color:#f3f3f3;
+	text-rendering: optimizeLegibility !important;
+	-webkit-font-smoothing: antialiased !important;
+}
+
+/* Text Styling */
+
+#order-cloud_slider a,
+#order-cloud_slider a:hover,
+#order-cloud_slider a:active,
+#order-cloud_slider a:visited,
+#order-cloud_slider a:link {
+    outline:none;
+    transition: all 0.5s ease 0s;
+    -webkit-transition: all 0.5s ease 0s;
+    -moz-transition: all 0.5s ease 0s;
+}
+
+/* Headings */
+
+#order-cloud_slider h1 {
+}
+#order-cloud_slider h2 {
+}
+#order-cloud_slider h3 {
+	padding:0 0 0 0;
+	margin:10px 0;
+	font-size:32px;
+	line-height:38px;
+	font-weight:bold;
+	color:#333333;
+}
+#order-cloud_slider h4 {
+	padding:0 0 0 0;
+	margin:10px 0;
+	font-size:24px;
+	color:#333333;
+}
+#order-cloud_slider h5 {
+	padding:0 0 0 0;
+	margin:5px 0;
+	font-size:16px;
+	color:#666666;
+	font-weight:normal;
+}
+
+#order-cloud_slider .txt-center {
+	padding-top:40px;
+	text-align:center;
+}
+
+#order-cloud_slider .main-container {
+	padding:0 2% 40px 2%;
+	margin:0 auto;
+	width:96%;
+	max-width:960px;
+}
+
+/* Plan Styles */
+
+#order-cloud_slider .plans-full-main {
+	padding:30px 0 0 0;
+	margin:0 0 0 0;
+	width:100%;
+	background: url(../img/sky-bg.jpg) repeat-x center top #eaf6fd;
+}
+#order-cloud_slider .pg-cont-container {
+	margin:0 auto;
+	width:100%;
+	max-width:825px;
+}
+#order-cloud_slider .heading-with-cloud {
+	padding:0 0 0 0;
+	margin:30px 0 0 0;
+	text-align:center;
+	position:relative;
+}
+#order-cloud_slider .heading-with-cloud .texts-container {
+	padding:0 0 0 0;
+	margin:0 0 20px 0;
+	font-size:57px;
+	text-transform:uppercase;
+	color:#99b826;
+}
+#order-cloud_slider .heading-with-cloud .images-container {
+	position:absolute;
+	top:10px;
+	text-align:center;
+	width:100%;
+	z-index:0;
+}
+#order-cloud_slider .tag-line-head {
+	text-align:center;
+	position:relative;
+	z-index:100;
+}
+#order-cloud_slider .tag-line-head h5 {
+	font-size:22px;
+	color:#53616c;
+}
+#order-cloud_slider .price-calc-container {
+	margin:20px 0 30px 0;
+	width:100%;
+	background:#ffffff;
+	-moz-border-radius:5px;
+	-webkit-border-radius:5px;
+	-ms-border-radius:5px;
+	border-radius:5px;
+	-webkit-box-shadow: 0 1px 2px 0 rgba(0,0,0,0.20);
+	-moz-box-shadow: 0 1px 2px 0 rgba(0,0,0,0.20);
+	box-shadow: 0 1px 2px 0 rgba(0,0,0,0.20);
+	position:relative;
+	z-index:100;
+}
+#order-cloud_slider .price-calc-top {
+	padding:20px 30px;
+	background:#f8f8f8;
+	-moz-border-radius:5px 5px 0 0;
+	-webkit-border-radius:5px 5px 0 0;
+	-ms-border-radius:5px 5px 0 0;
+	border-radius:5px 5px 0 0;
+	border-bottom:1px solid #ebebeb;
+}
+#order-cloud_slider .price-calc-top .price-cont {
+	padding:8px 0 0 0;
+	display:block;
+	font-size:24px;
+	color:#333333;
+}
+#order-cloud_slider .price-calc-top .order-btn,
+#order-cloud_slider .price-calc-top .order-btn:hover {
+	padding:12px 40px;
+	margin:10px 0;
+	font-size:16px;
+	color:#ffffff;
+	display:inline-table;
+	font-weight:bold;
+	background: #00afea; /* Old browsers */
+	background: -moz-linear-gradient(top,  #00afea 0%, #0089b8 100%); /* FF3.6+ */
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#00afea), color-stop(100%,#0089b8)); /* Chrome,Safari4+ */
+	background: -webkit-linear-gradient(top,  #00afea 0%,#0089b8 100%); /* Chrome10+,Safari5.1+ */
+	background: -o-linear-gradient(top,  #00afea 0%,#0089b8 100%); /* Opera 11.10+ */
+	background: -ms-linear-gradient(top,  #00afea 0%,#0089b8 100%); /* IE10+ */
+	background: linear-gradient(to bottom,  #00afea 0%,#0089b8 100%); /* W3C */
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00afea', endColorstr='#0089b8',GradientType=0 ); /* IE6-9 */
+	-webkit-border-radius:30px;
+	-moz-border-radius:30px;
+	-ms-border-radius:30px;
+	border-radius:30px;
+	text-decoration:none;
+	-webkit-text-shadow: 0 0 1px rgba(0,0,0,0.4);
+	-moz-text-shadow: 0 0 1px rgba(0,0,0,0.4);
+	-ms-text-shadow: 0 0 1px rgba(0,0,0,0.4);
+	text-shadow: 0 0 1px rgba(0,0,0,0.4);
+}
+#order-cloud_slider .price-calc-btm {
+	padding:20px 30px;
+}
+#order-cloud_slider .price-calc-btm .container-with-progress-bar {
+	padding-top:10px;
+	padding-bottom:20px;
+	font-size:14px;
+	line-height:26px;
+	font-weight:normal;
+}
+#order-cloud_slider .price-calc-btm .container-with-progress-bar span {
+	font-size:24px;
+	color:#333333;
+	display:block;
+}
+#order-cloud_slider .price-calc-btm .progress.small-progress {
+	margin:10px 0 0 0;
+	height:7px;
+	-webkit-box-shadow:none;
+	-moz-box-shadow:none;
+	-ms-box-shadow:none;
+	box-shadow:none;
+	background-color:#f3f3f3;
+}
+#order-cloud_slider .price-calc-btm .progress.small-progress .progress-bar {
+	-webkit-box-shadow:none;
+	-moz-box-shadow:none;
+	-ms-box-shadow:none;
+	box-shadow:none;
+	background-color:#66cc00;
+}
+
+/* Sliders Styles Overwrite */
+
+.irs-with-grid {
+	margin-top:20px;
+	height:60px;
+	margin-left:10px;
+}
+.irs-from,
+.irs-to,
+.irs-single {
+    color: #53616c;
+    font-size: 18px; line-height: 1.333;
+    text-shadow: none;
+    padding: 1px 5px 8px 5px;
+    background: #f8f8f8;
+	z-index:1000;
+	top:-8px;
+}
+.irs-grid-pol {
+	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
+	filter: alpha(opacity=0);
+	opacity:0;
+	background: #428bca;
+}
+.irs-grid-text {
+    top: 0;
+    color: #53616c;
+	font-size:14px;
+}
+.irs-grid {
+    bottom:inherit;
+	top:10px;
+}
+.irs-min,
+.irs-max {
+	display:none;
+}
+.irs-slider,
+.irs-slider:hover {
+    top: 21px;
+    width:40px; height:40px;
+    border:0 solid #AAA;
+    background: #DDD;
+    background:url(../img/slider-ct.png) no-repeat;
+    background-size:100%;
+    border-radius: 27px;
+    -moz-border-radius: 27px;
+    box-shadow: 1px 1px 3px rgba(0,0,0,0.3);
+    cursor: pointer;
+	z-index:1100;
+}
+.irs-line {
+	background:#00ffbf;
+	border:0;
+	height:16px;
+	-webkit-box-shadow: inset 0 2px 2px 0 rgba(0,0,0,0.20);
+	-moz-box-shadow: inset 0 2px 2px 0 rgba(0,0,0,0.20);
+	box-shadow: inset 0 2px 2px 0 rgba(0,0,0,0.20);
+}
+.irs-bar {
+    height: 10px;
+	top: 36px;
+    border-top:0 solid #428bca;
+    border-bottom:0 solid #428bca;
+    background: #00afea;
+}
+.irs-bar-edge {
+	height: 10px;
+	top: 36px;
+	width: 18px;
+	border:0 solid #428bca;
+    background: #00afea;
+	border-radius: 16px 0 0 16px;
+	-moz-border-radius: 16px 0 0 16px;
+	margin-left:3px;
+}
+
+/* Includes Content Area */
+
+#order-cloud_slider .includes-container {
+	margin:0 auto;
+	width:100%;
+	max-width:780px;
+	padding-top:35px;
+}
+#order-cloud_slider .includes-container .head-area {
+	padding:0 0 0 0;
+	margin:0 0 0 0;
+	text-align:center;
+	background:url(../img/head-bg.png) no-repeat center center;
+	background-size:100% auto;
+}
+#order-cloud_slider .includes-container .head-area span {
+	padding:0 20px;
+	margin:0 0 0 0;
+	display:inline-table;
+	background:#ffffff;
+}
+#order-cloud_slider .includes-container ul.list-contents {
+	padding:20px 0 0 0;
+	margin:0 0 0 0;
+	list-style:none;
+}
+#order-cloud_slider .includes-container ul.list-contents li {
+	padding:0 0 0 22px;
+	margin:5px 0;
+	width:33%;
+	display:inline-table;
+	background:url(../img/tick.png) no-repeat;
+}
+
+
+/* Features Content */
+
+#order-cloud_slider .plans-full-main h3 {
+	font-weight:normal;
+	color:#52606c;
+}
+#order-cloud_slider .plans-full-main h4 {
+}
+#order-cloud_slider .plans-full-main p {
+	padding:0 0 0 0;
+	margin:10px 0 20px 0;
+}
+#order-cloud_slider .price-features-container {
+	padding:0 40px;
+	line-height:23px;
+}
+#order-cloud_slider .feature-container {
+	padding:40px 0;
+}
+#order-cloud_slider .feature-container .left-img {
+	margin:0 20px 0 0;
+	float:left;
+	min-height:200px;
+}
+#order-cloud_slider .feature-container .right-img {
+	margin:0 0 20px 20px;
+	float:right;
+}
+
+/* Media Query */
+
+@media (max-width: 991px) { /* This media query is written for Ipad and tablets */
+    #order-cloud_slider .includes-container ul.list-contents li {
+        width:48%;
+    }
+    #order-cloud_slider .heading-with-cloud .images-container img {
+        width:100%;
+    }
+    #order-cloud_slider .price-calc-top .price-cont {
+        padding:30px 0 0 0;
+    }
+    #order-cloud_slider .irs-with-grid {
+        margin-left:0;
+    }
+}
+
+@media (max-width: 768px) { /* This media query is written for Mobile landscape and Ipad and tablets portrait */
+    #order-cloud_slider .feature-container .left-img,
+    #order-cloud_slider .feature-container .right-img {
+        margin:0 0 20px 0;
+        width:100%;
+        text-align:center;
+    }
+    #order-cloud_slider .feature-container {
+        text-align:center;
+    }
+    #order-cloud_slider .heading-with-cloud .texts-container {
+        font-size:48px;
+    }
+}
+
+@media (max-width: 480px) { /* This media query is written for Mobile only */
+    #order-cloud_slider .includes-container ul.list-contents li {
+        width:100%;
+    }
+    #order-cloud_slider .feature-container .left-img img, .feature-container .right-img img {
+        width:100%;
+    }
+    #order-cloud_slider .heading-with-cloud .texts-container {
+        font-size:24px;
+    }
+}
+
+/* Sidebar */
+
+html, body {
+    overflow-x: hidden; /* Prevent scroll on narrow devices */
+}
+
+.row-product-selection {
+    position: relative;
+    left: 0;
+    -webkit-transition: all .25s ease-out;
+         -o-transition: all .25s ease-out;
+            transition: all .25s ease-out;
+}
+
+.product-selection-sidebar {
+    position: absolute;
+    top: 0;
+    left: -300px;
+    width: 300px;
+    display: none;
+}
+
+#btnShowSidebar {
+    margin: -10px 0 0 20px;
+}

orderforms/cloud_slider/index.php

@@ -0,0 +1,2 @@
+<?php
+header("Location: ../../../index.php");

orderforms/cloud_slider/products.tpl

@@ -0,0 +1,393 @@
+<!--[if lt IE 9]>
+<script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.min.js"></script>
+<![endif]-->
+
+<!-- RangeSlider CSS -->
+<link type="text/css" rel="stylesheet" href="{$BASE_PATH_CSS}/ion.rangeSlider.css" property="stylesheet" />
+<!-- RangeSlider CSS -->
+<link type="text/css" rel="stylesheet" href="{$BASE_PATH_CSS}/ion.rangeSlider.skinHTML5.css" property="stylesheet" />
+<!-- Product Recommendations CSS -->
+<link type="text/css" rel="stylesheet" href="{$BASE_PATH_CSS}/recommendations.min.css" property="stylesheet" />
+<!-- Core CSS -->
+<link type="text/css" rel="stylesheet" href="{assetPath file="style.css"}" property="stylesheet" />
+
+<script>
+jQuery(document).ready(function () {
+    jQuery('#btnShowSidebar').click(function () {
+        if (jQuery(".product-selection-sidebar").is(":visible")) {
+            jQuery('.row-product-selection').css('left','0');
+            jQuery('.product-selection-sidebar').fadeOut();
+            jQuery('#btnShowSidebar').html('<i class="fas fa-arrow-circle-right"></i> {$LANG.showMenu}');
+        } else {
+            jQuery('.product-selection-sidebar').fadeIn();
+            jQuery('.row-product-selection').css('left','300px');
+            jQuery('#btnShowSidebar').html('<i class="fas fa-arrow-circle-left"></i> {$LANG.hideMenu}');
+        }
+    });
+});
+</script>
+
+{if $errormessage}
+    <div class="alert alert-danger">
+        {$errormessage}
+    </div>
+{else}
+
+    <div class="row row-product-selection">
+        <div class="col-md-3 sidebar product-selection-sidebar" id="premiumComparisonSidebar">
+            {include file="orderforms/standard_cart/sidebar-categories.tpl"}
+        </div>
+        <div class="col-md-12">
+
+            <div id="order-cloud_slider">
+                <section class="plans-full-main">
+                    {if $showSidebarToggle}
+                        <div class="pull-left float-left">
+                            <button type="button" class="btn btn-default btn-sm" id="btnShowSidebar">
+                                <i class="fas fa-arrow-circle-right"></i>
+                                {$LANG.showMenu}
+                            </button>
+                        </div>
+                    {/if}
+                    <div class="main-container">
+                        <div class="pg-cont-container">
+                            {if !$errormessage && !$productGroup}
+                                <div class="alert alert-info">
+                                    {lang key='orderForm.selectCategory'}
+                                </div>
+                            {else}
+                                <div class="heading-with-cloud">
+                                    <div id="headline" class="texts-container">
+                                        {if $productGroup.headline}
+                                            {$productGroup.headline}
+                                        {else}
+                                            {$productGroup.name}
+                                        {/if}
+                                    </div>
+                                    <div class="images-container">
+                                        <img src="{assetPath ns="img" file="sky-hr.png"}" alt="">
+                                    </div>
+                                </div>
+
+                                {if $productGroup.tagline}
+                                    <div id="tagline" class="tag-line-head">
+                                        <h5 class="font-size-14">{$productGroup.tagline}</h5>
+                                    </div>
+                                {/if}
+
+                                <!-- Start: Price Calculation Box -->
+                                <div class="price-calc-container">
+                                    <div class="price-calc-top">
+                                        <div class="row clearfix">
+                                            <div class="col-md-9" id="products-top">
+                                                <input type="hidden" id="scroll-top" name="scroll-top" value="" />
+                                            </div>
+                                            <div class="col-md-3 text-center">
+                                                <span id="priceTop" class="price-cont">--</span>
+                                                <a href="#" class="order-btn" id="product-order-button">
+                                                    {$LANG.ordernowbutton}
+                                                </a>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="price-calc-btm">
+
+                                        <!-- Start: Progress Area Container -->
+                                        <div id="productFeaturesTop" class="row clearfix">
+                                            <!-- Javascript will populate this area with product features. -->
+                                        </div>
+                                        <!-- End: Progress Area Container -->
+
+                                        <div id="productDescription"></div>
+
+                                        {if count($productGroup.features) > 0}
+                                            <!-- Start: Includes Container -->
+                                            <div class="includes-container">
+                                                <div class="row clearfix">
+
+                                                    <div class="col-md-12">
+                                                        <div class="head-area">
+                                                        <span>
+                                                            {$LANG.whatIsIncluded}
+                                                        </span>
+                                                        </div>
+
+                                                        <ul id="list-contents" class="list-contents">
+                                                            {foreach $productGroup.features as $features}
+                                                                <li>{$features.feature}</li>
+                                                            {/foreach}
+                                                        </ul>
+
+                                                    </div>
+
+                                                </div>
+                                            </div>
+                                            <!-- End: Includes Container -->
+                                        {/if}
+                                    </div>
+                                </div>
+                                <!-- End: Price Calculation Box -->
+                            {/if}
+
+                            <!-- Start: Features Content -->
+                            <div class="price-features-container">
+                                <div class="row clearfix">
+
+                                    <!-- Start: Feature 01 -->
+                                    <div class="col-md-12 feature-container clearfix">
+                                        <div class="left-img">
+                                            <img src="{assetPath ns="img" file="feat-img-01.png"}" alt="">
+                                        </div>
+                                        <h4 class="font-size-18">
+                                            {$LANG.cloudSlider.feature01Title}
+                                        </h4>
+                                        <p>
+                                            {$LANG.cloudSlider.feature01Description}
+                                        </p>
+                                        <p>
+                                            {$LANG.cloudSlider.feature01DescriptionTwo}
+                                        </p>
+                                    </div>
+                                    <!-- End: Feature 01 -->
+
+                                    <!-- Start: Feature 02 -->
+                                    <div class="col-md-12 feature-container clearfix">
+                                        <div class="right-img">
+                                            <img src="{assetPath ns="img" file="feat-img-02.png"}" alt="">
+                                        </div>
+                                        <h4 class="font-size-18">
+                                            {$LANG.cloudSlider.feature02Title}
+                                        </h4>
+                                        <p>
+                                            {$LANG.cloudSlider.feature02Description}
+                                        </p>
+                                        <p>
+                                            {$LANG.cloudSlider.feature02DescriptionTwo}
+                                        </p>
+                                    </div>
+                                    <!-- End: Feature 02 -->
+
+                                    <!-- Start: Feature 03 -->
+                                    <div class="col-md-12 feature-container clearfix">
+                                        <div class="left-img">
+                                            <img src="{$WEB_ROOT}/templates/orderforms/{$carttpl}/img/feat-img-03.jpg" alt="">
+                                        </div>
+                                        <h4 class="font-size-18">
+                                            {$LANG.cloudSlider.feature03Title}
+                                        </h4>
+                                        <p>
+                                            {$LANG.cloudSlider.feature03Description}
+                                        </p>
+                                        <p>
+                                            {$LANG.cloudSlider.feature03DescriptionTwo}
+                                        </p>
+                                    </div>
+                                    <!-- End: Feature 03 -->
+
+                                </div>
+                            </div>
+                            <!-- End: Features Content -->
+
+                            {if $productGroup}
+                                <h3 class="text-center font-size-24">{$LANG.cloudSlider.selectProductLevel}</h3>
+
+                                <!-- Start: Price Calculation Box -->
+                                <div class="price-calc-container">
+                                    <div class="price-calc-top">
+                                        <div class="row clearfix">
+                                            <div class="col-md-9" id="products-bottom">
+                                                <input type="hidden" id="scroll-bottom" name="scroll-bottom" value="" />
+                                            </div>
+                                            <div class="col-md-3 text-center">
+                                                <span id="priceBottom" class="price-cont">--</span>
+                                                <a href="#" class="order-btn" id="product-order-button-bottom">
+                                                    {$LANG.ordernowbutton}
+                                                </a>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="price-calc-btm">
+
+                                        <!-- Start: Progress Area Container -->
+                                        <div id="productFeaturesBottom" class="row clearfix">
+                                            <!-- Javascript will populate this area with product features. -->
+                                        </div>
+                                        <!-- End: Progress Area Container -->
+                                    </div>
+                                </div>
+                                <!-- End: Price Calculation Box -->
+                            {/if}
+                        </div>
+
+                    </div>
+                </section>
+
+            </div>
+
+        </div>
+    </div>
+
+    {include file="orderforms/cloud_slider/recommendations-modal.tpl"}
+{/if}
+<!-- RangeSlider JS -->
+<script type="text/javascript" src="{$BASE_PATH_JS}/ion.rangeSlider.js"></script>
+<script type="text/javascript">
+
+var sliderActivated = false;
+
+var sliderProductNames = [
+    {foreach $products as $product}
+        "{$product.name}",
+    {/foreach}
+];
+
+var allProducts = {
+    {foreach $products as $num => $product}
+        "{$num}": {
+            "name": "{$product.name}",
+            "desc": "{$product.featuresdesc|nl2br|trim|regex_replace:"/[\r\n]/":''}",
+            {if isset($product.pid)}
+                "pid": "{$product.pid}",
+                "displayPrice": "{$product.pricing.minprice.price}",
+                "displayCycle": "{$product.pricing.minprice.cycle}",
+            {else}
+                "bid": "{$product.bid}",
+                "displayPrice": "{$product.displayprice}",
+                "displayCycle": "",
+            {/if}
+            "features": {
+                {foreach $product.features as $k => $feature}
+                    "{$k}": "{$feature}",
+                {/foreach}
+            },
+            "featurePercentages": {
+                {foreach $featurePercentages as $featureKey => $feature}
+                    {if isset($feature.$num)}
+                        "{$featureKey}": "{$feature.$num}",
+                    {/if}
+                {/foreach}
+            },
+            productUrl: '{$product.productUrl}',
+            hasRecommendations: '{$product.hasRecommendations}'
+        },
+    {/foreach}
+};
+
+var definedProducts = {
+    {foreach $products as $product}
+        "{if isset($product.pid)}{$product.pid}{else}b{$product.bid}{/if}": "{$product@index}"{if !($product@last)},
+    {/if}
+    {/foreach}
+};
+
+{foreach $products as $product}
+    {if $product.isFeatured}
+        var firstFeatured = definedProducts["{if isset($product.pid)}{$product.pid}{else}b{$product.bid}{/if}"];
+        {break}
+    {/if}
+{/foreach}
+
+var rangeSliderValues = {
+    type: "single",
+    grid: true,
+    grid_snap: true,
+    step: 1,
+    onStart: updateFeaturesList,
+    {if $products|@count eq 1}
+        disable: true,
+    {/if}
+    onChange: updateFeaturesList,
+    values: sliderProductNames
+};
+
+{if $pid}
+    rangeSliderValues['from'] = definedProducts["{$pid}"];
+{else}
+    if (typeof firstFeatured != 'undefined') {
+        rangeSliderValues['from'] = firstFeatured;
+    }
+{/if}
+
+function updateFeaturesList(data)
+{
+    var featureName = "",
+        featureMarkup = "",
+        i = parseInt(data.from);
+    if (isNaN(i)) {
+        i = 0;
+        jQuery(".irs-single").text(sliderProductNames[0]);
+        jQuery(".irs-grid-text").text('');
+    }
+    var pid = allProducts[i].pid,
+        bid = allProducts[i].bid,
+        desc = allProducts[i].desc,
+        features = allProducts[i].features,
+        featurePercentages = allProducts[i].featurePercentages,
+        displayCycle = '<br><small>' + allProducts[i].displayCycle + '</small>',
+        displayPrice = allProducts[i].displayPrice + displayCycle,
+        selectedId = data.input[0].id,
+        featuresTargetArea = "",
+        priceTargetArea = "",
+        orderNowArea = "",
+        buyLink = allProducts[i].productUrl,
+        hasRecommendations = allProducts[i].hasRecommendations;
+
+    if (selectedId == 'scroll-top') {
+        if (sliderActivated) {
+            jQuery("#scroll-bottom").data("ionRangeSlider").update({
+               from:i
+            });
+        }
+    } else {
+        if (sliderActivated) {
+            jQuery("#scroll-top").data("ionRangeSlider").update({
+                from:i
+            });
+        }
+    }
+
+    // Clear the description.
+    jQuery("#productFeaturesTop").empty();
+    jQuery("#productFeaturesBottom").empty();
+
+    // Update the displayed price.
+    jQuery("#priceTop").html(displayPrice);
+    jQuery("#priceBottom").html(displayPrice);
+
+    // Update the href for the Order Now button.
+    jQuery("#product-order-button").attr("href", buyLink);
+    jQuery("#product-order-button-bottom").attr("href", buyLink);
+
+    // Update data-has-recommendations attribute
+    if (hasRecommendations) {
+        jQuery('#product-order-button').attr('data-has-recommendations', hasRecommendations);
+    }
+
+    for (featureName in features) {
+        featureMarkup = '<div class="col-md-3 container-with-progress-bar">' +
+                            featureName +
+                            '<span>' + features[featureName] + '</span>' +
+                            '<div class="progress small-progress">' +
+                                '<div class="progress-bar" role="progressbar" aria-valuenow="'+ featurePercentages[featureName] + '" aria-valuemin="0" aria-valuemax="100" style="width: ' + featurePercentages[featureName] + '%;">' +
+                                    '<span class="sr-only">' + featurePercentages[featureName] + '% Complete</span>' +
+                                '</div>' +
+                            '</div>' +
+                        '</div>';
+
+        jQuery("#productFeaturesTop").append(featureMarkup);
+        jQuery("#productFeaturesBottom").append(featureMarkup);
+    }
+
+    jQuery("#productDescription").html(desc);
+}
+
+jQuery("#scroll-top").ionRangeSlider(rangeSliderValues);
+jQuery("#scroll-bottom").ionRangeSlider(rangeSliderValues);
+{if $products|@count eq 1}
+    jQuery(".irs-single").text(sliderProductNames[0]);
+    jQuery(".irs-grid-text").text('');
+{/if}
+
+sliderActivated = true;
+</script>
+<script src="{$BASE_PATH_JS}/whmcs/recommendations.min.js"></script>

orderforms/cloud_slider/theme.yaml

@@ -0,0 +1,2 @@
+config:
+    parent: standard_cart

orderforms/index.php

@@ -0,0 +1,2 @@
+<?php
+header("Location: ../../index.php");

orderforms/legacy_boxes/css/style.css

@@ -0,0 +1,60 @@
+/**
+ * Legacy Boxes order form style sheet
+ *
+ * Contains styling specific to the Legacy Boxes order form template.
+ *
+ * @project   WHMCS
+ * @version   1.0
+ * @author    WHMCS Limited <development@whmcs.com>
+ * @copyright Copyright (c) WHMCS Limited 2005-2020
+ * @license   https://www.whmcs.com/license/
+ * @link      https://www.whmcs.com/
+ *
+ */
+#order-boxes {
+    margin: 0;
+    padding: 0 0 40px 0;
+}
+
+#order-boxes .line-padded {
+    margin-top: 15px;
+    margin-bottom: 15px;
+}
+
+#order-boxes .fields-container {
+    border-top: 10px solid #5AB9F1;
+    border-bottom: 10px solid #5AB9F1;
+}
+
+#order-boxes .fields-container .field-row {
+    padding: 10px 8px;
+}
+
+#order-boxes .fields-container .field-row:nth-child(odd) {
+    background-color: #E8F0F9;
+    color: #000000;
+}
+
+#order-boxes .fields-container .field-row:nth-child(even) {
+    background-color: #D6E4F6;
+    color: #000000;
+}
+
+#order-boxes .product-radio {
+    padding-left: 40px;
+}
+
+#order-boxes .product-radio input[type=radio] {
+    margin-left: -30px;
+}
+
+#order-boxes .secure-warning {
+    margin: 20px 0 20px 0;
+    padding: 7px;
+    border-top: 4px solid #EBE8CD;
+    border-bottom: 4px solid #EBE8CD;
+    background-color: #F1EFDC;
+    font-size: 0.9em;
+    text-align: center;
+    color: #000;
+}

orderforms/legacy_boxes/index.php

@@ -0,0 +1,2 @@
+<?php
+header("Location: ../../../index.php");

orderforms/legacy_boxes/products.tpl

@@ -0,0 +1,59 @@
+<link rel="stylesheet" type="text/css" href="{assetPath file="style.css"}" />
+
+<div id="order-boxes">
+
+    <div class="pull-md-right float-md-right col-md-9">
+
+        <div class="header-lined">
+            <h1 class="font-size-36">{$groupname}</h1>
+        </div>
+
+    </div>
+
+    <div class="col-md-3 pull-md-left sidebar hidden-xs hidden-sm d-none d-md-block float-md-left">
+
+        {include file="orderforms/standard_cart/sidebar-categories.tpl"}
+
+    </div>
+
+    <div class="col-md-9 pull-md-right float-md-right">
+
+        <div class="line-padded visible-xs visible-sm d-block d-md-none clearfix">
+
+            {include file="orderforms/standard_cart/sidebar-categories-collapsed.tpl"}
+
+        </div>
+
+        {if !$products && !$errormessage}
+            <div class="alert alert-info">
+                {lang key='orderForm.selectCategory'}
+            </div>
+        {else}
+            <form method="post" action="{$WEB_ROOT}/cart.php?a=add">
+
+                <div class="fields-container">
+                    {foreach from=$products item=product}
+                        <div class="field-row clearfix">
+                            <div class="col-xs-12 col-12">
+                                <label class="radio-inline product-radio"><input type="radio" name="pid" id="pid{$product.pid}" value="{if $product.bid}b{$product.bid}{else}{$product.pid}{/if}"{if $product.qty eq "0"} disabled{/if} /> <strong>{$product.name}</strong> {if $product.stockControlEnabled}<em>({$product.qty} {$LANG.orderavailable})</em>{/if}{if $product.description} - {$product.description}{/if}</label>
+                            </div>
+                        </div>
+                    {/foreach}
+                </div>
+
+                <div class="line-padded text-center">
+                    <button type="submit" class="btn btn-primary btn-lg">{$LANG.continue} &nbsp;<i class="fas fa-arrow-circle-right"></i></button>
+                </div>
+
+            </form>
+        {/if}
+
+    </div>
+
+    <div class="clearfix"></div>
+
+    <div class="secure-warning">
+        <img src="assets/img/padlock.gif" align="absmiddle" border="0" alt="Secure Transaction" /> &nbsp;{$LANG.ordersecure} (<strong>{$ipaddress}</strong>) {$LANG.ordersecure2}
+    </div>
+
+</div>

orderforms/legacy_boxes/theme.yaml

@@ -0,0 +1,2 @@
+config:
+  parent: standard_cart

orderforms/legacy_modern/css/style.css

@@ -0,0 +1,143 @@
+/**
+ * Legacy Modern order form style sheet
+ *
+ * Contains styling specific to the Legacy Modern order form template.
+ *
+ * @project   WHMCS
+ * @version   1.0
+ * @author    WHMCS Limited <development@whmcs.com>
+ * @copyright Copyright (c) WHMCS Limited 2005-2020
+ * @license   https://www.whmcs.com/license/
+ * @link      https://www.whmcs.com/
+ *
+ */
+#order-modern {
+    margin: 0;
+    padding: 0 0 40px;
+}
+
+#order-modern .title-bar {
+    margin: 0 0 25px 0;
+    text-align: center;
+}
+
+#order-modern .title-bar h1 {
+    margin: 0;
+    padding: 0;
+}
+
+#order-modern select {
+    border: 1px solid #ccc;
+    padding: 1px;
+}
+
+#order-modern .clear {
+    clear: both;
+}
+
+#order-modern #configcontainer, #order-modern #configcontainer2 {
+    display: none;
+}
+
+#order-modern .loading {
+    display: none;
+    width: 220px;
+    padding-top: 10px;
+    margin-left: auto;
+    margin-right: auto;
+    clear: both;
+}
+
+#order-modern #cartLoader i {
+    font-size: 1.6em;
+}
+
+#order-modern .errorbox {
+    display: none;
+    margin: 15px 0;
+    padding: 15px 20px;
+    background-color: #FBEEEB;
+    border: 1px dashed #cc0000;
+    font-weight: bold;
+    color: #cc0000;
+    text-align: center;
+    -moz-border-radius: 6px;
+    -webkit-border-radius: 6px;
+    -o-border-radius: 6px;
+    border-radius: 6px;
+}
+
+/*
+Product Categories
+*/
+
+#order-modern .choosecat {
+    margin: 10px;
+}
+
+#order-modern .currencychooser {
+    margin: 10px 30px;
+    padding: 0;
+    text-align: right;
+}
+
+/*
+Product Listing
+*/
+
+#order-modern .product {
+    margin: 15px 0;
+    padding: 15px;
+    background-color: #fff;
+    border: 1px solid #ccc;
+    -moz-border-radius: 5px;
+    -webkit-border-radius: 5px;
+    -o-border-radius: 5px;
+    border-radius: 5px;
+}
+
+#order-modern .product:hover {
+    background-color: #E6EDFF;
+    cursor: pointer;
+    cursor: hand;
+}
+
+#order-modern .product .pricing {
+    float: right;
+    text-align: right;
+    font-family: Lucida Sans Unicode,Lucida Grande,sans-serif;
+    font-size: 18px;
+    line-height: 20px;
+}
+
+#order-modern .product .name {
+    font-family: Lucida Sans Unicode,Lucida Grande,sans-serif;
+    font-weight: normal;
+    font-size: 20px;
+    margin-bottom: 10px;
+}
+
+#order-modern .product .prodfeature {
+    float: left;
+    margin: 5px 5px 0 0;
+    padding: 5px 10px 5px 10px;
+    border: 1px solid #ccc;
+    background-color: #fff;
+    text-align: center;
+    -moz-border-radius: 5px;
+    -webkit-border-radius: 5px;
+    -o-border-radius: 5px;
+    border-radius: 5px;
+    font-size: 20px;
+    color: #ff6600;
+}
+
+#order-modern .product .prodfeature .feature {
+    font-size: 13px;
+    color: #666;
+}
+
+#order-modern .product .description {
+    font-size: 0.9em;
+    margin: 15px 30px 10px 20px;
+}

orderforms/legacy_modern/index.php

@@ -0,0 +1,2 @@
+<?php
+header("Location: ../../../index.php");

orderforms/legacy_modern/js/main.js

@@ -0,0 +1,12 @@
+
+function showcats() {
+    jQuery("#categories").slideToggle();
+}
+
+function selproduct(num) {
+    jQuery('#productslider').slider("value", num);
+    jQuery(".product").hide();
+    jQuery("#product"+num).show();
+    jQuery(".sliderlabel").removeClass("selected");
+    jQuery("#prodlabel"+num).addClass("selected");
+}

orderforms/legacy_modern/products.tpl

@@ -0,0 +1,136 @@
+<script type="text/javascript" src="{assetPath file="main.js"}"></script>
+<link rel="stylesheet" type="text/css" href="{assetPath file="style.css"}" />
+
+<div id="order-modern">
+
+    <div class="title-bar">
+        <h1 class="font-size-36">{$groupname}</h1>
+        <div class="choosecat btn-group" role="toolbar">
+            <button type="button" class="btn btn-default btn-light dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                {lang key='cartchooseanothercategory'} <span class="caret"></span>
+            </button>
+            <ul class="dropdown-menu" role="menu">
+                {foreach key=num item=productgroup from=$productgroups}
+                    <li class="dropdown-item"><a class="dropdown-item px-2 py-0" href="{$WEB_ROOT}/cart.php?gid={$productgroup.gid}">{$productgroup.name}</a></li>
+                {/foreach}
+                {if $loggedin}
+                    <li class="dropdown-item"><a class="dropdown-item px-2 py-0" href="{$WEB_ROOT}/cart.php?gid=addons">{lang key='cartproductaddons'}</a></li>
+                    {if $renewalsenabled}
+                        <li class="dropdown-item"><a class="dropdown-item px-2 py-0" href="{$WEB_ROOT}/cart.php?gid=renewals">{lang key='domainrenewals'}</a></li>
+                    {/if}
+                {/if}
+                {if $registerdomainenabled}
+                    <li class="dropdown-item"><a class="dropdown-item px-2 py-0" href="{$WEB_ROOT}/cart.php?a=add&domain=register">{lang key='registerdomain'}</a></li>
+                {/if}
+                {if $transferdomainenabled}
+                    <li class="dropdown-item"><a class="dropdown-item px-2 py-0" href="{$WEB_ROOT}/cart.php?a=add&domain=transfer">{lang key='transferdomain'}</a></li>
+                {/if}
+                <li class="dropdown-item"><a class="dropdown-item px-2 py-0" href="{$WEB_ROOT}/cart.php?a=view">{lang key='viewcart'}</a></li>
+            </ul>
+        </div>
+    </div>
+
+    {if !$loggedin && $currencies}
+        <div class="currencychooser">
+            <div class="btn-group" role="group">
+                {foreach from=$currencies item=curr}
+                    <a href="{$WEB_ROOT}/cart.php?gid={$gid}&currency={$curr.id}" class="btn btn-default{if $currency.id eq $curr.id} active{/if}">
+                        <img src="{$BASE_PATH_IMG}/flags/{if $curr.code eq "AUD"}au{elseif $curr.code eq "CAD"}ca{elseif $curr.code eq "EUR"}eu{elseif $curr.code eq "GBP"}gb{elseif $curr.code eq "INR"}in{elseif $curr.code eq "JPY"}jp{elseif $curr.code eq "USD"}us{elseif $curr.code eq "ZAR"}za{else}na{/if}.png" border="0" alt="" />
+                        {$curr.code}
+                    </a>
+                {/foreach}
+            </div>
+        </div>
+    {/if}
+
+    <div class="row">
+
+        {foreach from=$products key=num item=product}
+            {$idPrefix = ($product.bid) ? ("bundle"|cat:$product.bid) : ("product"|cat:$product.pid)}
+            <div class="col-md-6">
+                <div id="{$idPrefix}" class="product" onclick="window.location='{$product.productUrl}'">
+
+                    <div class="pricing">
+                        {if $product.bid}
+                            {lang key='bundledeal'}<br />
+                            {if $product.displayprice}
+                                <span class="pricing">{$product.displayprice}</span>
+                            {/if}
+                        {else}
+                            {if $product.pricing.hasconfigoptions}
+                                {lang key='startingfrom'}
+                                <br />
+                            {/if}
+                            <span class="pricing">{$product.pricing.minprice.price}</span>
+                            <br />
+                            {if $product.pricing.minprice.cycle eq "monthly"}
+                                {lang key='orderpaymenttermmonthly'}
+                            {elseif $product.pricing.minprice.cycle eq "quarterly"}
+                                {lang key='orderpaymenttermquarterly'}
+                            {elseif $product.pricing.minprice.cycle eq "semiannually"}
+                                {lang key='orderpaymenttermsemiannually'}
+                            {elseif $product.pricing.minprice.cycle eq "annually"}
+                                {lang key='orderpaymenttermannually'}
+                            {elseif $product.pricing.minprice.cycle eq "biennially"}
+                                {lang key='orderpaymenttermbiennially'}
+                            {elseif $product.pricing.minprice.cycle eq "triennially"}
+                                {lang key='orderpaymenttermtriennially'}
+                            {/if}
+                            <br>
+                            {if $product.pricing.minprice.setupFee}
+                                <small>{$product.pricing.minprice.setupFee->toPrefixed()} {lang key='ordersetupfee'}</small>
+                            {/if}
+                        {/if}
+                    </div>
+
+                    <div class="name">
+                        {$product.name}
+                        {if $product.stockControlEnabled}
+                            <span class="qty">
+                                ({$product.qty} {lang key='orderavailable'})
+                            </span>
+                        {/if}
+                    </div>
+
+                    {foreach from=$product.features key=feature item=value}
+                        <span class="prodfeature">
+                            <span class="feature">{$feature}</span>
+                            <br />
+                            {$value}
+                        </span>
+                    {/foreach}
+
+                    <div class="clear"></div>
+
+                    <div class="description">{$product.featuresdesc}</div>
+
+                    <div class="text-right">
+                        <a href="{$product.productUrl}" class="btn btn-success btn-lg"><i class="fas fa-shopping-cart"></i> {lang key='ordernowbutton'}</a>
+                    </div>
+
+                </div>
+            </div>
+
+            {if $num % 2}
+                </div>
+                <div class="row">
+            {/if}
+
+        {/foreach}
+
+    </div>
+
+    {if !$loggedin && $currencies}
+        <div class="currencychooser">
+            <div class="btn-group" role="group">
+                {foreach from=$currencies item=curr}
+                    <a href="{$WEB_ROOT}/cart.php?gid={$gid}&currency={$curr.id}" class="btn btn-default{if $currency.id eq $curr.id} active{/if}">
+                        <img src="{$BASE_PATH_IMG}/flags/{if $curr.code eq "AUD"}au{elseif $curr.code eq "CAD"}ca{elseif $curr.code eq "EUR"}eu{elseif $curr.code eq "GBP"}gb{elseif $curr.code eq "INR"}in{elseif $curr.code eq "JPY"}jp{elseif $curr.code eq "USD"}us{elseif $curr.code eq "ZAR"}za{else}na{/if}.png" border="0" alt="" />
+                        {$curr.code}
+                    </a>
+                {/foreach}
+            </div>
+        </div>
+    {/if}
+
+</div>

orderforms/legacy_modern/theme.yaml

@@ -0,0 +1,2 @@
+config:
+  parent: standard_cart

orderforms/premium_comparison/css/style.css

@@ -0,0 +1,360 @@
+/**
+ * Premium Slider order form style sheet
+ *
+ * Contains styling specific to the Premium Slider order template.
+ *
+ * @project   WHMCS
+ * @version   1.0
+ * @author    WHMCS Limited <development@whmcs.com>
+ * @copyright Copyright (c) WHMCS Limited 2005-2015
+ * @license   http://www.whmcs.com/license/
+ * @link      http://www.whmcs.com/
+ */
+
+div#order-premium_comparison {
+    padding:0 0 0 0;
+    margin:0 0 30px 0;
+    height: 100%;
+    width: 100%;
+    line-height:18px;
+    font-size:14px;
+    color:#666666;
+    text-rendering: optimizeLegibility !important;
+    -webkit-font-smoothing: antialiased !important;
+}
+
+/* Text Styling */
+
+#order-premium_comparison a,
+#order-premium_comparison a:hover,
+#order-premium_comparison a:active,
+#order-premium_comparison a:visited,
+#order-premium_comparison a:link {
+    outline:none;
+    transition: all 0.5s ease 0s;
+    -webkit-transition: all 0.5s ease 0s;
+    -moz-transition: all 0.5s ease 0s;
+}
+#order-premium_comparison div,
+#order-premium_comparison ul,
+#order-premium_comparison li {
+    padding:0 0 0 0;
+    margin:0 0 0 0;
+}
+
+/* Headings */
+
+#order-premium_comparison h1 {
+}
+#order-premium_comparison h2 {
+}
+#order-premium_comparison h3 {
+    padding:0 0 0 0;
+    margin:0;
+    font-size:32px;
+    line-height:38px;
+    font-weight:bold;
+    color:#333333;
+}
+#order-premium_comparison h4 {
+    padding:0 0 0 0;
+    margin:10px 0;
+    font-size:24px;
+    color:#333333;
+}
+#order-premium_comparison h5 {
+    padding:0 0 0 0;
+    margin:5px 0;
+    font-size:16px;
+    color:#666666;
+}
+
+#order-premium_comparison .txt-center {
+    text-align:center;
+}
+
+#order-premium_comparison .alert {
+    margin-top: 70px;
+    padding: 15px;
+}
+
+#order-premium_comparison .main-container {
+    padding:0 2% 40px 2%;
+    margin:0 auto;
+}
+#order-premium_comparison .main-container.price-01 {
+    font-size:14px;
+    line-height:17px;
+}
+#order-premium_comparison .main-container.price-01 h3,
+#order-premium_comparison .main-container.price-01 h5 {
+    font-weight:normal;
+}
+
+#order-premium_comparison .price-table-container {
+    padding:10px 0 0 0;
+    margin:0 0 0 0;
+}
+#order-premium_comparison .price-table-container ul {
+    padding:0 0 0 0;
+    margin:0 0 0 0;
+    list-style:none;
+    text-align:center;
+}
+#order-premium_comparison .price-table-container ul li {
+    padding:30px 10px 5px 10px;
+    margin:0 0 0 0;
+    display:inline-block;
+    background:url(../img/shadow-btm.png) no-repeat center bottom;
+}
+#order-premium_comparison .price-table-container .price-table {
+    padding:0 0 0 0;
+    margin:0 0 0 0;
+    width: 270px;
+    min-width: 270px;
+    background:#ffffff;
+    -moz-border-radius:5px;
+    -webkit-border-radius:5px;
+    -ms-border-radius:5px;
+    border-radius:5px;
+    -webkit-box-shadow: 0 0 2px 0 rgba(0,0,0,0.30);
+    -moz-box-shadow: 0 0 2px 0 rgba(0,0,0,0.30);
+    box-shadow: 0 0 2px 0 rgba(0,0,0,0.30);
+}
+#order-premium_comparison .price-table-container .price-table.active {
+    margin:-30px 0 0 0;
+    width:245px;
+}
+#order-premium_comparison .price-table-container .price-table .top-head {
+    /* Old browsers */
+    background: #006699;
+    /* FF3.6+ */
+    background: -moz-linear-gradient(top,  #006699 0%, #004c66 100%);
+    /* Chrome,Safari4+ */
+    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#006699), color-stop(100%,#004c66));
+    /* Chrome10+,Safari5.1+ */
+    background: -webkit-linear-gradient(top,  #006699 0%,#004c66 100%);
+    /* Opera 11.10+ */
+    background: -o-linear-gradient(top,  #006699 0%,#004c66 100%);
+    /* IE10+ */
+    background: -ms-linear-gradient(top,  #006699 0%,#004c66 100%);
+    /* W3C */
+    background: linear-gradient(to bottom,  #018f94 0%,#00494b 100%);
+    /* IE6-9 */
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#006699', endColorstr='#004c66',GradientType=0);
+    border-radius:5px 5px 0 0;
+    -moz-border-radius:5px 5px 0 0;
+    -webkit-border-radius:5px 5px 0 0;
+}
+#order-premium_comparison .price-table-container .price-table .top-head .top-area {
+    padding:15px 0;
+    margin:0 0 0 0;
+    border-bottom:1px solid #57b581;
+    -webkit-text-shadow: 0 1px 2px rgba(0,0,0,0.4);
+    -moz-text-shadow: 0 1px 2px rgba(0,0,0,0.4);
+    -ms-text-shadow: 0 1px 2px rgba(0,0,0,0.4);
+    text-shadow: 0 1px 2px rgba(0,0,0,0.4);
+}
+#order-premium_comparison .price-table-container .price-table .top-head .top-area h4 {
+    padding:0 0 0 0;
+    margin:0 0 0 0;
+    font-weight:normal;
+    color:#ffffff;
+    line-height:29px;
+}
+#order-premium_comparison .price-table-container .price-table .top-head .top-area p {
+    padding:5px 0 0 0;
+    margin:0 0 0 0;
+    color:#80a7ba;
+    font-size:13px;
+    line-height:20px;
+}
+#order-premium_comparison .price-table-container .price-table .top-head .price-area {
+    padding:15px 0;
+    margin:0 0 0 0;
+    border-top:1px solid #12688d;
+    -webkit-text-shadow: 0 1px 2px rgba(0,0,0,0.4);
+    -moz-text-shadow: 0 1px 2px rgba(0,0,0,0.4);
+    -ms-text-shadow: 0 1px 2px rgba(0,0,0,0.4);
+    text-shadow: 0 1px 2px rgba(0,0,0,0.4);
+    color:#ffffbf;
+    font-size:16px;
+}
+#order-premium_comparison .price-table-container .price-table .top-head .price-area .price {
+    padding:10px 0 10px 0;
+}
+#order-premium_comparison .price-table-container .price-table .top-head .price-area .price span {
+    font-size:38px;
+}
+#order-premium_comparison .price-table-container .order-button,
+#order-premium_comparison .price-table-container .order-button:hover {
+    padding:13px 0;
+    margin:10px 25px;
+    font-size:16px;
+    color:#ffffff;
+    display:block;
+    font-weight:normal;
+    /* Old browsers */
+    background: #4a92b7;
+    /* FF3.6+ */
+    background: -moz-linear-gradient(top,  #4a92b7 0%, #006699 100%);
+    /* Chrome,Safari4+ */
+    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4a92b7), color-stop(100%,#006699));
+    /* Chrome10+,Safari5.1+ */
+    background: -webkit-linear-gradient(top,  #4a92b7 0%,#006699 100%);
+    /* Opera 11.10+ */
+    background: -o-linear-gradient(top,  #4a92b7 0%,#006699 100%);
+    /* IE10+ */
+    background: -ms-linear-gradient(top,  #4a92b7 0%,#006699 100%);
+    /* W3C */
+    background: linear-gradient(to bottom,  #018f94 0%,#00494b 100%);
+    /* IE6-9 */
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4a92b7', endColorstr='#006699',GradientType=0);
+    -webkit-border-radius:3px;
+    -moz-border-radius:3px;
+    -ms-border-radius:3px;
+    border-radius:3px;
+    text-decoration:none;
+    -webkit-text-shadow: 0 0 1px rgba(0,0,0,0.4);
+    -moz-text-shadow: 0 0 1px rgba(0,0,0,0.4);
+    -ms-text-shadow: 0 0 1px rgba(0,0,0,0.4);
+    text-shadow: 0 0 1px rgba(0,0,0,0.4);
+    -webkit-box-shadow: 0 1px 2px 0 rgba(0,0,0,0.40);
+    -moz-box-shadow: 0 1px 2px 0 rgba(0,0,0,0.40);
+    box-shadow: 0 1px 2px 0 rgba(0,0,0,0.40);
+}
+#order-premium_comparison .price-table-container .order-button.unavailable:hover {
+    cursor: not-allowed;
+    /* Old browsers */
+    background: #404A53;
+    /* FF3.6+ */
+    background: -moz-linear-gradient(top,  #404A53 0%, #949499 100%);
+    /* Chrome,Safari4+ */
+    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#404A53), color-stop(100%,#949499));
+    /* Chrome10+,Safari5.1+ */
+    background: -webkit-linear-gradient(top,  #404A53 0%,#949499 100%);
+    /* Opera 11.10+ */
+    background: -o-linear-gradient(top,  #404A53 0%,#949499 100%);
+    /* IE10+ */
+    background: -ms-linear-gradient(top,  #404A53 0%,#949499 100%);
+    /* W3C */
+    background: linear-gradient(to bottom,  #404A53 0%,#949499 100%);
+    /* IE6-9 */
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#404A53', endColorstr='#949499',GradientType=0);
+}
+#order-premium_comparison .price-table-container .price-table ul {
+    padding: 4px 10px 10px 10px;
+    margin:0 0 0 0;
+    list-style:none;
+}
+#order-premium_comparison .price-table-container .price-table ul li {
+    padding:17px 0 15px 0;
+    margin:0 0 0 0;
+    width:100%;
+    border-bottom:1px solid #d9d9d9;
+    color:#333333;
+    text-align:center;
+    line-height:16px;
+    font-size:14px;
+    background:none;
+}
+#order-premium_comparison .price-table-container .price-table ul li a {
+    color:#006699;
+}
+#order-premium_comparison .price-table-container .price-table ul li:last-child {
+    border-bottom:0;
+}
+#order-premium_comparison .price-table-container .price-table .popular-plan {
+    padding:7px 0 5px 0;
+    background:rgba(0,0,0,0.2);
+    border-bottom:1px solid #004662;
+    color:#a3d900;
+    font-size:13px;
+    text-transform:uppercase;
+}
+
+#order-premium_comparison .includes-features {
+	margin:0 auto;
+	width:100%;
+	max-width:780px;
+	padding-top:10px;
+}
+#order-premium_comparison .includes-features .head-area {
+    padding:0 0 0 0;
+    margin:0 0 0 0;
+    text-align:center;
+    background:url(../img/head-bg.png) no-repeat center center;
+    background-size:100% auto;
+}
+#order-premium_comparison .includes-features .head-area span {
+    padding:0 20px;
+    margin:0 0 0 0;
+    display:inline-table;
+}
+#order-premium_comparison .main-container.price-01 .includes-features .head-area span {
+    background:#f3f3f3;
+}
+#order-premium_comparison .includes-features ul.list-features {
+    padding:20px 0 0 0;
+    margin:0 0 0 0;
+    list-style:none;
+}
+#order-premium_comparison .includes-features ul.list-features li {
+    padding:0 0 0 22px;
+    margin:5px 0;
+    width:33%;
+    display:inline-table;
+    background:url(../img/tick.png) no-repeat;
+}
+
+/* This media query is written for iPad and tablets */
+@media (max-width: 991px) {
+    #order-premium_comparison .includes-features ul.list-features li {
+        width:48%;
+    }
+}
+
+/* This media query is written for Mobile only */
+@media (max-width: 600px) {
+    #order-premium_comparison .price-table-container .price-table {
+        margin:0 0 0 0;
+        width: 300px;
+    }
+    #order-premium_comparison .price-table-container .price-table.active {
+        margin:0 0 0 0;
+        width:300px;
+    }
+}
+
+/* This media query is written for Mobile only */
+@media (max-width: 480px) {
+    #order-premium_comparison .includes-features ul.list-features li {
+        width:100%;
+    }
+}
+
+/* Sidebar */
+
+html, body {
+    overflow-x: hidden; /* Prevent scroll on narrow devices */
+}
+
+.row-product-selection {
+    position: relative;
+    left: 0;
+    -webkit-transition: all .25s ease-out;
+         -o-transition: all .25s ease-out;
+            transition: all .25s ease-out;
+}
+
+.product-selection-sidebar {
+    position: absolute;
+    top: 0;
+    left: -300px;
+    width: 300px;
+    display: none;
+}
+
+#btnShowSidebar {
+    margin: 0 0 20px 0;
+}

orderforms/premium_comparison/index.php

@@ -0,0 +1,2 @@
+<?php
+header("Location: ../../../index.php");

orderforms/premium_comparison/products.tpl

@@ -0,0 +1,152 @@
+<!-- Product Recommendations CSS -->
+<link type="text/css" rel="stylesheet" href="{$BASE_PATH_CSS}/recommendations.min.css" property="stylesheet" />
+<!-- Core CSS -->
+<link rel="stylesheet" type="text/css" href="{assetPath file="style.css"}" property="stylesheet" />
+<script>
+jQuery(document).ready(function () {
+    jQuery('#btnShowSidebar').click(function () {
+        if (jQuery(".product-selection-sidebar").is(":visible")) {
+            jQuery('.row-product-selection').css('left','0');
+            jQuery('.product-selection-sidebar').fadeOut();
+            jQuery('#btnShowSidebar').html('<i class="fas fa-arrow-circle-right"></i> {$LANG.showMenu}');
+        } else {
+            jQuery('.product-selection-sidebar').fadeIn();
+            jQuery('.row-product-selection').css('left','300px');
+            jQuery('#btnShowSidebar').html('<i class="fas fa-arrow-circle-left"></i> {$LANG.hideMenu}');
+        }
+    });
+});
+</script>
+
+{if $showSidebarToggle}
+    <button type="button" class="btn btn-default btn-sm" id="btnShowSidebar">
+        <i class="fas fa-arrow-circle-right"></i>
+        {$LANG.showMenu}
+    </button>
+{/if}
+
+<div class="row row-product-selection">
+    <div class="col-md-3 sidebar product-selection-sidebar" id="premiumComparisonSidebar">
+        {include file="orderforms/standard_cart/sidebar-categories.tpl"}
+    </div>
+    <div class="col-md-12">
+
+        <div id="order-premium_comparison">
+            <div class="main-container price-01">
+                <div class="txt-center">
+                    <h3 id="headline" class="font-size-24">
+                        {if $productGroup.headline}
+                            {$productGroup.headline}
+                        {else}
+                            {$productGroup.name}
+                        {/if}
+                    </h3>
+                    {if $productGroup.tagline}
+                        <h5 id="tagline">
+                            {$productGroup.tagline}
+                        </h5>
+                    {/if}
+                    {if $errormessage}
+                        <div class="alert alert-danger">
+                            {$errormessage}
+                        </div>
+                    {elseif !$productGroup}
+                        <div class="alert alert-info">
+                            {lang key='orderForm.selectCategory'}
+                        </div>
+                    {/if}
+                </div>
+                <div id="products" class="price-table-container">
+                    <ul>
+                        {foreach $products as $product}
+                            {$idPrefix = ($product.bid) ? ("bundle"|cat:$product.bid) : ("product"|cat:$product.pid)}
+                            <li id="{$idPrefix}">
+                                <div class="price-table">
+                                    <div class="top-head">
+                                        <div class="top-area">
+                                            <h4 id="{$idPrefix}-name">{$product.name}</h4>
+                                        </div>
+                                        {if $product.tagLine}
+                                            <p id="{$idPrefix}-tag-line">{$product.tagLine}</p>
+                                        {/if}
+                                        {if $product.isFeatured}
+                                            <div class="popular-plan">
+                                                {$LANG.featuredProduct|upper}
+                                            </div>
+                                        {/if}
+
+                                        <div class="price-area">
+                                            <div class="price" id="{$idPrefix}-price">
+                                                {if $product.bid}
+                                                    {$LANG.bundledeal}
+                                                    {if $product.displayprice}
+                                                        <br /><br /><span>{$product.displayPriceSimple}</span>
+                                                    {/if}
+                                                {elseif $product.paytype eq "free"}
+                                                    {$LANG.orderfree}
+                                                {elseif $product.paytype eq "onetime"}
+                                                    {$product.pricing.onetime} {$LANG.orderpaymenttermonetime}
+                                                {else}
+                                                    {if $product.pricing.hasconfigoptions}
+                                                        {$LANG.from}
+                                                    {/if}
+                                                    {$product.pricing.minprice.cycleText}
+                                                    <br>
+                                                    {if $product.pricing.minprice.setupFee}
+                                                        <small>{$product.pricing.minprice.setupFee->toPrefixed()} {$LANG.ordersetupfee}</small>
+                                                    {/if}
+                                                {/if}
+                                            </div>
+                                            {if $product.qty eq "0"}
+                                                <span id="{$idPrefix}-unavailable" class="order-button unavailable">{$LANG.outofstock}</span>
+                                            {else}
+                                                <a href="{$product.productUrl}" class="order-button" id="{$idPrefix}-order-button"{if $product.hasRecommendations} data-has-recommendations="1"{/if}>
+                                                    {$LANG.ordernowbutton}
+                                                </a>
+                                            {/if}
+
+                                        </div>
+                                    </div>
+                                    <ul>
+                                        {foreach $product.features as $feature => $value}
+                                            <li id="{$idPrefix}-feature{$value@iteration}">
+                                                {$value} {$feature}
+                                            </li>
+                                        {foreachelse}
+                                            <li id="{$idPrefix}-description">
+                                                {$product.description}
+                                            </li>
+                                        {/foreach}
+                                    </ul>
+                                </div>
+                            </li>
+                        {/foreach}
+                    </ul>
+                </div>
+            </div>
+            {if count($productGroup.features) > 0}
+                <div class="includes-features">
+                    <div class="row clearfix">
+                        <div class="col-md-12">
+                            <div class="head-area">
+                                <span class="primary-bg-color">
+                                    {$LANG.orderForm.includedWithPlans}
+                                </span>
+                            </div>
+                            <ul class="list-features">
+                                {foreach $productGroup.features as $features}
+                                    <li>{$features.feature}</li>
+                                {/foreach}
+                            </ul>
+                        </div>
+                    </div>
+                </div>
+            {/if}
+        </div>
+
+    </div>
+</div>
+
+{include file="orderforms/premium_comparison/recommendations-modal.tpl"}
+
+<script src="{$BASE_PATH_JS}/whmcs/recommendations.min.js"></script>

orderforms/premium_comparison/theme.yaml

@@ -0,0 +1,2 @@
+config:
+    parent: standard_cart

orderforms/pure_comparison/css/style.css

@@ -0,0 +1,398 @@
+/**
+ * Pure Comparison order form style sheet
+ *
+ * Contains styling specific to the Pure Comparison order template.
+ *
+ * @project   WHMCS
+ * @version   1.0
+ * @author    WHMCS Limited <development@whmcs.com>
+ * @copyright Copyright (c) WHMCS Limited 2005-2015
+ * @license   http://www.whmcs.com/license/
+ * @link      http://www.whmcs.com/
+ */
+
+div#order-pure_comparison {
+	padding:0 0 0 0;
+	margin:0 0 50px 0;
+    height: 100%;
+    width: 100%;
+	line-height:18px;
+	font-size:14px;
+	color:#666666;
+	text-rendering: optimizeLegibility !important;
+	-webkit-font-smoothing: antialiased !important;
+}
+
+#order-pure_comparison a,
+#order-pure_comparison a:hover,
+#order-pure_comparison a:active,
+#order-pure_comparison a:visited,
+#order-pure_comparison a:link {
+    outline:none;
+    transition: all 0.5s ease 0s;
+    -webkit-transition: all 0.5s ease 0s;
+    -moz-transition: all 0.5s ease 0s;
+}
+#order-pure_comparison div,
+#order-pure_comparison ul,
+#order-pure_comparison li {
+	padding:0 0 0 0;
+	margin:0 0 0 0;
+}
+
+#order-pure_comparison h1 {
+}
+#order-pure_comparison h2 {
+}
+#order-pure_comparison h3 {
+	padding:0 0 0 0;
+	margin:0 0 0 0;
+	font-size:32px;
+	line-height:38px;
+	font-weight:bold;
+	color:#333333;
+}
+#order-pure_comparison h4 {
+	padding:0 0 0 0;
+	margin:10px 0;
+	font-size:24px;
+	color:#333333;
+}
+#order-pure_comparison h5 {
+	padding:0 0 0 0;
+	margin:5px 0;
+	font-size:16px;
+	color:#666666;
+	font-weight:normal;
+}
+
+#order-pure_comparison .txt-center {
+	padding-top:0;
+	text-align:center;
+}
+
+#order-pure_comparison .alert {
+	margin-top: 70px;
+	padding: 15px;
+}
+
+#order-pure_comparison .page-container {
+	padding:0 2% 40px 2%;
+	margin:0 auto;
+}
+
+#order-pure_comparison .price-table-container {
+	padding:20px 0 0 0;
+	margin:0 0 0 0;
+}
+#order-pure_comparison .price-table-container ul {
+	padding:0 0 0 0;
+	margin:0 0 0 0;
+	list-style:none;
+	text-align:center;
+}
+#order-pure_comparison .price-table-container ul li {
+	padding:30px 4px 6px 4px;
+	margin:0 0 0 0;
+	display:inline-block;
+	background:url(../img/shadow-btm.png) no-repeat center bottom;
+}
+#order-pure_comparison .price-table-container .price-table {
+	padding:0 0 0 0;
+	margin:0 0 0 0;
+	width:215px;
+	background:#ffffff;
+	-moz-border-radius:5px;
+	-webkit-border-radius:5px;
+	-ms-border-radius:5px;
+	border-radius:5px;
+	-webkit-box-shadow: 0 1px 2px 0 rgba(0,0,0,0.30);
+	-moz-box-shadow: 0 1px 2px 0 rgba(0,0,0,0.30);
+	box-shadow: 0 1px 2px 0 rgba(0,0,0,0.30);
+}
+#order-pure_comparison .price-table-container .price-table .top-head {
+    /* Old browsers */
+	background: #ffffef;
+    /* FF3.6+ */
+	background: -moz-linear-gradient(top,  #ffffef 0%, #fefebe 100%);
+    /* Chrome,Safari4+ */
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffef), color-stop(100%,#fefebe));
+    /* Chrome10+,Safari5.1+ */
+	background: -webkit-linear-gradient(top,  #ffffef 0%,#fefebe 100%);
+    /* Opera 11.10+ */
+	background: -o-linear-gradient(top,  #ffffef 0%,#fefebe 100%);
+    /* IE10+ */
+	background: -ms-linear-gradient(top,  #ffffef 0%,#fefebe 100%);
+    /* W3C */
+	background: linear-gradient(to bottom,  #ffffef 0%,#fefebe 100%);
+    /* IE6-9 */
+	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffef', endColorstr='#fefebe',GradientType=0);
+	border-radius:5px 5px 0 0;
+	-moz-border-radius:5px 5px 0 0;
+	-webkit-border-radius:5px 5px 0 0;
+}
+#order-pure_comparison .price-table-container .price-table .top-head .top-area {
+	padding:15px 0;
+	margin:0 0 0 0;
+	border-bottom:1px solid #f1f1b6;
+}
+#order-pure_comparison .price-table-container .price-table .top-head .top-area h4 {
+	padding:0 0 0 0;
+	margin:0 0 0 0;
+	color:#333333;
+	line-height:29px;
+	font-weight:bold;
+}
+#order-pure_comparison .price-table-container .price-table .top-head .top-area p {
+	padding:5px 0 0 0;
+	margin:0 0 0 0;
+	color:#333333;
+	font-size:13px;
+	line-height:20px;
+}
+#order-pure_comparison .price-table-container .price-table ul {
+	padding:4px 10px 10px 10px;
+	margin:0 0 0 0;
+	list-style:none;
+}
+#order-pure_comparison .price-table-container .price-table ul li {
+	padding:17px 0 15px 0;
+	margin:0 0 0 0;
+	width:100%;
+	border-bottom:1px solid #d9d9d9;
+	color:#333333;
+	text-align:center;
+	line-height:16px;
+	font-size:15px;
+	background:none;
+}
+#order-pure_comparison .price-table-container .price-table ul li span {
+}
+#order-pure_comparison .price-table-container .price-table ul li a {
+	color:#006699;
+}
+#order-pure_comparison .price-table-container .price-table ul li:last-child {
+	border-bottom:0;
+}
+#order-pure_comparison .price-table-container .price-area {
+	padding:5px 0;
+	margin:0 0 0 0;
+	color:#333333;
+	font-size:16px;
+    /* Old browsers */
+	background: #ffffff;
+    /* FF3.6+ */
+	background: -moz-linear-gradient(top,  #ffffff 2%, #fefebe 100%);
+    /* Chrome,Safari4+ */
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(2%,#ffffff), color-stop(100%,#fefebe));
+    /* Chrome10+,Safari5.1+ */
+	background: -webkit-linear-gradient(top,  #ffffff 2%,#fefebe 100%);
+    /* Opera 11.10+ */
+	background: -o-linear-gradient(top,  #ffffff 2%,#fefebe 100%);
+    /* IE10+ */
+	background: -ms-linear-gradient(top,  #ffffff 2%,#fefebe 100%);
+    /* W3C */
+	background: linear-gradient(to bottom,  #ffffff 2%,#fefebe 100%);
+    /* IE6-9 */
+	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#fefebe',GradientType=0);
+	border-radius:0 0 5px 5px;
+	-moz-border-radius:0 0 5px 5px;
+	-webkit-border-radius:0 0 5px 5px;
+}
+#order-pure_comparison .price-table-container .price-area .price {
+	padding:10px 0 10px 0;
+}
+#order-pure_comparison .price-table-container .price-area .price span {
+	font-size:32px;
+}
+#order-pure_comparison .price-table-container .order-button,
+#order-pure_comparison .price-table-container .order-button:hover {
+	padding:13px 0;
+	margin:10px 20px;
+	font-size:18px;
+	color:#ffffff;
+	display:block;
+	font-weight:bold;
+    /* Old browsers */
+	background: #4a92b7;
+    /* FF3.6+ */
+	background: -moz-linear-gradient(top,  #4a92b7 0%, #006699 100%);
+    /* Chrome,Safari4+ */
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4a92b7), color-stop(100%,#006699));
+    /* Chrome10+,Safari5.1+ */
+	background: -webkit-linear-gradient(top,  #4a92b7 0%,#006699 100%);
+    /* Opera 11.10+ */
+	background: -o-linear-gradient(top,  #4a92b7 0%,#006699 100%);
+    /* IE10+ */
+	background: -ms-linear-gradient(top,  #4a92b7 0%,#006699 100%);
+    /* W3C */
+	background: linear-gradient(to bottom,  #4a92b7 0%,#006699 100%);
+    /* IE6-9 */
+	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#4a92b7', endColorstr='#006699',GradientType=0);
+	-webkit-border-radius:3px;
+	-moz-border-radius:3px;
+	-ms-border-radius:3px;
+	border-radius:3px;
+	text-decoration:none;
+	-webkit-text-shadow: 0 0 1px rgba(0,0,0,0.4);
+	-moz-text-shadow: 0 0 1px rgba(0,0,0,0.4);
+	-ms-text-shadow: 0 0 1px rgba(0,0,0,0.4);
+	text-shadow: 0 0 1px rgba(0,0,0,0.4);
+}
+#order-pure_comparison .price-table-container .order-button.unavailable:hover {
+    cursor: not-allowed;
+    /* Old browsers */
+    background: #404A53;
+    /* FF3.6+ */
+    background: -moz-linear-gradient(top,  #404A53 0%, #949499 100%);
+    /* Chrome,Safari4+ */
+    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#404A53), color-stop(100%,#949499));
+    /* Chrome10+,Safari5.1+ */
+    background: -webkit-linear-gradient(top,  #404A53 0%,#949499 100%);
+    /* Opera 11.10+ */
+    background: -o-linear-gradient(top,  #404A53 0%,#949499 100%);
+    /* IE10+ */
+    background: -ms-linear-gradient(top,  #404A53 0%,#949499 100%);
+    /* W3C */
+    background: linear-gradient(to bottom,  #404A53 0%,#949499 100%);
+    /* IE6-9 */
+    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#404A53', endColorstr='#949499',GradientType=0);
+}
+
+/* Active Table */
+
+#order-pure_comparison .price-table-container .price-table.active {
+	margin:0 15px 0 15px;
+	transform: scale(1.08);
+}
+#order-pure_comparison .price-table-container .price-table.active .top-head {
+	background: #ffe1e1; /* Old browsers */
+	background: -moz-linear-gradient(top,  #ffe1e1 0%, #ffbfbf 100%); /* FF3.6+ */
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffe1e1), color-stop(100%,#ffbfbf)); /* Chrome,Safari4+ */
+	background: -webkit-linear-gradient(top,  #ffe1e1 0%,#ffbfbf 100%); /* Chrome10+,Safari5.1+ */
+	background: -o-linear-gradient(top,  #ffe1e1 0%,#ffbfbf 100%); /* Opera 11.10+ */
+	background: -ms-linear-gradient(top,  #ffe1e1 0%,#ffbfbf 100%); /* IE10+ */
+	background: linear-gradient(to bottom,  #ffe1e1 0%,#ffbfbf 100%); /* W3C */
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffe1e1', endColorstr='#ffbfbf',GradientType=0 ); /* IE6-9 */
+}
+#order-pure_comparison .price-table-container .price-table.active .top-head .top-area {
+	padding:5px 0;
+}
+#order-pure_comparison .price-table-container  .price-table.active .price-area {
+	background: #ffffff; /* Old browsers */
+	background: -moz-linear-gradient(top,  #ffffff 0%, #ffe1e1 82%); /* FF3.6+ */
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(82%,#ffe1e1)); /* Chrome,Safari4+ */
+	background: -webkit-linear-gradient(top,  #ffffff 0%,#ffe1e1 82%); /* Chrome10+,Safari5.1+ */
+	background: -o-linear-gradient(top,  #ffffff 0%,#ffe1e1 82%); /* Opera 11.10+ */
+	background: -ms-linear-gradient(top,  #ffffff 0%,#ffe1e1 82%); /* IE10+ */
+	background: linear-gradient(to bottom,  #ffffff 0%,#ffe1e1 82%); /* W3C */
+	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffe1e1',GradientType=0 ); /* IE6-9 */
+}
+#order-pure_comparison .price-table-container .price-table .popular-plan {
+	margin-top:5px;
+	width:100%;
+	height:35px;
+	position:relative;
+}
+#order-pure_comparison .price-table-container .price-table .popular-plan .plan-container {
+	position:absolute;
+	height:35px;
+	top:0;
+	left:-5%;
+	width:110%;
+	background:url(../img/shadow-left.png) no-repeat left bottom;
+	background-size:100% auto;
+}
+#order-pure_comparison .price-table-container .price-table .popular-plan .plan-container:before {
+}
+#order-pure_comparison .price-table-container .price-table .popular-plan .plan-container .txt-container {
+	padding:6px 0 0 0;
+	height:28px;
+	width:100%;
+    /* Old browsers */
+	background: #f30000;
+    /* FF3.6+ */
+	background: -moz-linear-gradient(top,  #f30000 0%, #b70202 100%);
+    /* Chrome,Safari4+ */
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f30000), color-stop(100%,#b70202));
+    /* Chrome10+,Safari5.1+ */
+    background: -webkit-linear-gradient(top,  #f30000 0%,#b70202 100%);
+    /* Opera 11.10+ */
+	background: -o-linear-gradient(top,  #f30000 0%,#b70202 100%);
+    /* IE10+ */
+	background: -ms-linear-gradient(top,  #f30000 0%,#b70202 100%);
+    /* W3C */
+	background: linear-gradient(to bottom,  #f30000 0%,#b70202 100%);
+    /* IE6-9 */
+	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f30000', endColorstr='#b70202',GradientType=0);
+	color:#ffffff;
+	font-size:12px;
+	font-weight:bold;
+	text-transform:uppercase;
+	text-shadow: 0 1px 2px rgba(0,0,0,0.4);
+	-webkit-text-shadow: 0 1px 2px rgba(0,0,0,0.4);
+	-moz-text-shadow: 0 1px 2px rgba(0,0,0,0.4);
+	-webkit-box-shadow: -1px 10px 2px -7px rgba(0,0,0,0.18);
+	-moz-box-shadow: -1px 10px 2px -7px rgba(0,0,0,0.18);
+	box-shadow: -1px 10px 2px -7px rgba(0,0,0,0.18);
+}
+
+#order-pure_comparison .includes-features {
+    margin:0 auto;
+    width:100%;
+    max-width:780px;
+    padding-top:55px;
+}
+#order-pure_comparison .includes-features .head-area {
+    padding:0 0 0 0;
+    margin:0 0 0 0;
+    text-align:center;
+    background:url(../img/head-bg.png) no-repeat center center;
+    background-size:100% auto;
+}
+#order-pure_comparison .includes-features .head-area span {
+    padding:0 20px;
+    margin:0 0 0 0;
+    display:inline-table;
+}
+#order-pure_comparison .main-container.price-01 .includes-features .head-area span {
+    background:#f3f3f3;
+}
+#order-pure_comparison .includes-features ul.list-features {
+    padding:20px 0 0 0;
+    margin:0 0 0 0;
+    list-style:none;
+}
+#order-pure_comparison .includes-features ul.list-features li {
+    padding:0 0 0 22px;
+    margin:5px 0;
+    width:33%;
+    display:inline-table;
+    background:url(../img/tick.png) no-repeat;
+}
+
+/* Sidebar */
+
+html, body {
+    overflow-x: hidden; /* Prevent scroll on narrow devices */
+}
+
+.row-product-selection {
+    position: relative;
+    left: 0;
+    -webkit-transition: all .25s ease-out;
+         -o-transition: all .25s ease-out;
+            transition: all .25s ease-out;
+}
+
+.product-selection-sidebar {
+    position: absolute;
+    top: 0;
+    left: -300px;
+    width: 300px;
+    display: none;
+}
+
+#btnShowSidebar {
+    margin: 0 0 20px 0;
+}

orderforms/pure_comparison/index.php

@@ -0,0 +1,2 @@
+<?php
+header("Location: ../../../index.php");

orderforms/pure_comparison/products.tpl

@@ -0,0 +1,155 @@
+<!-- Product Recommendations CSS -->
+<link type="text/css" rel="stylesheet" href="{$BASE_PATH_CSS}/recommendations.min.css" property="stylesheet" />
+<!-- Core CSS -->
+<link type="text/css" rel="stylesheet" href="{assetPath file="style.css"}" property="stylesheet" />
+<script>
+jQuery(document).ready(function () {
+    jQuery('#btnShowSidebar').click(function () {
+        if (jQuery(".product-selection-sidebar").is(":visible")) {
+            jQuery('.row-product-selection').css('left','0');
+            jQuery('.product-selection-sidebar').fadeOut();
+            jQuery('#btnShowSidebar').html('<i class="fas fa-arrow-circle-right"></i> {$LANG.showMenu}');
+        } else {
+            jQuery('.product-selection-sidebar').fadeIn();
+            jQuery('.row-product-selection').css('left','300px');
+            jQuery('#btnShowSidebar').html('<i class="fas fa-arrow-circle-left"></i> {$LANG.hideMenu}');
+        }
+    });
+});
+</script>
+
+{if $showSidebarToggle}
+    <button type="button" class="btn btn-default btn-sm" id="btnShowSidebar">
+        <i class="fas fa-arrow-circle-right"></i>
+        {$LANG.showMenu}
+    </button>
+{/if}
+
+<div class="row row-product-selection">
+    <div class="col-md-3 sidebar product-selection-sidebar" id="premiumComparisonSidebar">
+        {include file="orderforms/standard_cart/sidebar-categories.tpl"}
+    </div>
+    <div class="col-md-12">
+
+        <div id="order-pure_comparison" class="page-container">
+            <div class="txt-center">
+                <h3 id="headline" class="font-size-24">
+                    {if $productGroup.headline}
+                        {$productGroup.headline}
+                    {else}
+                        {$productGroup.name}
+                    {/if}
+                </h3>
+                {if $productGroup.tagline}
+                    <h5 id="tagline">
+                        {$productGroup.tagline}
+                    </h5>
+                {/if}
+                {if $errormessage}
+                    <div class="alert alert-danger">
+                        {$errormessage}
+                    </div>
+                {elseif !$productGroup}
+                    <div class="alert alert-info">
+                        {lang key='orderForm.selectCategory'}
+                    </div>
+                {/if}
+            </div>
+            <div id="products" class="price-table-container">
+                <ul>
+                    {foreach $products as $product}
+                        {$idPrefix = ($product.bid) ? ("bundle"|cat:$product.bid) : ("product"|cat:$product.pid)}
+                        <li id="{$idPrefix}">
+                            <div class="price-table{if $product.isFeatured} active{/if}">
+                                <div class="top-head">
+                                    <div class="top-area">
+                                        <h4 id="{$idPrefix}-name">
+                                            {$product.name}
+                                        </h4>
+                                        {if $product.isFeatured}
+                                            <div class="popular-plan">
+                                                <div class="plan-container">
+                                                    <div class="txt-container">{$LANG.featuredProduct|upper}</div>
+                                                </div>
+                                            </div>
+                                        {/if}
+                                        {if $product.tagLine}
+                                            <p id="{$idPrefix}-tag-line">{$product.tagLine}</p>
+                                        {/if}
+                                    </div>
+                                </div>
+                                <ul id="productDescription{$product@iteration}">
+                                    {foreach $product.features as $feature => $value}
+                                        <li id="{$idPrefix}-feature{$value@iteration}">
+                                            <span>{$value}</span> {$feature}
+                                        </li>
+                                    {foreachelse}
+                                        <li id="{$idPrefix}-description">
+                                            {$product.description}
+                                        </li>
+                                    {/foreach}
+                                </ul>
+                                <div class="price-area">
+                                    <div class="price" id="{$idPrefix}-price">
+                                        {if $product.bid}
+                                            {$LANG.bundledeal}
+                                            {if $product.displayprice}
+                                                <br /><br /><span>{$product.displayPriceSimple}</span>
+                                            {/if}
+                                        {elseif $product.paytype eq "free"}
+                                            {$LANG.orderfree}
+                                        {elseif $product.paytype eq "onetime"}
+                                            {$product.pricing.onetime} {$LANG.orderpaymenttermonetime}
+                                        {else}
+                                            {if $product.pricing.hasconfigoptions}
+                                                {$LANG.from}
+                                            {/if}
+                                            {$product.pricing.minprice.cycleText}
+                                            <br>
+                                            {if $product.pricing.minprice.setupFee}
+                                                <small>{$product.pricing.minprice.setupFee->toPrefixed()} {$LANG.ordersetupfee}</small>
+                                            {/if}
+                                        {/if}
+                                    </div>
+                                    {if $product.qty eq "0"}
+                                        <span id="{$idPrefix}-unavailable" class="order-button unavailable">
+                                            {$LANG.outofstock}
+                                        </span>
+                                    {else}
+                                        <a href="{$product.productUrl}" class="order-button" id="{$idPrefix}-order-button"{if $product.hasRecommendations} data-has-recommendations="1"{/if}>
+                                            {$LANG.ordernowbutton}
+                                        </a>
+                                    {/if}
+                                </div>
+                            </div>
+                        </li>
+                    {/foreach}
+                </ul>
+            </div>
+
+            {if count($productGroup.features) > 0}
+                <div class="includes-features">
+                    <div class="row clearfix">
+                        <div class="col-md-12">
+                            <div class="head-area">
+                                <span class="primary-bg-color">
+                                    {$LANG.orderForm.includedWithPlans}
+                                </span>
+                            </div>
+                            <ul class="list-features">
+                                {foreach $productGroup.features as $features}
+                                    <li>{$features.feature}</li>
+                                {/foreach}
+                            </ul>
+                        </div>
+                    </div>
+                </div>
+            {/if}
+
+        </div>
+    </div>
+</div>
+
+{include file="orderforms/pure_comparison/recommendations-modal.tpl"}
+
+<script src="{$BASE_PATH_JS}/whmcs/recommendations.min.js"></script>

orderforms/pure_comparison/theme.yaml

@@ -0,0 +1,2 @@
+config:
+    parent: standard_cart

orderforms/standard_cart/addons.tpl

@@ -0,0 +1,79 @@
+{include file="orderforms/standard_cart/common.tpl"}
+
+<div id="order-standard_cart">
+
+    <div class="row">
+        <div class="cart-sidebar">
+
+            {include file="orderforms/standard_cart/sidebar-categories.tpl"}
+
+        </div>
+        <div class="cart-body">
+
+            <div class="header-lined">
+                <h1 class="font-size-36">{$LANG.cartproductaddons}</h1>
+            </div>
+            {include file="orderforms/standard_cart/sidebar-categories-collapsed.tpl"}
+
+            {if count($addons) == 0}
+                <div id="noAddons" class="alert alert-warning text-center" role="alert">
+                    {$LANG.cartproductaddonsnone}
+                </div>
+                <p class="text-center">
+                    <a href="{$WEB_ROOT}/clientarea.php" class="btn btn-default">
+                        <i class="fas fa-arrow-circle-left"></i>
+                        {$LANG.orderForm.returnToClientArea}
+                    </a>
+                </p>
+            {/if}
+
+            <div class="products">
+                <div class="row row-eq-height">
+                    {foreach $addons as $num => $addon}
+                    <div class="col-md-6">
+                        <div class="product clearfix" id="product{$num}">
+                            <form method="post" action="{$smarty.server.PHP_SELF}?a=add" class="form-inline">
+                                <input type="hidden" name="aid" value="{$addon.id}" />
+                                <header class="col-12">
+                                    <span>{$addon.name}</span>
+                                </header>
+                                <div class="product-desc product-desc-full-width">
+                                    <p>{$addon.description|nl2br}</p>
+                                    <div class="form-group">
+                                        <select name="productid" id="inputProductId{$num}" class="field form-control">
+                                            {foreach $addon.productids as $product}
+                                                <option value="{$product.id}">
+                                                    {$product.product}{if $product.domain} - {$product.domain}{/if}
+                                                </option>
+                                            {/foreach}
+                                        </select>
+                                    </div>
+                                </div>
+                                <div class="clearfix"></div>
+                                <footer class="col-12 text-right">
+                                    <div class="product-pricing">
+                                        {if $addon.free}
+                                            {$LANG.orderfree}
+                                        {else}
+                                            <span class="price">{$addon.recurringamount} {$addon.billingcycle}</span>
+                                            {if $addon.setupfee}<br />+ {$addon.setupfee} {$LANG.ordersetupfee}{/if}
+                                        {/if}
+                                    </div>
+                                    <button type="submit" class="btn btn-success btn-sm">
+                                        <i class="fas fa-shopping-cart"></i>
+                                        {$LANG.ordernowbutton}
+                                    </button>
+                                </footer>
+                            </form>
+                        </div>
+                    </div>
+                    {if $num % 2 != 0}
+                </div>
+                <div class="row row-eq-height">
+                    {/if}
+                    {/foreach}
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

orderforms/standard_cart/checkout.tpl

@@ -0,0 +1,747 @@
+<script>
+    // Define state tab index value
+    var statesTab = 10;
+    // Do not enforce state input client side
+    var stateNotRequired = true;
+</script>
+{include file="orderforms/standard_cart/common.tpl"}
+<script type="text/javascript" src="{$BASE_PATH_JS}/StatesDropdown.js"></script>
+<script type="text/javascript" src="{$BASE_PATH_JS}/PasswordStrength.js"></script>
+<script>
+    window.langPasswordStrength = "{$LANG.pwstrength}";
+    window.langPasswordWeak = "{$LANG.pwstrengthweak}";
+    window.langPasswordModerate = "{$LANG.pwstrengthmoderate}";
+    window.langPasswordStrong = "{$LANG.pwstrengthstrong}";
+</script>
+<div id="order-standard_cart">
+
+    <div class="row">
+        <div class="cart-sidebar">
+            {include file="orderforms/standard_cart/sidebar-categories.tpl"}
+        </div>
+        <div class="cart-body">
+            <div class="header-lined">
+                <h1 class="font-size-36">{$LANG.orderForm.checkout}</h1>
+            </div>
+            {include file="orderforms/standard_cart/sidebar-categories-collapsed.tpl"}
+
+            <div class="already-registered clearfix">
+                <div class="pull-right float-right">
+                    <button type="button" class="btn btn-info{if $loggedin || !$loggedin && $custtype eq "existing"} w-hidden{/if}" id="btnAlreadyRegistered">
+                        {$LANG.orderForm.alreadyRegistered}
+                    </button>
+                    <button type="button" class="btn btn-warning{if $loggedin || $custtype neq "existing"} w-hidden{/if}" id="btnNewUserSignup">
+                        {$LANG.orderForm.createAccount}
+                    </button>
+                </div>
+
+                <p class="text-sm-left overflow-hidden">{lang key='orderForm.enterPersonalDetails'}</p>
+            </div>
+
+            {if $errormessage}
+                <div class="alert alert-danger checkout-error-feedback" role="alert">
+                    <p>{$LANG.orderForm.correctErrors}:</p>
+                    <ul>
+                        {$errormessage}
+                    </ul>
+                </div>
+                <div class="clearfix"></div>
+            {/if}
+
+            <form method="post" action="{$smarty.server.PHP_SELF}?a=checkout" name="orderfrm" id="frmCheckout">
+                <input type="hidden" name="submit" value="true" />
+                <input type="hidden" name="custtype" id="inputCustType" value="{$custtype}" />
+
+                {if $custtype neq "new" && $loggedin}
+                    <div class="sub-heading">
+                        <span class="primary-bg-color">
+                            {lang key='switchAccount.title'}
+                        </span>
+                    </div>
+                    <div id="containerExistingAccountSelect" class="row account-select-container">
+                        {foreach $accounts as $account}
+                            <div class="col-sm-{if $accounts->count() == 1}12{else}6{/if}">
+                                <div class="account{if $selectedAccountId == $account->id} active{/if}">
+                                    <label class="radio-inline" for="account{$account->id}">
+                                        <input id="account{$account->id}" class="account-select{if $account->isClosed || $account->noPermission || $inExpressCheckout} disabled{/if}" type="radio" name="account_id" value="{$account->id}"{if $account->isClosed || $account->noPermission || $inExpressCheckout} disabled="disabled"{/if}{if $selectedAccountId == $account->id} checked="checked"{/if}>
+                                        <span class="address">
+                                            <strong>
+                                                {if $account->company}{$account->company}{else}{$account->fullName}{/if}
+                                            </strong>
+                                            {if $account->isClosed || $account->noPermission}
+                                                <span class="label label-default">
+                                                    {if $account->isClosed}
+                                                        {lang key='closed'}
+                                                    {else}
+                                                        {lang key='noPermission'}
+                                                    {/if}
+                                                </span>
+                                            {elseif $account->currencyCode}
+                                                <span class="label label-info">
+                                                    {$account->currencyCode}
+                                                </span>
+                                            {/if}
+                                            <br>
+                                            <span class="small">
+                                                {$account->address1}{if $account->address2}, {$account->address2}{/if}<br>
+                                                {if $account->city}{$account->city},{/if}
+                                                {if $account->state} {$account->state},{/if}
+                                                {if $account->postcode} {$account->postcode},{/if}
+                                                {$account->countryName}
+                                            </span>
+                                        </span>
+                                    </label>
+                                </div>
+                            </div>
+                        {/foreach}
+                        <div class="col-sm-12">
+                            <div class="account border-bottom{if !$selectedAccountId || !is_numeric($selectedAccountId)} active{/if}">
+                                <label class="radio-inline">
+                                    <input class="account-select" type="radio" name="account_id" value="new"{if !$selectedAccountId || !is_numeric($selectedAccountId)} checked="checked"{/if}{if $inExpressCheckout} disabled="disabled" class="disabled"{/if}>
+                                    {lang key='orderForm.createAccount'}
+                                </label>
+                            </div>
+                        </div>
+                    </div>
+                {/if}
+
+                <div id="containerExistingUserSignin"{if $loggedin || $custtype neq "existing"} class="w-hidden{/if}">
+                    <div class="sub-heading">
+                        <span class="primary-bg-color">{$LANG.orderForm.existingCustomerLogin}</span>
+                    </div>
+
+                    <div class="alert alert-danger w-hidden" id="existingLoginMessage">
+                    </div>
+
+                    <div class="row">
+                        <div class="col-sm-6">
+                            <div class="form-group prepend-icon">
+                                <label for="inputLoginEmail" class="field-icon">
+                                    <i class="fas fa-envelope"></i>
+                                </label>
+                                <input type="text" name="loginemail" id="inputLoginEmail" class="field form-control" placeholder="{$LANG.orderForm.emailAddress}" value="{$loginemail}">
+                            </div>
+                        </div>
+                        <div class="col-sm-6">
+                            <div class="form-group prepend-icon">
+                                <label for="inputLoginPassword" class="field-icon">
+                                    <i class="fas fa-lock"></i>
+                                </label>
+                                <input type="password" name="loginpassword" id="inputLoginPassword" class="field form-control" placeholder="{$LANG.clientareapassword}">
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="text-center">
+                        <button type="button" id="btnExistingLogin" class="btn btn-primary btn-md">
+                            <span id="existingLoginButton">{lang key='login'}</span>
+                            <span id="existingLoginPleaseWait" class="w-hidden">{lang key='pleasewait'}</span>
+                        </button>
+                    </div>
+
+                    {include file="orderforms/standard_cart/linkedaccounts.tpl" linkContext="checkout-existing"}
+                </div>
+
+                <div id="containerNewUserSignup"{if $custtype === 'existing' || (is_numeric($selectedAccountId) && $selectedAccountId > 0) || ($loggedin && $accounts->count() > 0 && $selectedAccountId !== 'new')} class="w-hidden"{/if}>
+
+                    <div{if $loggedin} class="w-hidden"{/if}>
+                        {include file="orderforms/standard_cart/linkedaccounts.tpl" linkContext="checkout-new"}
+                    </div>
+
+                    <div class="sub-heading">
+                        <span class="primary-bg-color">{$LANG.orderForm.personalInformation}</span>
+                    </div>
+
+                    <div class="row">
+                        <div class="col-sm-6">
+                            <div class="form-group prepend-icon">
+                                <label for="inputFirstName" class="field-icon">
+                                    <i class="fas fa-user"></i>
+                                </label>
+                                <input type="text" name="firstname" id="inputFirstName" class="field form-control" placeholder="{$LANG.orderForm.firstName}" value="{$clientsdetails.firstname}" autofocus>
+                            </div>
+                        </div>
+                        <div class="col-sm-6">
+                            <div class="form-group prepend-icon">
+                                <label for="inputLastName" class="field-icon">
+                                    <i class="fas fa-user"></i>
+                                </label>
+                                <input type="text" name="lastname" id="inputLastName" class="field form-control" placeholder="{$LANG.orderForm.lastName}" value="{$clientsdetails.lastname}">
+                            </div>
+                        </div>
+                        <div class="col-sm-6">
+                            <div class="form-group prepend-icon">
+                                <label for="inputEmail" class="field-icon">
+                                    <i class="fas fa-envelope"></i>
+                                </label>
+                                <input type="email" name="email" id="inputEmail" class="field form-control" placeholder="{$LANG.orderForm.emailAddress}" value="{$clientsdetails.email}">
+                            </div>
+                        </div>
+                        <div class="col-sm-6">
+                            <div class="form-group prepend-icon">
+                                <label for="inputPhone" class="field-icon">
+                                    <i class="fas fa-phone"></i>
+                                </label>
+                                <input type="tel" name="phonenumber" id="inputPhone" class="field form-control" placeholder="{$LANG.orderForm.phoneNumber}" value="{$clientsdetails.phonenumber}">
+                            </div>
+                        </div>
+                    </div>
+
+                    <div class="sub-heading">
+                        <span class="primary-bg-color">{$LANG.orderForm.billingAddress}</span>
+                    </div>
+
+                    <div class="row">
+                        <div class="col-sm-12">
+                            <div class="form-group prepend-icon">
+                                <label for="inputCompanyName" class="field-icon">
+                                    <i class="fas fa-building"></i>
+                                </label>
+                                <input type="text" name="companyname" id="inputCompanyName" class="field form-control" placeholder="{$LANG.orderForm.companyName} ({$LANG.orderForm.optional})" value="{$clientsdetails.companyname}">
+                            </div>
+                        </div>
+                        <div class="col-sm-12">
+                            <div class="form-group prepend-icon">
+                                <label for="inputAddress1" class="field-icon">
+                                    <i class="far fa-building"></i>
+                                </label>
+                                <input type="text" name="address1" id="inputAddress1" class="field form-control" placeholder="{$LANG.orderForm.streetAddress}" value="{$clientsdetails.address1}">
+                            </div>
+                        </div>
+                        <div class="col-sm-12">
+                            <div class="form-group prepend-icon">
+                                <label for="inputAddress2" class="field-icon">
+                                    <i class="fas fa-map-marker-alt"></i>
+                                </label>
+                                <input type="text" name="address2" id="inputAddress2" class="field form-control" placeholder="{$LANG.orderForm.streetAddress2}" value="{$clientsdetails.address2}">
+                            </div>
+                        </div>
+                        <div class="col-sm-4">
+                            <div class="form-group prepend-icon">
+                                <label for="inputCity" class="field-icon">
+                                    <i class="far fa-building"></i>
+                                </label>
+                                <input type="text" name="city" id="inputCity" class="field form-control" placeholder="{$LANG.orderForm.city}" value="{$clientsdetails.city}">
+                            </div>
+                        </div>
+                        <div class="col-sm-5">
+                            <div class="form-group prepend-icon">
+                                <label for="state" class="field-icon" id="inputStateIcon">
+                                    <i class="fas fa-map-signs"></i>
+                                </label>
+                                <label for="stateinput" class="field-icon" id="inputStateIcon">
+                                    <i class="fas fa-map-signs"></i>
+                                </label>
+                                <input type="text" name="state" id="inputState" class="field form-control" placeholder="{$LANG.orderForm.state}" value="{$clientsdetails.state}">
+                            </div>
+                        </div>
+                        <div class="col-sm-3">
+                            <div class="form-group prepend-icon">
+                                <label for="inputPostcode" class="field-icon">
+                                    <i class="fas fa-certificate"></i>
+                                </label>
+                                <input type="text" name="postcode" id="inputPostcode" class="field form-control" placeholder="{$LANG.orderForm.postcode}" value="{$clientsdetails.postcode}">
+                            </div>
+                        </div>
+                        <div class="col-sm-12">
+                            <div class="form-group prepend-icon">
+                                <label for="inputCountry" class="field-icon" id="inputCountryIcon">
+                                    <i class="fas fa-globe"></i>
+                                </label>
+                                <select name="country" id="inputCountry" class="field form-control">
+                                    {foreach $countries as $countrycode => $countrylabel}
+                                        <option value="{$countrycode}"{if (!$country && $countrycode == $defaultcountry) || $countrycode eq $country} selected{/if}>
+                                            {$countrylabel}
+                                        </option>
+                                    {/foreach}
+                                </select>
+                            </div>
+                        </div>
+                        {if $showTaxIdField}
+                            <div class="col-sm-12">
+                                <div class="form-group prepend-icon">
+                                    <label for="inputTaxId" class="field-icon">
+                                        <i class="fas fa-building"></i>
+                                    </label>
+                                    <input type="text" name="tax_id" id="inputTaxId" class="field form-control" placeholder="{$taxLabel} ({$LANG.orderForm.optional})" value="{$clientsdetails.tax_id}">
+                                </div>
+                            </div>
+                        {/if}
+                    </div>
+
+                    {if $customfields}
+                        <div class="sub-heading">
+                            <span class="primary-bg-color">{$LANG.orderadditionalrequiredinfo}<br><i><small>{lang key='orderForm.requiredField'}</small></i></span>
+                        </div>
+                        <div class="field-container">
+                            <div class="row">
+                                {foreach $customfields as $customfield}
+                                    <div class="col-sm-6">
+                                        <div class="form-group">
+                                            <label for="customfield{$customfield.id}">{$customfield.name} {$customfield.required}</label>
+                                            {$customfield.input}
+                                            {if $customfield.description}
+                                                <span class="field-help-text">
+                                                    {$customfield.description}
+                                                </span>
+                                            {/if}
+                                        </div>
+                                    </div>
+                                {/foreach}
+                            </div>
+                        </div>
+                    {/if}
+
+                </div>
+
+                {if $domainsinorder}
+
+                    <div class="sub-heading">
+                        <span class="primary-bg-color">{$LANG.domainregistrantinfo}</span>
+                    </div>
+
+                    <p class="small text-muted">{$LANG.orderForm.domainAlternativeContact}</p>
+
+                    <div class="row margin-bottom">
+                        <div class="col-sm-6 col-sm-offset-3 offset-sm-3">
+                            <select name="contact" id="inputDomainContact" class="field form-control">
+                                <option value="">{$LANG.usedefaultcontact}</option>
+                                {foreach $domaincontacts as $domcontact}
+                                    <option value="{$domcontact.id}"{if $contact == $domcontact.id} selected{/if}>
+                                        {$domcontact.name}
+                                    </option>
+                                {/foreach}
+                                <option value="addingnew"{if $contact == "addingnew"} selected{/if}>
+                                    {$LANG.clientareanavaddcontact}...
+                                </option>
+                            </select>
+                        </div>
+                    </div>
+
+                    <div{if $contact neq "addingnew"} class="w-hidden"{/if}>
+                        <div class="row" id="domainRegistrantInputFields">
+                            <div class="col-sm-6">
+                                <div class="form-group prepend-icon">
+                                    <label for="inputDCFirstName" class="field-icon">
+                                        <i class="fas fa-user"></i>
+                                    </label>
+                                    <input type="text" name="domaincontactfirstname" id="inputDCFirstName" class="field form-control" placeholder="{$LANG.orderForm.firstName}" value="{$domaincontact.firstname}">
+                                </div>
+                            </div>
+                            <div class="col-sm-6">
+                                <div class="form-group prepend-icon">
+                                    <label for="inputDCLastName" class="field-icon">
+                                        <i class="fas fa-user"></i>
+                                    </label>
+                                    <input type="text" name="domaincontactlastname" id="inputDCLastName" class="field form-control" placeholder="{$LANG.orderForm.lastName}" value="{$domaincontact.lastname}">
+                                </div>
+                            </div>
+                            <div class="col-sm-6">
+                                <div class="form-group prepend-icon">
+                                    <label for="inputDCEmail" class="field-icon">
+                                        <i class="fas fa-envelope"></i>
+                                    </label>
+                                    <input type="email" name="domaincontactemail" id="inputDCEmail" class="field form-control" placeholder="{$LANG.orderForm.emailAddress}" value="{$domaincontact.email}">
+                                </div>
+                            </div>
+                            <div class="col-sm-6">
+                                <div class="form-group prepend-icon">
+                                    <label for="inputDCPhone" class="field-icon">
+                                        <i class="fas fa-phone"></i>
+                                    </label>
+                                    <input type="tel" name="domaincontactphonenumber" id="inputDCPhone" class="field form-control" placeholder="{$LANG.orderForm.phoneNumber}" value="{$domaincontact.phonenumber}">
+                                </div>
+                            </div>
+                            <div class="col-sm-12">
+                                <div class="form-group prepend-icon">
+                                    <label for="inputDCCompanyName" class="field-icon">
+                                        <i class="fas fa-building"></i>
+                                    </label>
+                                    <input type="text" name="domaincontactcompanyname" id="inputDCCompanyName" class="field form-control" placeholder="{$LANG.orderForm.companyName} ({$LANG.orderForm.optional})" value="{$domaincontact.companyname}">
+                                </div>
+                            </div>
+                            <div class="col-sm-12">
+                                <div class="form-group prepend-icon">
+                                    <label for="inputDCAddress1" class="field-icon">
+                                        <i class="far fa-building"></i>
+                                    </label>
+                                    <input type="text" name="domaincontactaddress1" id="inputDCAddress1" class="field form-control" placeholder="{$LANG.orderForm.streetAddress}" value="{$domaincontact.address1}">
+                                </div>
+                            </div>
+                            <div class="col-sm-12">
+                                <div class="form-group prepend-icon">
+                                    <label for="inputDCAddress2" class="field-icon">
+                                        <i class="fas fa-map-marker-alt"></i>
+                                    </label>
+                                    <input type="text" name="domaincontactaddress2" id="inputDCAddress2" class="field form-control" placeholder="{$LANG.orderForm.streetAddress2}" value="{$domaincontact.address2}">
+                                </div>
+                            </div>
+                            <div class="col-sm-4">
+                                <div class="form-group prepend-icon">
+                                    <label for="inputDCCity" class="field-icon">
+                                        <i class="far fa-building"></i>
+                                    </label>
+                                    <input type="text" name="domaincontactcity" id="inputDCCity" class="field form-control" placeholder="{$LANG.orderForm.city}" value="{$domaincontact.city}">
+                                </div>
+                            </div>
+                            <div class="col-sm-5">
+                                <div class="form-group prepend-icon">
+                                    <label for="inputDCState" class="field-icon">
+                                        <i class="fas fa-map-signs"></i>
+                                    </label>
+                                    <input type="text" name="domaincontactstate" id="inputDCState" class="field form-control" placeholder="{$LANG.orderForm.state}" value="{$domaincontact.state}">
+                                </div>
+                            </div>
+                            <div class="col-sm-3">
+                                <div class="form-group prepend-icon">
+                                    <label for="inputDCPostcode" class="field-icon">
+                                        <i class="fas fa-certificate"></i>
+                                    </label>
+                                    <input type="text" name="domaincontactpostcode" id="inputDCPostcode" class="field form-control" placeholder="{$LANG.orderForm.postcode}" value="{$domaincontact.postcode}">
+                                </div>
+                            </div>
+                            <div class="col-sm-12">
+                                <div class="form-group prepend-icon">
+                                    <label for="inputDCCountry" class="field-icon" id="inputCountryIcon">
+                                        <i class="fas fa-globe"></i>
+                                    </label>
+                                    <select name="domaincontactcountry" id="inputDCCountry" class="field form-control">
+                                        {foreach $countries as $countrycode => $countrylabel}
+                                            <option value="{$countrycode}"{if (!$domaincontact.country && $countrycode == $defaultcountry) || $countrycode eq $domaincontact.country} selected{/if}>
+                                                {$countrylabel}
+                                            </option>
+                                        {/foreach}
+                                    </select>
+                                </div>
+                            </div>
+                            <div class="col-sm-12">
+                                <div class="form-group prepend-icon">
+                                    <label for="inputDCTaxId" class="field-icon">
+                                        <i class="fas fa-building"></i>
+                                    </label>
+                                    <input type="text" name="domaincontacttax_id" id="inputDCTaxId" class="field form-control" placeholder="{$taxLabel} ({$LANG.orderForm.optional})" value="{$domaincontact.tax_id}">
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+
+                {/if}
+
+                {if !$loggedin}
+
+                    <div id="containerNewUserSecurity"{if (!$loggedin && $custtype eq "existing") || ($remote_auth_prelinked && !$securityquestions)} class="w-hidden"{/if}>
+
+                        <div class="sub-heading">
+                            <span class="primary-bg-color">{$LANG.orderForm.accountSecurity}</span>
+                        </div>
+
+                        <div id="containerPassword" class="row{if $remote_auth_prelinked && $securityquestions} w-hidden{/if}">
+                            <div id="passwdFeedback" class="alert alert-info text-center col-sm-12 w-hidden"></div>
+                            <div class="col-sm-6">
+                                <div class="form-group prepend-icon">
+                                    <label for="inputNewPassword1" class="field-icon">
+                                        <i class="fas fa-lock"></i>
+                                    </label>
+                                    <input type="password" name="password" id="inputNewPassword1" data-error-threshold="{$pwStrengthErrorThreshold}" data-warning-threshold="{$pwStrengthWarningThreshold}" class="field form-control" placeholder="{$LANG.clientareapassword}"{if $remote_auth_prelinked} value="{$password}"{/if}>
+                                </div>
+                            </div>
+                            <div class="col-sm-6">
+                                <div class="form-group prepend-icon">
+                                    <label for="inputNewPassword2" class="field-icon">
+                                        <i class="fas fa-lock"></i>
+                                    </label>
+                                    <input type="password" name="password2" id="inputNewPassword2" class="field form-control" placeholder="{$LANG.clientareaconfirmpassword}"{if $remote_auth_prelinked} value="{$password}"{/if}>
+                                </div>
+                            </div>
+                            <div class="col-sm-6">
+                                <button type="button" class="btn btn-default btn-sm generate-password" data-targetfields="inputNewPassword1,inputNewPassword2">
+                                    {$LANG.generatePassword.btnLabel}
+                                </button>
+                            </div>
+                            <div class="col-sm-6">
+                                <div class="password-strength-meter">
+                                    <div class="progress">
+                                        <div class="progress-bar progress-bar-success progress-bar-striped" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" id="passwordStrengthMeterBar">
+                                        </div>
+                                    </div>
+                                    <p class="text-center small text-muted" id="passwordStrengthTextLabel">{$LANG.pwstrength}: {$LANG.pwstrengthenter}</p>
+                                </div>
+                            </div>
+                        </div>
+                        {if $securityquestions}
+                            <div class="row">
+                                <div class="col-sm-6">
+                                    <select name="securityqid" id="inputSecurityQId" class="field form-control">
+                                        <option value="">{$LANG.clientareasecurityquestion}</option>
+                                        {foreach $securityquestions as $question}
+                                            <option value="{$question.id}"{if $question.id eq $securityqid} selected{/if}>
+                                                {$question.question}
+                                            </option>
+                                        {/foreach}
+                                    </select>
+                                </div>
+                                <div class="col-sm-6">
+                                    <div class="form-group prepend-icon">
+                                        <label for="inputSecurityQAns" class="field-icon">
+                                            <i class="fas fa-lock"></i>
+                                        </label>
+                                        <input type="password" name="securityqans" id="inputSecurityQAns" class="field form-control" placeholder="{$LANG.clientareasecurityanswer}">
+                                    </div>
+                                </div>
+                            </div>
+                        {/if}
+
+                    </div>
+
+                {/if}
+
+                {foreach $hookOutput as $output}
+                    <div>
+                        {$output}
+                    </div>
+                {/foreach}
+
+                <div class="sub-heading">
+                    <span class="primary-bg-color">{$LANG.orderForm.paymentDetails}</span>
+                </div>
+
+                <div class="alert alert-success text-center large-text" role="alert" id="totalDueToday">
+                    {$LANG.ordertotalduetoday}: &nbsp; <strong id="totalCartPrice">{$total}</strong>
+                </div>
+
+                <div id="applyCreditContainer" class="apply-credit-container{if !$canUseCreditOnCheckout} w-hidden{/if}" data-apply-credit="{$applyCredit}">
+                    <p>{lang key='cart.availableCreditBalance' amount=$creditBalance}</p>
+
+                    <label class="radio">
+                        <input id="useCreditOnCheckout" type="radio" name="applycredit" value="1"{if $applyCredit} checked{/if}>
+                        <span id="spanFullCredit"{if !($creditBalance->toNumeric() >= $total->toNumeric())} class="w-hidden"{/if}>
+                            {lang key='cart.applyCreditAmountNoFurtherPayment' amount=$total}
+                        </span>
+                        <span id="spanUseCredit"{if $creditBalance->toNumeric() >= $total->toNumeric()} class="w-hidden"{/if}>
+                            {lang key='cart.applyCreditAmount' amount=$creditBalance}
+                        </span>
+                    </label>
+                    <label class="radio">
+                        <input id="skipCreditOnCheckout" type="radio" name="applycredit" value="0"{if !$applyCredit} checked{/if}>
+                        {lang key='cart.applyCreditSkip' amount=$creditBalance}
+                    </label>
+                </div>
+
+                {if !$inExpressCheckout}
+                    <div id="paymentGatewaysContainer" class="form-group">
+                        <p class="small text-muted">{$LANG.orderForm.preferredPaymentMethod}</p>
+
+                        <div class="text-center">
+                            {foreach $gateways as $gateway}
+                                <label class="radio-inline">
+                                    <input type="radio"
+                                           name="paymentmethod"
+                                           value="{$gateway.sysname}"
+                                           data-payment-type="{$gateway.payment_type}"
+                                           data-show-local="{$gateway.show_local_cards}"
+                                           data-remote-inputs="{$gateway.uses_remote_inputs}"
+                                           class="payment-methods{if $gateway.type eq "CC"} is-credit-card{/if}"
+                                            {if $selectedgateway eq $gateway.sysname} checked{/if}
+                                    />
+                                    {$gateway.name}
+                                </label>
+                            {/foreach}
+                        </div>
+                    </div>
+
+                    <div class="alert alert-danger text-center gateway-errors w-hidden"></div>
+
+                    <div class="clearfix"></div>
+
+                    <div id="paymentGatewayInput"></div>
+
+                    <div class="cc-input-container{if $selectedgatewaytype neq "CC"} w-hidden{/if}" id="creditCardInputFields">
+                        {if $client}
+                            <div id="existingCardsContainer" class="existing-cc-grid">
+                                {include file="orderforms/standard_cart/includes/existing-paymethods.tpl"}
+                            </div>
+                        {/if}
+                        <div class="row cvv-input" id="existingCardInfo">
+                            <div class="col-lg-3 col-sm-4">
+                                <div class="form-group prepend-icon">
+                                    <label for="inputCardCVV2" class="field-icon">
+                                        <i class="fas fa-barcode"></i>
+                                    </label>
+                                    <div class="input-group">
+                                        <input type="tel" name="cccvv" id="inputCardCVV2" class="field form-control" placeholder="{$LANG.creditcardcvvnumbershort}" autocomplete="cc-cvc">
+                                        <span class="input-group-btn input-group-append">
+                                            <button type="button" class="btn btn-default" data-toggle="popover" data-placement="bottom" data-content="<img src='{$BASE_PATH_IMG}/ccv.gif' width='210' />">
+                                                ?
+                                            </button>
+                                        </span>
+                                    </div>
+                                    <span class="field-error-msg">{lang key="paymentMethodsManage.cvcNumberNotValid"}</span>
+                                </div>
+                            </div>
+                        </div>
+
+                        <ul>
+                            <li>
+                                <label class="radio-inline">
+                                    <input type="radio" name="ccinfo" value="new" id="new" {if !$client || $client->payMethods->count() === 0} checked="checked"{/if} />
+                                    &nbsp;
+                                    {lang key='creditcardenternewcard'}
+                                </label>
+                            </li>
+                        </ul>
+
+                        <div class="row" id="newCardInfo">
+                            <div id="cardNumberContainer" class="col-sm-6 new-card-container">
+                                <div class="form-group prepend-icon">
+                                    <label for="inputCardNumber" class="field-icon">
+                                        <i class="fas fa-credit-card"></i>
+                                    </label>
+                                    <input type="tel" name="ccnumber" id="inputCardNumber" class="field form-control cc-number-field" placeholder="{$LANG.orderForm.cardNumber}" autocomplete="cc-number" data-message-unsupported="{lang key='paymentMethodsManage.unsupportedCardType'}" data-message-invalid="{lang key='paymentMethodsManage.cardNumberNotValid'}" data-supported-cards="{$supportedCardTypes}" />
+                                    <span class="field-error-msg"></span>
+                                </div>
+                            </div>
+                            <div class="col-sm-3 new-card-container">
+                                <div class="form-group prepend-icon">
+                                    <label for="inputCardExpiry" class="field-icon">
+                                        <i class="fas fa-calendar-alt"></i>
+                                    </label>
+                                    <input type="tel" name="ccexpirydate" id="inputCardExpiry" class="field form-control" placeholder="MM / YY{if $showccissuestart} ({$LANG.creditcardcardexpires}){/if}" autocomplete="cc-exp">
+                                    <span class="field-error-msg">{lang key="paymentMethodsManage.expiryDateNotValid"}</span>
+                                </div>
+                            </div>
+                            <div class="col-sm-3" id="cvv-field-container">
+                                <div class="form-group prepend-icon">
+                                    <label for="inputCardCVV" class="field-icon">
+                                        <i class="fas fa-barcode"></i>
+                                    </label>
+                                    <div class="input-group">
+                                        <input type="tel" name="cccvv" id="inputCardCVV" class="field form-control" placeholder="{$LANG.creditcardcvvnumbershort}" autocomplete="cc-cvc">
+                                        <span class="input-group-btn input-group-append">
+                                            <button type="button" class="btn btn-default" data-toggle="popover" data-placement="bottom" data-content="<img src='{$BASE_PATH_IMG}/ccv.gif' width='210' />">
+                                                ?
+                                            </button>
+                                        </span><br>
+                                    </div>
+                                    <span class="field-error-msg">{lang key="paymentMethodsManage.cvcNumberNotValid"}</span>
+                                </div>
+                            </div>
+                            {if $showccissuestart}
+                                <div class="col-sm-3 col-sm-offset-6 new-card-container offset-sm-6">
+                                    <div class="form-group prepend-icon">
+                                        <label for="inputCardStart" class="field-icon">
+                                            <i class="far fa-calendar-check"></i>
+                                        </label>
+                                        <input type="tel" name="ccstartdate" id="inputCardStart" class="field form-control" placeholder="MM / YY ({$LANG.creditcardcardstart})" autocomplete="cc-exp">
+                                    </div>
+                                </div>
+                                <div class="col-sm-3 new-card-container">
+                                    <div class="form-group prepend-icon">
+                                        <label for="inputCardIssue" class="field-icon">
+                                            <i class="fas fa-asterisk"></i>
+                                        </label>
+                                        <input type="tel" name="ccissuenum" id="inputCardIssue" class="field form-control" placeholder="{$LANG.creditcardcardissuenum}">
+                                    </div>
+                                </div>
+                            {/if}
+                        </div>
+                        <div id="newCardSaveSettings">
+                            <div class="row form-group new-card-container">
+                                <div id="inputDescriptionContainer" class="col-md-6">
+                                    <div class="prepend-icon">
+                                        <label for="inputDescription" class="field-icon">
+                                            <i class="fas fa-pencil"></i>
+                                        </label>
+                                        <input type="text" class="field form-control" id="inputDescription" name="ccdescription" autocomplete="off" value="" placeholder="{$LANG.paymentMethods.descriptionInput} {$LANG.paymentMethodsManage.optional}" />
+                                    </div>
+                                </div>
+                                {if $allowClientsToRemoveCards}
+                                    <div id="inputNoStoreContainer" class="col-md-6" style="line-height: 32px;">
+                                        <input type="hidden" name="nostore" value="1">
+                                        <input type="checkbox" class="toggle-switch-success no-icheck" data-size="mini" checked="checked" name="nostore" id="inputNoStore" value="0" data-on-text="{lang key='yes'}" data-off-text="{lang key='no'}">
+                                        <label for="inputNoStore" class="checkbox-inline no-padding">
+                                            &nbsp;&nbsp;
+                                            {$LANG.creditCardStore}
+                                        </label>
+                                    </div>
+                                {/if}
+                            </div>
+                        </div>
+                    </div>
+                {else}
+                    {if $expressCheckoutOutput}
+                        {$expressCheckoutOutput}
+                    {else}
+                        <p align="center">
+                            {lang key='paymentPreApproved' gateway=$expressCheckoutGateway}
+                        </p>
+                    {/if}
+                {/if}
+
+                {if $shownotesfield}
+
+                    <div class="sub-heading">
+                        <span class="primary-bg-color">{$LANG.orderForm.additionalNotes}</span>
+                    </div>
+
+                    <div class="row">
+                        <div class="col-sm-12">
+                            <div class="form-group">
+                                <textarea name="notes" class="field form-control" rows="4" placeholder="{$LANG.ordernotesdescription}">{$orderNotes}</textarea>
+                            </div>
+                        </div>
+                    </div>
+
+                {/if}
+
+                {if $showMarketingEmailOptIn}
+                    <div class="marketing-email-optin">
+                        <h4 class="font-size-18">{lang key='emailMarketing.joinOurMailingList'}</h4>
+                        <p>{$marketingEmailOptInMessage}</p>
+                        <input type="checkbox" name="marketingoptin" value="1"{if $marketingEmailOptIn} checked{/if} class="no-icheck toggle-switch-success" data-size="small" data-on-text="{lang key='yes'}" data-off-text="{lang key='no'}">
+                    </div>
+                {/if}
+
+                <div class="text-center">
+                    {if $accepttos}
+                        <p>
+                            <label class="checkbox-inline">
+                                <input type="checkbox" name="accepttos" id="accepttos" />
+                                &nbsp;
+                                {$LANG.ordertosagreement}
+                                <a href="{$tosurl}" target="_blank">{$LANG.ordertos}</a>
+                            </label>
+                        </p>
+                    {/if}
+                    {if $captcha}
+                        <div class="text-center margin-bottom">
+                            {include file="$template/includes/captcha.tpl"}
+                        </div>
+                    {/if}
+
+                    <button type="submit"
+                            id="btnCompleteOrder"
+                            class="btn btn-primary btn-lg disable-on-click spinner-on-click{if $captcha}{$captcha->getButtonClass($captchaForm)}{/if}"
+                            {if $cartitems==0}disabled="disabled"{/if}
+                    >
+                        {if $inExpressCheckout}{$LANG.confirmAndPay}{else}{$LANG.completeorder}{/if}
+                        &nbsp;<i class="fas fa-arrow-circle-right"></i>
+                    </button>
+                </div>
+            </form>
+
+            {if $servedOverSsl}
+                <div class="alert alert-warning checkout-security-msg">
+                    <i class="fas fa-lock"></i>
+                    {$LANG.ordersecure} (<strong>{$ipaddress}</strong>) {$LANG.ordersecure2}
+                    <div class="clearfix"></div>
+                </div>
+            {/if}
+        </div>
+    </div>
+</div>
+
+<script type="text/javascript" src="{$BASE_PATH_JS}/jquery.payment.js"></script>
+<script>
+    var hideCvcOnCheckoutForExistingCard = '{if $canUseCreditOnCheckout && $applyCredit && ($creditBalance->toNumeric() >= $total->toNumeric())}1{else}0{/if}';
+</script>
+{include file="orderforms/standard_cart/recommendations-modal.tpl"}

orderforms/standard_cart/common.tpl

@@ -0,0 +1,5 @@
+<link rel="stylesheet" type="text/css" href="{assetPath file='all.min.css'}?v={$versionHash}" />
+{assetExists file="custom.css"}
+<link rel="stylesheet" type="text/css" href="{$__assetPath__}?v={$versionHash}" />
+{/assetExists}
+<script type="text/javascript" src="{assetPath file='scripts.min.js'}?v={$versionHash}"></script>

orderforms/standard_cart/complete.tpl

@@ -0,0 +1,68 @@
+{include file="orderforms/standard_cart/common.tpl"}
+
+<div id="order-standard_cart">
+
+    <div class="row">
+        <div class="cart-sidebar">
+            {include file="orderforms/standard_cart/sidebar-categories.tpl"}
+        </div>
+        <div class="cart-body">
+            <div class="header-lined">
+                <h1 class="font-size-36">{$LANG.orderconfirmation}</h1>
+            </div>
+            {include file="orderforms/standard_cart/sidebar-categories-collapsed.tpl"}
+
+            <p>{$LANG.orderreceived}</p>
+
+            <div class="row">
+                <div class="col-sm-8 col-sm-offset-2 offset-sm-2">
+                    <div class="alert alert-info order-confirmation">
+                        {$LANG.ordernumberis} <span>{$ordernumber}</span>
+                    </div>
+                </div>
+            </div>
+
+            <p>{$LANG.orderfinalinstructions}</p>
+
+            {if $expressCheckoutInfo}
+                <div class="alert alert-info text-center">
+                    {$expressCheckoutInfo}
+                </div>
+            {elseif $expressCheckoutError}
+                <div class="alert alert-danger text-center">
+                    {$expressCheckoutError}
+                </div>
+            {elseif $invoiceid && !$ispaid}
+                <div class="alert alert-warning text-center">
+                    {$LANG.ordercompletebutnotpaid}
+                    <br /><br />
+                    <a href="{$WEB_ROOT}/viewinvoice.php?id={$invoiceid}" target="_blank" class="alert-link">
+                        {$LANG.invoicenumber}{$invoiceid}
+                    </a>
+                </div>
+            {/if}
+
+            {foreach $addons_html as $addon_html}
+                <div class="order-confirmation-addon-output">
+                    {$addon_html}
+                </div>
+            {/foreach}
+
+            {if $ispaid}
+                <!-- Enter any HTML code which should be displayed when a user has completed checkout here -->
+                <!-- Common uses of this include conversion and affiliate tracking scripts -->
+            {/if}
+
+            <div class="text-center">
+                <a href="{$WEB_ROOT}/clientarea.php" class="btn btn-default">
+                    {$LANG.orderForm.continueToClientArea}
+                    &nbsp;<i class="fas fa-arrow-circle-right"></i>
+                </a>
+            </div>
+
+            {if $hasRecommendations}
+                {include file="orderforms/standard_cart/includes/product-recommendations.tpl"}
+            {/if}
+        </div>
+    </div>
+</div>

orderforms/standard_cart/configuredomains.tpl

@@ -0,0 +1,204 @@
+{include file="orderforms/standard_cart/common.tpl"}
+
+<script>
+var _localLang = {
+    'addToCart': '{$LANG.orderForm.addToCart|escape}',
+    'addedToCartRemove': '{$LANG.orderForm.addedToCartRemove|escape}'
+}
+</script>
+
+<div id="order-standard_cart">
+
+    <div class="row">
+        <div class="cart-sidebar">
+            {include file="orderforms/standard_cart/sidebar-categories.tpl"}
+        </div>
+        <div class="cart-body">
+            <div class="header-lined">
+                <h1 class="font-size-36">{$LANG.cartdomainsconfig}</h1>
+            </div>
+            {include file="orderforms/standard_cart/sidebar-categories-collapsed.tpl"}
+
+            <form method="post" action="{$smarty.server.PHP_SELF}?a=confdomains" id="frmConfigureDomains">
+                <input type="hidden" name="update" value="true" />
+
+                <p>{$LANG.orderForm.reviewDomainAndAddons}</p>
+
+                {if $errormessage}
+                    <div class="alert alert-danger" role="alert">
+                        <p>{$LANG.orderForm.correctErrors}:</p>
+                        <ul>
+                            {$errormessage}
+                        </ul>
+                    </div>
+                {/if}
+
+                {foreach $domains as $num => $domain}
+
+                    <div class="sub-heading">
+                        <span class="primary-bg-color">{$domain.domain}</span>
+                    </div>
+
+                    <div class="row">
+                        <div class="col-sm-6">
+                            <div class="form-group">
+                                <label>{$LANG.orderregperiod}</label>
+                                <br />
+                                {$domain.regperiod} {$LANG.orderyears}
+                            </div>
+                        </div>
+                        <div class="col-sm-6">
+                            <div class="form-group">
+                                <label>{$LANG.hosting}</label>
+                                <br />
+                                {if $domain.hosting}<span style="color:#009900;">[{$LANG.cartdomainshashosting}]</span>{else}<a href="{$WEB_ROOT}/cart.php" style="color:#cc0000;">[{$LANG.cartdomainsnohosting}]</a>{/if}
+                            </div>
+                        </div>
+                        {if $domain.eppenabled}
+                            <div class="col-sm-12">
+                                <div class="form-group prepend-icon">
+                                    <input type="text" name="epp[{$num}]" id="inputEppcode{$num}" value="{$domain.eppvalue}" class="field" placeholder="{$LANG.domaineppcode}" />
+                                    <label for="inputEppcode{$num}" class="field-icon">
+                                        <i class="fas fa-lock"></i>
+                                    </label>
+                                    <span class="field-help-text">
+                                        {$LANG.domaineppcodedesc}
+                                    </span>
+                                </div>
+                            </div>
+                        {/if}
+                    </div>
+
+                    {if $domain.dnsmanagement || $domain.emailforwarding || $domain.idprotection}
+                        <div class="row addon-products">
+
+                            {if $domain.dnsmanagement}
+                                <div class="col-sm-{math equation="12 / numAddons" numAddons=$domain.addonsCount} mb-3">
+                                    <div class="panel panel-default panel-addon{if $domain.dnsmanagementselected} panel-addon-selected{/if}">
+                                        <div class="panel-body">
+                                            <label>
+                                                <input type="checkbox" name="dnsmanagement[{$num}]"{if $domain.dnsmanagementselected} checked{/if} />
+                                                {$LANG.domaindnsmanagement}
+                                            </label><br />
+                                            {$LANG.domainaddonsdnsmanagementinfo}
+                                        </div>
+                                        <div class="panel-price">
+                                            {$domain.dnsmanagementprice} / {$domain.regperiod} {$LANG.orderyears}
+                                        </div>
+                                        <div class="panel-add">
+                                            <i class="fas fa-plus"></i>
+                                            {$LANG.orderForm.addToCart}
+                                        </div>
+                                    </div>
+                                </div>
+                            {/if}
+
+                            {if $domain.idprotection}
+                                <div class="col-sm-{math equation="12 / numAddons" numAddons=$domain.addonsCount} mb-3">
+                                    <div class="panel panel-default panel-addon{if $domain.idprotectionselected} panel-addon-selected{/if}">
+                                        <div class="panel-body">
+                                            <label>
+                                                <input type="checkbox" name="idprotection[{$num}]"{if $domain.idprotectionselected} checked{/if} />
+                                                {$LANG.domainidprotection}
+                                            </label><br />
+                                            {$LANG.domainaddonsidprotectioninfo}
+                                        </div>
+                                        <div class="panel-price">
+                                            {$domain.idprotectionprice} / {$domain.regperiod} {$LANG.orderyears}
+                                        </div>
+                                        <div class="panel-add">
+                                            <i class="fas fa-plus"></i>
+                                            {$LANG.orderForm.addToCart}
+                                        </div>
+                                    </div>
+                                </div>
+                            {/if}
+
+                            {if $domain.emailforwarding}
+                                <div class="col-sm-{math equation="12 / numAddons" numAddons=$domain.addonsCount} mb-3">
+                                    <div class="panel panel-default panel-addon{if $domain.emailforwardingselected} panel-addon-selected{/if}">
+                                        <div class="panel-body">
+                                            <label>
+                                                <input type="checkbox" name="emailforwarding[{$num}]"{if $domain.emailforwardingselected} checked{/if} />
+                                                {$LANG.domainemailforwarding}
+                                            </label><br />
+                                            {$LANG.domainaddonsemailforwardinginfo}
+                                        </div>
+                                        <div class="panel-price">
+                                            {$domain.emailforwardingprice} / {$domain.regperiod} {$LANG.orderyears}
+                                        </div>
+                                        <div class="panel-add">
+                                            <i class="fas fa-plus"></i>
+                                            {$LANG.orderForm.addToCart}
+                                        </div>
+                                    </div>
+                                </div>
+                            {/if}
+
+                        </div>
+                    {/if}
+                    {foreach from=$domain.fields key=domainfieldname item=domainfield}
+                        <div class="form-group row">
+                            <div class="col-sm-4 text-sm-right"">{$domainfieldname}:</div>
+                            <div class="col-sm-8">{$domainfield}</div>
+                        </div>
+                    {/foreach}
+
+                {/foreach}
+
+                {if $atleastonenohosting}
+
+                    <div class="sub-heading">
+                        <span class="primary-bg-color">{$LANG.domainnameservers}</span>
+                    </div>
+
+                    <p>{$LANG.cartnameserversdesc}</p>
+
+                    <div class="row">
+                        <div class="col-sm-4">
+                            <div class="form-group">
+                                <label for="inputNs1">{$LANG.domainnameserver1}</label>
+                                <input type="text" class="form-control" id="inputNs1" name="domainns1" value="{$domainns1}" />
+                            </div>
+                        </div>
+                        <div class="col-sm-4">
+                            <div class="form-group">
+                                <label for="inputNs2">{$LANG.domainnameserver2}</label>
+                                <input type="text" class="form-control" id="inputNs2" name="domainns2" value="{$domainns2}" />
+                            </div>
+                        </div>
+                        <div class="col-sm-4">
+                            <div class="form-group">
+                                <label for="inputNs3">{$LANG.domainnameserver3}</label>
+                                <input type="text" class="form-control" id="inputNs3" name="domainns3" value="{$domainns3}" />
+                            </div>
+                        </div>
+                        <div class="col-sm-4">
+                            <div class="form-group">
+                                <label for="inputNs1">{$LANG.domainnameserver4}</label>
+                                <input type="text" class="form-control" id="inputNs4" name="domainns4" value="{$domainns4}" />
+                            </div>
+                        </div>
+                        <div class="col-sm-4">
+                            <div class="form-group">
+                                <label for="inputNs5">{$LANG.domainnameserver5}</label>
+                                <input type="text" class="form-control" id="inputNs5" name="domainns5" value="{$domainns5}" />
+                            </div>
+                        </div>
+                    </div>
+
+                {/if}
+
+                <div class="text-center pt-4">
+                    <button type="submit" class="btn btn-primary btn-lg">
+                        {$LANG.continue}
+                        &nbsp;<i class="fas fa-arrow-circle-right"></i>
+                    </button>
+                </div>
+
+            </form>
+        </div>
+    </div>
+</div>
+
+{include file="orderforms/standard_cart/recommendations-modal.tpl"}

orderforms/standard_cart/configureproduct.tpl

@@ -0,0 +1,358 @@
+{include file="orderforms/standard_cart/common.tpl"}
+
+<script>
+var _localLang = {
+    'addToCart': '{$LANG.orderForm.addToCart|escape}',
+    'addedToCartRemove': '{$LANG.orderForm.addedToCartRemove|escape}'
+}
+</script>
+
+<div id="order-standard_cart">
+
+    <div class="row">
+        <div class="cart-sidebar">
+            {include file="orderforms/standard_cart/sidebar-categories.tpl"}
+        </div>
+        <div class="cart-body">
+
+            <div class="header-lined">
+                <h1 class="font-size-36">{$LANG.orderconfigure}</h1>
+            </div>
+
+            {include file="orderforms/standard_cart/sidebar-categories-collapsed.tpl"}
+
+            <form id="frmConfigureProduct">
+                <input type="hidden" name="configure" value="true" />
+                <input type="hidden" name="i" value="{$i}" />
+
+                <div class="row">
+                    <div class="secondary-cart-body">
+
+                        <p>{$LANG.orderForm.configureDesiredOptions}</p>
+
+                        <div class="product-info">
+                            <p class="product-title">{$productinfo.name}</p>
+                            <p>{$productinfo.description}</p>
+                        </div>
+
+                        <div class="alert alert-danger w-hidden" role="alert" id="containerProductValidationErrors">
+                            <p>{$LANG.orderForm.correctErrors}:</p>
+                            <ul id="containerProductValidationErrorsList"></ul>
+                        </div>
+
+                        {if $pricing.type eq "recurring"}
+                            <div class="field-container">
+                                <div class="form-group">
+                                    <label for="inputBillingcycle">{$LANG.cartchoosecycle}</label>
+                                    <br>
+                                    <select name="billingcycle" id="inputBillingcycle" class="form-control select-inline custom-select" onchange="updateConfigurableOptions({$i}, this.value); return false">
+                                        {if $pricing.monthly}
+                                            <option value="monthly"{if $billingcycle eq "monthly"} selected{/if}>
+                                                {$pricing.monthly}
+                                            </option>
+                                        {/if}
+                                        {if $pricing.quarterly}
+                                            <option value="quarterly"{if $billingcycle eq "quarterly"} selected{/if}>
+                                                {$pricing.quarterly}
+                                            </option>
+                                        {/if}
+                                        {if $pricing.semiannually}
+                                            <option value="semiannually"{if $billingcycle eq "semiannually"} selected{/if}>
+                                                {$pricing.semiannually}
+                                            </option>
+                                        {/if}
+                                        {if $pricing.annually}
+                                            <option value="annually"{if $billingcycle eq "annually"} selected{/if}>
+                                                {$pricing.annually}
+                                            </option>
+                                        {/if}
+                                        {if $pricing.biennially}
+                                            <option value="biennially"{if $billingcycle eq "biennially"} selected{/if}>
+                                                {$pricing.biennially}
+                                            </option>
+                                        {/if}
+                                        {if $pricing.triennially}
+                                            <option value="triennially"{if $billingcycle eq "triennially"} selected{/if}>
+                                                {$pricing.triennially}
+                                            </option>
+                                        {/if}
+                                    </select>
+                                </div>
+                            </div>
+                        {/if}
+
+                        {if count($metrics) > 0}
+                            <div class="sub-heading">
+                                <span class="primary-bg-color">{$LANG.metrics.title}</span>
+                            </div>
+
+                            <p>{$LANG.metrics.explanation}</p>
+
+                            <ul>
+                                {foreach $metrics as $metric}
+                                    <li>
+                                        {$metric.displayName}
+                                        -
+                                        {if count($metric.pricing) > 1}
+                                            {$LANG.metrics.startingFrom} {$metric.lowestPrice} / {if $metric.unitName}{$metric.unitName}{else}{$LANG.metrics.unit}{/if}
+                                            <button type="button" class="btn btn-default btn-sm" data-toggle="modal" data-target="#modalMetricPricing-{$metric.systemName}">
+                                                {$LANG.metrics.viewPricing}
+                                            </button>
+                                        {elseif count($metric.pricing) == 1}
+                                            {$metric.lowestPrice} / {if $metric.unitName}{$metric.unitName}{else}{$LANG.metrics.unit}{/if}
+                                            {if $metric.includedQuantity > 0} ({$metric.includedQuantity} {$LANG.metrics.includedNotCounted}){/if}
+                                        {/if}
+                                        {include file="$template/usagebillingpricing.tpl"}
+                                    </li>
+                                {/foreach}
+                            </ul>
+
+                            <br>
+                        {/if}
+
+                        {if $productinfo.type eq "server"}
+                            <div class="sub-heading">
+                                <span class="primary-bg-color">{$LANG.cartconfigserver}</span>
+                            </div>
+
+                            <div class="field-container">
+
+                                <div class="row">
+                                    <div class="col-sm-6">
+                                        <div class="form-group">
+                                            <label for="inputHostname">{$LANG.serverhostname}</label>
+                                            <input type="text" name="hostname" class="form-control" id="inputHostname" value="{$server.hostname}" placeholder="servername.example.com">
+                                        </div>
+                                    </div>
+                                    <div class="col-sm-6">
+                                        <div class="form-group">
+                                            <label for="inputRootpw">{$LANG.serverrootpw}</label>
+                                            <input type="password" name="rootpw" class="form-control" id="inputRootpw" value="{$server.rootpw}">
+                                        </div>
+                                    </div>
+                                </div>
+
+                                <div class="row">
+                                    <div class="col-sm-6">
+                                        <div class="form-group">
+                                            <label for="inputNs1prefix">{$LANG.serverns1prefix}</label>
+                                            <input type="text" name="ns1prefix" class="form-control" id="inputNs1prefix" value="{$server.ns1prefix}" placeholder="ns1">
+                                        </div>
+                                    </div>
+                                    <div class="col-sm-6">
+                                        <div class="form-group">
+                                            <label for="inputNs2prefix">{$LANG.serverns2prefix}</label>
+                                            <input type="text" name="ns2prefix" class="form-control" id="inputNs2prefix" value="{$server.ns2prefix}" placeholder="ns2">
+                                        </div>
+                                    </div>
+                                </div>
+
+                            </div>
+                        {/if}
+
+                        {if $configurableoptions}
+                            <div class="sub-heading">
+                                <span class="primary-bg-color">{$LANG.orderconfigpackage}</span>
+                            </div>
+                            <div class="product-configurable-options" id="productConfigurableOptions">
+                                <div class="row">
+                                    {foreach $configurableoptions as $num => $configoption}
+                                    {if $configoption.optiontype eq 1}
+                                        <div class="col-sm-6">
+                                            <div class="form-group">
+                                                <label for="inputConfigOption{$configoption.id}">{$configoption.optionname}</label>
+                                                <select name="configoption[{$configoption.id}]" id="inputConfigOption{$configoption.id}" class="form-control">
+                                                    {foreach key=num2 item=options from=$configoption.options}
+                                                        <option value="{$options.id}"{if $configoption.selectedvalue eq $options.id} selected="selected"{/if}>
+                                                            {$options.name}
+                                                        </option>
+                                                    {/foreach}
+                                                </select>
+                                            </div>
+                                        </div>
+                                    {elseif $configoption.optiontype eq 2}
+                                        <div class="col-sm-6">
+                                            <div class="form-group">
+                                                <label for="inputConfigOption{$configoption.id}">{$configoption.optionname}</label>
+                                                {foreach key=num2 item=options from=$configoption.options}
+                                                    <br />
+                                                    <label>
+                                                        <input type="radio" name="configoption[{$configoption.id}]" value="{$options.id}"{if $configoption.selectedvalue eq $options.id} checked="checked"{/if} />
+                                                        {if $options.name}
+                                                            {$options.name}
+                                                        {else}
+                                                            {$LANG.enable}
+                                                        {/if}
+                                                    </label>
+                                                {/foreach}
+                                            </div>
+                                        </div>
+                                    {elseif $configoption.optiontype eq 3}
+                                        <div class="col-sm-6">
+                                            <div class="form-group">
+                                                <label for="inputConfigOption{$configoption.id}">{$configoption.optionname}</label>
+                                                <br />
+                                                <label>
+                                                    <input type="checkbox" name="configoption[{$configoption.id}]" id="inputConfigOption{$configoption.id}" value="1"{if $configoption.selectedqty} checked{/if} />
+                                                    {if $configoption.options.0.name}
+                                                        {$configoption.options.0.name}
+                                                    {else}
+                                                        {$LANG.enable}
+                                                    {/if}
+                                                </label>
+                                            </div>
+                                        </div>
+                                    {elseif $configoption.optiontype eq 4}
+                                        <div class="col-sm-12">
+                                            <div class="form-group">
+                                                <label for="inputConfigOption{$configoption.id}">{$configoption.optionname}</label>
+                                                {if $configoption.qtymaximum}
+                                                {if !$rangesliderincluded}
+                                                    <script type="text/javascript" src="{$BASE_PATH_JS}/ion.rangeSlider.min.js"></script>
+                                                <link href="{$BASE_PATH_CSS}/ion.rangeSlider.css" rel="stylesheet">
+                                                <link href="{$BASE_PATH_CSS}/ion.rangeSlider.skinModern.css" rel="stylesheet">
+                                                    {assign var='rangesliderincluded' value=true}
+                                                {/if}
+                                                    <input type="text" name="configoption[{$configoption.id}]" value="{if $configoption.selectedqty}{$configoption.selectedqty}{else}{$configoption.qtyminimum}{/if}" id="inputConfigOption{$configoption.id}" class="form-control" />
+                                                    <script>
+                                                        var sliderTimeoutId = null;
+                                                        var sliderRangeDifference = {$configoption.qtymaximum} - {$configoption.qtyminimum};
+                                                        // The largest size that looks nice on most screens.
+                                                        var sliderStepThreshold = 25;
+                                                        // Check if there are too many to display individually.
+                                                        var setLargerMarkers = sliderRangeDifference > sliderStepThreshold;
+
+                                                        jQuery("#inputConfigOption{$configoption.id}").ionRangeSlider({
+                                                            min: {$configoption.qtyminimum},
+                                                            max: {$configoption.qtymaximum},
+                                                            grid: true,
+                                                            grid_snap: setLargerMarkers ? false : true,
+                                                            onChange: function() {
+                                                                if (sliderTimeoutId) {
+                                                                    clearTimeout(sliderTimeoutId);
+                                                                }
+
+                                                                sliderTimeoutId = setTimeout(function() {
+                                                                    sliderTimeoutId = null;
+                                                                    recalctotals();
+                                                                }, 250);
+                                                            }
+                                                        });
+                                                    </script>
+                                                {else}
+                                                    <div>
+                                                        <input type="number" name="configoption[{$configoption.id}]" value="{if $configoption.selectedqty}{$configoption.selectedqty}{else}{$configoption.qtyminimum}{/if}" id="inputConfigOption{$configoption.id}" min="{$configoption.qtyminimum}" onchange="recalctotals()" onkeyup="recalctotals()" class="form-control form-control-qty" />
+                                                        <span class="form-control-static form-control-static-inline">
+                                                                x {$configoption.options.0.name}
+                                                            </span>
+                                                    </div>
+                                                {/if}
+                                            </div>
+                                        </div>
+                                    {/if}
+                                    {if $num % 2 != 0}
+                                </div>
+                                <div class="row">
+                                    {/if}
+                                    {/foreach}
+                                </div>
+                            </div>
+
+                        {/if}
+
+                        {if $customfields}
+
+                            <div class="sub-heading pb-1">
+                                <span class="primary-bg-color">{$LANG.orderadditionalrequiredinfo}<br><i><small>{lang key='orderForm.requiredField'}</small></i></span>
+                            </div>
+
+                            <div class="field-container">
+                                {foreach $customfields as $customfield}
+                                    <div class="form-group">
+                                        <label for="customfield{$customfield.id}">{$customfield.name} {$customfield.required}</label>
+                                        {$customfield.input}
+                                        {if $customfield.description}
+                                            <span class="field-help-text">
+                                                {$customfield.description}
+                                            </span>
+                                        {/if}
+                                    </div>
+                                {/foreach}
+                            </div>
+
+                        {/if}
+
+                        {if $addons || count($addonsPromoOutput) > 0}
+
+                            <div id="productAddonsContainer">
+                                <div class="sub-heading">
+                                    <span class="primary-bg-color">{$LANG.cartavailableaddons}</span>
+                                </div>
+
+                                {foreach $addonsPromoOutput as $output}
+                                    <div>
+                                        {$output}
+                                    </div>
+                                {/foreach}
+
+                                <div class="row addon-products">
+                                    {foreach $addons as $addon}
+                                        <div class="col-sm-{if count($addons) > 1}6{else}12{/if}">
+                                            <div class="panel card panel-default panel-addon{if $addon.status} panel-addon-selected{/if}">
+                                                <div class="panel-body card-body">
+                                                    <label>
+                                                        <input type="checkbox" name="addons[{$addon.id}]"{if $addon.status} checked{/if} />
+                                                        {$addon.name}
+                                                    </label><br />
+                                                    {$addon.description}
+                                                </div>
+                                                <div class="panel-price">
+                                                    {$addon.pricing}
+                                                </div>
+                                                <div class="panel-add">
+                                                    <i class="fas fa-plus"></i>
+                                                    {$LANG.addtocart}
+                                                </div>
+                                            </div>
+                                        </div>
+                                    {/foreach}
+                                </div>
+                            </div>
+                        {/if}
+
+                        <div class="alert alert-warning info-text-sm">
+                            <i class="fas fa-question-circle"></i>
+                            {$LANG.orderForm.haveQuestionsContact} <a href="{$WEB_ROOT}/contact.php" target="_blank" class="alert-link">{$LANG.orderForm.haveQuestionsClickHere}</a>
+                        </div>
+
+                    </div>
+                    <div class="secondary-cart-sidebar" id="scrollingPanelContainer">
+
+                        <div id="orderSummary">
+                            <div class="order-summary">
+                                <div class="loader" id="orderSummaryLoader">
+                                    <i class="fas fa-fw fa-sync fa-spin"></i>
+                                </div>
+                                <h2 class="font-size-30">{$LANG.ordersummary}</h2>
+                                <div class="summary-container" id="producttotal"></div>
+                            </div>
+                            <div class="text-center">
+                                <button type="submit" id="btnCompleteProductConfig" class="btn btn-primary btn-lg">
+                                    {$LANG.continue}
+                                    <i class="fas fa-arrow-circle-right"></i>
+                                </button>
+                            </div>
+                        </div>
+
+                    </div>
+
+                </div>
+
+            </form>
+        </div>
+    </div>
+</div>
+
+<script>recalctotals();</script>
+
+{include file="orderforms/standard_cart/recommendations-modal.tpl"}

orderforms/standard_cart/configureproductdomain.tpl

@@ -0,0 +1,342 @@
+{include file="orderforms/standard_cart/common.tpl"}
+
+<div id="order-standard_cart">
+
+    <div class="row">
+        <div class="cart-sidebar">
+            {include file="orderforms/standard_cart/sidebar-categories.tpl"}
+        </div>
+
+        <div class="cart-body">
+            <div class="header-lined">
+                <h1 class="font-size-36">{$LANG.domaincheckerchoosedomain}</h1>
+            </div>
+            {include file="orderforms/standard_cart/sidebar-categories-collapsed.tpl"}
+            <form id="frmProductDomain">
+                <input type="hidden" id="frmProductDomainPid" value="{$pid}" />
+                <div class="domain-selection-options">
+                    {if $incartdomains}
+                        <div class="option">
+                            <label>
+                                <input type="radio" name="domainoption" value="incart" id="selincart" />{$LANG.cartproductdomainuseincart}
+                            </label>
+                            <div class="domain-input-group clearfix" id="domainincart">
+                                <div class="row">
+                                    <div class="col-sm-8 col-sm-offset-1 col-md-6 col-md-offset-2 offset-sm-1 offset-md-2">
+                                        <div class="domains-row">
+                                            <select id="incartsld" name="incartdomain" class="form-control">
+                                                {foreach key=num item=incartdomain from=$incartdomains}
+                                                    <option value="{$incartdomain}">{$incartdomain}</option>
+                                                {/foreach}
+                                            </select>
+                                        </div>
+                                    </div>
+                                    <div class="col-sm-2">
+                                        <button type="submit" class="btn btn-primary btn-block">
+                                            {$LANG.orderForm.use}
+                                        </button>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    {/if}
+                    {if $registerdomainenabled}
+                        <div class="option">
+                            <label>
+                                <input type="radio" name="domainoption" value="register" id="selregister"{if $domainoption eq "register"} checked{/if} />{$LANG.cartregisterdomainchoice|sprintf2:$companyname}
+                            </label>
+                            <div class="domain-input-group clearfix" id="domainregister">
+                                <div class="row">
+                                    <div class="col-sm-8 col-sm-offset-1 offset-sm-1">
+                                        <div class="row domains-row">
+                                            <div class="col-xs-9 col-9">
+                                                <div class="input-group">
+                                                    <div class="input-group-addon input-group-prepend">
+                                                        <span class="input-group-text">{$LANG.orderForm.www}</span>
+                                                    </div>
+                                                    <input type="text" id="registersld" value="{$sld}" class="form-control" autocapitalize="none" data-toggle="tooltip" data-placement="top" data-trigger="manual" title="{lang key='orderForm.enterDomain'}" />
+                                                </div>
+                                            </div>
+                                            <div class="col-xs-3 col-3">
+                                                <select id="registertld" class="form-control">
+                                                    {foreach from=$registertlds item=listtld}
+                                                        <option value="{$listtld}"{if $listtld eq $tld} selected="selected"{/if}>{$listtld}</option>
+                                                    {/foreach}
+                                                </select>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="col-sm-2">
+                                        <button type="submit" class="btn btn-primary btn-block">
+                                            {$LANG.orderForm.check}
+                                        </button>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    {/if}
+                    {if $transferdomainenabled}
+                        <div class="option">
+                            <label>
+                                <input type="radio" name="domainoption" value="transfer" id="seltransfer"{if $domainoption eq "transfer"} checked{/if} />{$LANG.carttransferdomainchoice|sprintf2:$companyname}
+                            </label>
+                            <div class="domain-input-group clearfix" id="domaintransfer">
+                                <div class="row">
+                                    <div class="col-sm-8 col-sm-offset-1 offset-sm-1">
+                                        <div class="row domains-row">
+                                            <div class="col-xs-9 col-9">
+                                                <div class="input-group">
+                                                    <div class="input-group-addon input-group-prepend">
+                                                        <span class="input-group-text">{$LANG.orderForm.www}</span>
+                                                    </div>
+                                                    <input type="text" id="transfersld" value="{$sld}" class="form-control" autocapitalize="none" data-toggle="tooltip" data-placement="top" data-trigger="manual" title="{lang key='orderForm.enterDomain'}"/>
+                                                </div>
+                                            </div>
+                                            <div class="col-xs-3 col-3">
+                                                <select id="transfertld" class="form-control">
+                                                    {foreach from=$transfertlds item=listtld}
+                                                        <option value="{$listtld}"{if $listtld eq $tld} selected="selected"{/if}>{$listtld}</option>
+                                                    {/foreach}
+                                                </select>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="col-sm-2">
+                                        <button type="submit" class="btn btn-primary btn-block">
+                                            {$LANG.orderForm.transfer}
+                                        </button>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    {/if}
+                    {if $owndomainenabled}
+                        <div class="option">
+                            <label>
+                                <input type="radio" name="domainoption" value="owndomain" id="selowndomain"{if $domainoption eq "owndomain"} checked{/if} />{$LANG.cartexistingdomainchoice|sprintf2:$companyname}
+                            </label>
+                            <div class="domain-input-group clearfix" id="domainowndomain">
+                                <div class="row">
+                                    <div class="col-sm-8 col-sm-offset-1 offset-sm-1">
+                                        <div class="row domains-row">
+                                            <div class="col-xs-9 col-9">
+                                                <div class="input-group">
+                                                    <div class="input-group-addon input-group-prepend">
+                                                        <span class="input-group-text">{lang key='orderForm.www'}</span>
+                                                    </div>
+                                                    <input type="text" id="owndomainsld" value="{$sld}" placeholder="{lang key='yourdomainplaceholder'}" class="form-control" autocapitalize="none" data-toggle="tooltip" data-placement="top" data-trigger="manual" title="{lang key='orderForm.enterDomain'}" />
+                                                </div>
+                                            </div>
+                                            <div class="col-xs-3 col-3">
+                                                <input type="text" id="owndomaintld" value="{$tld|substr:1}" placeholder="{$LANG.yourtldplaceholder}" class="form-control" autocapitalize="none" data-toggle="tooltip" data-placement="top" data-trigger="manual" title="{lang key='orderForm.required'}" />
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="col-sm-2">
+                                        <button type="submit" class="btn btn-primary btn-block" id="useOwnDomain">
+                                            {$LANG.orderForm.use}
+                                        </button>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    {/if}
+                    {if $subdomains}
+                        <div class="option">
+                            <label>
+                                <input type="radio" name="domainoption" value="subdomain" id="selsubdomain"{if $domainoption eq "subdomain"} checked{/if} />{$LANG.cartsubdomainchoice|sprintf2:$companyname}
+                            </label>
+                            <div class="domain-input-group clearfix" id="domainsubdomain">
+                                <div class="row">
+                                    <div class="col-sm-9">
+                                        <div class="row domains-row">
+                                            <div class="col-xs-2 col-2 text-right">
+                                                <p class="form-control-static">http://</p>
+                                            </div>
+                                            <div class="col-xs-5 col-5">
+                                                <input type="text" id="subdomainsld" value="{$sld}" placeholder="yourname" class="form-control" autocapitalize="none" data-toggle="tooltip" data-placement="top" data-trigger="manual" title="{lang key='orderForm.enterDomain'}" />
+                                            </div>
+                                            <div class="col-xs-5 col-5">
+                                                <select id="subdomaintld" class="form-control">
+                                                    {foreach $subdomains as $subid => $subdomain}
+                                                        <option value="{$subid}">{$subdomain}</option>
+                                                    {/foreach}
+                                                </select>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div class="col-sm-2">
+                                        <button type="submit" class="btn btn-primary btn-block">
+                                            {$LANG.orderForm.check}
+                                        </button>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    {/if}
+                </div>
+
+                {if $freedomaintlds}
+                    <p>* <em>{$LANG.orderfreedomainregistration} {$LANG.orderfreedomainappliesto}: {$freedomaintlds}</em></p>
+                {/if}
+
+            </form>
+
+            <div class="clearfix"></div>
+            <form method="post" action="{$WEB_ROOT}/cart.php?a=add&pid={$pid}&domainselect=1" id="frmProductDomainSelections">
+
+                <div id="DomainSearchResults" class="w-hidden">
+
+                    <div id="searchDomainInfo">
+                        <p id="primaryLookupSearching" class="domain-lookup-loader domain-lookup-primary-loader domain-searching domain-checker-result-headline">
+                            <i class="fas fa-spinner fa-spin"></i>
+                            <span class="domain-lookup-register-loader">{lang key='orderForm.checkingAvailability'}...</span>
+                            <span class="domain-lookup-transfer-loader">{lang key='orderForm.verifyingTransferEligibility'}...</span>
+                            <span class="domain-lookup-other-loader">{lang key='orderForm.verifyingDomain'}...</span>
+                        </p>
+                        <div id="primaryLookupResult" class="domain-lookup-result domain-lookup-primary-results w-hidden">
+                            <div class="domain-unavailable domain-checker-unavailable headline">{lang key='orderForm.domainIsUnavailable'}</div>
+                            <div class="domain-available domain-checker-available headline">{$LANG.domainavailablemessage}</div>
+                            <div class="btn btn-primary domain-contact-support headline">{$LANG.domainContactUs}</div>
+                            <div class="transfer-eligible">
+                                <p class="domain-checker-available headline">{lang key='orderForm.transferEligible'}</p>
+                                <p>{lang key='orderForm.transferUnlockBeforeContinuing'}</p>
+                            </div>
+                            <div class="transfer-not-eligible">
+                                <p class="domain-checker-unavailable headline">{lang key='orderForm.transferNotEligible'}</p>
+                                <p>{lang key='orderForm.transferNotRegistered'}</p>
+                                <p>{lang key='orderForm.trasnferRecentlyRegistered'}</p>
+                                <p>{lang key='orderForm.transferAlternativelyRegister'}</p>
+                            </div>
+                            <div class="domain-invalid">
+                                <p class="domain-checker-unavailable headline">{lang key='orderForm.domainInvalid'}</p>
+                                <p>
+                                    {lang key='orderForm.domainLetterOrNumber'}<span class="domain-length-restrictions">{lang key='orderForm.domainLengthRequirements'}</span><br />
+                                    {lang key='orderForm.domainInvalidCheckEntry'}
+                                </p>
+                            </div>
+                            <div id="idnLanguageSelector" class="margin-10 idn-language-selector idn-language w-hidden">
+                                <div class="row">
+                                    <div class="col-sm-10 col-sm-offset-1 col-lg-8 col-lg-offset-2 offset-sm-1 offset-lg-2">
+                                        <div class="margin-10 text-center">
+                                            {lang key='cart.idnLanguageDescription'}
+                                        </div>
+                                    </div>
+                                </div>
+                                <div class="row">
+                                    <div class="col-sm-8 col-lg-6 col-sm-offset-2 col-lg-offset-3 offset-sm-2 offset-lg-3">
+                                        <div class="form-group">
+                                            <select name="idnlanguage" class="form-control">
+                                                <option value="">{lang key='cart.idnLanguage'}</option>
+                                                {foreach $idnLanguages as $idnLanguageKey => $idnLanguage}
+                                                    <option value="{$idnLanguageKey}">{lang key='idnLanguage.'|cat:$idnLanguageKey}</option>
+                                                {/foreach}
+                                            </select>
+                                            <div class="field-error-msg">
+                                                {lang key='cart.selectIdnLanguageForRegister'}
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="domain-price">
+                                <span class="register-price-label">{lang key='orderForm.domainPriceRegisterLabel'}</span>
+                                <span class="transfer-price-label w-hidden">{lang key='orderForm.domainPriceTransferLabel'}</span>
+                                <span class="price"></span>
+                            </div>
+                            <p class="domain-error domain-checker-unavailable headline"></p>
+                            <input type="hidden" id="resultDomainOption" name="domainoption" />
+                            <input type="hidden" id="resultDomain" name="domains[]" />
+                            <input type="hidden" id="resultDomainPricingTerm" />
+                        </div>
+                    </div>
+
+                    {if $registerdomainenabled}
+                        {if $spotlightTlds}
+                            <div id="spotlightTlds" class="spotlight-tlds clearfix w-hidden">
+                                <div class="spotlight-tlds-container">
+                                    {foreach $spotlightTlds as $key => $data}
+                                        <div class="spotlight-tld-container spotlight-tld-container-{$spotlightTlds|count}">
+                                            <div id="spotlight{$data.tldNoDots}" class="spotlight-tld">
+                                                {if $data.group}
+                                                    <div class="spotlight-tld-{$data.group}">{$data.groupDisplayName}</div>
+                                                {/if}
+                                                {$data.tld}
+                                                <span class="domain-lookup-loader domain-lookup-spotlight-loader">
+                                                    <i class="fas fa-spinner fa-spin"></i>
+                                                </span>
+                                                <div class="domain-lookup-result">
+                                                    <button type="button" class="btn unavailable w-hidden" disabled="disabled">
+                                                        {lang key='domainunavailable'}
+                                                    </button>
+                                                    <button type="button" class="btn invalid w-hidden" disabled="disabled">
+                                                        {lang key='domainunavailable'}
+                                                    </button>
+                                                    <span class="available price w-hidden">{$data.register}</span>
+                                                    <button type="button" class="btn btn-add-to-cart product-domain w-hidden" data-whois="0" data-domain="">
+                                                        <span class="to-add">{lang key='orderForm.add'}</span>
+                                                        <span class="loading">
+                                                            <i class="fas fa-spinner fa-spin"></i> {lang key='loading'}
+                                                        </span>
+                                                        <span class="added"><i class="far fa-shopping-cart"></i> {lang key='domaincheckeradded'}</span>
+                                                        <span class="unavailable">{$LANG.domaincheckertaken}</span>
+                                                    </button>
+                                                    <button type="button" class="btn btn-primary domain-contact-support w-hidden">
+                                                        {lang key='domainChecker.contactSupport'}
+                                                    </button>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    {/foreach}
+                                </div>
+                            </div>
+                        {/if}
+
+                        <div class="suggested-domains w-hidden">
+                            <div class="panel-heading card-header">
+                                {lang key='orderForm.suggestedDomains'}
+                            </div>
+                            <div id="suggestionsLoader" class="card-body panel-body domain-lookup-loader domain-lookup-suggestions-loader">
+                                <i class="fas fa-spinner fa-spin"></i> {lang key='orderForm.generatingSuggestions'}
+                            </div>
+                            <div id="domainSuggestions" class="domain-lookup-result list-group w-hidden">
+                                <div class="domain-suggestion list-group-item w-hidden">
+                                    <span class="domain"></span><span class="extension"></span>
+                                    <div class="actions">
+                                        <button type="button" class="btn btn-add-to-cart product-domain" data-whois="1" data-domain="">
+                                            <span class="to-add">{$LANG.addtocart}</span>
+                                            <span class="loading">
+                                                <i class="fas fa-spinner fa-spin"></i> {lang key='loading'}
+                                            </span>
+                                            <span class="added">{lang key='domaincheckeradded'}</span>
+                                            <span class="unavailable">{$LANG.domaincheckertaken}</span>
+                                        </button>
+                                        <button type="button" class="btn btn-primary domain-contact-support w-hidden">{lang key='domainChecker.contactSupport'}</button>
+                                        <span class="price"></span>
+                                        <span class="promo w-hidden"></span>
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="panel-footer card-footer more-suggestions text-center w-hidden">
+                                <a id="moreSuggestions" href="#" onclick="loadMoreSuggestions();return false;">{lang key='domainsmoresuggestions'}</a>
+                                <span id="noMoreSuggestions" class="no-more small w-hidden">{lang key='domaincheckernomoresuggestions'}</span>
+                            </div>
+                            <div class="text-center text-muted domain-suggestions-warning">
+                                <p>{lang key='domainssuggestionswarnings'}</p>
+                            </div>
+                        </div>
+                    {/if}
+                </div>
+
+                <div class="text-center">
+                    <button id="btnDomainContinue" type="submit" class="btn btn-primary btn-lg w-hidden" disabled="disabled">
+                        {$LANG.continue}
+                        &nbsp;<i class="fas fa-arrow-circle-right"></i>
+                    </button>
+                </div>
+            </form>
+        </div>
+    </div>
+</div>
+
+{include file="orderforms/standard_cart/recommendations-modal.tpl"}

orderforms/standard_cart/domain-renewals.tpl

@@ -0,0 +1,190 @@
+{include file="orderforms/standard_cart/common.tpl"}
+
+<div id="order-standard_cart">
+    <div class="row">
+        <div class="cart-sidebar">
+            {include file="orderforms/standard_cart/sidebar-categories.tpl"}
+        </div>
+        <div class="cart-body">
+            <div class="header-lined">
+                <h1 class="font-size-36">
+                    {if $totalResults > 1}{lang key='navrenewdomains'}{else}{lang key='domainrenew'}{/if}
+                    {if $totalResults > 5}
+                        <div class="pull-right float-right">
+                            <input id="domainRenewalFilter" type="search" class="domain-renewals-filter form-control input-inline-100" placeholder="{lang key='searchenterdomain'}">
+                        </div>
+                    {/if}
+                </h1>
+            </div>
+            {include file="orderforms/standard_cart/sidebar-categories-collapsed.tpl"}
+
+            {if $totalDomainCount == 0}
+                <div id="no-domains" class="alert alert-warning text-center" role="alert">
+                    {$LANG.domainRenewal.noDomains}
+                </div>
+                <p class="text-center">
+                    <a href="{$WEB_ROOT}/clientarea.php" class="btn btn-default">
+                        <i class="fas fa-arrow-circle-left"></i>
+                        {$LANG.orderForm.returnToClientArea}
+                    </a>
+                </p>
+            {else}
+                <div class="row">
+
+                    <div class="secondary-cart-body">
+                        {if $totalResults < $totalDomainCount}
+                            <div class="text-center">
+                                {lang key='domainRenewal.showingDomains' showing=$totalResults totalCount=$totalDomainCount}
+                                <a id="linkShowAll" href="{routePath('cart-domain-renewals')}">{lang key='domainRenewal.showAll'}</a>
+                            </div>
+                        {/if}
+
+                        <div id="domainRenewals" class="domain-renewals">
+                            {foreach $renewalsData as $renewalData}
+                                <div class="domain-renewal" data-domain="{$renewalData.domain}">
+                                    <div class="pull-right float-right">
+                                        {if !$renewalData.eligibleForRenewal}
+                                            <span class="label label-info">
+                                                {if $renewalData.freeDomainRenewal}
+                                                    {lang key='domainRenewal.freeWithService'}
+                                                {else}
+                                                    {lang key='domainRenewal.unavailable'}
+                                                {/if}
+                                            </span>
+                                        {elseif ($renewalData.pastGracePeriod && $renewalData.pastRedemptionGracePeriod)}
+                                            <span class="label label-info">
+                                                {lang key='domainrenewalspastgraceperiod'}
+                                            </span>
+                                        {elseif !$renewalData.beforeRenewLimit && $renewalData.daysUntilExpiry > 0}
+                                            <span class="label label-{if $renewalData.daysUntilExpiry > 30}success{else}warning{/if}">
+                                                {lang key='domainRenewal.expiringIn' days=$renewalData.daysUntilExpiry}
+                                            </span>
+                                        {elseif $renewalData.daysUntilExpiry === 0}
+                                            <span class="label label-grey">
+                                                {lang key='expiresToday'}
+                                            </span>
+                                        {elseif $renewalData.beforeRenewLimit}
+                                            <span class="label label-info">
+                                                {lang key='domainRenewal.maximumAdvanceRenewal' days=$renewalData.beforeRenewLimitDays}
+                                            </span>
+                                        {else}
+                                            <span class="label label-danger">
+                                                {lang key='domainRenewal.expiredDaysAgo' days=$renewalData.daysUntilExpiry*-1}
+                                            </span>
+                                        {/if}
+                                    </div>
+
+                                    <h3 class="font-size-24">{$renewalData.domain}</h3>
+
+                                    <p>{lang key='clientareadomainexpirydate'}: {$renewalData.expiryDate->format('j M Y')} ({$renewalData.expiryDate->diffForHumans()})</p>
+                                    {if $renewalData.freeDomainRenewal}
+                                        <p class="domain-renewal-desc">{lang key='domainRenewal.freeWithServiceDesc'}</p>
+                                    {/if}
+
+                                    {if ($renewalData.pastGracePeriod && $renewalData.pastRedemptionGracePeriod) || !count($renewalData.renewalOptions)}
+                                    {else}
+                                        <form class="form-horizontal">
+                                            <div class="form-group row">
+                                                <label for="renewalPricing{$renewalData.id}" class="control-label col-md-5">
+                                                    {lang key='domainRenewal.availablePeriods'}
+                                                    {if $renewalData.inGracePeriod || $renewalData.inRedemptionGracePeriod}
+                                                        *
+                                                    {/if}
+                                                </label>
+                                                <div class="col-sm-6">
+                                                    <select class="form-control select-renewal-pricing" id="renewalPricing{$renewalData.id}" data-domain-id="{$renewalData.id}">
+                                                        {foreach $renewalData.renewalOptions as $renewalOption}
+                                                            <option value="{$renewalOption.period}">
+                                                                {$renewalOption.period} {lang key='orderyears'} @ {$renewalOption.rawRenewalPrice}
+                                                                {if $renewalOption.gracePeriodFee && $renewalOption.gracePeriodFee->toNumeric() != 0.00}
+                                                                    + {$renewalOption.gracePeriodFee} {lang key='domainRenewal.graceFee'}
+                                                                {/if}
+                                                                {if $renewalOption.redemptionGracePeriodFee && $renewalOption.redemptionGracePeriodFee->toNumeric() != 0.00}
+                                                                    + {$renewalOption.redemptionGracePeriodFee} {lang key='domainRenewal.redemptionFee'}
+                                                                {/if}
+                                                            </option>
+                                                        {/foreach}
+                                                    </select>
+                                                </div>
+                                            </div>
+                                        </form>
+                                    {/if}
+
+                                    <div class="text-right">
+                                        {if !$renewalData.eligibleForRenewal || $renewalData.beforeRenewLimit || ($renewalData.pastGracePeriod && $renewalData.pastRedemptionGracePeriod)}
+                                        {else}
+                                            <button id="renewDomain{$renewalData.id}" class="btn btn-default btn-sm btn-add-renewal-to-cart" data-domain-id="{$renewalData.id}">
+                                                <span class="to-add">
+                                                    <i class="fas fa-fw fa-spinner fa-spin"></i>
+                                                    {lang key='addtocart'}
+                                                </span>
+                                                <span class="added">{lang key='domaincheckeradded'}</span>
+                                            </button>
+                                        {/if}
+                                    </div>
+                                </div>
+                            {/foreach}
+                        </div>
+
+                        <div class="text-center">
+                            <small>
+                                {if $hasDomainsInGracePeriod}
+                                    * {lang key='domainRenewal.graceRenewalPeriodDescription'}
+                                {/if}
+                            </small>
+                        </div>
+                    </div>
+
+                    <div class="secondary-cart-sidebar" id="scrollingPanelContainer">
+
+                        <div id="orderSummary">
+                            <div class="order-summary">
+                                <div class="loader" id="orderSummaryLoader">
+                                    <i class="fas fa-fw fa-sync fa-spin"></i>
+                                </div>
+                                <h2 class="font-size-30">{lang key='ordersummary'}</h2>
+                                <div class="summary-container" id="producttotal"></div>
+                            </div>
+                            <div class="text-center">
+                                <a id="btnGoToCart" class="btn btn-primary btn-lg" href="{$WEB_ROOT}/cart.php?a=view">
+                                    {lang key='viewcart'}
+                                    <i class="far fa-shopping-cart"></i>
+                                </a>
+                            </div>
+                        </div>
+
+                    </div>
+                </div>
+            {/if}
+        </div>
+    </div>
+    <form id="removeRenewalForm" method="post" action="{$WEB_ROOT}/cart.php">
+        <input type="hidden" name="a" value="remove" />
+        <input type="hidden" name="r" value="" id="inputRemoveItemType" />
+        <input type="hidden" name="i" value="" id="inputRemoveItemRef" />
+        <div class="modal fade modal-remove-item" id="modalRemoveItem" tabindex="-1" role="dialog">
+            <div class="modal-dialog" role="document">
+                <div class="modal-content">
+                    <div class="modal-header d-block">
+                        <h4 class="modal-title">
+                            <button type="button" class="close" data-dismiss="modal" aria-label="{lang key='orderForm.close'}">
+                                <span aria-hidden="true">&times;</span>
+                            </button>
+                            <i class="fas fa-times fa-3x"></i>
+                            <span>{lang key='orderForm.removeItem'}</span>
+                        </h4>
+                    </div>
+                    <div class="modal-body">
+                        {lang key='cartremoveitemconfirm'}
+                    </div>
+                    <div class="modal-footer d-block">
+                        <button type="button" class="btn btn-default" data-dismiss="modal">{lang key='no'}</button>
+                        <button type="submit" class="btn btn-primary">{lang key='yes'}</button>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </form>
+</div>
+
+<script>recalculateRenewalTotals();</script>

orderforms/standard_cart/domainoptions.tpl

@@ -0,0 +1,184 @@
+{if $invalid}
+    <div class="domain-checker-result-headline domain-checker-unavailable">
+        {if $reason}
+            {$reason}
+        {else}
+            {$LANG.cartdomaininvalid}
+        {/if}
+    </div>
+{elseif $alreadyindb}
+    <div class="domain-checker-result-headline domain-checker-unavailable">
+        {$LANG.cartdomainexists}
+    </div>
+{else}
+
+    {if $checktype=="register" && $regenabled}
+
+        <input type="hidden" name="domainoption" value="register" />
+
+        {if $status eq "available" || $status eq "error"}
+
+            <div class="domain-checker-result-headline domain-checker-available">
+                {$LANG.cartcongratsdomainavailable|sprintf2:$domain}
+            </div>
+
+            <input type="hidden" name="domains[]" value="{$searchResults.domainName}" />
+            <input type="hidden" name="domainsregperiod[{$domain}]" value="{$searchResults.shortestPeriod.period}" />
+
+            <div class="text-center">
+                {if count($searchResults.pricing) == 1}
+                    <p class="margin-bottom">{$LANG.orderForm.domainAddedToCart}</p>
+                    <button type="button" class="btn btn-default btn-lg margin-bottom">
+                        <span class="far fa-shopping-cart"></span>
+                        {$searchResults.shortestPeriod.register}
+                    </button>
+                {else}
+                    <p class="margin-bottom">{$LANG.orderForm.registerLongerAndSave}</p>
+                    <div class="btn-group btn-group-lg margin-bottom">
+                        <button type="button" class="btn btn-default btn-sm">
+                            <span name="{$searchResults.domainName}-selected-price">
+                                <b class="far fa-shopping-cart"></b>
+                                {$searchResults.shortestPeriod.period} {$LANG.orderyears} @ {$searchResults.shortestPeriod.register}
+                            </span>
+                        </button>
+                        <button type="button" class="btn btn-default btn-sm dropdown-toggle additional-options" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                            <b class="caret"></b>
+                            <span class="sr-only">
+                                {lang key="domainChecker.additionalPricingOptions" domain=$searchResults.domainName}
+                            </span>
+                        </button>
+                        <ul class="dropdown-menu" role="menu">
+                            {foreach $searchResults.pricing as $years => $price}
+                                <li>
+                                    <a href="#" onclick="selectDomainPricing('{$searchResults.domainName}', '{$price.register}', {$years}, '{$LANG.orderyears}');return false;">
+                                        <b class="far fa-shopping-cart"></b>
+                                        {$years} {$LANG.orderyears} @ {$price.register}
+                                    </a>
+                                </li>
+                            {/foreach}
+                        </ul>
+                    </div>
+                {/if}
+            </div>
+
+
+            {assign var='continueok' value=true}
+
+        {elseif $status eq "unavailable"}
+
+            <div class="domain-checker-result-headline domain-checker-unavailable">
+                {$LANG.cartdomaintaken|sprintf2:$domain}
+            </div>
+
+        {/if}
+
+    {elseif $checktype=="transfer" && $transferenabled}
+
+        <input type="hidden" name="domainoption" value="transfer" />
+
+        {if $status eq "available"}
+
+            <div class="domain-checker-result-headline domain-checker-unavailable">
+                {$LANG.carttransfernotregistered|sprintf2:$domain}
+            </div>
+            <p class="text-center">{$LANG.orderForm.tryRegisteringInstead}</p>
+
+        {elseif $status eq "unavailable" || $status eq "error"}
+
+            <div class="domain-checker-result-headline domain-checker-available">
+                {$LANG.carttransferpossible|sprintf2:$domain:$transferprice}
+            </div>
+
+            <input type="hidden" name="domains[]" value="{$domain}" />
+            <input type="hidden" name="domainsregperiod[{$domain}]" value="{$transferterm}" />
+
+            {assign var='continueok' value=true}
+
+        {/if}
+
+    {elseif $checktype=="owndomain" || $checktype=="subdomain"}
+
+        <input type="hidden" name="domainoption" value="{$checktype}" />
+        <input type="hidden" name="sld" value="{$sld}" />
+        <input type="hidden" name="tld" value="{$tld}" />
+        <script language="javascript">
+            domainGotoNextStep();
+        </script>
+
+    {/if}
+
+    {if $searchResults.suggestions}
+
+        <div class="sub-heading">
+            <span class="primary-bg-color">{$LANG.cartotherdomainsuggestions}</span>
+        </div>
+
+        <div class="row domain-suggestions">
+            {foreach $searchResults.suggestions as $num => $result}
+                <div class="col-sm-6 margin-bottom-5">
+                    <input type="hidden" name="domainsregperiod[{$result.domainName}]" value="{$result.shortestPeriod.period}" />
+                    <label>
+                        <input type="checkbox" name="domains[]" value="{$result.domainName}" id="domainSuggestion{$num}" class="suggested-domains" />
+                        {$result.domainName}
+                    </label>
+                    <div class="pull-right float-right">
+                        {if count($result.pricing) > 1}
+                            <div class="btn-group domain-suggestion-pricing">
+                        {/if}
+                        <button type="button" class="btn btn-default btn-sm" onclick="selectDomainPricing('{$result.domainName}', '{$result.shortestPeriod.register}', {$result.shortestPeriod.period}, '{$LANG.orderyears}', '{$num}')">
+                            <span name="{$result.domainName}-selected-price">
+                                <b class="far fa-shopping-cart"></b>
+                                {$result.shortestPeriod.period} {$LANG.orderyears} @ {$result.shortestPeriod.register}
+                            </span>
+                        </button>
+                        {if count($result.pricing) > 1}
+                            <button type="button" class="btn btn-default btn-sm dropdown-toggle additional-options" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                                <b class="caret"></b>
+                                <span class="sr-only">
+                                    {lang key="domainChecker.additionalPricingOptions" domain=$result.domainName}
+                                </span>
+                            </button>
+                            <ul class="dropdown-menu" role="menu">
+                                {foreach $result.pricing as $years => $price}
+                                    <li>
+                                        <a href="#" onclick="selectDomainPricing('{$result.domainName}', '{$price.register}', {$years}, '{$LANG.orderyears}', '{$num}');return false;">
+                                            <b class="far fa-shopping-cart"></b>
+                                            {$years} {$LANG.orderyears} @ {$price.register}
+                                        </a>
+                                    </li>
+                                {/foreach}
+                            </ul>
+                        </div>
+                        {/if}
+                    </div>
+                </div>
+            {/foreach}
+        </div>
+
+        {assign var='continueok' value=true}
+
+    {/if}
+
+    {if $continueok}
+        <div class="alert alert-info info-text-sm">
+            <i class="fas fa-info-circle"></i>
+            {$LANG.orderForm.domainAvailabilityCached}
+        </div>
+
+        <div class="text-center">
+            <button type="submit" class="btn btn-primary btn-lg">
+                {$LANG.continue}
+                &nbsp;<i class="fas fa-arrow-circle-right"></i>
+            </button>
+        </div>
+    {/if}
+
+{/if}
+
+<script>
+    jQuery('input.suggested-domains').iCheck({
+        checkboxClass: 'icheckbox_square-green',
+        radioClass: 'iradio_square-green',
+        increaseArea: '20%'
+    });
+</script>

orderforms/standard_cart/domainregister.tpl

@@ -0,0 +1,348 @@
+{include file="orderforms/standard_cart/common.tpl"}
+
+<div id="order-standard_cart">
+
+    <div class="row">
+        <div class="cart-sidebar">
+            {include file="orderforms/standard_cart/sidebar-categories.tpl"}
+        </div>
+        <div class="cart-body">
+            <div class="header-lined">
+                <h1 class="font-size-36">
+                    {$LANG.registerdomain}
+                </h1>
+            </div>
+            {include file="orderforms/standard_cart/sidebar-categories-collapsed.tpl"}
+
+            <p>{$LANG.orderForm.findNewDomain}</p>
+
+            <div class="domain-checker-container">
+                <div class="domain-checker-bg clearfix">
+                    <form method="post" action="{$WEB_ROOT}/cart.php" id="frmDomainChecker">
+                        <input type="hidden" name="a" value="checkDomain">
+                        <div class="row">
+                            <div class="col-md-8 col-md-offset-2 offset-md-2 col-xs-10 col-xs-offset-1 col-10 offset-1">
+                                <div class="input-group input-group-lg input-group-box">
+                                    <input type="text" name="domain" class="form-control" placeholder="{$LANG.findyourdomain}" value="{$lookupTerm}" id="inputDomain" data-toggle="tooltip" data-placement="left" data-trigger="manual" title="{lang key='orderForm.domainOrKeyword'}" />
+                                    <span class="input-group-btn input-group-append">
+                                        <button type="submit" id="btnCheckAvailability" class="btn btn-primary domain-check-availability{$captcha->getButtonClass($captchaForm)}">{$LANG.search}</button>
+                                    </span>
+                                </div>
+                            </div>
+
+                            {if $captcha->isEnabled() && $captcha->isEnabledForForm($captchaForm) && !$captcha->recaptcha->isInvisible()}
+                                <div class="col-md-8 col-md-offset-2 offset-md-2 col-xs-10 col-xs-offset-1 col-10 offset-1">
+                                    <div class="captcha-container" id="captchaContainer">
+                                        {if $captcha == "recaptcha"}
+                                            <br>
+                                            <div class="text-center">
+                                                <div class="form-group recaptcha-container"></div>
+                                            </div>
+                                        {elseif $captcha != "recaptcha"}
+                                            <div class="default-captcha default-captcha-register-margin">
+                                                <p>{lang key="cartSimpleCaptcha"}</p>
+                                                <div>
+                                                    <img id="inputCaptchaImage" src="{$systemurl}includes/verifyimage.php" align="middle" />
+                                                    <input id="inputCaptcha" type="text" name="code" maxlength="6" class="form-control input-sm" data-toggle="tooltip" data-placement="right" data-trigger="manual" title="{lang key='orderForm.required'}" />
+                                                </div>
+                                            </div>
+                                        {/if}
+                                    </div>
+                                </div>
+                            {/if}
+                        </div>
+                    </form>
+                </div>
+            </div>
+
+            <div id="DomainSearchResults" class="w-hidden">
+                <div id="searchDomainInfo" class="domain-checker-result-headline">
+                    <p id="primaryLookupSearching" class="domain-lookup-loader domain-lookup-primary-loader domain-searching"><i class="fas fa-spinner fa-spin"></i> {lang key='orderForm.searching'}...</p>
+                    <div id="primaryLookupResult" class="domain-lookup-result w-hidden">
+                        <p class="domain-invalid domain-checker-invalid">{lang key='orderForm.domainLetterOrNumber'}<span class="domain-length-restrictions">{lang key='orderForm.domainLengthRequirements'}</span></p>
+                        <p class="domain-unavailable domain-checker-unavailable">{lang key='orderForm.domainIsUnavailable'}</p>
+                        <p class="domain-tld-unavailable domain-checker-unavailable">{lang key='orderForm.domainHasUnavailableTld'}</p>
+                        <p class="domain-available domain-checker-available">{$LANG.domainavailablemessage}</p>
+                        <a class="domain-contact-support btn btn-primary">{$LANG.domainContactUs}</a>
+                        <div id="idnLanguageSelector" class="form-group idn-language-selector w-hidden">
+                            <div class="row">
+                                <div class="col-sm-10 col-sm-offset-1 col-lg-8 col-lg-offset-2 offset-sm-1 offset-lg-2">
+                                    <div class="margin-10 text-center">
+                                        {lang key='cart.idnLanguageDescription'}
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="row">
+                                <div class="col-sm-8 col-lg-6 col-sm-offset-2 col-lg-offset-3 offset-sm-2 offset-lg-3">
+                                    <select name="idnlanguage" class="form-control">
+                                        <option value="">{lang key='cart.idnLanguage'}</option>
+                                        {foreach $idnLanguages as $idnLanguageKey => $idnLanguage}
+                                            <option value="{$idnLanguageKey}">{lang key='idnLanguage.'|cat:$idnLanguageKey}</option>
+                                        {/foreach}
+                                    </select>
+                                    <div class="field-error-msg">
+                                        {lang key='cart.selectIdnLanguageForRegister'}
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <p class="domain-price">
+                            <span class="price"></span>
+                            <button class="btn btn-primary btn-add-to-cart" data-whois="0" data-domain="">
+                                <span class="to-add">{$LANG.addtocart}</span>
+                                <span class="loading">
+                                    <i class="fas fa-spinner fa-spin"></i> {lang key='loading'}
+                                </span>
+                                <span class="added"><i class="far fa-shopping-cart"></i> {lang key='checkout'}</span>
+                                <span class="unavailable">{$LANG.domaincheckertaken}</span>
+                            </button>
+                        </p>
+                        <p class="domain-error domain-checker-unavailable"></p>
+                    </div>
+                </div>
+
+                {if $spotlightTlds}
+                    <div id="spotlightTlds" class="spotlight-tlds clearfix">
+                        <div class="spotlight-tlds-container">
+                            {foreach $spotlightTlds as $key => $data}
+                                <div class="spotlight-tld-container spotlight-tld-container-{$spotlightTlds|count}">
+                                    <div id="spotlight{$data.tldNoDots}" class="spotlight-tld">
+                                        {if $data.group}
+                                            <div class="spotlight-tld-{$data.group}">{$data.groupDisplayName}</div>
+                                        {/if}
+                                        {$data.tld}
+                                        <span class="domain-lookup-loader domain-lookup-spotlight-loader">
+                                            <i class="fas fa-spinner fa-spin"></i>
+                                        </span>
+                                        <div class="domain-lookup-result">
+                                            <button type="button" class="btn unavailable w-hidden" disabled="disabled">
+                                                {lang key='domainunavailable'}
+                                            </button>
+                                            <button type="button" class="btn invalid w-hidden" disabled="disabled">
+                                                {lang key='domainunavailable'}
+                                            </button>
+                                            <span class="available price w-hidden">{$data.register}</span>
+                                            <button type="button" class="btn btn-add-to-cart w-hidden" data-whois="0" data-domain="">
+                                                <span class="to-add">{lang key='orderForm.add'}</span>
+                                                <span class="loading">
+                                                    <i class="fas fa-spinner fa-spin"></i> {lang key='loading'}
+                                                </span>
+                                                <span class="added"><i class="far fa-shopping-cart"></i> {lang key='checkout'}</span>
+                                                <span class="unavailable">{$LANG.domaincheckertaken}</span>
+                                            </button>
+                                            <button type="button" class="btn btn-primary domain-contact-support w-hidden">
+                                                {lang key='domainChecker.contactSupport'}
+                                            </button>
+                                        </div>
+                                    </div>
+                                </div>
+                            {/foreach}
+                        </div>
+                    </div>
+                {/if}
+
+                <div class="suggested-domains{if !$showSuggestionsContainer} w-hidden{/if}">
+                    <div class="panel-heading card-header">
+                        {lang key='orderForm.suggestedDomains'}
+                    </div>
+                    <div id="suggestionsLoader" class="panel-body card-body domain-lookup-loader domain-lookup-suggestions-loader">
+                        <i class="fas fa-spinner fa-spin"></i> {lang key='orderForm.generatingSuggestions'}
+                    </div>
+                    <div id="domainSuggestions" class="domain-lookup-result list-group w-hidden">
+                        <div class="domain-suggestion list-group-item w-hidden">
+                            <span class="domain"></span><span class="extension"></span>
+                            <span class="promo w-hidden">
+                                <span class="sales-group-hot w-hidden">{lang key='domainCheckerSalesGroup.hot'}</span>
+                                <span class="sales-group-new w-hidden">{lang key='domainCheckerSalesGroup.new'}</span>
+                                <span class="sales-group-sale w-hidden">{lang key='domainCheckerSalesGroup.sale'}</span>
+                            </span>
+                            <div class="actions">
+                                <span class="price"></span>
+                                <button type="button" class="btn btn-add-to-cart" data-whois="1" data-domain="">
+                                    <span class="to-add">{$LANG.addtocart}</span>
+                                    <span class="loading">
+                                        <i class="fas fa-spinner fa-spin"></i> {lang key='loading'}
+                                    </span>
+                                    <span class="added"><i class="far fa-shopping-cart"></i> {lang key='checkout'}</span>
+                                    <span class="unavailable">{$LANG.domaincheckertaken}</span>
+                                </button>
+                                <button type="button" class="btn btn-primary domain-contact-support w-hidden">
+                                    {lang key='domainChecker.contactSupport'}
+                                </button>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="panel-footer card-footer more-suggestions text-center w-hidden">
+                        <a id="moreSuggestions" href="#" onclick="loadMoreSuggestions();return false;">{lang key='domainsmoresuggestions'}</a>
+                        <span id="noMoreSuggestions" class="no-more small w-hidden">{lang key='domaincheckernomoresuggestions'}</span>
+                    </div>
+                    <div class="text-center text-muted domain-suggestions-warning">
+                        <p>{lang key='domainssuggestionswarnings'}</p>
+                    </div>
+                </div>
+
+            </div>
+
+            <div class="domain-pricing">
+
+                {if $featuredTlds}
+                    <div class="featured-tlds-container">
+                        <div class="row">
+                            {foreach $featuredTlds as $num => $tldinfo}
+                                {if $num % 3 == 0 && (count($featuredTlds) - $num < 3)}
+                                    {if count($featuredTlds) - $num == 2}
+                                        <div class="col-sm-2"></div>
+                                    {else}
+                                        <div class="col-sm-4"></div>
+                                    {/if}
+                                {/if}
+                                <div class="col-lg-4 col-sm-6">
+                                    <div class="featured-tld">
+                                        <div class="img-container">
+                                            <img src="{$BASE_PATH_IMG}/tld_logos/{$tldinfo.tldNoDots}.png">
+                                        </div>
+                                        <div class="price {$tldinfo.tldNoDots}">
+                                            {if is_object($tldinfo.register)}
+                                                {$tldinfo.register->toPrefixed()}{if $tldinfo.period > 1}{lang key="orderForm.shortPerYears" years={$tldinfo.period}}{else}{lang key="orderForm.shortPerYear" years=''}{/if}
+                                            {else}
+                                                {lang key="domainregnotavailable"}
+                                            {/if}
+                                        </div>
+                                    </div>
+                                </div>
+                            {/foreach}
+                        </div>
+                    </div>
+                {/if}
+
+                <h4 class="font-size-18">{lang key='pricing.browseExtByCategory'}</h4>
+
+                <div class="tld-filters">
+                    {foreach $categoriesWithCounts as $category => $count}
+                        <a href="#" data-category="{$category}" class="badge badge-secondary">{lang key="domainTldCategory.$category" defaultValue=$category} ({$count})</a>
+                    {/foreach}
+                </div>
+
+                <div class="bg-white">
+                    <div class="row no-gutters tld-pricing-header text-center">
+                        <div class="col-md-4 tld-column">{lang key='orderdomain'}</div>
+                        <div class="col-md-8">
+                            <div class="row no-gutters">
+                                <div class="col-xs-4 col-4">{lang key='pricing.register'}</div>
+                                <div class="col-xs-4 col-4">{lang key='pricing.transfer'}</div>
+                                <div class="col-xs-4 col-4">{lang key='pricing.renewal'}</div>
+                            </div>
+                        </div>
+                    </div>
+                    {foreach $pricing['pricing'] as $tld => $price}
+                        <div class="row no-gutters tld-row" data-category="{foreach $price.categories as $category}|{$category}|{/foreach}">
+                            <div class="col-md-4 two-row-center px-4">
+                                <strong>.{$tld}</strong>
+                                {if $price.group}
+                                    <span class="tld-sale-group tld-sale-group-{$price.group}">
+                                        {lang key='domainCheckerSalesGroup.'|cat:$price.group}
+                                    </span>
+                                {/if}
+                            </div>
+                            <div class="col-md-8">
+                                <div class="row">
+                                    <div class="col-xs-4 col-4 text-center">
+                                        {if isset($price.register) && current($price.register) > 0}
+                                            {current($price.register)}<br>
+                                            <small>{key($price.register)} {if key($price.register) > 1}{lang key="orderForm.years"}{else}{lang key="orderForm.year"}{/if}</small>
+                                        {elseif isset($price.register) && current($price.register) == 0}
+                                            <small>{lang key='orderfree'}</small>
+                                        {else}
+                                            <small>{lang key='na'}</small>
+                                        {/if}
+                                    </div>
+                                    <div class="col-xs-4 col-4 text-center">
+                                        {if isset($price.transfer) && current($price.transfer) > 0}
+                                            {current($price.transfer)}<br>
+                                            <small>{key($price.transfer)} {if key($price.register) > 1}{lang key="orderForm.years"}{else}{lang key="orderForm.year"}{/if}</small>
+                                        {elseif isset($price.transfer) && current($price.transfer) == 0}
+                                            <small>{lang key='orderfree'}</small>
+                                        {else}
+                                            <small>{lang key='na'}</small>
+                                        {/if}
+                                    </div>
+                                    <div class="col-xs-4 col-4 text-center">
+                                        {if isset($price.renew) && current($price.renew) > 0}
+                                            {current($price.renew)}<br>
+                                            <small>{key($price.renew)} {if key($price.register) > 1}{lang key="orderForm.years"}{else}{lang key="orderForm.year"}{/if}</small>
+                                        {elseif isset($price.renew) && current($price.renew) == 0}
+                                            <small>{lang key='orderfree'}</small>
+                                        {else}
+                                            <small>{lang key='na'}</small>
+                                        {/if}
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    {/foreach}
+                    <div class="row tld-row no-tlds">
+                        <div class="col-xs-12 col-12 text-center">
+                            <br>
+                            {lang key='pricing.selectExtCategory'}
+                            <br><br>
+                        </div>
+                    </div>
+                </div>
+
+            </div>
+
+            <div class="row">
+                <div class="{if $domainTransferEnabled}col-md-6{else}col-md-8 col-md-offset-2 offset-md-2{/if}">
+                    <div class="domain-promo-box">
+
+                        <div class="clearfix">
+                            <i class="fas fa-server fa-4x"></i>
+                            <h3 class="font-size-24 no-wrap">{lang key='orderForm.addHosting'}</h3>
+                            <p class="font-bold text-warning">{lang key='orderForm.chooseFromRange'}</p>
+                        </div>
+
+                        <p>{lang key='orderForm.packagesForBudget'}</p>
+
+                        <a href="{$WEB_ROOT}/cart.php" class="btn btn-warning">
+                            {lang key='orderForm.exploreNow'}
+                        </a>
+                    </div>
+                </div>
+                {if $domainTransferEnabled}
+                    <div class="col-md-6">
+                        <div class="domain-promo-box">
+
+                            <div class="clearfix">
+                                <i class="fas fa-globe fa-4x"></i>
+                                <h3 class="font-size-22">{lang key='orderForm.transferToUs'}</h3>
+                                <p class="font-bold text-primary">{lang key='orderForm.transferExtend'}*</p>
+                            </div>
+
+                            <a href="{$WEB_ROOT}/cart.php?a=add&domain=transfer" class="btn btn-primary">
+                                {lang key='orderForm.transferDomain'}
+                            </a>
+
+                            <p class="small">* {lang key='orderForm.extendExclusions'}</p>
+                        </div>
+                    </div>
+                {/if}
+            </div>
+        </div>
+    </div>
+</div>
+
+<script>
+jQuery(document).ready(function() {
+    jQuery('.tld-filters a:first-child').click();
+{if $lookupTerm && !$captchaError && !$invalid}
+    jQuery('#btnCheckAvailability').click();
+{/if}
+{if $invalid}
+    jQuery('#primaryLookupSearching').toggle();
+    jQuery('#primaryLookupResult').children().toggle();
+    jQuery('#primaryLookupResult').toggle();
+    jQuery('#DomainSearchResults').toggle();
+    jQuery('.domain-invalid').toggle();
+{/if}
+});
+</script>

orderforms/standard_cart/domaintransfer.tpl

@@ -0,0 +1,79 @@
+{include file="orderforms/standard_cart/common.tpl"}
+
+<div id="order-standard_cart">
+
+    <div class="row">
+        <div class="cart-sidebar">
+            {include file="orderforms/standard_cart/sidebar-categories.tpl"}
+        </div>
+        <div class="cart-body">
+            <div class="header-lined">
+                <h1 class="font-size-36">
+                    {$LANG.transferdomain}
+                </h1>
+            </div>
+            {include file="orderforms/standard_cart/sidebar-categories-collapsed.tpl"}
+
+            <div class="text-center">
+                <h2 class="font-size-30">{lang key='orderForm.transferToUs'}</h2>
+                <p>{lang key='orderForm.transferExtend'}*</p>
+            </div>
+            <br />
+
+            <form method="post" action="{$WEB_ROOT}/cart.php" id="frmDomainTransfer">
+                <input type="hidden" name="a" value="addDomainTransfer">
+
+                <div class="row">
+                    <div class="col-sm-8 col-sm-offset-2 offset-sm-2">
+                        <div class="panel card panel-default">
+                            <div class="panel-heading card-header pb-0">
+                                <h3 class="panel-title card-title font-size-24 mb-2">{lang key='orderForm.singleTransfer'}</h3>
+                            </div>
+                            <div class="panel-body card-body">
+                                <div class="form-group">
+                                    <label for="inputTransferDomain">{lang key='domainname'}</label>
+                                    <input type="text" class="form-control" name="domain" id="inputTransferDomain" value="{$lookupTerm}" placeholder="{lang key='yourdomainplaceholder'}.{lang key='yourtldplaceholder'}" data-toggle="tooltip" data-placement="left" data-trigger="manual" title="{lang key='orderForm.enterDomain'}" />
+                                </div>
+                                <div class="form-group">
+                                    <label for="inputAuthCode" style="width:100%;">
+                                        {lang key='orderForm.authCode'}
+                                        <a data-toggle="tooltip" data-placement="left" title="{lang key='orderForm.authCodeTooltip'}" class="pull-right float-right"><i class="fas fa-question-circle"></i> {lang key='orderForm.help'}</a>
+                                    </label>
+                                    <input type="text" class="form-control" name="epp" id="inputAuthCode" placeholder="{lang key='orderForm.authCodePlaceholder'}" data-toggle="tooltip" data-placement="left" data-trigger="manual" title="{lang key='orderForm.required'}" />
+                                </div>
+                                <div id="transferUnavailable" class="alert alert-warning slim-alert text-center w-hidden"></div>
+                                {if $captcha->isEnabled() && !$captcha->recaptcha->isEnabled()}
+                                    <div class="captcha-container" id="captchaContainer">
+                                        <div class="default-captcha">
+                                            <p>{lang key="cartSimpleCaptcha"}</p>
+                                            <div>
+                                                <img id="inputCaptchaImage" src="{$systemurl}includes/verifyimage.php" />
+                                                <input id="inputCaptcha" type="text" name="code" maxlength="6" class="form-control input-sm" data-toggle="tooltip" data-placement="right" data-trigger="manual" title="{lang key='orderForm.required'}" />
+                                            </div>
+                                        </div>
+                                    </div>
+                                {elseif $captcha->isEnabled() && $captcha->recaptcha->isEnabled() && !$captcha->recaptcha->isInvisible()}
+                                    <div class="text-center">
+                                        <div class="form-group recaptcha-container" id="captchaContainer"></div>
+                                    </div>
+                                {/if}
+                            </div>
+
+                            <div class="panel-footer card-footer text-right">
+                                <button type="submit" id="btnTransferDomain" class="btn btn-primary btn-transfer{$captcha->getButtonClass($captchaForm)}">
+                                    <span class="loader w-hidden" id="addTransferLoader">
+                                        <i class="fas fa-fw fa-spinner fa-spin"></i>
+                                    </span>
+                                    <span id="addToCart">{lang key="orderForm.addToCart"}</span>
+                                </button>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+
+            </form>
+
+            <p class="text-center small">* {lang key='orderForm.extendExclusions'}</p>
+        </div>
+    </div>
+</div>

orderforms/standard_cart/error.tpl

@@ -0,0 +1,38 @@
+{include file="orderforms/standard_cart/common.tpl"}
+
+<div id="order-standard_cart">
+
+    <div class="row">
+        <div class="cart-sidebar">
+            {include file="orderforms/standard_cart/sidebar-categories.tpl"}
+        </div>
+        <div class="cart-body">
+            <div class="header-lined">
+                <h1 class="font-size-36">
+                    {$LANG.thereisaproblem}
+                </h1>
+            </div>
+            {include file="orderforms/standard_cart/sidebar-categories-collapsed.tpl"}
+
+            <div class="alert alert-danger error-heading">
+                <i class="fas fa-exclamation-triangle"></i>
+                {$errortitle}
+            </div>
+
+            <div class="row">
+                <div class="col-sm-8 col-sm-offset-2 offset-sm-2">
+
+                    <p class="margin-bottom">{$errormsg}</p>
+
+                    <div class="text-center">
+                        <a href="javascript:history.go(-1)" class="btn btn-default">
+                            <i class="fas fa-arrow-left"></i>&nbsp;
+                            {$LANG.problemgoback}
+                        </a>
+                    </div>
+
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

orderforms/standard_cart/fraudcheck.tpl

@@ -0,0 +1,60 @@
+{include file="orderforms/standard_cart/common.tpl"}
+
+<div id="order-standard_cart">
+
+    <div class="header-lined">
+        <h1 class="font-size-36">
+            {$LANG.cartfraudcheck}
+        </h1>
+    </div>
+
+    <div class="row">
+
+        <div class="col-md-10 col-md-offset-1 offset-md-1">
+
+            {include file="orderforms/standard_cart/sidebar-categories-collapsed.tpl"}
+
+            <div class="alert alert-danger error-heading">
+                <i class="fas fa-exclamation-triangle"></i>
+                {$errortitle}
+            </div>
+
+            <div class="row">
+                <div class="col-sm-8 col-sm-offset-2 offset-sm-2 text-center">
+                    {if !$userValidation.submittedAt && $userValidation.token eq true}
+                        <p class="margin-bottom">{lang key='fraud.furtherVal'}</p>
+                        <p>
+                            <a href="#" class="btn btn-default" data-url="{$userValidationUrl}" onclick="openValidationSubmitModal(this);return false;">
+                                {lang key='fraud.submitDocs'}
+                                &nbsp;<i class="fas fa-arrow-right"></i>
+                            </a>
+                        </p>
+                        <div id="validationSubmitModal" class="modal fade" role="dialog">
+                            <div class="modal-dialog modal-lg">
+                                <div class="modal-content">
+                                    <div class="modal-body top-margin-10">
+                                        <iframe id="validationContent" allow="camera {$userValidationHost}" width="100%" height="700" frameborder="0" src=""></iframe>
+                                    </div>
+                                    <div class="modal-footer">
+                                        <button type="button" class="btn btn-default" data-dismiss="modal">{lang key='close'}</button>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    {else}
+                        <p class="margin-bottom">{$error}</p>
+
+                        <p>
+                            <a href="{$WEB_ROOT}/submitticket.php" class="btn btn-default">
+                                {$LANG.orderForm.submitTicket}
+                                &nbsp;<i class="fas fa-arrow-right"></i>
+                            </a>
+                        </p>
+                    {/if}
+
+                </div>
+            </div>
+
+        </div>
+    </div>
+</div>

orderforms/standard_cart/includes/existing-paymethods.tpl

@@ -0,0 +1,46 @@
+{if $selectedAccountId === $client->id}
+    {foreach $client->payMethods->validateGateways()->sortByExpiryDate() as $payMethod}
+        {assign "payMethodExpired" 0}
+        {assign "expiryDate" ""}
+        {if $payMethod->isCreditCard()}
+            {if ($payMethod->payment->isExpired())}
+                {assign "payMethodExpired" 1}
+            {/if}
+
+            {if $payMethod->payment->getExpiryDate()}
+                {assign "expiryDate" $payMethod->payment->getExpiryDate()->format('m/Y')}
+            {/if}
+        {/if}
+
+        <div class="paymethod-info radio-inline" data-paymethod-id="{$payMethod->id}">
+            <input type="radio"
+                   name="ccinfo"
+                   class="existing-card"
+                   {if $payMethodExpired}disabled{/if}
+                   data-payment-type="{$payMethod->getType()}"
+                   data-payment-gateway="{$payMethod->gateway_name}"
+                   data-order-preference="{$payMethod->order_preference}"
+                   value="{$payMethod->id}">
+        </div>
+
+        <div class="paymethod-info" data-paymethod-id="{$payMethod->id}">
+            <i class="{$payMethod->getFontAwesomeIcon()}"></i>
+        </div>
+        <div class="paymethod-info" data-paymethod-id="{$payMethod->id}">
+            {if $payMethod->isCreditCard() || $payMethod->isRemoteBankAccount()}
+                {$payMethod->payment->getDisplayName()}
+            {else}
+                <span class="type">
+                {$payMethod->payment->getAccountType()}
+            </span>
+                {substr($payMethod->payment->getAccountNumber(), -4)}
+            {/if}
+        </div>
+        <div class="paymethod-info" data-paymethod-id="{$payMethod->id}">
+            {$payMethod->getDescription()}
+        </div>
+        <div class="paymethod-info" data-paymethod-id="{$payMethod->id}">
+            {$expiryDate}{if $payMethodExpired}<br><small>{$LANG.clientareaexpired}</small>{/if}
+        </div>
+    {/foreach}
+{/if}

orderforms/standard_cart/includes/product-recommendations.tpl

@@ -0,0 +1,114 @@
+{if !empty($lastProduct)}
+<div class="product-added-panel panel card">
+    <div class="panel-body card-body">
+        <span class="text-muted">
+            <i class="far fa-check"></i>&nbsp;{lang key="recommendations.productAdded"}
+        </span>
+        <div>
+            <span class="product-name">&nbsp;{$lastProduct.product.name}</span>
+            <span class="product-group">&nbsp;{$lastProduct.product.productGroup.name}</span>
+        </div>
+        <div>
+            <span class="product-price">
+                {if !$lastProduct.pricing->isFree()}
+                    &nbsp;{$lastProduct.pricing->price()->toFull()}
+                    {if $lastProduct.pricing->setup() && $lastProduct.pricing->setup()->toNumeric() > 0}
+                        + {$lastProduct.pricing->setup()->toFull()} {lang key="ordersetupfee"}
+                    {/if}
+                {/if}
+            </span>
+            <span class="product-cycle">&nbsp;{lang key='orderpaymentterm'|cat:$lastProduct.pricing->cycle()}</span>
+        </div>
+    </div>
+</div>
+{/if}
+<div class="product-recommendations-container">
+    <div class="product-recommendations">
+        {if !in_array($templatefile, ['viewcart', 'checkout', 'complete'])}
+            <p>{lang key="recommendations.explain.product"}</p>
+        {elseif !$recommendStyle && $templatefile != 'complete'}
+            <p>{lang key="recommendations.explain.generic"}</p>
+        {elseif $templatefile == 'complete'}
+            <div>
+                <h4 class="float-left pull-left">{lang key="recommendations.title.generic"}</h4>
+                <h4 class="text-muted float-right pull-right">
+                    <small>
+                        {if !empty($productRecommendations.order)}
+                            {lang key="recommendations.title.yourOrder"}
+                        {else}
+                            {lang key="recommendations.title.yourProducts"}
+                        {/if}
+                    </small>
+                </h4>
+                <div class="clearfix"></div>
+            </div>
+        {/if}
+        {if $productRecommendations}
+            {foreach $productRecommendations as $categoryKey => $categoryRecommendations}
+                {if $templatefile == 'complete' && $categoryKey == 'own' && !empty($productRecommendations.own) && !empty($productRecommendations.order)}
+                    <h4 class="text-muted float-right pull-right">
+                        <small>{lang key="recommendations.title.yourProducts"}</small>
+                    </h4>
+                    <div class="clearfix"></div>
+                {/if}
+                {foreach $categoryRecommendations as $categoryRecommendation}
+                    {if $recommendStyle && $templatefile != 'complete'}
+                        <p>{lang key="recommendations.explain.ordered" productName=$categoryRecommendation.name}</p>
+                    {/if}
+                    {foreach $categoryRecommendation.recommendations as $recommendation}
+                        {assign var="price" value=$recommendation->pricing()->first()}
+                        <div class="product-recommendation" data-color="{$recommendation.color}" style="border-color:{$recommendation->color};">
+                            <div class="header{if !$recommendation.shortDescription} header-static{/if}">
+                                <div class="cta">
+                                    <div class="price" style="color:{$recommendation->color};">
+                                        <span {if !$recommendation->isFree()}class="w-hidden hidden"{/if}>{lang key="orderfree"}</span>
+                                        {if !$recommendation->isFree() && $price}
+                                            <span class="breakdown-price">
+                                            {if $price->isOneTime()}
+                                                {$price->price()->toFull()}
+                                            {elseif $price->isRecurring()}
+                                                {$price->breakdownPrice()}
+                                            {/if}
+                                        </span>
+                                        {/if}
+                                        {if !$recommendation->isFree() && !is_null($price->setup()) && $price->setup()->toNumeric() > 0}
+                                            <span class="setup-fee"><small>{$price->setup()->toFull()}&nbsp;{lang key="ordersetupfee"}</small></span>
+                                        {/if}
+                                    </div>
+                                    <a type="button" class="btn btn-sm btn-add" href="{$recommendation->getRoutePath()}" role="button" style="background-color:{$recommendation->color};">
+                                        <span class="text">
+                                            {lang key="addtocart"}
+                                        </span>
+                                            <span class="arrow" style="background-color:{$recommendation->color};">
+                                            <i class="fas fa-chevron-right"></i>
+                                        </span>
+                                    </a>
+                                </div>
+                                <div class="expander" style="color:{$recommendation->color};">
+                                    {if $recommendation.shortDescription}
+                                        <i class="fas fa-chevron-right rotate" data-toggle="tooltip" data-placement="right" title="{lang key="recommendations.learnMore"}"></i>
+                                    {else}
+                                        <i class="fas fa-square fa-xs"></i>
+                                    {/if}
+                                </div>
+                                <div class="content">
+                                    <div class="headline truncate">{$recommendation.productGroup.name} - {$recommendation.name}</div>
+                                    <div class="tagline truncate">
+                                        {if empty($recommendation.tagline)}
+                                            {lang key="recommendations.taglinePlaceholder"}
+                                        {else}
+                                            {$recommendation.tagline}
+                                        {/if}
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="body clearfix">
+                                <p>{$recommendation.shortDescription}</p>
+                            </div>
+                        </div>
+                    {/foreach}
+                {/foreach}
+            {/foreach}
+        {/if}
+    </div>
+</div>

orderforms/standard_cart/index.php

@@ -0,0 +1,2 @@
+<?php
+header("Location: ../../../index.php");

orderforms/standard_cart/linkedaccounts.tpl

@@ -0,0 +1,95 @@
+{if ($linkableProviders || $hasLinkedProvidersEnabled) && $linkContext == 'linktable'}
+    <table id="tableLinkedAccounts" class="table display data-driven"
+           data-ajax-url="{$linkedAccountsUrl}"
+           data-on-draw-rebind-confirmation-modal="true"
+           data-lang-empty-table="{lang key='remoteAuthn.noLinkedAccounts'}"
+    >
+        <thead>
+            <tr class="text-center">
+                <th>{lang key='remoteAuthn.provider'}</th>
+                <th>{lang key='remoteAuthn.name'}</th>
+                <th>{lang key='remoteAuthn.emailAddress'}</th>
+                <th>{lang key='remoteAuthn.actions'}</th>
+            </tr>
+        </thead>
+        <tbody>
+            <tr>
+                <td colspan="4" class="text-center">{lang key='remoteAuthn.noLinkedAccounts'}</td>
+            </tr>
+        </tbody>
+    </table>
+{elseif $linkableProviders}
+
+    <div id="providerLinkingMessages" class="w-hidden">
+        <p class="providerLinkingMsg-preLink-init_failed">
+            <span class="provider-name"></span> {lang key='remoteAuthn.unavailable'}
+        </p>
+        <p class="providerLinkingMsg-preLink-connect_error">
+            <strong>{lang key='remoteAuthn.error'}</strong> {lang key='remoteAuthn.connectError'}
+        </p>
+        <p class="providerLinkingMsg-preLink-complete_sign_in">
+            {lang key='remoteAuthn.completeSignIn'}
+        </p>
+        <p class="providerLinkingMsg-preLink-2fa_needed">
+            {lang key='remoteAuthn.redirecting'}
+        </p>
+        <p class="providerLinkingMsg-preLink-linking_complete">
+            <strong>{lang key='remoteAuthn.success'}</strong> {lang key='remoteAuthn.accountNowLinked'}
+        </p>
+        <p class="providerLinkingMsg-preLink-login_to_link-signin-required">
+            <strong>{lang key='remoteAuthn.linkInitiated'}</strong> {lang key='remoteAuthn.oneTimeAuthRequired'}
+        </p>
+        <p class="providerLinkingMsg-preLink-login_to_link-registration-required">
+            <strong>{lang key='remoteAuthn.linkInitiated'}</strong> {lang key='remoteAuthn.completeRegistrationForm'}
+        </p>
+        <p class="providerLinkingMsg-preLink-checkout-new">
+            <strong>{lang key='remoteAuthn.linkInitiated'}</strong> {lang key='remoteAuthn.completeNewAccountForm'}
+        </p>
+        <p class="providerLinkingMsg-preLink-other_user_exists">
+            <strong>{lang key='remoteAuthn.error'}</strong> {lang key='remoteAuthn.linkedToAnotherClient'}
+        </p>
+        <p class="providerLinkingMsg-preLink-already_linked">
+            <strong>{lang key='remoteAuthn.error'}</strong> {lang key='remoteAuthn.alreadyLinkedToYou'}
+        </p>
+        <p class="providerLinkingMsg-preLink-default">
+            <strong>{lang key='remoteAuthn.error'}</strong> {lang key='remoteAuthn.connectError'}
+        </p>
+    </div>
+
+    {if $linkContext == 'registration'}
+        <div class="sub-heading">
+            <span class="primary-bg-color">{lang key='remoteAuthn.titleSignUpVerb'}</span>
+        </div>
+    {elseif $linkContext == 'checkout-existing'}
+        <div class="sub-heading-borderless">
+            <span class="primary-bg-color">{lang key='remoteAuthn.titleOr'}</span>
+        </div>
+        <p class="small text-center text-muted">{lang key='remoteAuthn.saveTimeByLinking'}</p>
+    {elseif $linkContext == 'checkout-new'}
+        <div class="sub-heading">
+            <span class="primary-bg-color">{lang key='remoteAuthn.titleSignUpVerb'}</span>
+        </div>
+        <p class="small text-center text-muted">{lang key='remoteAuthn.saveTimeByLinking'}</p>
+    {elseif $linkContext == 'clientsecurity'}
+        <p>{lang key='remoteAuthn.mayHaveMultipleLinks'}</p>
+    {/if}
+
+    <div class="providerPreLinking" data-link-context="{$linkContext}"
+         data-hide-on-prelink={if in_array($linkContext, ['clientsecurity','login'])}0{else}1{/if}
+         data-disable-on-prelink=0>
+        <div class="social-signin-btns">
+            {foreach $linkableProviders as $provider }
+                {if in_array($linkContext, ['checkout-existing'])}
+                    {$provider.login_button}
+                {else}
+                    {$provider.code}
+                {/if}
+            {/foreach}
+        </div>
+    </div>
+
+    {if !isset($customFeedback) || !$customFeedback}
+        <div class="providerLinkingFeedback"></div>
+    {/if}
+
+{/if}

orderforms/standard_cart/marketconnect-promo.tpl

@@ -0,0 +1,43 @@
+<div class="mc-promo {$promotion->getClass()}" id="promo_{$product->productKey}">
+    <div class="header">
+        <div class="cta">
+            <div class="price">
+                {if $product->isFree()}
+                    {lang key="orderfree"}
+                {elseif $product->pricing()->first()}
+                    {$product->pricing()->setQuantity($cartItem.qty)->first()->breakdownPrice()}
+                {/if}
+            </div>
+            <button type="button" class="btn btn-sm btn-add" data-product-key="{$product->productKey}">
+                <span class="text">
+                    {lang key="addtocart"}
+                </span>
+                <span class="arrow">
+                    <i class="fas fa-chevron-right"></i>
+                </span>
+            </button>
+        </div>
+        <div class="expander">
+            <i class="fas fa-chevron-right rotate" data-toggle="tooltip" data-placement="right" title="Click to learn more"></i>
+        </div>
+        <div class="icon">
+            <img src="{$promotion->getImagePath()}">
+        </div>
+        <div class="content">
+            <div class="headline truncate">{$promotion->getHeadline()}</div>
+            <div class="tagline truncate">{$promotion->getTagline()}</div>
+        </div>
+    </div>
+    <div class="body clearfix">
+        {if $promotion->hasFeatures()}
+            <ul>
+                {assign "promotionFeatures" $promotion->getFeatures()}
+                {foreach $promotionFeatures as $key=>$feature}
+                    <li class="{if $key < ($promotionFeatures|@count / 2)}left{else}right{/if}">
+                        <i class="fas fa-check"></i> {$feature}
+                    </li>
+                {/foreach}
+            </ul>
+        {/if}
+    </div>
+</div>

orderforms/standard_cart/ordersummary.tpl

@@ -0,0 +1,179 @@
+{if $producttotals}
+    <span class="product-name">{if $producttotals.allowqty && $producttotals.qty > 1}{$producttotals.qty} x {/if}{$producttotals.productinfo.name}</span>
+    <span class="product-group">{$producttotals.productinfo.groupname}</span>
+
+    <div class="clearfix">
+        <span class="pull-left float-left">{$producttotals.productinfo.name}</span>
+        <span class="pull-right float-right">{$producttotals.pricing.baseprice}</span>
+    </div>
+
+    {foreach $producttotals.configoptions as $configoption}
+        {if $configoption}
+            <div class="clearfix">
+                <span class="pull-left float-left">&nbsp;&raquo; {$configoption.name}: {$configoption.optionname}</span>
+                <span class="pull-right float-right">{$configoption.recurring}{if $configoption.setup} + {$configoption.setup} {$LANG.ordersetupfee}{/if}</span>
+            </div>
+        {/if}
+    {/foreach}
+
+    {foreach $producttotals.addons as $addon}
+        <div class="clearfix">
+            <span class="pull-left float-left">+ {$addon.name}</span>
+            <span class="pull-right float-right">{$addon.recurring}</span>
+        </div>
+    {/foreach}
+
+    {if $producttotals.pricing.setup || $producttotals.pricing.recurring || $producttotals.pricing.addons}
+        <div class="summary-totals">
+            {if $producttotals.pricing.setup}
+                <div class="clearfix">
+                    <span class="pull-left float-left">{$LANG.cartsetupfees}:</span>
+                    <span class="pull-right float-right">{$producttotals.pricing.setup}</span>
+                </div>
+            {/if}
+            {foreach from=$producttotals.pricing.recurringexcltax key=cycle item=recurring}
+                <div class="clearfix">
+                    <span class="pull-left float-left">{$cycle}:</span>
+                    <span class="pull-right float-right">{$recurring}</span>
+                </div>
+            {/foreach}
+            {if $producttotals.pricing.tax1}
+                <div class="clearfix">
+                    <span class="pull-left float-left">{$carttotals.taxname} @ {$carttotals.taxrate}%:</span>
+                    <span class="pull-right float-right">{$producttotals.pricing.tax1}</span>
+                </div>
+            {/if}
+            {if $producttotals.pricing.tax2}
+                <div class="clearfix">
+                    <span class="pull-left float-left">{$carttotals.taxname2} @ {$carttotals.taxrate2}%:</span>
+                    <span class="pull-right float-right">{$producttotals.pricing.tax2}</span>
+                </div>
+            {/if}
+        </div>
+    {/if}
+
+    <div class="total-due-today">
+        <span class="amt">{$producttotals.pricing.totaltoday}</span>
+        <span>{$LANG.ordertotalduetoday}</span>
+    </div>
+{elseif !empty($renewals) || !empty($serviceRenewals)}
+    {if !empty($serviceRenewals)}
+        {if !empty($carttotals.renewalsByType.services)}
+            <span class="product-name">{lang key='renewService.titleAltPlural'}</span>
+            {foreach $carttotals.renewalsByType.services as $serviceId => $serviceRenewal}
+                <div class="clearfix" id="cartServiceRenewal{$serviceId}">
+                    <div class="pull-left float-left">
+                        <div>
+                            {$serviceRenewal.name}
+                        </div>
+                        <div>
+                            {$serviceRenewal.domainName}
+                        </div>
+                    </div>
+                    <div class="pull-right float-right">
+                        <div>
+                            {$serviceRenewal.billingCycle}
+                        </div>
+                        <div>
+                            {$serviceRenewal.recurringBeforeTax}
+                            <a onclick="removeItem('r','{$serviceId}','service'); return false;" href="#" id="linkCartRemoveServiceRenewal{$serviceId}">
+                                <i class="fas fa-fw fa-trash-alt"></i>
+                            </a>
+                        </div>
+                    </div>
+                </div>
+            {/foreach}
+        {/if}
+        {if !empty($carttotals.renewalsByType.addons)}
+            <span class="product-name">{lang key='renewServiceAddon.titleAltPlural'}</span>
+            {foreach $carttotals.renewalsByType.addons as $serviceAddonId => $serviceAddonRenewal}
+                <div class="clearfix" id="cartServiceAddonRenewal{$serviceAddonId}">
+                    <div class="pull-left float-left">
+                        <div>
+                            {$serviceAddonRenewal.name}
+                        </div>
+                        <div>
+                            {$serviceAddonRenewal.domainName}
+                        </div>
+                    </div>
+                    <div class="pull-right float-right">
+                        <div>
+                            {$serviceAddonRenewal.billingCycle}
+                        </div>
+                        <div>
+                            {$serviceAddonRenewal.recurringBeforeTax}
+                            <a onclick="removeItem('r','{$serviceAddonId}','addon'); return false;" href="#" id="linkCartRemoveServiceAddonRenewal{$serviceAddonId}">
+                                <i class="fas fa-fw fa-trash-alt"></i>
+                            </a>
+                        </div>
+                    </div>
+                </div>
+            {/foreach}
+        {/if}
+    {elseif !empty($renewals) && !empty($carttotals.renewalsByType.domains)}
+        <span class="product-name">{lang key='domainrenewals'}</span>
+        {foreach $carttotals.renewalsByType.domains as $domainId => $renewal}
+            <div class="clearfix" id="cartDomainRenewal{$domainId}">
+                <span class="pull-left float-left">
+                    {$renewal.domain} - {$renewal.regperiod} {if $renewal.regperiod == 1}{lang key='orderForm.year'}{else}{lang key='orderForm.years'}{/if}
+                </span>
+                <span class="pull-right float-right">
+                    {$renewal.priceBeforeTax}
+                    <a onclick="removeItem('r','{$domainId}','domain'); return false;" href="#" id="linkCartRemoveDomainRenewal{$domainId}">
+                        <i class="fas fa-fw fa-trash-alt"></i>
+                    </a>
+                </span>
+            </div>
+            {if $renewal.dnsmanagement}
+                <div class="clearfix">
+                    <span class="pull-left float-left">+ {lang key='domaindnsmanagement'}</span>
+                </div>
+            {/if}
+            {if $renewal.emailforwarding}
+                <div class="clearfix">
+                    <span class="pull-left float-left">+ {lang key='domainemailforwarding'}</span>
+                </div>
+            {/if}
+            {if $renewal.idprotection}
+                <div class="clearfix">
+                    <span class="pull-left float-left">+ {lang key='domainidprotection'}</span>
+                </div>
+            {/if}
+            {if $renewal.hasGracePeriodFee}
+                <div class="clearfix">
+                    <span class="pull-left float-left">+ {lang key='domainRenewal.graceFee'}</span>
+                </div>
+            {/if}
+            {if $renewal.hasRedemptionGracePeriodFee}
+                <div class="clearfix">
+                    <span class="pull-left float-left">+ {lang key='domainRenewal.redemptionFee'}</span>
+                </div>
+            {/if}
+
+        {/foreach}
+    {/if}
+    <div class="summary-totals">
+        <div class="clearfix">
+            <span class="pull-left float-left">{lang key='ordersubtotal'}:</span>
+            <span class="pull-right float-right">{$carttotals.subtotal}</span>
+        </div>
+        {if ($carttotals.taxrate && $carttotals.taxtotal) || ($carttotals.taxrate2 && $carttotals.taxtotal2)}
+            {if $carttotals.taxrate}
+                <div class="clearfix">
+                    <span class="pull-left float-left">{$carttotals.taxname} @ {$carttotals.taxrate}%:</span>
+                    <span class="pull-right float-right">{$carttotals.taxtotal}</span>
+                </div>
+            {/if}
+            {if $carttotals.taxrate2}
+                <div class="clearfix">
+                    <span class="pull-left float-left">{$carttotals.taxname2} @ {$carttotals.taxrate2}%:</span>
+                    <span class="pull-right float-right">{$carttotals.taxtotal2}</span>
+                </div>
+            {/if}
+        {/if}
+    </div>
+    <div class="total-due-today">
+        <span class="amt">{$carttotals.total}</span>
+        <span>{lang key='ordertotalduetoday'}</span>
+    </div>
+{/if}

orderforms/standard_cart/products.tpl

@@ -0,0 +1,114 @@
+{include file="orderforms/standard_cart/common.tpl"}
+
+<div id="order-standard_cart">
+    <div class="row">
+        <div class="cart-sidebar sidebar">
+            {include file="orderforms/standard_cart/sidebar-categories.tpl"}
+        </div>
+        <div class="cart-body">
+
+            <div class="header-lined">
+                <h1 class="font-size-36">
+                    {if $productGroup.headline}
+                        {$productGroup.headline}
+                    {else}
+                        {$productGroup.name}
+                    {/if}
+                </h1>
+                {if $productGroup.tagline}
+                    <p>{$productGroup.tagline}</p>
+                {/if}
+            </div>
+            {if $errormessage}
+                <div class="alert alert-danger">
+                    {$errormessage}
+                </div>
+            {elseif !$productGroup}
+                <div class="alert alert-info">
+                    {lang key='orderForm.selectCategory'}
+                </div>
+            {/if}
+
+            {include file="orderforms/standard_cart/sidebar-categories-collapsed.tpl"}
+
+            <div class="products" id="products">
+                <div class="row row-eq-height">
+                    {foreach $products as $key => $product}
+                        {$idPrefix = ($product.bid) ? ("bundle"|cat:$product.bid) : ("product"|cat:$product.pid)}
+                    <div class="col-md-6">
+                        <div class="product clearfix" id="{$idPrefix}">
+                            <header>
+                                <span id="{$idPrefix}-name">{$product.name}</span>
+                                {if $product.stockControlEnabled}
+                                    <span class="qty">
+                                            {$product.qty} {$LANG.orderavailable}
+                                        </span>
+                                {/if}
+                            </header>
+                            <div class="product-desc">
+                                {if $product.featuresdesc}
+                                    <p id="{$idPrefix}-description">
+                                        {$product.featuresdesc}
+                                    </p>
+                                {/if}
+                                <ul>
+                                    {foreach $product.features as $feature => $value}
+                                        <li id="{$idPrefix}-feature{$value@iteration}">
+                                            <span class="feature-value">{$value}</span>
+                                            {$feature}
+                                        </li>
+                                    {/foreach}
+                                </ul>
+                            </div>
+                            <footer>
+                                <div class="product-pricing" id="{$idPrefix}-price">
+                                    {if $product.bid}
+                                        {$LANG.bundledeal}<br />
+                                        {if $product.displayprice}
+                                            <span class="price">{$product.displayprice}</span>
+                                        {/if}
+                                    {else}
+                                        {if $product.pricing.hasconfigoptions}
+                                            {$LANG.startingfrom}
+                                            <br />
+                                        {/if}
+                                        <span class="price">{$product.pricing.minprice.price}</span>
+                                        <br />
+                                        {if $product.pricing.minprice.cycle eq "monthly"}
+                                            {$LANG.orderpaymenttermmonthly}
+                                        {elseif $product.pricing.minprice.cycle eq "quarterly"}
+                                            {$LANG.orderpaymenttermquarterly}
+                                        {elseif $product.pricing.minprice.cycle eq "semiannually"}
+                                            {$LANG.orderpaymenttermsemiannually}
+                                        {elseif $product.pricing.minprice.cycle eq "annually"}
+                                            {$LANG.orderpaymenttermannually}
+                                        {elseif $product.pricing.minprice.cycle eq "biennially"}
+                                            {$LANG.orderpaymenttermbiennially}
+                                        {elseif $product.pricing.minprice.cycle eq "triennially"}
+                                            {$LANG.orderpaymenttermtriennially}
+                                        {/if}
+                                        <br>
+                                        {if $product.pricing.minprice.setupFee}
+                                            <small>{$product.pricing.minprice.setupFee->toPrefixed()} {$LANG.ordersetupfee}</small>
+                                        {/if}
+                                    {/if}
+                                </div>
+                                <a href="{$product.productUrl}" class="btn btn-success btn-sm btn-order-now" id="{$idPrefix}-order-button"{if $product.hasRecommendations} data-has-recommendations="1"{/if}>
+                                    <i class="fas fa-shopping-cart"></i>
+                                    {$LANG.ordernowbutton}
+                                </a>
+                            </footer>
+                        </div>
+                    </div>
+                    {if $product@iteration % 2 == 0}
+                </div>
+                <div class="row row-eq-height">
+                    {/if}
+                    {/foreach}
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+{include file="orderforms/standard_cart/recommendations-modal.tpl"}

orderforms/standard_cart/recommendations-modal.tpl

@@ -0,0 +1,53 @@
+{if in_array($templatefile, ['configureproductdomain', 'configureproduct'])}
+<div class="hidden" id="divProductHasRecommendations" data-value="{$productinfo.hasRecommendations}"></div>
+{/if}
+<div class="modal fade" id="recommendationsModal" tabindex="-1" role="dialog">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h4 class="float-left pull-left">
+                    {if in_array($templatefile, ['viewcart', 'complete', 'checkout'])}
+                        {lang key="recommendations.title.generic"}
+                    {else}
+                        {lang key="recommendations.title.addedTo"}
+                    {/if}
+                </h4>
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+                <div class="clearfix"></div>
+            </div>
+            <div class="modal-body">
+                {include file="orderforms/standard_cart/includes/product-recommendations.tpl"}
+            </div>
+            <div class="modal-footer">
+                <a class="btn btn-primary" href="#" id="btnContinueRecommendationsModal" data-dismiss="modal" role="button">
+                    <span class="w-hidden hidden"><i class="fas fa-spinner fa-spin"></i>&nbsp;</span>{lang key="continue"}
+                </a>
+            </div>
+        </div>
+    </div>
+    <div class="product-recommendation clonable w-hidden hidden">
+        <div class="header">
+            <div class="cta">
+                <div class="price">
+                    <span class="w-hidden hidden">{lang key="orderfree"}</span>
+                    <span class="breakdown-price"></span>
+                    <span class="setup-fee"><small>&nbsp;{lang key="ordersetupfee"}</small></span>
+                </div>
+                <button type="button" class="btn btn-sm btn-add">
+                    <span class="text">{lang key="addtocart"}</span>
+                    <span class="arrow"><i class="fas fa-chevron-right"></i></span>
+                </button>
+            </div>
+            <div class="expander">
+                <i class="fas fa-chevron-right rotate" data-toggle="tooltip" data-placement="right" title="{lang key="recommendations.learnMore"}"></i>
+            </div>
+            <div class="content">
+                <div class="headline truncate"></div>
+                <div class="tagline truncate">
+                    {lang key="recommendations.taglinePlaceholder"}
+                </div>
+            </div>
+        </div>
+        <div class="body clearfix"><p></p></div>
+    </div>
+</div>

orderforms/standard_cart/service-renewal-item.tpl

@@ -0,0 +1,70 @@
+{foreach $renewableItems as $renewableItem}
+    <div class="service-renewal"
+         data-product-name="{$renewableItem.product->name}"
+         data-service-id="{$renewableItem.serviceId}"
+         data-service-domain="{$renewableItem.domain}"
+         {if $renewableItem.renewable === false}style="display: none;" data-is-renewable="false" {else}data-is-renewable="true"{/if}
+    >
+        <div class="pull-right float-right">
+            {if $renewableItem.renewable === false}
+                <span class="label label-info">
+                    {lang key='renewService.renewalUnavailable'}
+                </span>
+            {else}
+                <span class="label label-warning">
+                    {lang key='renewService.renewingIn' days=$renewableItem.nextDueDate->diffInDays()}
+                </span>
+            {/if}
+        </div>
+        <h3 class="font-size-24">
+            {$renewableItem.product->name}
+        </h3>
+        <h4 class="font-size-22">
+            {$renewableItem.domain}
+        </h4>
+        <p>
+            {if is_null($renewableItem.nextDueDate)}
+                {lang key='renewService.serviceNextDueDateBasic' nextDueDate={lang key='na'}}
+            {else}
+                {lang key='renewService.serviceNextDueDateExtended' nextDueDate=$renewableItem.nextDueDate->toClientDateFormat() nextDueDateFormatted=$renewableItem.nextDueDate->diffForHumans()}
+            {/if}
+        </p>
+        <div class="clearfix">
+            <div class="pull-left float-left">
+                {if $renewableItem.renewable === false}
+                    <div class="div-renewal-ineligible">
+                        <i class="fas fa-info-circle"></i>{$renewableItem.reason}
+                    </div>
+                {else}
+                    <div class="div-renewal-period-label">
+                        {lang key='renewService.renewalPeriodLabel'}
+                    </div>
+                    <div>
+                        {lang key='renewService.renewalPeriod' nextDueDate=$renewableItem.nextDueDate->toClientDateFormat() nextPayUntilDate=$renewableItem.nextPayUntilDate->toClientDateFormat() renewalPrice=$renewableItem.price}
+                    </div>
+                {/if}
+            </div>
+            {if $renewableItem.renewable === true}
+                <button id="renewService{$renewableItem.serviceId}" class="btn btn-default btn-add-renewal-to-cart pull-right float-right" data-service-id="{$prefix}{$renewableItem.serviceId}">
+                    <span class="to-add">
+                        <i class="fas fa-fw fa-spinner fa-spin"></i>
+                        {lang key='addtocart'}
+                    </span>
+                    <span class="added">
+                        {lang key='domaincheckeradded'}
+                    </span>
+                </button>
+            {/if}
+        </div>
+        {if !empty($renewableItem.addons)}
+            <div class="addon-renewals"
+                 {if $renewableItem.renewableCount <= 0}style="display: none;" data-is-renewable="false" {else}data-is-renewable="true"{/if}
+            >
+                <h4 class="font-size-22">Addons</h4>
+                <div>
+                    {include file="orderforms/standard_cart/service-renewal-item.tpl" renewableItems=$renewableItem.addons prefix='a-'}
+                </div>
+            </div>
+        {/if}
+    </div>
+{/foreach}

orderforms/standard_cart/service-renewals.tpl

@@ -0,0 +1,110 @@
+{include file="orderforms/standard_cart/common.tpl"}
+<div id="order-standard_cart">
+    <div class="row">
+        <div class="cart-sidebar">
+            {include file="orderforms/standard_cart/sidebar-categories.tpl"}
+        </div>
+        <div class="cart-body">
+            <div class="header-lined row">
+                <div class="col-md-6">
+                    <h1 class="font-size-36">
+                        {if $totalResults > 1}
+                            {lang key='renewService.titlePlural'}
+                        {else}
+                            {lang key='renewService.titleSingular'}
+                        {/if}
+                    </h1>
+                </div>
+                <div class="col-md-6">
+                    <button id="hideShowServiceRenewalButton" class="btn btn-sm btn-default service-renewals-quick-filter">
+                        <span class="to-hide">
+                            {lang key='renewService.hideShowServices.hide'}
+                        </span>
+                        <span class="to-show">
+                            {lang key='renewService.hideShowServices.show'}
+                        </span>
+                    </button>
+                    {if $totalResults > 5}
+                        <input id="serviceRenewalFilter" type="search" class="service-renewals-filter form-control" placeholder="{lang key='renewService.searchPlaceholder'}">
+                    {/if}
+                </div>
+            </div>
+            {include file="orderforms/standard_cart/sidebar-categories-collapsed.tpl"}
+            {if $totalServiceCount == 0}
+                <div id="no-services" class="alert alert-warning text-center" role="alert">
+                    {lang key='renewService.noServices'}
+                </div>
+                <p class="text-center">
+                    <a href="" class="btn btn-default">
+                        <i class="fas fa-arrow-circle-left"></i>
+                        {lang key='orderForm.returnToClientArea'}
+                    </a>
+                </p>
+            {else}
+                <div class="row">
+                    <div class="secondary-cart-body">
+                        {if $totalResults < $totalServiceCount}
+                            <div class="text-center">
+                                {lang key='renewService.showingServices' showing=$totalResults totalCount=$totalServiceCount}
+                                <a id="linkShowAll" href="{routePath('service-renewals')}">
+                                    {lang key='domainRenewal.showAll'}
+                                </a>
+                            </div>
+                        {/if}
+                        <div id="serviceRenewals" class="service-renewals">
+                            {include file="orderforms/standard_cart/service-renewal-item.tpl" renewableItems=$renewableServices prefix=''}
+                        </div>
+                    </div>
+                    <div class="secondary-cart-sidebar" id="scrollingPanelContainer">
+                        <div id="orderSummary">
+                            <div class="order-summary">
+                                <div class="loader" id="orderSummaryLoader">
+                                    <i class="fas fa-fw fa-sync fa-spin"></i>
+                                </div>
+                                <h2 class="font-size-30">
+                                    {lang key='ordersummary'}
+                                </h2>
+                                <div class="summary-container" id="producttotal"></div>
+                            </div>
+                            <div class="text-center">
+                                <a id="btnGoToCart" class="btn btn-primary btn-lg" href="{$WEB_ROOT}/cart.php?a=view">
+                                    {lang key='viewcart'}
+                                    <i class="far fa-shopping-cart"></i>
+                                </a>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            {/if}
+        </div>
+    </div>
+    <form id="removeRenewalForm" method="post" action="{$WEB_ROOT}/cart.php" data-renew-type="service">
+        <input type="hidden" name="a" value="remove">
+        <input type="hidden" name="r" value="" id="inputRemoveItemType">
+        <input type="hidden" name="i" value="" id="inputRemoveItemRef">
+        <input type="hidden" name="rt" value="service" id="inputRemoveItemRenewalType">
+        <div class="modal fade modal-remove-item" id="modalRemoveItem" tabindex="-1" role="dialog">
+            <div class="modal-dialog" role="document">
+                <div class="modal-content">
+                    <div class="modal-header d-block">
+                        <h4 class="modal-title">
+                            <button type="button" class="close" data-dismiss="modal" aria-label="{lang key='orderForm.close'}">
+                                <span aria-hidden="true">&times;</span>
+                            </button>
+                            <i class="fas fa-times fa-3x"></i>
+                            <span>{lang key='orderForm.removeItem'}</span>
+                        </h4>
+                    </div>
+                    <div class="modal-body">
+                        {lang key='cartremoveitemconfirm'}
+                    </div>
+                    <div class="modal-footer d-block">
+                        <button type="button" class="btn btn-default" data-dismiss="modal">{lang key='no'}</button>
+                        <button type="submit" class="btn btn-primary">{lang key='yes'}</button>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </form>
+</div>
+<script>recalculateRenewalTotals();</script>

orderforms/standard_cart/sidebar-categories-collapsed.tpl

@@ -0,0 +1,22 @@
+<div class="sidebar-collapsed">
+
+    {foreach $secondarySidebar as $panel}
+        <div class="panel card{if $panel->getClass()}{$panel->getClass()}{else} panel-default{/if}">
+            {include file="orderforms/standard_cart/sidebar-categories-selector.tpl"}
+        </div>
+    {/foreach}
+
+    {if !$loggedin && $currencies}
+        <div class="pull-right form-inline float-right">
+            <form method="post" action="{$WEB_ROOT}/cart.php{if $action}?a={$action}{if $domain}&domain={$domain}{/if}{elseif $gid}?gid={$gid}{/if}">
+                <select name="currency" onchange="submit()" class="form-control">
+                    <option value="">{$LANG.choosecurrency}</option>
+                    {foreach from=$currencies item=listcurr}
+                        <option value="{$listcurr.id}"{if $listcurr.id == $activeCurrency.id} selected{/if}>{$listcurr.code}</option>
+                    {/foreach}
+                </select>
+            </form>
+        </div>
+    {/if}
+
+</div>

orderforms/standard_cart/sidebar-categories-selector.tpl

@@ -0,0 +1,44 @@
+{if $panel}
+    <div class="m-0 panel-heading card-header">
+        <h3 class="panel-title">
+            {if $panel->hasIcon()}
+                <i class="{$panel->getIcon()}"></i>&nbsp;
+            {/if}
+
+            {$panel->getLabel()}
+
+            {if $panel->hasBadge()}
+                &nbsp;<span class="badge">{$panel->getBadge()}</span>
+            {/if}
+        </h3>
+    </div>
+
+    <div class="panel-body card-body">
+        <form role="form">
+            <select class="form-control custom-select" onchange="selectChangeNavigate(this)">
+                {assign var='hasCurrent' value=false}
+                {foreach $panel->getChildren() as $child}
+                    <option menuItemName="{$child->getName()}" value="{$child->getUri()}" class="list-group-item" {if $child->isCurrent()}selected="selected"{/if}>
+                        {$child->getLabel()}
+
+                        {if $child->hasBadge()}
+                            ({$child->getBadge()})
+                        {/if}
+                    </option>
+                    {if !$hasCurrent and $child->isCurrent()}
+                        {assign var='hasCurrent' value=true}
+                    {/if}
+                {/foreach}
+                {if !$hasCurrent}
+                    <option value="" class="list-group-item" selected=""selected>- {lang key="cartchooseanothercategory"} -</option>
+                {/if}
+            </select>
+        </form>
+    </div>
+
+    {if $panel->hasFooterHtml()}
+        <div class="panel-footer card-footer">
+            {$panel->getFooterHtml()}
+        </div>
+    {/if}
+{/if}

orderforms/standard_cart/sidebar-categories.tpl

@@ -0,0 +1,70 @@
+{foreach $secondarySidebar as $panel}
+    <div menuItemName="{$panel->getName()}" class="panel card card-sidebar mb-3 {if $panel->getClass()}{$panel->getClass()}{else}panel-sidebar{/if}{if $panel->getExtra('mobileSelect') and $panel->hasChildren()} hidden-sm hidden-xs d-none d-md-block{/if}"{if $panel->getAttribute('id')} id="{$panel->getAttribute('id')}"{/if}>
+        <div class="panel-heading card-header">
+            <h3 class="panel-title">
+                {if $panel->hasIcon()}
+                    <i class="{$panel->getIcon()}"></i>&nbsp;
+                {/if}
+
+                {$panel->getLabel()}
+
+                {if $panel->hasBadge()}
+                    &nbsp;<span class="badge">{$panel->getBadge()}</span>
+                {/if}
+
+                <i class="fas fa-chevron-up card-minimise panel-minimise pull-right float-right"></i>
+            </h3>
+        </div>
+
+        {if $panel->hasBodyHtml()}
+            <div class="panel-body card-body collapsable-card-body">
+                {$panel->getBodyHtml()}
+            </div>
+        {/if}
+
+        {if $panel->hasChildren()}
+            <div class="list-group collapsable-card-body{if $panel->getChildrenAttribute('class')} {$panel->getChildrenAttribute('class')}{/if}">
+                {foreach $panel->getChildren() as $child}
+                    {if $child->getUri()}
+                        <a menuItemName="{$child->getName()}" href="{$child->getUri()}" class="list-group-item list-group-item-action{if $child->isDisabled()} disabled{/if}{if $child->getClass()} {$child->getClass()}{/if}{if $child->isCurrent()} active{/if}"{if $child->getAttribute('dataToggleTab')} data-toggle="tab"{/if}{if $child->getAttribute('target')} target="{$child->getAttribute('target')}"{/if} id="{$child->getId()}">
+                            {if $child->hasIcon()}
+                                <i class="{$child->getIcon()}"></i>&nbsp;
+                            {/if}
+
+                            {$child->getLabel()}
+
+                            {if $child->hasBadge()}
+                                &nbsp;<span class="badge">{$child->getBadge()}</span>
+                            {/if}
+                        </a>
+                    {else}
+                        <div menuItemName="{$child->getName()}" class="list-group-item{if $child->getClass()} {$child->getClass()}{/if}" id="{$child->getId()}">
+                            {if $child->hasIcon()}
+                                <i class="{$child->getIcon()}"></i>&nbsp;
+                            {/if}
+
+                            {$child->getLabel()}
+
+                            {if $child->hasBadge()}
+                                &nbsp;<span class="badge">{$child->getBadge()}</span>
+                            {/if}
+                        </div>
+                    {/if}
+                {/foreach}
+            </div>
+        {/if}
+
+        {if $panel->hasFooterHtml()}
+            <div class="panel-footer card-footer clearfix">
+                {$panel->getFooterHtml()}
+            </div>
+        {/if}
+    </div>
+
+    {if $panel->getExtra('mobileSelect') and $panel->hasChildren()}
+        {* Mobile Select only supports dropdown menus *}
+        <div class="panel card hidden-lg hidden-md d-md-none{if $panel->getClass()}{$panel->getClass()}{else} panel-default{/if}"{if $panel->getAttribute('id')} id="{$panel->getAttribute('id')}"{/if}>
+            {include file="orderforms/standard_cart/sidebar-categories-selector.tpl"}
+        </div>
+    {/if}
+{/foreach}

orderforms/standard_cart/theme.yaml

@@ -0,0 +1,4 @@
+dependencies:
+  bootstrap: 3||4
+  jquery: 1.12
+  fontawesome: 5

orderforms/standard_cart/viewcart.tpl

@@ -0,0 +1,678 @@
+{if $checkout}
+
+    {include file="orderforms/$carttpl/checkout.tpl"}
+
+{else}
+
+    <script>
+        // Define state tab index value
+        var statesTab = 10;
+        var stateNotRequired = true;
+    </script>
+    {include file="orderforms/standard_cart/common.tpl"}
+    <script type="text/javascript" src="{$BASE_PATH_JS}/StatesDropdown.js"></script>
+
+    <div id="order-standard_cart">
+
+        <div class="row">
+            <div class="cart-sidebar">
+
+                {include file="orderforms/standard_cart/sidebar-categories.tpl"}
+
+            </div>
+            <div class="cart-body">
+                <div class="header-lined">
+                    <h1 class="font-size-36">{$LANG.cartreviewcheckout}</h1>
+                </div>
+
+                {include file="orderforms/standard_cart/sidebar-categories-collapsed.tpl"}
+
+                <div class="row">
+                    <div class="secondary-cart-body">
+
+                        {if $promoerrormessage}
+                            <div class="alert alert-warning text-center" role="alert">
+                                {$promoerrormessage}
+                            </div>
+                        {elseif $errormessage}
+                            <div class="alert alert-danger" role="alert">
+                                <p>{$LANG.orderForm.correctErrors}:</p>
+                                <ul>
+                                    {$errormessage}
+                                </ul>
+                            </div>
+                        {elseif $promotioncode && $rawdiscount eq "0.00"}
+                            <div class="alert alert-info text-center" role="alert">
+                                {$LANG.promoappliedbutnodiscount}
+                            </div>
+                        {elseif $promoaddedsuccess}
+                            <div class="alert alert-success text-center" role="alert">
+                                {$LANG.orderForm.promotionAccepted}
+                            </div>
+                        {/if}
+
+                        {if $bundlewarnings}
+                            <div class="alert alert-warning" role="alert">
+                                <strong>{$LANG.bundlereqsnotmet}</strong><br />
+                                <ul>
+                                    {foreach from=$bundlewarnings item=warning}
+                                        <li>{$warning}</li>
+                                    {/foreach}
+                                </ul>
+                            </div>
+                        {/if}
+
+                        <form method="post" action="{$smarty.server.PHP_SELF}?a=view">
+
+                            <div class="view-cart-items-header">
+                                <div class="row">
+                                    <div class="{if $showqtyoptions}col-sm-5{else}col-sm-7{/if} col-xs-7 col-7">
+                                        {$LANG.orderForm.productOptions}
+                                    </div>
+                                    {if $showqtyoptions}
+                                        <div class="col-sm-2 hidden-xs text-center d-none d-sm-block">
+                                            {$LANG.orderForm.qty}
+                                        </div>
+                                    {/if}
+                                    <div class="col-sm-4 col-xs-5 col-5 text-right">
+                                        {$LANG.orderForm.priceCycle}
+                                    </div>
+                                </div>
+                            </div>
+                            <div class="view-cart-items">
+
+                                {foreach $products as $num => $product}
+                                    <div class="item">
+                                        <div class="row">
+                                            <div class="{if $showqtyoptions}col-sm-5{else}col-sm-7{/if}">
+                                                <span class="item-title">
+                                                    {$product.productinfo.name}
+                                                    <a href="{$WEB_ROOT}/cart.php?a=confproduct&i={$num}" class="btn btn-link btn-xs">
+                                                        <i class="fas fa-pencil-alt"></i>
+                                                        {$LANG.orderForm.edit}
+                                                    </a>
+                                                    <span class="visible-xs-inline d-inline d-sm-none">
+                                                        <button type="button" class="btn btn-link btn-xs btn-remove-from-cart" onclick="removeItem('p','{$num}')">
+                                                            <i class="fas fa-times"></i>
+                                                            {$LANG.orderForm.remove}
+                                                        </button>
+                                                    </span>
+                                                </span>
+                                                <span class="item-group">
+                                                    {$product.productinfo.groupname}
+                                                </span>
+                                                {if $product.domain}
+                                                    <span class="item-domain">
+                                                        {$product.domain}
+                                                    </span>
+                                                {/if}
+                                                {if $product.configoptions}
+                                                    <small>
+                                                        {foreach key=confnum item=configoption from=$product.configoptions}
+                                                            &nbsp;&raquo; {$configoption.name}: {if $configoption.type eq 1 || $configoption.type eq 2}{$configoption.option}{elseif $configoption.type eq 3}{if $configoption.qty}{$configoption.option}{else}{$LANG.no}{/if}{elseif $configoption.type eq 4}{$configoption.qty} x {$configoption.option}{/if}<br />
+                                                        {/foreach}
+                                                    </small>
+                                                {/if}
+                                            </div>
+                                            {if $showqtyoptions}
+                                                <div class="col-sm-2 item-qty">
+                                                    {if $product.allowqty}
+                                                        <input type="number" name="qty[{$num}]" value="{$product.qty}" class="form-control text-center" min="0" />
+                                                        <button type="submit" class="btn btn-xs">
+                                                            {$LANG.orderForm.update}
+                                                        </button>
+                                                    {/if}
+                                                </div>
+                                            {/if}
+                                            <div class="col-sm-4 item-price">
+                                                <span>{$product.pricing.totalTodayExcludingTaxSetup}</span>
+                                                <span class="cycle">{$product.billingcyclefriendly}</span>
+                                                {if $product.pricing.productonlysetup}
+                                                    {$product.pricing.productonlysetup->toPrefixed()} {$LANG.ordersetupfee}
+                                                {/if}
+                                                {if $product.proratadate}<br />({$LANG.orderprorata} {$product.proratadate}){/if}
+                                            </div>
+                                            <div class="col-sm-1 hidden-xs d-none d-sm-block">
+                                                <button type="button" class="btn btn-link btn-xs btn-remove-from-cart" onclick="removeItem('p','{$num}')">
+                                                    <i class="fas fa-times"></i>
+                                                </button>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    {foreach $product.addons as $addonnum => $addon}
+                                        <div class="item">
+                                            <div class="row">
+                                                <div class="{if $showAddonQtyOptions}col-sm-5{else}col-sm-7{/if}">
+                                                    <span class="item-title">
+                                                        {$addon.name}
+                                                    </span>
+                                                    <span class="item-group">
+                                                        {$LANG.orderaddon}
+                                                    </span>
+                                                </div>
+                                                {if $showAddonQtyOptions}
+                                                    <div class="col-sm-2 item-qty">
+                                                        {if $addon.allowqty === 2}
+                                                            <input type="number" name="paddonqty[{$num}][{$addonnum}]" value="{$addon.qty}" class="form-control text-center" min="0" />
+                                                            <button type="submit" class="btn btn-xs">
+                                                                {$LANG.orderForm.update}
+                                                            </button>
+                                                        {/if}
+                                                    </div>
+                                                {/if}
+                                                <div class="col-sm-4 item-price">
+                                                    <span>{$addon.totaltoday}</span>
+                                                    <span class="cycle">{$addon.billingcyclefriendly}</span>
+                                                    {if $addon.setup}{$addon.setup->toPrefixed()} {$LANG.ordersetupfee}{/if}
+                                                    {if $addon.isProrated}<br />({$LANG.orderprorata} {$addon.prorataDate}){/if}
+                                                </div>
+                                            </div>
+                                        </div>
+                                    {/foreach}
+                                {/foreach}
+
+                                {foreach $addons as $num => $addon}
+                                    <div class="item">
+                                        <div class="row">
+                                            <div class="{if $showAddonQtyOptions}col-sm-5{else}col-sm-7{/if}">
+                                                <span class="item-title">
+                                                    {$addon.name}
+                                                    <span class="visible-xs-inline d-inline d-sm-none">
+                                                        <button type="button" class="btn btn-link btn-xs btn-remove-from-cart" onclick="removeItem('a','{$num}')">
+                                                            <i class="fas fa-times"></i>
+                                                            {$LANG.orderForm.remove}
+                                                        </button>
+                                                    </span>
+                                                </span>
+                                                <span class="item-group">
+                                                    {$addon.productname}
+                                                </span>
+                                                {if $addon.domainname}
+                                                    <span class="item-domain">
+                                                        {$addon.domainname}
+                                                    </span>
+                                                {/if}
+                                            </div>
+                                            {if $showAddonQtyOptions}
+                                                <div class="col-sm-2 item-qty">
+                                                    {if $addon.allowqty === 2}
+                                                        <input type="number" name="addonqty[{$num}]" value="{$addon.qty}" class="form-control text-center" min="0" />
+                                                        <button type="submit" class="btn btn-xs">
+                                                            {$LANG.orderForm.update}
+                                                        </button>
+                                                    {/if}
+                                                </div>
+                                            {/if}
+                                            <div class="col-sm-4 item-price">
+                                                <span>{$addon.totaltoday}</span>
+                                                <span class="cycle">{$addon.billingcyclefriendly}</span>
+                                                {if $addon.setup}{$addon.setup->toPrefixed()} {$LANG.ordersetupfee}{/if}
+                                                {if $addon.isProrated}<br />({$LANG.orderprorata} {$addon.prorataDate}){/if}
+                                            </div>
+                                            <div class="col-sm-1 hidden-xs d-none d-sm-block">
+                                                <button type="button" class="btn btn-link btn-xs btn-remove-from-cart" onclick="removeItem('a','{$num}')">
+                                                    <i class="fas fa-times"></i>
+                                                </button>
+                                            </div>
+                                        </div>
+                                    </div>
+                                {/foreach}
+
+                                {foreach $domains as $num => $domain}
+                                    <div class="item">
+                                        <div class="row">
+                                            <div class="col-sm-7">
+                                                <span class="item-title">
+                                                    {if $domain.type eq "register"}{$LANG.orderdomainregistration}{else}{$LANG.orderdomaintransfer}{/if}
+                                                    <a href="{$WEB_ROOT}/cart.php?a=confdomains" class="btn btn-link btn-xs">
+                                                        <i class="fas fa-pencil-alt"></i>
+                                                        {$LANG.orderForm.edit}
+                                                    </a>
+                                                    <span class="visible-xs-inline d-inline d-sm-none">
+                                                        <button type="button" class="btn btn-link btn-xs btn-remove-from-cart" onclick="removeItem('d','{$num}')">
+                                                            <i class="fas fa-times"></i>
+                                                            {$LANG.orderForm.remove}
+                                                        </button>
+                                                    </span>
+                                                </span>
+                                                {if $domain.domain}
+                                                    <span class="item-domain">
+                                                        {$domain.domain}
+                                                    </span>
+                                                {/if}
+                                                {if $domain.dnsmanagement}&nbsp;&raquo; {$LANG.domaindnsmanagement}<br />{/if}
+                                                {if $domain.emailforwarding}&nbsp;&raquo; {$LANG.domainemailforwarding}<br />{/if}
+                                                {if $domain.idprotection}&nbsp;&raquo; {$LANG.domainidprotection}<br />{/if}
+                                            </div>
+                                            <div class="col-sm-4 item-price">
+                                                {if count($domain.pricing) == 1 || $domain.type == 'transfer'}
+                                                    <span name="{$domain.domain}Price">{$domain.price}</span>
+                                                    <span class="cycle">{$domain.regperiod} {$domain.yearsLanguage}</span>
+                                                    <span class="renewal cycle">
+                                                        {if isset($domain.renewprice)}{lang key='domainrenewalprice'} <span class="renewal-price cycle">{$domain.renewprice->toPrefixed()}{$domain.shortRenewalYearsLanguage}{/if}</span>
+                                                    </span>
+                                                {else}
+                                                    <span name="{$domain.domain}Price">{$domain.price}</span>
+                                                    <div class="dropdown">
+                                                        <button class="btn btn-default btn-default btn-xs dropdown-toggle" type="button" id="{$domain.domain}Pricing" name="{$domain.domain}Pricing" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                                                            {$domain.regperiod} {$domain.yearsLanguage}
+                                                            <span class="caret"></span>
+                                                        </button>
+                                                        <ul class="dropdown-menu" aria-labelledby="{$domain.domain}Pricing">
+                                                            {foreach $domain.pricing as $years => $price}
+                                                                <li class="dropdown-item">
+                                                                    <a href="#" onclick="selectDomainPeriodInCart('{$domain.domain}', '{$price.register}', {$years}, '{if $years == 1}{lang key='orderForm.year'}{else}{lang key='orderForm.years'}{/if}');return false;">
+                                                                        {$years} {if $years == 1}{lang key='orderForm.year'}{else}{lang key='orderForm.years'}{/if} @ {$price.register}
+                                                                    </a>
+                                                                </li>
+                                                            {/foreach}
+                                                        </ul>
+                                                    </div>
+                                                    <span class="renewal cycle">
+                                                        {lang key='domainrenewalprice'} <span class="renewal-price cycle">{if isset($domain.renewprice)}{$domain.renewprice->toPrefixed()}{$domain.shortRenewalYearsLanguage}{/if}</span>
+                                                    </span>
+                                                {/if}
+                                            </div>
+                                            <div class="col-sm-1 hidden-xs d-none d-sm-block">
+                                                <button type="button" class="btn btn-link btn-xs btn-remove-from-cart" onclick="removeItem('d','{$num}')">
+                                                    <i class="fas fa-times"></i>
+                                                </button>
+                                            </div>
+                                        </div>
+                                    </div>
+                                {/foreach}
+
+                                {foreach $renewalsByType['services'] as $num => $service}
+                                    <div class="item">
+                                        <div class="row">
+                                            <div class="col-sm-7">
+                                                <span class="item-title">
+                                                    {lang key='renewService.titleAltSingular'}
+                                                </span>
+                                                <span class="item-group">
+                                                    {$service.name}
+                                                </span>
+                                                <span class="item-domain">
+                                                    {$service.domainName}
+                                                </span>
+                                            </div>
+                                            <div class="col-sm-4 item-price">
+                                                <span>{$service.recurringBeforeTax}</span>
+                                                <span class="cycle">{$service.billingCycle}</span>
+                                            </div>
+                                            <div class="col-sm-1">
+                                                <button type="button" class="btn btn-link btn-xs btn-remove-from-cart" onclick="removeItem('r','{$num}','service')">
+                                                    <i class="fas fa-times"></i>
+                                                    <span class="visible-xs d-block d-sm-none">{lang key='orderForm.remove'}</span>
+                                                </button>
+                                            </div>
+                                        </div>
+                                    </div>
+                                {/foreach}
+
+                                {foreach $renewalsByType['addons'] as $num => $service}
+                                    <div class="item">
+                                        <div class="row">
+                                            <div class="col-sm-7">
+                                                <span class="item-title">
+                                                    {lang key='renewServiceAddon.titleAltSingular'}
+                                                </span>
+                                                <span class="item-group">
+                                                    {$service.name}
+                                                </span>
+                                                <span class="item-domain">
+                                                    {$service.domainName}
+                                                </span>
+                                            </div>
+                                            <div class="col-sm-4 item-price">
+                                                <span>{$service.recurringBeforeTax}</span>
+                                                <span class="cycle">{$service.billingCycle}</span>
+                                            </div>
+                                            <div class="col-sm-1">
+                                                <button type="button" class="btn btn-link btn-xs btn-remove-from-cart" onclick="removeItem('r','{$num}','addon')">
+                                                    <i class="fas fa-times"></i>
+                                                    <span class="visible-xs d-block d-sm-none">{lang key='orderForm.remove'}</span>
+                                                </button>
+                                            </div>
+                                        </div>
+                                    </div>
+                                {/foreach}
+
+                                {foreach $renewalsByType['domains'] as $num => $domain}
+                                    <div class="item">
+                                        <div class="row">
+                                            <div class="col-sm-7">
+                                                <span class="item-title">
+                                                    {$LANG.domainrenewal}
+                                                </span>
+                                                <span class="item-domain">
+                                                    {$domain.domain}
+                                                </span>
+                                                {if $domain.dnsmanagement}&nbsp;&raquo; {$LANG.domaindnsmanagement}<br />{/if}
+                                                {if $domain.emailforwarding}&nbsp;&raquo; {$LANG.domainemailforwarding}<br />{/if}
+                                                {if $domain.idprotection}&nbsp;&raquo; {$LANG.domainidprotection}<br />{/if}
+                                            </div>
+                                            <div class="col-sm-4 item-price">
+                                                <span>{$domain.price}</span>
+                                                <span class="cycle">{$domain.regperiod} {$LANG.orderyears}</span>
+                                            </div>
+                                            <div class="col-sm-1">
+                                                <button type="button" class="btn btn-link btn-xs btn-remove-from-cart" onclick="removeItem('r','{$num}','domain')">
+                                                    <i class="fas fa-times"></i>
+                                                    <span class="visible-xs d-block d-sm-none">{$LANG.orderForm.remove}</span>
+                                                </button>
+                                            </div>
+                                        </div>
+                                    </div>
+                                {/foreach}
+
+                                {foreach $upgrades as $num => $upgrade}
+                                    <div class="item">
+                                        <div class="row">
+                                            <div class="{if $showUpgradeQtyOptions}col-sm-5{else}col-sm-7{/if}">
+                                                <span class="item-title">
+                                                    {$LANG.upgrade}
+                                                </span>
+                                                <span class="item-group">
+                                                    {if $upgrade->type == 'service'}
+                                                        {$upgrade->originalProduct->productGroup->name}<br>{$upgrade->originalProduct->name} => {$upgrade->newProduct->name}
+                                                    {elseif $upgrade->type == 'addon'}
+                                                        {$upgrade->originalAddon->name} => {$upgrade->newAddon->name}
+                                                    {/if}
+                                                </span>
+                                                <span class="item-domain">
+                                                    {if $upgrade->type == 'service'}
+                                                        {$upgrade->service->domain}
+                                                    {/if}
+                                                </span>
+                                            </div>
+                                            {if $showUpgradeQtyOptions}
+                                                <div class="col-sm-2 item-qty">
+                                                    {if $upgrade->allowMultipleQuantities}
+                                                        <input type="number" name="upgradeqty[{$num}]" value="{$upgrade->qty}" class="form-control text-center" min="{$upgrade->minimumQuantity}" />
+                                                        <button type="submit" class="btn btn-xs">
+                                                            {$LANG.orderForm.update}
+                                                        </button>
+                                                    {/if}
+                                                </div>
+                                            {/if}
+                                            <div class="col-sm-4 item-price">
+                                                <span>{$upgrade->newRecurringAmount}</span>
+                                                <span class="cycle">{$upgrade->localisedNewCycle}</span>
+                                            </div>
+                                            <div class="col-sm-1">
+                                                <button type="button" class="btn btn-link btn-xs btn-remove-from-cart" onclick="removeItem('u','{$num}')">
+                                                    <i class="fas fa-times"></i>
+                                                    <span class="visible-xs d-block d-sm-none">{$LANG.orderForm.remove}</span>
+                                                </button>
+                                            </div>
+                                        </div>
+                                        {if $upgrade->totalDaysInCycle > 0}
+                                            <div class="row row-upgrade-credit">
+                                                <div class="col-sm-7">
+                                                    <span class="item-group">
+                                                        {$LANG.upgradeCredit}
+                                                    </span>
+                                                    <div class="upgrade-calc-msg">
+                                                        {lang key="upgradeCreditDescription" daysRemaining=$upgrade->daysRemaining totalDays=$upgrade->totalDaysInCycle}
+                                                    </div>
+                                                </div>
+                                                <div class="col-sm-4 item-price">
+                                                    <span>-{$upgrade->creditAmount}</span>
+                                                </div>
+                                            </div>
+                                        {/if}
+                                    </div>
+                                {/foreach}
+
+                                {if $cartitems == 0}
+                                    <div class="view-cart-empty">
+                                        {$LANG.cartempty}
+                                    </div>
+                                {/if}
+
+                            </div>
+
+                            {if $cartitems > 0}
+                                <div class="empty-cart">
+                                    <button type="button" class="btn btn-link btn-xs" id="btnEmptyCart">
+                                        <i class="fas fa-trash-alt"></i>
+                                        <span>{$LANG.emptycart}</span>
+                                    </button>
+                                </div>
+                            {/if}
+
+                        </form>
+
+                        {foreach $hookOutput as $output}
+                            <div>
+                                {$output}
+                            </div>
+                        {/foreach}
+
+                        {foreach $gatewaysoutput as $gatewayoutput}
+                            <div class="view-cart-gateway-checkout">
+                                {$gatewayoutput}
+                            </div>
+                        {/foreach}
+
+                        <div class="view-cart-tabs">
+                            <ul class="nav nav-tabs" role="tablist">
+                                <li role="presentation" class="nav-item active">
+                                    <a href="#applyPromo" class="nav-link active" aria-controls="applyPromo" role="tab" data-toggle="tab"{if $template == 'twenty-one'} aria-selected="true"{else} aria-expanded="true"{/if}>
+                                        {$LANG.orderForm.applyPromoCode}
+                                    </a>
+                                </li>
+                                {if $taxenabled && !$loggedin}
+                                    <li role="presentation" class="nav-item">
+                                        <a href="#calcTaxes" class="nav-link" aria-controls="calcTaxes" role="tab" data-toggle="tab"{if $template == 'twenty-one'} aria-selected="false"{else} aria-expanded="false"{/if}>
+                                            {$LANG.orderForm.estimateTaxes}
+                                        </a>
+                                    </li>
+                                {/if}
+                            </ul>
+                            <div class="tab-content">
+                                <div role="tabpanel" class="tab-pane active promo" id="applyPromo">
+                                    {if $promotioncode}
+                                        <div class="view-cart-promotion-code">
+                                            {$promotioncode} - {$promotiondescription}
+                                        </div>
+                                        <div class="text-center">
+                                            <a href="{$WEB_ROOT}/cart.php?a=removepromo" class="btn btn-default btn-xs">
+                                                {$LANG.orderForm.removePromotionCode}
+                                            </a>
+                                        </div>
+                                    {else}
+                                        <form method="post" action="{$WEB_ROOT}/cart.php?a=view">
+                                            <div class="form-group prepend-icon ">
+                                                <label for="cardno" class="field-icon">
+                                                    <i class="fas fa-ticket-alt"></i>
+                                                </label>
+                                                <input type="text" name="promocode" id="inputPromotionCode" class="field form-control" placeholder="{lang key="orderPromoCodePlaceholder"}" required="required">
+                                            </div>
+                                            <button type="submit" name="validatepromo" class="btn btn-block btn-default" value="{$LANG.orderpromovalidatebutton}">
+                                                {$LANG.orderpromovalidatebutton}
+                                            </button>
+                                        </form>
+                                    {/if}
+                                </div>
+                                <div role="tabpanel" class="tab-pane" id="calcTaxes">
+
+                                    <form method="post" action="{$WEB_ROOT}/cart.php?a=setstateandcountry">
+                                        <div class="form-group row">
+                                            <label for="inputState" class="pt-sm-2 col-sm-4 control-label text-sm-right">{$LANG.orderForm.state}</label>
+                                            <div class="col-sm-7">
+                                                <input type="text" name="state" id="inputState" value="{$clientsdetails.state}" class="form-control"{if $loggedin} disabled="disabled"{/if} />
+                                            </div>
+                                        </div>
+                                        <div class="form-group row">
+                                            <label for="inputCountry" class="pt-sm-2 col-sm-4 control-label text-sm-right">{$LANG.orderForm.country}</label>
+                                            <div class="col-sm-7">
+                                                <select name="country" id="inputCountry" class="form-control">
+                                                    {foreach $countries as $countrycode => $countrylabel}
+                                                        <option value="{$countrycode}"{if (!$country && $countrycode == $defaultcountry) || $countrycode eq $country} selected{/if}>
+                                                            {$countrylabel}
+                                                        </option>
+                                                    {/foreach}
+                                                </select>
+                                            </div>
+                                        </div>
+                                        <div class="form-group text-center">
+                                            <button type="submit" class="btn btn-default">
+                                                {$LANG.orderForm.updateTotals}
+                                            </button>
+                                        </div>
+                                    </form>
+
+                                </div>
+                            </div>
+                        </div>
+
+                    </div>
+                    <div class="secondary-cart-sidebar" id="scrollingPanelContainer">
+
+                        <div class="order-summary" id="orderSummary">
+                            <div class="loader w-hidden" id="orderSummaryLoader">
+                                <i class="fas fa-fw fa-sync fa-spin"></i>
+                            </div>
+                            <h2 class="font-size-30">{$LANG.ordersummary}</h2>
+                            <div class="summary-container">
+
+                                <div class="subtotal clearfix">
+                                    <span class="pull-left float-left">{$LANG.ordersubtotal}</span>
+                                    <span id="subtotal" class="pull-right float-right">{$subtotal}</span>
+                                </div>
+                                {if $promotioncode || $taxrate || $taxrate2}
+                                    <div class="bordered-totals">
+                                        {if $promotioncode}
+                                            <div class="clearfix">
+                                                <span class="pull-left float-left">{$promotiondescription}</span>
+                                                <span id="discount" class="pull-right float-right">{$discount}</span>
+                                            </div>
+                                        {/if}
+                                        {if $taxrate}
+                                            <div class="clearfix">
+                                                <span class="pull-left float-left">{$taxname} @ {$taxrate}%</span>
+                                                <span id="taxTotal1" class="pull-right float-right">{$taxtotal}</span>
+                                            </div>
+                                        {/if}
+                                        {if $taxrate2}
+                                            <div class="clearfix">
+                                                <span class="pull-left float-left">{$taxname2} @ {$taxrate2}%</span>
+                                                <span id="taxTotal2" class="pull-right float-right">{$taxtotal2}</span>
+                                            </div>
+                                        {/if}
+                                    </div>
+                                {/if}
+                                <div class="recurring-totals clearfix">
+                                    <span class="pull-left float-left">{$LANG.orderForm.totals}</span>
+                                    <span id="recurring" class="pull-right float-right recurring-charges">
+                                        <span id="recurringMonthly" {if !$totalrecurringmonthly}style="display:none;"{/if}>
+                                            <span class="cost">{$totalrecurringmonthly}</span> {$LANG.orderpaymenttermmonthly}<br />
+                                        </span>
+                                        <span id="recurringQuarterly" {if !$totalrecurringquarterly}style="display:none;"{/if}>
+                                            <span class="cost">{$totalrecurringquarterly}</span> {$LANG.orderpaymenttermquarterly}<br />
+                                        </span>
+                                        <span id="recurringSemiAnnually" {if !$totalrecurringsemiannually}style="display:none;"{/if}>
+                                            <span class="cost">{$totalrecurringsemiannually}</span> {$LANG.orderpaymenttermsemiannually}<br />
+                                        </span>
+                                        <span id="recurringAnnually" {if !$totalrecurringannually}style="display:none;"{/if}>
+                                            <span class="cost">{$totalrecurringannually}</span> {$LANG.orderpaymenttermannually}<br />
+                                        </span>
+                                        <span id="recurringBiennially" {if !$totalrecurringbiennially}style="display:none;"{/if}>
+                                            <span class="cost">{$totalrecurringbiennially}</span> {$LANG.orderpaymenttermbiennially}<br />
+                                        </span>
+                                        <span id="recurringTriennially" {if !$totalrecurringtriennially}style="display:none;"{/if}>
+                                            <span class="cost">{$totalrecurringtriennially}</span> {$LANG.orderpaymenttermtriennially}<br />
+                                        </span>
+                                    </span>
+                                </div>
+
+                                <div class="total-due-today total-due-today-padded">
+                                    <span id="totalDueToday" class="amt">{$total}</span>
+                                    <span>{$LANG.ordertotalduetoday}</span>
+                                </div>
+
+                                <div class="express-checkout-buttons">
+                                    {foreach $expressCheckoutButtons as $checkoutButton}
+                                        {$checkoutButton}
+                                        <div class="separator">
+                                            - {$LANG.or|strtoupper} -
+                                        </div>
+                                    {/foreach}
+                                </div>
+
+                                <div class="text-right">
+                                    <a href="{$WEB_ROOT}/cart.php?a=checkout&e=false" class="btn btn-success btn-lg btn-checkout{if $cartitems == 0} disabled{/if}" id="checkout">
+                                        {$LANG.orderForm.checkout}
+                                        <i class="fas fa-arrow-right"></i>
+                                    </a><br />
+                                    <a href="{$WEB_ROOT}/cart.php" class="btn btn-link btn-continue-shopping" id="continueShopping">
+                                        {$LANG.orderForm.continueShopping}
+                                    </a>
+                                </div>
+
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <form method="post" action="{$WEB_ROOT}/cart.php">
+            <input type="hidden" name="a" value="remove" />
+            <input type="hidden" name="r" value="" id="inputRemoveItemType" />
+            <input type="hidden" name="i" value="" id="inputRemoveItemRef" />
+            <input type="hidden" name="rt" value="" id="inputRemoveItemRenewalType">
+            <div class="modal fade modal-remove-item" id="modalRemoveItem" tabindex="-1" role="dialog">
+                <div class="modal-dialog" role="document">
+                    <div class="modal-content">
+                        <div class="modal-body">
+                            <div class="float-right">
+                                <button type="button" class="close" data-dismiss="modal" aria-label="{lang key='orderForm.close'}">
+                                    <span aria-hidden="true">&times;</span>
+                                </button>
+                            </div>
+                            <h4 class="modal-title margin-bottom mb-3">
+                                <i class="fas fa-times fa-3x"></i>
+                                <span>{lang key='orderForm.removeItem'}</span>
+                            </h4>
+                            {lang key='cartremoveitemconfirm'}
+                        </div>
+                        <div class="modal-footer justify-content-center">
+                            <button type="button" class="btn btn-default" data-dismiss="modal">{lang key='no'}</button>
+                            <button type="submit" class="btn btn-primary">{lang key='yes'}</button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </form>
+
+        <form method="post" action="{$WEB_ROOT}/cart.php">
+            <input type="hidden" name="a" value="empty" />
+            <div class="modal fade modal-remove-item" id="modalEmptyCart" tabindex="-1" role="dialog">
+                <div class="modal-dialog" role="document">
+                    <div class="modal-content">
+                        <div class="modal-body">
+                            <div class="float-right">
+                                <button type="button" class="close" data-dismiss="modal" aria-label="{$LANG.orderForm.close}">
+                                    <span aria-hidden="true">&times;</span>
+                                </button>
+                            </div>
+                            <h4 class="modal-title margin-bottom mb-3">
+                                <i class="fas fa-trash-alt fa-3x"></i>
+                                <span>{$LANG.emptycart}</span>
+                            </h4>
+                            {$LANG.cartemptyconfirm}
+                        </div>
+                        <div class="modal-footer justify-content-center">
+                            <button type="button" class="btn btn-default" data-dismiss="modal">{$LANG.no}</button>
+                            <button type="submit" class="btn btn-primary">{$LANG.yes}</button>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </form>
+    </div>
+    {include file="orderforms/standard_cart/recommendations-modal.tpl"}
+{/if}

orderforms/supreme_comparison/css/style.css

@@ -0,0 +1,388 @@
+/**
+ * Supreme Comparison order form style sheet
+ *
+ * Contains styling specific to the Supreme Comparison order form template.
+ *
+ * @project   WHMCS
+ * @version   1.0
+ * @author    WHMCS Limited <development@whmcs.com>
+ * @copyright Copyright (c) WHMCS Limited 2005-2015
+ * @license   http://www.whmcs.com/license/
+ * @link      http://www.whmcs.com/
+ *
+ */
+html, body {
+    overflow-x: hidden; /* Prevent scroll on narrow devices */
+}
+
+div#order-supreme_comparison {
+    padding: 0;
+    margin: 0;
+    height: 100%;
+    width: 100%;
+    line-height:18px;
+    text-rendering: optimizeLegibility !important;
+    -webkit-font-smoothing: antialiased !important;
+}
+
+div#order-supreme_comparison a,
+div#order-supreme_comparison a:hover,
+div#order-supreme_comparison a:active,
+div#order-supreme_comparison a:visited,
+div#order-supreme_comparison a:link {
+    outline:none;
+    transition: all 0.5s ease 0s;
+    -webkit-transition: all 0.5s ease 0s;
+    -moz-transition: all 0.5s ease 0s;
+}
+div#order-supreme_comparison div,
+div#order-supreme_comparison ul,
+div#order-supreme_comparison li {
+    padding: 0;
+    margin: 0;
+}
+
+div#order-supreme_comparison .product-group-heading {
+    margin: 0;
+    padding: 0 0 20px 0;
+    text-align: center;
+}
+div#order-supreme_comparison .product-group-headline {
+    margin: 0;
+    padding: 0;
+    font-size:32px;
+    text-transform:capitalize;
+    font-weight:600;
+    line-height:40px;
+}
+div#order-supreme_comparison .product-group-tagline {
+    margin: 0;
+    padding: 3px 0 5px 0;
+    letter-spacing:0;
+    font-size:16px;
+    color: #666;
+}
+div#order-supreme_comparison .price-table-container {
+    margin: 0 auto;
+    padding: 0;
+}
+div#order-supreme_comparison .price-table-container ul {
+    margin: 0;
+    padding: 0;
+    list-style:none;
+    text-align:center;
+    width:100%;
+}
+div#order-supreme_comparison .price-table-container ul li {
+    margin: 0;
+    padding:15px 4px 0;
+    display:inline-block;
+}
+div#order-supreme_comparison .price-table-container ul li:first-child {
+    padding-left: 0;
+}
+div#order-supreme_comparison .price-table-container ul li:last-child {
+    padding-right: 0;
+}
+div#order-supreme_comparison .price-table {
+    margin: 0;
+    padding: 0;
+    max-width:155px;
+    width:155px;
+    position:relative;
+}
+
+div#order-supreme_comparison .price-table .product-icon {
+    background-repeat: no-repeat;
+    height: 95px;
+}
+div#order-supreme_comparison .price-table .product-icon img {
+    width: 100%;
+}
+
+div#order-supreme_comparison .product-title {
+    margin: 0;
+    padding: 10px;
+    background: #6d4674; /* Old browsers */
+    background: -moz-linear-gradient(top,  #6d4674 0%, #574b78 100%); /* FF3.6+ */
+    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6d4674), color-stop(100%,#574b78)); /* Chrome,Safari4+ */
+    background: -webkit-linear-gradient(top,  #6d4674 0%,#574b78 100%); /* Chrome10+,Safari5.1+ */
+    background: -o-linear-gradient(top,  #6d4674 0%,#574b78 100%); /* Opera 11.10+ */
+    background: -ms-linear-gradient(top,  #6d4674 0%,#574b78 100%); /* IE10+ */
+    background: linear-gradient(to bottom,  #6d4674 0%,#574b78 100%); /* W3C */
+    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6d4674', endColorstr='#574b78',GradientType=0 ); /* IE6-9 */
+    border-bottom: 1px solid #463c60;
+}
+div#order-supreme_comparison .product-title h3 {
+    margin: 0;
+    padding: 0;
+    color: #ffffcc;
+    font-weight: 100;
+    line-height: 26px;
+    font-size: 26px;
+    overflow: hidden;
+}
+div#order-supreme_comparison .text-position p {
+    margin: 0;
+    padding:5px 0 20px;
+    color: #b3a1b7;
+    font-size: 13px;
+    font-weight: normal;
+    line-height:20px;
+    text-shadow:0 1px 2px rgba(0, 0, 0, 0.4);
+}
+div#order-supreme_comparison .featured-product-background {
+    background:rgba(0, 0, 0, 0) linear-gradient(to bottom, #d343c8 0%, #b42aa8 100%) repeat scroll 0 0;
+    border-bottom: 1px solid #463c60;
+    padding:4px 0 4px;
+}
+div#order-supreme_comparison .featured-product {
+    margin: 0;
+    padding: 0;
+    top:133px;
+    color:#ffffcc;
+    font-size: 13px;
+    text-transform:uppercase;
+    font-weight: bold;
+}
+div#order-supreme_comparison .product-body {
+    margin:0 auto;
+    padding: 0;
+    position:relative;
+}
+div#order-supreme_comparison .product-body ul {
+    margin: 0;
+    padding:7px 5px 5px;
+    list-style:none;
+    border-bottom: 1px solid #d9d9d9;
+    border-left: 1px solid #d9d9d9;
+    border-right: 1px solid #d9d9d9;
+    border-radius:0 0 10px 10px;
+    box-shadow:0 0 2px 0 rgba(0, 0, 0, 0.3);
+    background-color:#ffffff;
+    z-index:1;
+    position:relative;
+    width:100%;
+}
+div#order-supreme_comparison .product-body ul li {
+    margin: 0;
+    padding: 15px 0 15px;
+    display:list-item;
+    border-bottom: 1px solid #d9d9d9;
+    color: #333333;
+    font-size:0.9em;
+    line-height: 16px;
+    text-align: center;
+    width: 100%;
+}
+div#order-supreme_comparison .product-body ul li span {
+    font-weight: bold;
+}
+div#order-supreme_comparison .product-body ul li:last-child {
+    border-bottom: none;
+}
+div#order-supreme_comparison .product-body ul li a {
+    color:#006699;
+ }
+div#order-supreme_comparison .price-area {
+    margin:0 auto;
+    padding:0 0 16px 0;
+    background-color:#decfd9;
+    text-align:center;
+    width:100%;
+    color:#000;
+    max-width:137px;
+    border-radius:0 0 10px 10px;
+}
+div#order-supreme_comparison .price {
+    margin: 0;
+    padding: 12px 0;
+    max-width: 137px;
+    overflow: hidden;
+}
+div#order-supreme_comparison .price-label {
+    height: 26px;
+    font-size: 0.9em;
+    color: #666;
+}
+div#order-supreme_comparison .price-single-line {
+    line-height: 44px;
+}
+div#order-supreme_comparison .price-area span {
+    font-weight: bold;
+    font-size: 1.4em;
+}
+div#order-supreme_comparison .order-now {
+    margin:0 auto;
+    padding:10px 1px 10px 0;
+    max-width:107px;
+    width:100%;
+    border-radius:4px;
+    background:rgba(0, 0, 0, 0) linear-gradient(to bottom, #d343c8 0%, #b42aa8 100%) repeat scroll 0 0;
+    font-weight: bold;
+}
+div#order-supreme_comparison .order-unavailable {
+    margin:0 auto;
+    padding:10px 1px 10px 0;
+    width:100%;
+    background: #666;
+    color: #efefef;
+    font-size: 0.9em;
+    font-style: italic;
+}
+div#order-supreme_comparison .price-area a {
+    font-size: 0.9em;
+    color:#ffffcc;
+    font-weight: bold;
+    text-decoration: none;
+    text-shadow: 1px 1px #222;
+}
+div#order-supreme_comparison .featured {
+    padding:15px 1px 15px 0;
+}
+div#order-supreme_comparison .featured-background h3 {
+    margin:3px 0 8px 8px;
+}
+
+div#order-supreme_comparison .includes-features {
+    margin: 0 auto;
+    max-width: 780px;
+    padding-top: 35px;
+    padding-bottom:45px;
+    width: 100%;
+}
+div#order-supreme_comparison .includes-features .head-area {
+    margin: 0;
+    padding: 0 12px 0;
+    background: rgba(0, 0, 0, 0) url("../img/head-bg.png") no-repeat scroll center center / 100% auto;
+    text-align: center;
+}
+div#order-supreme_comparison .head-area span {
+    padding: 0 20px;
+    color: #666;
+}
+div#order-supreme_comparison .includes-features .list-features {
+    list-style: outside none none;
+    margin: 0;
+    padding: 20px 0 0 11px;
+    color: #666;
+}
+div#order-supreme_comparison .includes-features ul.list-features li {
+    background: rgba(0, 0, 0, 0) url("../img/tick-violet.png") no-repeat scroll 0 0;
+    display: inline-table;
+    margin: 5px 0;
+    padding: 0 0 0 22px;
+    width: 32%;
+    line-height:17px;
+    font-size:14px;
+}
+
+/* This media query is written for Ipad and tablets */
+@media (max-width: 991px) {
+    div#order-supreme_comparison .center-head {
+        padding-right:0;
+    }
+    div#order-supreme_comparison .center-head h5 {
+        padding-left:0;
+    }
+    div#order-supreme_comparison .includes-features ul.list-features li {
+        width:48%;
+    }
+}
+/* This media query is written for Mobile landscape and Ipad and tablets portrait */
+@media (max-width: 768px) {
+}
+
+/* This media query is written for Mobile only */
+@media (max-width: 600px) {
+    div#order-supreme_comparison .price-table-container .price-table {
+        max-width:40%;
+        margin:0 auto;
+    }
+    div#order-supreme_comparison .price-table-container ul li {
+        width:100%;
+    }
+    div#order-supreme_comparison .text-position {
+        top:145px;
+    }
+    div#order-supreme_comparison .text-position p {
+        padding:6px 0 30px;
+    }
+    div#order-supreme_comparison .featured-product-background {
+        padding:11px 0;
+    }
+}
+/* This media query is written for Mobile only */
+@media (max-width: 480px) {
+    div#order-supreme_comparison .price-table-container .price-table {
+        max-width:155px;
+        width:100%;
+    }
+    div#order-supreme_comparison .price-table-container ul li {
+        max-width: 180px;
+        width: 100%;
+    }
+    div#order-supreme_comparison .text-position p {
+        padding-bottom:13px;
+    }
+    div#order-supreme_comparison .text-position {
+        top: 109px;
+    }
+}
+/* This media query is written for Mobile only */
+@media (max-width: 414px) {
+    div#order-supreme_comparison .price-table-container ul li {
+        max-width:100%;
+    }
+    div#order-supreme_comparison .includes-features ul.list-features li {
+        width:100%;
+    }
+    div#order-supreme_comparison .price-table-container .price-table {
+        margin: 0 auto;
+        max-width: 55%;
+    }
+    div#order-supreme_comparison .text-position {
+        top: 139px;
+    }
+}
+/* This media query is written for Mobile only */
+@media (max-width: 360px) {
+}
+/* This media query is written for Mobile only */
+@media (max-width: 320px) {
+    div#order-supreme_comparison .includes-features ul.list-features li {
+        width:100%;
+    }
+    div#order-supreme_comparison .price-table-container .price-table {
+        max-width:65%;
+    }
+    div#order-supreme_comparison .price-table-second .colm-bg {
+        max-width: 65%;
+    }
+    div#order-supreme_comparison .text-position p {
+        padding-bottom:27px;
+    }
+    div#order-supreme_comparison .includes-features {
+        width:97%;
+    }
+}
+
+.row-product-selection {
+    position: relative;
+    left: 0;
+    -webkit-transition: all .25s ease-out;
+    -o-transition: all .25s ease-out;
+    transition: all .25s ease-out;
+}
+
+.product-selection-sidebar {
+    position: absolute;
+    top: 0;
+    left: -300px;
+    width: 300px;
+    display: none;
+}
+
+#btnShowSidebar {
+    margin: 0 0 20px 0;
+}

orderforms/supreme_comparison/index.php

@@ -0,0 +1,2 @@
+<?php
+header("Location: ../../../index.php");

orderforms/supreme_comparison/products.tpl

@@ -0,0 +1,179 @@
+<!-- Product Recommendations CSS -->
+<link type="text/css" rel="stylesheet" href="{$BASE_PATH_CSS}/recommendations.min.css" property="stylesheet" />
+<!-- Core CSS -->
+<link rel="stylesheet" type="text/css" href="{assetPath file="style.css"}" property="stylesheet" />
+<script>
+    jQuery(document).ready(function () {
+        jQuery('#btnShowSidebar').click(function () {
+            if (jQuery(".product-selection-sidebar").is(":visible")) {
+                jQuery('.row-product-selection').css('left','0');
+                jQuery('.product-selection-sidebar').fadeOut();
+                jQuery('#btnShowSidebar').html('<i class="fas fa-arrow-circle-right"></i> {$LANG.showMenu}');
+            } else {
+                jQuery('.product-selection-sidebar').fadeIn();
+                jQuery('.row-product-selection').css('left','300px');
+                jQuery('#btnShowSidebar').html('<i class="fas fa-arrow-circle-left"></i> {$LANG.hideMenu}');
+            }
+        });
+    });
+</script>
+
+{if $showSidebarToggle}
+    <button type="button" class="btn btn-default btn-sm" id="btnShowSidebar">
+        <i class="fas fa-arrow-circle-right"></i>
+        {$LANG.showMenu}
+    </button>
+{/if}
+<div class="row row-product-selection">
+    <div class="col-md-3 sidebar product-selection-sidebar" id="supremeComparisonSidebar">
+        {include file="orderforms/standard_cart/sidebar-categories.tpl"}
+    </div>
+    <div class="col-md-12">
+        <div id="order-supreme_comparison">
+            <div class="product-group-heading">
+                <div class="product-group-headline">
+                    {if $productGroup.headline}
+                        {$productGroup.headline}
+                    {else}
+                        {$productGroup.name}
+                    {/if}
+                </div>
+                {if $productGroup.tagline}
+                    <div class="product-group-tagline">
+                        {$productGroup.tagline}
+                    </div>
+                {/if}
+                {if $errormessage}
+                    <div class="alert alert-danger">
+                        {$errormessage}
+                    </div>
+                {elseif !$productGroup}
+                    <div class="alert alert-info">
+                        {lang key='orderForm.selectCategory'}
+                    </div>
+                {/if}
+            </div>
+            <div id="products" class="price-table-container">
+                <ul>
+                    {$count = 1}
+                    {foreach $products as $product}
+                        {$idPrefix = ($product.bid) ? ("bundle"|cat:$product.bid) : ("product"|cat:$product.pid)}
+                        <li id="{$idPrefix}">
+                            <div class="price-table">
+                                <div class="product-icon">
+                                    <img src="{assetPath ns="img" file="bg{$count}.png"}" width="155" height="95" alt="Product {$product@iteration}" />
+                                </div>
+                                <div class="product-title">
+                                    <h3 id="{$idPrefix}-name" class="font-size-24">
+                                        {$product.name}
+                                    </h3>
+                                    {if $product.tagLine}
+                                        <p id="{$idPrefix}-tag-line">
+                                            {$product.tagLine}
+                                        </p>
+                                    {/if}
+                                </div>
+                                {if $product.isFeatured}
+                                    <div class="featured-product-background">
+                                        <span class="featured-product">{$LANG.featuredProduct|upper}</span>
+                                    </div>
+                                {/if}
+                                <div class="product-body">
+                                    <ul id="{$idPrefix}-description">
+                                        {foreach $product.features as $feature => $value}
+                                            <li id="{$idPrefix}-feature{$value@iteration}">
+                                                <span>{$value}</span> {$feature}
+                                            </li>
+                                        {foreachelse}
+                                            <li id="{$idPrefix}-description">
+                                                {$product.description}
+                                            </li>
+                                        {/foreach}
+                                        {if !empty($product.features) && $product.featuresdesc}
+                                            <li id="{$idPrefix}-feature-description">
+                                                {$product.featuresdesc}
+                                            </li>
+                                        {/if}
+                                    </ul>
+                                    <div class="price-area">
+                                        <div class="price" id="{$idPrefix}-price">
+                                            {if $product.bid}
+                                                {if $product.displayprice}
+                                                    <div class="price-label">{$LANG.bundledeal}</div>
+                                                    <span>{$product.displayPriceSimple}</span>
+                                                {else}
+                                                    <div class="price-single-line">
+                                                        {$LANG.bundledeal}
+                                                    </div>
+                                                {/if}
+                                            {elseif $product.paytype eq "free"}
+                                                <div class="price-single-line">
+                                                    <span>{$LANG.orderfree}</span>
+                                                </div>
+                                            {elseif $product.paytype eq "onetime"}
+                                                <div class="price-label">{$LANG.orderpaymenttermonetime}</div>
+                                                <span>{$product.pricing.onetime}</span>
+                                            {else}
+                                                {if $product.pricing.hasconfigoptions}
+                                                    <div class="price-label">{$LANG.startingat}</div>
+                                                {else}
+                                                    <div class="price-label">{$LANG.only}</div>
+                                                {/if}
+                                                {$product.pricing.minprice.cycleText}
+                                                <br>
+                                                {if $product.pricing.minprice.setupFee}
+                                                    <small>{$product.pricing.minprice.setupFee->toPrefixed()} {$LANG.ordersetupfee}</small>
+                                                {/if}
+                                            {/if}
+                                        </div>
+                                        {if $product.qty eq "0"}
+                                            <div id="{$idPrefix}-unavailable">
+                                                <div class="order-unavailable">
+                                                    {$LANG.outofstock}
+                                                </div>
+                                            </div>
+                                        {else}
+                                            <a href="{$product.productUrl}" class="btn-order-now" id="{$idPrefix}-order-button"{if $product.hasRecommendations} data-has-recommendations="1"{/if}>
+                                                <div class="order-now">
+                                                    {$LANG.ordernowbutton}
+                                                </div>
+                                            </a>
+                                        {/if}
+
+                                    </div>
+                                </div>
+                            </div>
+                        </li>
+                        {if $count eq 6}
+                            {$count = 1}
+                        {else}
+                            {$count = $count + 1}
+                        {/if}
+                    {/foreach}
+                </ul>
+            </div>
+            {if count($productGroup.features) > 0}
+                <div class="includes-features">
+                    <div class="row clearfix">
+                        <div class="col-md-12">
+                            <div class="head-area">
+                                <span class="primary-bg-color">
+                                    {$LANG.orderForm.includedWithPlans}
+                                </span>
+                            </div>
+                            <ul class="list-features">
+                                {foreach $productGroup.features as $features}
+                                    <li>{$features.feature}</li>
+                                {/foreach}
+                            </ul>
+                        </div>
+                    </div>
+                </div>
+            {/if}
+        </div>
+    </div>
+</div>
+
+{include file="orderforms/supreme_comparison/recommendations-modal.tpl"}
+
+<script src="{$BASE_PATH_JS}/whmcs/recommendations.min.js"></script>

orderforms/supreme_comparison/theme.yaml

@@ -0,0 +1,2 @@
+config:
+    parent: standard_cart