/* #########################################################*/
/*														 	*/
/*							 LOGIN					        */
/*														    */
/* #########################################################*/
.btn-login { 
    display: inline-block; 
    *display: inline; 
    *zoom: 1; 
    padding: 4px 10px 4px; 
    margin-bottom: 0; 
    font-size: 13px; 
    line-height: 18px; 
    color: #333333; 
    text-align: center;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75); 
    vertical-align: middle; 
    /*background-color: #f5f5f5; */
    /* background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -ms-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
    background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: linear-gradient(top, #ffffff, #e6e6e6);
    background-repeat: repeat-x;
    filter: progid:dximagetransform.microsoft.gradient(startColorstr=#ffffff, endColorstr=#e6e6e6, GradientType=0);
    border-color: #e6e6e6 #e6e6e6 #e6e6e6;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    border: 1px solid #e6e6e6;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px; */
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); 
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); 
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); 
    cursor: pointer; 
    *margin-left: .3em; 
}

.btn-login:hover, .btn:active, .btn.active, .btn.disabled, .btn[disabled] { background-color: #e6e6e6; }
.btn-large { padding: 9px 14px; font-size: 15px; line-height: normal; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.btn:hover { color: #333333; text-decoration: none; background-color: #e6e6e6; background-position: 0 -15px; -webkit-transition: background-position 0.1s linear; -moz-transition: background-position 0.1s linear; -ms-transition: background-position 0.1s linear; -o-transition: background-position 0.1s linear; transition: background-position 0.1s linear; }
.btn-primary, .btn-primary:hover { text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); color: #ffffff; }
.btn-primary.active { color: rgba(255, 255, 255, 0.75); }
.btn-primary { background-color: #4a77d4; background-image: -moz-linear-gradient(top, #6eb6de, #4a77d4); background-image: -ms-linear-gradient(top, #6eb6de, #4a77d4); background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#6eb6de), to(#4a77d4)); background-image: -webkit-linear-gradient(top, #6eb6de, #4a77d4); background-image: -o-linear-gradient(top, #6eb6de, #4a77d4); background-image: linear-gradient(top, #6eb6de, #4a77d4); background-repeat: repeat-x; filter: progid:dximagetransform.microsoft.gradient(startColorstr=#6eb6de, endColorstr=#4a77d4, GradientType=0);  border: 1px solid #3762bc; text-shadow: 1px 1px 1px rgba(0,0,0,0.4); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.5); }
.btn-primary:hover, .btn-primary:active, .btn-primary.active, .btn-primary.disabled, .btn-primary[disabled] { filter: none; background-color: #4a77d4; }
.btn-block { width: 100%; display:block; }

* { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; -o-box-sizing:border-box; box-sizing:border-box; }

html { width: 100%; height:100%; overflow:hidden; }

body { 
	width: 100%;
	height:100%;
	font-family: 'Open Sans', sans-serif;
	background: #092756;
	background: -moz-radial-gradient(0% 100%, ellipse cover, rgba(104,128,138,.4) 10%,rgba(138,114,76,0) 40%),-moz-linear-gradient(top,  rgba(57,173,219,.25) 0%, rgba(42,60,87,.4) 100%), -moz-linear-gradient(-45deg,  #670d10 0%, #092756 100%);
	background: -webkit-radial-gradient(0% 100%, ellipse cover, rgba(104,128,138,.4) 10%,rgba(138,114,76,0) 40%), -webkit-linear-gradient(top,  rgba(57,173,219,.25) 0%,rgba(42,60,87,.4) 100%), -webkit-linear-gradient(-45deg,  #670d10 0%,#092756 100%);
	background: -o-radial-gradient(0% 100%, ellipse cover, rgba(104,128,138,.4) 10%,rgba(138,114,76,0) 40%), -o-linear-gradient(top,  rgba(57,173,219,.25) 0%,rgba(42,60,87,.4) 100%), -o-linear-gradient(-45deg,  #670d10 0%,#092756 100%);
	background: -ms-radial-gradient(0% 100%, ellipse cover, rgba(104,128,138,.4) 10%,rgba(138,114,76,0) 40%), -ms-linear-gradient(top,  rgba(57,173,219,.25) 0%,rgba(42,60,87,.4) 100%), -ms-linear-gradient(-45deg,  #670d10 0%,#092756 100%);
	background: -webkit-radial-gradient(0% 100%, ellipse cover, rgba(104,128,138,.4) 10%,rgba(138,114,76,0) 40%), linear-gradient(to bottom,  rgba(57,173,219,.25) 0%,rgba(42,60,87,.4) 100%), linear-gradient(135deg,  #670d10 0%,#092756 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3E1D6D', endColorstr='#092756',GradientType=1 );
	/* background: #fff !important; */
}
.login { 
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -150px 0 0 -150px;
	width:300px;
	height:300px;
}
.login h1 { color: #fff; text-shadow: 0 0 10px rgba(0,0,0,0.3); letter-spacing:1px; text-align:center; }

input { 
	width: 100%; 
	margin-bottom: 10px; 
	background: rgba(0,0,0,0.3);
	border: none;
	outline: none;
	padding: 10px;
	font-size: 13px;
	color: #fff;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
	border: 1px solid rgba(0,0,0,0.3);
	border-radius: 4px;
	box-shadow: inset 0 -5px 45px rgba(100,100,100,0.2), 0 1px 1px rgba(255,255,255,0.2);
	-webkit-transition: box-shadow .5s ease;
	-moz-transition: box-shadow .5s ease;
	-o-transition: box-shadow .5s ease;
	-ms-transition: box-shadow .5s ease;
	transition: box-shadow .5s ease;
}
input:focus { box-shadow: inset 0 -5px 45px rgba(100,100,100,0.4), 0 1px 1px rgba(255,255,255,0.2); }


/* #########################################################*/
/*														 	*/
/*						    HEADER					        */
/*														    */
/* #########################################################*/

.navbar{
	background: var(--header);
}

.sidebar-toggle {cursor: pointer;}

.sidebar-toggle > .menu-hamburgue {
	color: #37689b;
	font-size: 20px;
	position: relative;
	top: 3px;
}

.navbar-brand {width: 120px;}
.menu-header {color: #fff !important;}

.dropdown-item {color: #6a6868;}
.dropdown-item > span{font-size: 13px;}

.sidebar {
    background-color: #222c3c;
    min-width: 250px;
    max-width: 250px;
    min-height: calc(100vh - 56px); /*ocupa 100% da página - 56px do menu */
    transition: all 0.3s;
}

.sidebar ul li a {
    display: block;
    padding: 0.75rem 1rem;
    color: #c7cace;
    text-decoration: none;
}

.sidebar ul li a:hover, .sidebar ul .active a { /*active para deixar ativo para saber qual página o usuário está */
    color: #ecedee;
    background-color: #354358;
}

.sidebar ul ul a {
    padding-left: 2.5rem;
    background-color: #1e2835;
}

.sidebar [data-toggle="collapse"] {
    position: relative;
}

/* ADICIONA O ICONE DE SETINHA PARA BAIXO NA LISTAS DO MENU */
.sidebar [data-toggle="collapse"]:before {
    content: "\f0d7";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    position: absolute;
    right: 1rem;
}

/* QUANDO CLICAR NO ITEM DO MENU ELE FICA COM A COR DIFERENTE */
.sidebar [aria-expanded="true"] {
    background-color: #19222d;
}

/* MUDA O ICONE DA SETINHA DE BAIXO PARA CIMA AO CLICA NO ITEM DO MENU */
.sidebar [aria-expanded="true"]:before {
    content: "\f0d8";
}

.list-unstyled li a i {margin-right: 5px;}

/*PEGANNDO O VALOR DO JS - SELETOR UTILIZADO PARA ATIVAR O BOTÃO OCULTAR MENU NO PC*/
/* .sidebar.toggled {
    margin-left: -250px; 
} */

/* #########################################################*/
/*														 	*/
/*						  CONTAINER					        */
/*														    */
/* #########################################################*/
.content {width: 100%;}

.titulo {
	color: #6c757d;
	font-family: sans-serif;
	text-transform: uppercase;
	font-size: 1.2rem;
}

.column {margin-bottom: 1rem;}

.list-group-item,
.card {
	background-color: var(--card);
	color: var(--text);
}

.card.card-xs {
   height: 95px;
   overflow: hidden;
}

.card-body-welcome {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.card-welcome {bottom: 25px !important;}
.card-welcome .img-welcome {width: 100px;}
.card-text {font-family: inherit;}

.pn-h {
   position: relative;
   bottom: 62px;
}

.pn-i {
    position: relative;
    bottom: 9px;
}

.pn-i.cdi-3,
.pn-i.cdi-4 {bottom: 8px;}

.pn-h.cd-3 {bottom: 62px;}
.pn-h.cd-4 {bottom: 64px;}
.title-number {font-size: 1.2rem;}
.title-number > span{font-size: 0.95rem;}

.title-description {
    font-size: 1rem;
    text-transform: capitalize;
}

.input-acess,
.input-span {
	background-color: #151a30!important;
    border-color: #101426!important;
    box-shadow: 0 1px 0 0 #101426!important;
    color: #fff!important;
}

.input-span {
	border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}


/* #########################################################*/
/*														 	*/
/*							 RENOVAR					    */
/*														    */
/* #########################################################*/
/* .signature{
	text-transform: uppercase;
	font-size: 1.4rem!important;
}

.btn-purchase {
	background-color: transparent;
	border-color: #07a7e3!important;
   color: #0583b2!important;
}

.btn-purchase:hover {
	background-color: transparent;
	border-color: #0583b2!important;
   color: #07a7e3!important;
}

.value-original {text-decoration: line-through;} */
.j_input_package,
.j_input_package:focus,
.j_select_gateway,
.j_select_gateway:focus {
    background-color: #2a3042; 
    border: 0 solid #32394e; 
    color: #adadad;
}

.j_input_package option,
.j_select_gateway option {
    background-color: #2a3042; 
    border: 0 solid #32394e; 
    color: #adadad;
}

.btn-pgt {
    color: var(--text);
    background-color: #485ec4;
    border-color: #4458b8;
}

.mini-stats-wid {margin-bottom: 1rem;}

.card-title{
    display: flex;
    justify-content: space-between;
    font-family: Poppins,sans-serif!important;
    text-transform: uppercase;
    font-size: 1rem;
    padding-top: 0.5rem;
    /* padding-left: 2rem;
    padding-right: 2rem; */
}

.pct-ass {font-size: 15px;}
.cd-title {bottom: 0}
.td-bt {bottom: 35px;}
.td-ct{text-align: center!important;}

.j_input_package:focus,
.j_select_gateway {box-shadow: 0 0 0 0.2rem rgba(40, 42, 44, 0.25) !important;}

.j_price {color:#f6f6f6}

.mini-stat-icon {
    position: relative; 
    overflow: hidden; 
    height: 3rem; 
    width: 3rem;
}

.rounded-circle:before {
    content: "";
    position: absolute;
    width: 8px;
    height: 54px;
    background-color: rgba(255,255,255,.1);
    left: 16px;
    -webkit-transform: rotate(32deg);
    transform: rotate(32deg);
    top: -5px;
    -webkit-transition: all .4s;
    transition: all .4s;
}

.mini-stat-icon .avatar-title {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #556ee6;
    color: #fff;
    font-weight: 500;
    width: 100%;
    height: 100%; 
}

.mini-stat-icon .avatar-title > i {font-size: 24px!important;}

/* #########################################################*/
/*														 	*/
/*							 RESUME					        */
/*														    */
/* #########################################################*/
/* .card-resume {
    font-family: Poppins,sans-serif!important;
    text-transform: uppercase;
    font-size: 1rem;
    padding-top: 2rem;
    padding-left: 2rem;
    padding-right: 2rem;
}

.td-bt {bottom: 35px;}
.td-ct{text-align: center!important;} */

/* #########################################################*/
/*														 	*/
/*						  INDICAÇÃO						    */
/*														    */
/* #########################################################*/
.textarea-acess {
   background-color: #151a30!important;
   border-color: #101426!important;
   box-shadow: 0 1px 0 0 #101426!important;
   color: #fff!important;
}

.msg_regInd {
    background-color: var(--body);
}
/* #########################################################*/
/*														 	*/
/*						    HÍSTÓRICO						*/
/*														 	*/
/* #########################################################*/    
.select-acess {
	background-color: #151a30!important;
   border-color: #101426!important;
   box-shadow: 0 1px 0 0 #101426!important;
   color: #fff!important;

   width: 90px;
   margin-right: 10px;
   border-radius: 5px;
   padding: 0 0.75rem;
   box-sizing: content-box;
}

.fs {font-size: 14px;}

.input-history {height: calc(1.8125rem + 2px);}

.history-search {text-align: right;}

.history-search > label {
	font-weight: normal;
   white-space: nowrap;
   text-align: left;
}

.basic-addon2 {
	font-family: Poppins,sans-serif!important;
   font-size: 10px;
   text-transform: uppercase;
   cursor: pointer;
   background: #07a7e3;
   border: 1px solid #07a7e3;
   color: var(--text);
}

.basic-addon2:hover {background: #25bff8;}
.icon-pesquisa {margin-right: 2px;}
.table td, .table th {border-top: 1px solid #151a30;}
.table thead th {border-bottom: 1px solid #151a30;}
.table-striped tbody tr:nth-of-type(odd) {background-color: #151a30;}
.table {text-align: center;}
.dataTables_empty,
.dataTables_info {font-size: 14px;}

/* #########################################################*/
/*														 	*/
/*						    MODAL						    */
/*														 	*/
/* #########################################################*/
.modal-content {
    background-color: var(--card);
    color: var(--text);
}

#modal-bodyDelete,
#modal-bodyDeletePay,
#modal-exitFooter {
    display: flex;
    justify-content: center;
}

.form-row > .form-group > label {color: var(--text) !important;}
.form-row > .form-group > input {background-color: #151a30};

.modal-header {border-bottom: 1px solid rgba(0,0,0,.125);}
.modal-header > .close {color: var(--text);}
.modal-header > .close:hover {color: var(--red) !important;}

.modal-content-pix {background-color: #151a30 !important;}

.modal-header-pix {
    background-color: #151a30 !important;
    border-color: #101426 !important;
    box-shadow: 0 1px 0 0 #101426 !important;
    color: var(--text);
}

.modal-pix {
    padding: 0; 
    background-color: var(--card);
    color: var(--text);
}

.modal-header-pix > .close > span {color: var(--text);}

.table-pix {margin-bottom: 0;}

.table-pix thead th {
    border-top: 1px solid #151a30;
    border-bottom: 1px solid #151a30;
}

.table-pix > tbody > tr > td {padding: 1rem;}
.table-pix tr > td > img {width: 50px;}

.table-pix > tbody > tr > td:nth-child(2),
.table-pix > tbody > tr > td:nth-child(3) {
    position: relative;
    top: 15px;
}

/* #########################################################*/
/*														    */
/*							FOOTER					        */
/*														    */
/* #########################################################*/
.text-footer {
	color: var(--text-footer);
	font-size: 14px;
}

/* #########################################################*/
/*														 	*/
/*						 MEDIA QUERIES						*/
/*														 	*/
/* #########################################################*/
/*1366px*/
@media (max-width: 86em) {
    .content {padding: 2rem!important;}
    .title-number {font-size: 1rem;}
}

/*992px*/
@media (max-width: 62em) {
	.cmb {margin-bottom: 1rem!important;}
	.cm {margin-bottom: 2rem}
}

/*768px*/
@media (max-width: 48em) {
    .sidebar {
        margin-left: -250px; /*Oculta o sidebar quando for a menor que 768px */
    }

    .sidebar.toggled {
        margin-left: 0; /*pegado o valor do js - ativa o botão mostrar*/
    }
}

/*400px*/
@media (max-width: 25em) {
    .content {padding: 1rem!important;}
	/* .content {padding: 0.5rem!important;} */
}



/*576px*/
@media (min-width: 36em) {
    #modal-dialog {
        max-width: 500px !important;
        margin: 1.75rem auto;
    }
}

/*992px*/
@media (min-width: 62em) {
    #modal-lg, #modal-xl {
        max-width: 800px !important;
    }
}

/*1200px*/
@media (min-width: 75em) {
    #modal-xl {
        max-width: 1140px !important;
    }
}

/*1366px*/
@media (min-width: 86em) {
	.col-card {
		flex: 0 0 25%;
    	max-width: 25%;
	}
}