/* Importing fonts from Google */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap');

body {
    background: linear-gradient(90deg, #024ccc, #024aad);
}

/**/

/*#upsell_frame ~ .row-fluid [class*="span"]
{ min-height: 0px; }
*/
.page_inner
{ margin: 0; }

.block-checkout{
	border-right: 1px solid #EEEEEE;
	max-width: 1200px;
	margin: 40px auto;
	padding: 20px 45px;
	box-shadow: 5px 25px 35px #3535356b;
	background: #FFFFFF;
	border-radius: 0.25rem!important;

}

	.block-checkout .form-stacked-row
	{ max-width: 800px; margin: 0; }

	.block-checkout .form-stacked-row input:focus
	{ border-color: #0c10ba; }

/*	.form-stacked-recurring
	{ max-width: 500px!important; }
*/

#upsell_frame .block-checkout
{ margin-bottom: 0; position: relative; margin-top: 0; border-radius: 0 0 5px 5px!important; }

#upsell_frame  h2 {
    color: white;
    padding: 10px 20px;
    font-size: 1.2rem;
    font-weight: 700;
    text-transform: uppercase;
    border-radius: 5px  5px 0 0;
    background: rgb(161,51,213);
    background: linear-gradient(90deg, rgba(161,51,213,1) 25%, rgba(0,129,213,1) 100%);
    display: block;
    width: auto;
    margin: 0;
    margin-top: 10px;
}

#upsell_frame h2 span {
    display: block;
    width: 50px;
    float: left;
    margin-right: 25px;
    margin-left: 15px;
    margin-top: -5px;
}


#upsell_frame p {
    border-left: 4px solid #9488db;
    display: block;
    margin-top: 7px;
    padding-left:10px;
    color: #5b5b5b;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 0.9rem;
}


