/**
* 2007-2022 PrestaShop
*
* NOTICE OF LICENSE
*
* This source file is subject to the Academic Free License (AFL 3.0)
* that is bundled with this package in the file LICENSE.txt.
* It is also available through the world-wide-web at this URL:
* http://opensource.org/licenses/afl-3.0.php
* If you did not receive a copy of the license and are unable to
* obtain it through the world-wide-web, please send an email
* to license@prestashop.com so we can send you a copy immediately.
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade PrestaShop to newer
* versions in the future. If you wish to customize PrestaShop for your
* needs please refer to http://www.prestashop.com for more information.
*
*  @author    PrestaShop SA <contact@prestashop.com>
*  @copyright 2007-2022 PrestaShop SA
*  @license   http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
*  International Registered Trademark & Property of PrestaShop SA
*
* Don't forget to prefix your containers with your own identifier
* to avoid any conflicts with others containers.
*/
        
        .select2-container {
            width: -webkit-fill-available !important;
        }
        
        .bar-code-bg {
            background: url("/modules/paymentbills/views/img/history.png") no-repeat center;
        }
        
        span.required {
            color: red;
        }
        
        .expiry-date-group {
            float: left;
            width: 50%
        }
        
        .expiry-date-group input {
            width: calc(100% + 1px);
            border-top-right-radius: 0;
            border-bottom-right-radius: 0;
        }
        
        .expiry-date-group input:focus {
            position: relative;
            z-index: 10;
        }
        
        .security-code-group {
            float: right;
            width: 50%
        }
        
        .security-code-group input {
            border-top-left-radius: 0;
            border-bottom-left-radius: 0;
        }
        
        .zip-code-group {
            clear: both;
        }
        
        #CheckButton,
        #PayButton,
        #CheckButtonF,
        #PayButtonF {
            outline: 0 !important;
            font-size: 16px;
            border: none;
            width: 50%;
            left: 25%;
            position: relative;
        }
        
        #CheckButtonF,
        #PayButtonF {
            display: none;
        }
        
        .printPayment {
            position: relative;
            left: 30%;
            width: 40%;
        }
        
        #Checkout {
            z-index: 100001;
            background: ;
            width: 50%;
            min-width: 300px;
            height: 100%;
            min-height: 100%;
            background: 0 0 #ffffff;
            border-radius: 8px;
            border: 1px solid #dedede;
            margin-left: auto;
            margin-right: auto;
            display: block;
        }
        
        #Checkout>h1 {
            margin: 0;
            padding: 20px;
            text-align: center;
            background: #EEF2F4;
            color: #5D6F78;
            font-size: 24px;
            font-weight: 300;
            border-bottom: 1px solid #DEDEDE;
            border-top-left-radius: 8px;
            border-top-right-radius: 8px;
        }
        
        #Checkout>form {
            margin: 0 25px 25px;
        }
        
        label {
            color: #46545C;
            margin-bottom: 2px;
        }
        
        .input-container {
            position: relative;
        }
        
        .input-container input {
            padding-right: 25px;
        }
        
        .input-container>i,
        a[role="button"] {
            color: #d3d3d3;
            width: 25px;
            height: 30px;
            line-height: 30px;
            font-size: 16px;
            position: absolute;
            top: 2px;
            right: 2px;
            cursor: pointer;
            text-align: center;
        }
        
        .input-container>i:hover,
        a[role="button"]:hover {
            color: #777;
        }
        
        .amount-placeholder {
            font-size: 20px;
        }
        
        .amount-placeholder>button {
            float: right;
            width: 60px;
        }
        
        .amount-placeholder>span {
            line-height: 34px;
        }
        
        .card-row {
            text-align: center;
            margin: 20px 25px 10px;
        }
        
        .card-row span {
            width: 48px;
            height: 30px;
            margin-right: 3px;
            background-repeat: no-repeat;
            display: inline-block;
            background-size: contain;
        }
        
        .card-image {
            background-repeat: no-repeat;
            padding-right: 50px;
            background-position: right 2px center;
            background-size: auto 90%
        }
        
        .cvc-preview-container {
            overflow: hidden;
        }
        
        .cvc-preview-container.two-card div {
            width: 48%;
            height: 80px;
        }
        
        .cvc-preview-container.two-card div.amex-cvc-preview {
            float: right;
        }
        
        .cvc-preview-container.two-card div.visa-mc-dis-cvc-preview {
            float: left;
        }
        
        .cvc-preview-container div {
            height: 160px;
        }
        
        .submit-button-pay {
            height: 20px;
            margin-top: -2px;
            margin-right: 7px;
            vertical-align: middle;
            background: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMTIgOWM1LjM0NSAwIDEwLTIuMDE1IDEwLTQuNXMtNC42NTUtNC41LTEwLTQuNWMtNS4zNDQgMC0xMCAyLjAxNS0xMCA0LjVzNC42NTYgNC41IDEwIDQuNXptLjE4Ny00LjAxOWMtLjU5OC0uMTgtMi40MjgtLjMzMi0yLjQyOC0xLjM1IDAtLjU2OC42NjgtMS4wNzQgMS45MTctMS4xODd2LS40NDRoLjY0MnYuNDIyYy40NjguMDExLjk4OS4wNjIgMS41NjkuMThsLS4yMzQuNjg1Yy0uNDQxLS4xMDEtLjkzMy0uMTk5LTEuNDE2LS4xOTlsLS4xNDUuMDAyYy0uOTYyLjA0LTEuMDQxLjU3NC0uMzczLjc5OSAxLjA5Mi4zMzcgMi41MzIuNTg1IDIuNTMyIDEuNDc5IDAgLjcxNC0uODY3IDEuMDk3LTEuOTM0IDEuMTkydi40NGgtLjY0MnYtLjQxNmMtLjY1OS0uMDA2LTEuMzUzLS4xMTMtMS45MjUtLjMwNGwuMjk1LS42ODZjLjQ4OC4xMjUgMS4xMDIuMjUzIDEuNjU1LjI1My4xNDUgMCAuMjg0LS4wMDkuNDE3LS4wMjguNzM3LS4xMDYuODg0LS42MDIuMDctLjgzOHptLS4xODcgMTYuMDE5YzMuNzgzIDAgNy43MDgtLjk2OSAxMC0yLjgwM3YxLjMwM2MwIDIuNDg1LTQuNjU1IDQuNS0xMCA0LjUtNS4zNDQgMC0xMC0yLjAxNS0xMC00LjV2LTEuMzA0YzIuMjkyIDEuODM1IDYuMjE3IDIuODA0IDEwIDIuODA0em0wLTEwYzMuNzgzIDAgNy43MDgtLjk2OSAxMC0yLjgwM3YxLjMwM2MwIDIuNDg1LTQuNjU1IDQuNS0xMCA0LjUtNS4zNDQgMC0xMC0yLjAxNS0xMC00LjV2LTEuMzAzYzIuMjkyIDEuODM0IDYuMjE3IDIuODAzIDEwIDIuODAzem0wIDVjMy43ODMgMCA3LjcwOC0uOTY5IDEwLTIuODAzdjEuMzAzYzAgMi40ODUtNC42NTUgNC41LTEwIDQuNS01LjM0NCAwLTEwLTIuMDE1LTEwLTQuNXYtMS4zMDRjMi4yOTIgMS44MzUgNi4yMTcgMi44MDQgMTAgMi44MDR6Ii8+PC9zdmc+") center center/contain no-repeat;
            width: 14px;
            display: inline-block;
        }
        
        .submit-button-lock {
            height: 20px;
            margin-top: -2px;
            margin-right: 7px;
            vertical-align: middle;
            background: url("data:image/png;base64,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NQxdFfpzGC4sNKwm7Hm4VXh+eHcELWJFREPEu0iPyNLIR4uNFksWd0bJR8VF1UdNRXtFl0VLl1gsWbPkRoxajCCmPRYfGxV7JHZyqffS3UuH4+ziCuPuLjNclrPs2nK15anLz66QX8FZcSoeGx8d3xD/iRPCqeVMrvRfuXflBNeTu4f7kufGK+eN8V34ZfyRBJeEsoTRRJfEXYljSa5JFUnjAk9BteB1sl/ygeSplJCUoykzqdGpzWmEtPi000IlYYqwK10zPSe9L8M0ozBDuspp1e5VE6JA0ZFMKHNZZruYjv5M9UiMJJslg1kLs2qy3mdHZZ/KUcwR5vTkmuRuyx3J88n7fjVmNXd1Z752/ob8wTXuaw6thdauXNu5Tnddwbrh9b7rj20gbUjZ8MtGy41lG99uit7UUaBRsL5gaLPv5sZCuUJR4b0tzlsObMVsFWzt3WazrWrblyJe0fViy+KK4k8l3JLr31l9V/ndzPaE7b2l9qX7d+B2CHfc3em681iZYlle2dCu4F2t5czyovK3u1fsvlZhW3FgD2mPZI+0MqiyvUqvakfVp+qk6oEaj5rmvep7t+2d2sfb17/fbX/TAY0DxQc+HhQcvH/I91BrrUFtxWHc4azDz+ui6rq/Z39ff0TtSPGRz0eFR6XHwo911TvU1zeoN5Q2wo2SxrHjccdv/eD1Q3sTq+lQM6O5+AQ4ITnx4sf4H++eDDzZeYp9qukn/Z/2ttBailqh1tzWibakNml7THvf6YDTnR3OHS0/m/989Iz2mZqzymdLz5HOFZybOZ93fvJCxoXxi4kXhzpXdD66tOTSna6wrt7LgZevXvG5cqnbvfv8VZerZ645XTt9nX297Yb9jdYeu56WX+x+aem172296XCz/ZbjrY6+BX3n+l37L972un3ljv+dGwOLBvruLr57/17cPel93v3RB6kPXj/Mejj9aP1j7OOiJwpPKp6qP6391fjXZqm99Oyg12DPs4hnj4a4Qy//lfmvT8MFz6nPK0a0RupHrUfPjPmM3Xqx9MXwy4yX0+OFvyn+tveV0auffnf7vWdiycTwa9HrmT9K3qi+OfrW9m3nZOjk03dp76anit6rvj/2gf2h+2P0x5Hp7E/4T5WfjT93fAn88ngmbWbm3/eE8/syOll+AAAAYFBMVEUAAAD///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////98JRy6AAAAH3RSTlMAAgYMEyIzOUpTVFViY3N2gJmcnaipq7fX3ebx+Pn8eTEuDQAAAI9JREFUKM/N0UkOglAQRdFHDyK90n64+9+lAyQgookjuaNKTlJJpaQlO2n6sW8SW/uCjrku2EloWDLhi3gDa4O3pTtA5Tt+BXDbiDsBmSQpAyZ3pRhoLUmS1QLxSilQPOcCSFfKgfxgPgfZ9ch7Y21LCcdd5wVH5SckEzkXc0ylpPJnMpETmX/d9eUpH1/5AKrsQVrz7YPBAAAAAElFTkSuQmCC") center center/contain no-repeat;
            width: 14px;
            display: inline-block;
        }
        
        .step2,
        .step3 {
            display: none;
        }
        
        .align-middle {
            vertical-align: middle;
        }
        
        input {
            box-shadow: none;
        }
        
        input:focus {
            border-color: #b0e5e3;
            background-color: #EEF9F9 ;
        }
        /* ANIMATE BUTTON */
        
        .activate {
            width: 240px;
            text-align: center;
            display: table;
            background: #A61BF8;
            box-shadow: 0 4px 20px rgba(86, 40, 238, 0.15);
            line-height: 20px;
            padding: 12px 50px;
            border-radius: 22px;
            color: #fff;
            font-weight: 500;
            cursor: pointer;
            transition: transform 0.2s ease, background 0.3s ease, box-shadow 0.3s ease;
        }
        
        .activate span {
            display: inline-block;
            vertical-align: top;
            width: 20px;
            height: 20px;
            background: #fff;
            border-radius: 50%;
            margin: 0 4px 0 0;
            position: relative;
            overflow: hidden;
        }
        
        .activate span:before {
            content: "";
            left: 0;
            top: 0;
            width: 100%;
            height: 100%;
            position: absolute;
            background: #A61BF8;
            border-radius: 50%;
            transform: scale(0);
            transition: transform 0.3s ease, background 0.3s ease;
        }
        
        .activate span svg {
            position: absolute;
            width: 12px;
            height: 12px;
            left: 50%;
            top: 50%;
            margin: -6px 0 0 -6px;
            z-index: 1;
        }
        
        .activate span svg:nth-child(1) {
            width: 20px;
            height: 20px;
            top: 0;
            left: 0;
            fill: none;
            margin: 0;
            stroke: #fff;
            stroke-width: 1px;
            stroke-dashoffset: 94.248;
            stroke-dasharray: 47.124;
        }
        
        .activate span svg:nth-child(2) {
            fill: #A61BF8;
            transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        }
        
        .activate span svg:nth-child(3) {
            fill: #A61BF8;
            transform: translateY(20px);
            transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0.3s ease;
        }
        
        .activate:hover {
            box-shadow: 0 8px 24px rgba(86, 40, 238, 0.15);
            color: white;
        }
        
        .activate:hover span svg:nth-child(2) {
            transform: translateY(-20px);
        }
        
        .activate:hover span svg:nth-child(3) {
            transform: translateY(0);
        }
        
        .activate:active {
            transform: scale(0.94);
            box-shadow: 0 4px 16px rgba(63, 220, 117, 0.18);
        }
        
        .activate.loading span {
            background: none;
            transition: background 0.1s ease 0.3s;
        }
        
        .activate.loading span:before {
            transform: scale(1);
        }
        
        .activate.loading span svg:nth-child(1) {
            -webkit-animation: turn 1.6s linear infinite forwards, path 1.6s linear infinite forwards;
            animation: turn 1.6s linear infinite forwards, path 1.6s linear infinite forwards;
        }
        
        .activate.loading span svg:nth-child(2) {
            transform: translateY(-20px);
        }
        
        .activate.loading span svg:nth-child(3) {
            opacity: 0;
            transform: translateY(0) scale(0.6);
        }
        
        .activate.loading ul {
            transform: rotateX(90deg);
        }
        
        .activate.loading.done {
            background: #3fdc75;
            box-shadow: 0 4px 20px rgba(63, 220, 117, 0.15);
        }
        
        .activate.loading.done span {
            background: #fff;
            transition: background 0.1s ease 0s;
        }
        
        .activate.loading.done span:before {
            background: #3fdc75;
            transform: scale(0);
        }
        
        .activate.loading.done span svg:nth-child(1) {
            -webkit-animation: none;
            animation: none;
        }
        
        .activate.loading.done span svg:nth-child(3) {
            fill: #3fdc75;
            opacity: 1;
            transform: scale(1);
            transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s, opacity 0.4s ease 0.25s;
        }
        
        .activate.loading.done ul {
            transform: rotateX(180deg);
        }
        
        .activate ul {
            padding: 0;
            margin: 0;
            list-style: none;
            height: 20px;
            width: 70px;
            display: inline-block;
            vertical-align: top;
            text-align: center;
            position: relative;
            transform-style: preserve-3d;
            transition: transform 0.3s ease;
        }
        
        ul.PayButton {
            width: 150px;
            height: 40px;
        }
        
        .activate ul li {
            --rotateX: 0deg;
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
            position: absolute;
            top: 0;
            bottom: 0;
            width: 100%;
            transform-origin: 50% 50%;
            transform: rotateX(var(--rotateX)) translateZ(10px);
            color: white;
        }
        
        .activate ul li:nth-child(2) {
            --rotateX: -90deg;
        }
        
        .activate ul li:nth-child(3) {
            --rotateX: -180deg;
        }
        
        @-webkit-keyframes turn {
            100% {
                transform: rotate(360deg);
            }
        }
        
        @keyframes turn {
            100% {
                transform: rotate(360deg);
            }
        }
        
        @-webkit-keyframes path {
            100% {
                stroke-dashoffset: 0;
            }
        }
        
        @keyframes path {
            100% {
                stroke-dashoffset: 0;
            }
        }
        /* ANIMATE BUTTON */
        
        @media (max-width: 768px) {
            #Checkout {
                width: 100%;
            }
            #CheckButton,
            #PayButton,
            #CheckButtonF,
            #PayButtonF {
                width: 90%;
                left: 5%;
            }
        }