.block-checkout .nav-tabs>li>a
{ padding: 20px; background-color: #eeeeee; }

.block-checkout .nav-tabs>li>a:hover
{ background-color: #CCCCCC; cursor: pointer; }

	.block-checkout .nav-tabs>.active>a, .block-checkout .nav-tabs>.active>a:hover
	{ background-color: #333333; cursor: pointer; color: #FFFFFF; }

.block-checkout h3
{ margin-bottom: 30px; }

	.block-checkout h3 span
	{ font-size: 14px; }

	.hold-badge
	{ position: relative; }

	.product-quantity.badge
	{ display: inline-block; position: absolute; top: -4px; right: -4px; z-index: 100; padding: 2px 7px 3px; }

.basket-resume
{  }

	.basket-resume h4
	{ padding: 0; margin: 0; font-weight: 500; font-size: 14px; }

	.basket-resume p
	{ font-size: 12px; font-weight: 500; margin: 0; padding: 0; }

	.basket-resume p.price
	{ font-weight: 600; }

	.basket-resume .row-fluid
	{ border-bottom: 1px solid #EEEEEE; margin-bottom: 16px; padding-bottom: 8px; }

	.basket-resume:last-child
	{ border-bottom: none; }


/*TABS*/

.tab-pane
{ border: 1px solid #DDDDDD; padding: 20px; border-radius: 8px; }

.nav-tabs
{ border: none; }

.nav-tabs>li>a
{ border-radius: 8px; }


@media screen and (max-width: 768px){
    #basket_frame {
     position: static !important;
    }
}

@media (max-width: 767px){
	.nav-tabs>li, .nav-pills>li { width: 100%!important; margin-bottom: 2px!important; max-width: 100%!important; }


    .block-checkout h3 span
    { float: inherit; margin-top: 3px; margin-left: 1px; margin-right: 3px; }

    .block-checkout h3 span:first-of-type
    { margin-left: 21px; }

    .block-checkout{
        border-right: 1px solid #EEEEEE;
        max-width: 800px;
        margin: 20px auto;
        padding: 15px 25px;
        box-shadow: 5px 25px 35px #3535356b;
        background: #FFFFFF;
        border-radius: 0.25rem!important;

    }

}


/*cards*/


.card-border
{

	background-color: #ffffff;
	position: relative;
    border: 1px solid #cccccc;
    -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
    -webkit-transition: border linear .2s, box-shadow linear .2s;
    -moz-transition: border linear .2s, box-shadow linear .2s;
    -o-transition: border linear .2s, box-shadow linear .2s;
    transition: border linear .2s, box-shadow linear .2s;
	color: #555555;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;

}


.error .card-border input
{ border: none!important; }

.error .card-border
{ border: 1px solid red; }

	.card-inside
	{ position: relative; padding-left: 50px!important; border: none!important; margin-bottom: 0!important; }

	.card-border span
	{ position: absolute; align-self: center; width: 31px; left: 18px; top: 13px; }

	.control-label
	{ margin-top: 10px; }

	.radio input[type="radio"], .checkbox input[type="checkbox"]
	{ margin-left: -24px; }

	input[type="radio"]
	{ width: auto; height: auto; }

	.form-stacked-row select
	{ height: 42px; }


.switchcards {
    position: absolute;
    top: -5px;
    right: 0px;
    height: 36px;
    width: 100px;
    display: block;
}

/*
recurring
*/


.well-gray
{ background: #EEEEEE; position: relative; padding: 30px 20px 10px 20px; border: 1px solid #DDDDDD; margin-top: 20px; font-size: 12px; }

	.well-gray h4
	{ position: absolute; left: 10px; top: -20px; background: #FFFFFF; padding: 0 5px; font-size: 14px; }

	.well-gray p
	{ font-size: 12px; line-height: 14px; }



/*messages*/

.alert
{  margin: 0; }

.alert .close
{ right: 0px; }

.alert-danger, .alert-error
{ background-color: #FFFFFF; border-color: #CCCCCC; }

        :root {
            --error-color: #FC6362;
            --sucess-color: #48C55D;
            --color-text: #AAAEB2;
        }


        #messages {
            /*background-color: #FFFFFF;*/
            border-radius: 10px!important;
            display: block;            
            color: var(--color-text);
            position: relative;
            box-shadow: 8px 8px 10px rgba(69, 69, 69, 0.1);
            z-index: 100;
            width: 100%;
            margin-top: 20px;

        }

        #messages .alert {
            display: block;
            align-items: center;
            padding: 0;
            padding-left: 75px;
            padding-bottom: 4px;
            width: auto;
            height: 60px;
            line-height: 60px;
            position: relative;
            border: none;
            border-radius: 5px;
            margin-bottom: 4px;
        }

        #messages .alert::before {
            content: " ";
            display: block;
            position: absolute;
            width: 8px;
            height: 100%;
            top: 0px;
            left: 0px;
            background-color: var(--sucess-color);
            border-radius: 5px  0 0 5px;
        }

        #messages .alert::after {
            content: " ";
            width: 32px;
            height: 32px;
            display: block;
            background: url('icon-sucess.svg') no-repeat top left;
            position: absolute;
            top: 50%;
            left: 25px;
            transform:translate(0, -50%);
        }

        #messages .alert-error::before {
            background-color: var(--error-color);
        }

        #messages .alert-error::after {
            background: url('icon-error.svg') no-repeat top left;
        }

        #messages a {
            text-transform: uppercase;
            border-left: 1px solid #666666;
            margin-left: 20px;
            padding: 21px;
            text-decoration: none;
            color: var(--color-text);
            transition: all 0.3s ease;
            top: 0;
        }

        #messages a:hover {
            text-decoration: none;
            background-color: #666666;
            border-radius: 0 10px 10px 0;
        }

/* .control-group */

.control-group
{ margin-bottom: 0; }


/*address*/

.address-form .control-label
{ margin-top: 0; font-size: 13px; margin-bottom: 1px; }

.modal-body
{ padding: 5px 15px; background-color: #EEEEEE; }

/*basket resume*/


@media (max-width: 767px){

    .line_form
    { font-size: 16px; }

        .line_form a
        { padding: 2px; }

    .basket-resume p.price
    { font-size: 14px; margin-top: 2px; margin-bottom: 2px; }

    .basket-resume h4
    { font-size: 15px; }

    #messages .alert
    { padding-left: 20px; line-height: 18px; height: auto; padding-top: 15px; min-height: 30px; }

    #messages a
    { padding-top: 2px; padding-bottom: 3px; }

}


/* custom scrollbar */
::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background-color: transparent;
}

::-webkit-scrollbar-thumb {
  background-color: #d6dee1;
  border-radius: 10px;
  border: 3px solid transparent;
  background-clip: content-box;
}

::-webkit-scrollbar-thumb:hover {
  background-color: #333333;
}


.controls {
    position:relative;
}


.eye--icon {
    position: absolute;
    right: 2%;
    display: block;
    width: 25px;
    height:15px;
    margin-top: -31px;
    background: url(../images/eye-icon-slash.svg) no-repeat;
    cursor: pointer;
}

.eye--slash {
    background: url(../images/eye-icon.svg) no-repeat;
    
}

@media (min-width: 576px) { 
    .eye--icon {
        right:2%;
    }
 }

 @media (min-width: 768px) { 
    .eye--icon {
        right: 2%;
    }
 }

 /*cards*/

.card-visa
{ content: url('../images/cards/card-visa.svg'); margin: 2px 0 0 -6px; }

.card-master
{ content: url('../images/cards/card-master.svg'); margin: -1px 0 0 -6px; }

.card-amex
{ content: url('../images/cards/card-amex.svg'); margin: -2px 0 0 -6px; }

.card-jcb
{ content: url('../images/cards/card-jcb.svg'); margin: -1px 0 0 -6px; }

.card-discover
{ content: url('../images/cards/card-discover.svg'); margin: -1px 0 0 -6px; }

.card-diners
{ content: url('../images/cards/card-diners.svg'); margin: -1px 0 0 -6px; }

.card-hipercard
{ content: url('../images/cards/card-hipercard.svg'); margin: -1px 0 0 -6px; }

.card-elo
{ content: url('../images/cards/card-elo.svg'); margin: -1px 0 0 -6px; }

/**/

div.small p
{ font-size: 12px; margin-top: -6px; }



.card-isoladas .form-up {
    color: #475E8A;
    text-transform: uppercase;
    display: grid;
    gap: 4px;
    grid-template-columns: repeat(auto-fit, minmax(210px, 1fr ));
    
    
}

.card-isoladas .form-up h4 {
    font-size: 1rem;
    font-weight: 700;

    text-align: center;
}

.card-isoladas figure {
    display: block;
    width: 100%;
    display: block;
}

.card-isoladas figure img {
    width:100% ;
    border-radius: 5px;
}

.card-isoladas span  {
    color: #475E8A;
    font-weight: 600;
    font-size: 1.1rem;
    text-align: center;
    width: 100%;
    display: block;
}

.card-isoladas span strong {
    color: #468847;
    text-decoration: line-through 3.5px;
}

.card-isoladas span strong:last-child {
    text-decoration: none;
}

.card-isoladas span i {
    color: #B4B4B4;
    font-style: normal;
}

.card-isoladas .form-up button {
    
    border: 0;
    color: white;
    border-radius: 5px;
    margin-top: 10px;
    padding: 5px;
    font-weight: 700;
    text-transform: uppercase;
    font-size: .7rem;
    width: 100%;
}

.icon-carrinho {
    display: block;
    width: 20px;
    height: 20px;
    float: left;
    margin-right: 10px;
    margin-top: -1px;
}

.card-item {
    border: 1px solid #e6e6e6;
    max-width: 180px;
    padding: 10px;
    border-radius: 5px;
    margin-top: 10px;
}


@media screen and (max-width: 750px) {
    .card-isoladas .form-up {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr ));
    }

    .card-item { 
        width: 205px;
    }
}