/*tAMANHOS*/
.w-100{width:100%;}
.w-50{width:50%;}
.w-20{width:20%;}
.w-10{width:10%;}
.w-5{width:5%;}

.fw-700{font-weight:700;}
.fw-300{font-weight:300;}
.fw-400{font-weight:400;}

/*display*/
.d-block{display:block!important}
.d-inline-block{display:inline-block!important}
.d-none{display:none!important}
.d-table{display:table!important}
.d-flex{display:flex!important}

/*float*/
.float-left{float:left!important}
.float-right{float:right!important}
.float-none{float:none!important}

/*text*/
.text-center{text-align:center!important}
.text-left{text-align:left!important}
.text-right{text-align:right!important}
.text-justify{text-align:justify!important}
.text-uppercase{text-transform:uppercase!important}
.text-end{justify-content:flex-end!important}

.justify-center{justify-content: center!important;}
.justify-between{justify-content: space-between!important;}

.center-middle{align-items: center;}

/*padding*/
.p-5{padding:3rem!important}
.p-4{padding:2rem!important}
.p-3{padding:1rem!important}
.p-2{padding:.9rem!important}
.p-1{padding:.6rem!important}
.p-0{padding:0!important}

/*padding- y*/
.pt-5,.py-5{padding-top:3rem!important}
.pb-5,.py-5{padding-bottom:3rem!important}

.pt-4,.py-4{padding-top:2rem!important}
.pb-4,.py-4{padding-bottom:2rem!important}

.pt-3,.py-3{padding-top:1rem!important}
.pb-3,.py-3{padding-bottom:1rem!important}

.pt-2,.py-2{padding-top:.9rem!important}
.pb-2,.py-2{padding-bottom:.9rem!important}

.pt-1,.py-1{padding-top:.6rem!important}
.pb-1,.py-1{padding-bottom:.6rem!important}

.pt-0,.py-0{padding-top:0!important}
.pb-0,.py-0{padding-bottom:0!important}


/*padding- x*/
.pl-5,.px-5{padding-left:3rem!important}
.pr-5,.px-5{padding-right:3rem!important}

.pl-4,.px-4{padding-left:2rem!important}
.pr-4,.px-4{padding-right:2rem!important}

.pl-3,.px-3{padding-left:1rem!important}
.pr-3,.px-3{padding-right:1rem!important}

.pl-2,.px-2{padding-left:.9rem!important}
.pr-2,.px-2{padding-right:.9rem!important}

.pl-1,.px-1{padding-left:.6rem!important}
.pr-1,.px-1{padding-right:.6rem!important}

.pl-0,.px-0{padding-left:0!important}
.pr-0,.px-0{padding-right:0!important}


/*margin- y*/
.mt-5,.my-5{margin-top:3rem!important}
.mb-5,.my-5{margin-bottom:3rem!important}

.mt-4,.my-4{margin-top:2rem!important}
.mb-4,.my-4{margin-bottom:2rem!important}

.mt-3,.my-3{margin-top:1rem!important}
.mb-3,.my-3{margin-bottom:1rem!important}

.mt-2,.my-2{margin-top:.9rem!important}
.mb-2,.my-2{margin-bottom:.9rem!important}

.mt-1,.my-1{margin-top:.6rem!important}
.mb-1,.my-1{margin-bottom:.6rem!important}

.mt-0,.my-0{margin-top:0!important}
.mb-0,.my-0{margin-bottom:0!important}


/*margin- x*/
.ml-5,.mx-5{margin-left:3rem!important}
.mr-5,.mx-5{margin-right:3rem!important}

.ml-4,.mx-4{margin-left:2rem!important}
.mr-4,.mx-4{margin-right:2rem!important}

.ml-3,.mx-3{margin-left:1rem!important}
.mr-3,.mx-3{margin-right:1rem!important}

.ml-2,.mx-2{margin-left:.9rem!important}
.mr-2,.mx-2{margin-right:.9rem!important}

.ml-1,.mx-1{margin-left:.6rem!important}
.mr-1,.mx-1{margin-right:.6rem!important}

.ml-0,.mx-0{margin-left:0!important}
.mr-0,.mx-0{margin-right:0!important}

.m-auto{margin:0 auto!important}

/*border*/
.border-left{border-left:solid 1px #2e1b56!important}
.border-right{border-right:solid 1px #2e1b56!important}
.border-top{border-top:solid 1px #2e1b56!important}
.border-bottom{border-bottom:solid 1px #2e1b56!important}
.border{border:solid 1px #2e1b56!important}
.border-0{border:0!important}

.border-bottom-dashed {border-bottom:dashed 1px #2e1b56!important}

/*fonts h*/
.h1{font-size:3.1rem!important;margin-bottom:20px;display:block;}
.h2{font-size:2.5rem!important;margin-bottom:20px;display:block;}
.h3{font-size:1.8rem!important;margin-bottom:20px;display:block;}
.h4{font-size:1.5rem!important;margin-bottom:20px;display:block;}
.h5{font-size:1.1rem!important;margin-bottom:20px;display:block;}
.h6{font-size:.9rem!important;margin-bottom:20px;display:block;}

.grande-font{font-size:4rem!important}
.medio-font{font-size:3rem!important}
.pequeno-font{font-size:2rem!important}
.minimo-font{font-size:1.2rem!important}

/*links*/
.link-azul{color:#3aa6ea!important;text-decoration:none}
.link-azul:hover{color:#57abe0!important;text-decoration:underline}

.link-vermelho{color:#ff7373!important;text-decoration:none}
.link-vermelho:hover{color:#fb9090!important;text-decoration:underline}

.link-verde{color:#4dd898!important;text-decoration:none}
.link-verde:hover{color:#59e4c2!important;text-decoration:underline}

.link-roxo{color:#4968d1!important;text-decoration:none}
.link-roxo:hover{color:#8ba2ef!important;text-decoration:underline}

/*links*/
.text-azul{color:#3aa6ea!important;}
.text-vermelho{color:#da3b3b!important}
.text-verde{color:#2cb783!important;}
.text-roxo{color:#4968d1!important;}
.text-branco{color:#fff!important;}
.text-escuro{color:#7c7878!important}
.text-padrao{color: #759f8d!important;}
.text-laranja{color: orange!important}

/*position*/
.position-relative{position:relative!important;}
.position-absolute{position:absolute!important;}
.position-inherit{position:inherit!important;}
.position-normal{position:normal!important;}
.position-fixed{position:fixed!important;}

/*border-radius*/
.radius-circulo{border-radius:50%!important;overflow:hidden!important;}
.radius-4{border-radius:4px!important;}
.radius-50{border-radius:50px!important;}
.radius-0{border-radius:0px!important;}
.radius-radius-ty{border-radius:0 .5rem .5rem 0!important;}
.opaco{opacity:.8;}

/*largura*/
.width-100{width:100%!important}
.width-50{width:50%!important}
.width-30{width:30%!important}
.width-10{width:10%!important}

/*botoes*/
.btn{	display:block;	padding:11px 15px;border-radius:3px;-webkit-border-radius:3px;	-moz-border-radius:3px;	-o-border-radius:3px;	background:#fff;	border:solid 1px #FFFFFF;	color:#100f0f;	text-align:center;	text-transform:uppercase;	text-decoration:none;	transition:all .4s;	font-size:.9rem;	font-weight: 600;}
.btn:hover{		box-shadow:inset 0 0 7px 0 #0000007d;	transition:all .4s;	cursor:pointer;}

.btn.btn-azul{	border:solid 1px #3aa6ea;	background:#3aa6ea;	color:#FFF!important}
.btn.btn-amarelo{	border:solid 1px #ffd800;	background:#ffd800;	color:#000!important}
.btn.btn-vermelho{	border:solid 1px #ff7373;	background:#ff7373;}
.btn.btn-roxo{	border:solid 1px #ad93fe;	background:#ad93fe;}
.btn.btn-verde{	border:solid 1px #21dc85;	background:#60e2a6;}
.btn.btn-laranja{	border:solid 1px #fbb661;	background:#fbc27c;}
.btn.btn-padrao{	border: solid 1px #e83c18;    background: #e83c18;    color: #fff;}

.btn-gradient-amarelo{
	background: linear-gradient(180deg, #fdf989, #fd8e07) fixed;
    border-color: #ffc200;
}



/*btn outline*/
.btn-outline-branco{	border:solid 1px #fff;	background:none!important;	color:#fff!important;}
.btn-outline-azul{	border:solid 1px #0c8dde;	background:none!important;	color:#0c8dde!important;}
.btn-outline-vermelho{	border:solid 1px #e86868;	background:none!important;	color:#e86868!important;}
.btn-outline-verde{	border:solid 1px #4dd898;	background:none!important;	color:#4dd898!important;}
.btn-outline-roxo{	border:solid 1px #7892ea;	background:none!important;	color:#7892ea!important;}
.btn-outline-amarelo{	border:solid 1px #e8f791;	background:none!important;	color:#e8f791!important;}
.btn.btn-grande{	font-size:1.5rem;	padding:.8rem 1.2rem}
.btn.btn-pequeno{	font-size: .8rem;    padding: .3rem .8rem;}
.btn.btn-neutro{	font-size: .8rem;    padding: .3rem .8rem;	background:#ccc;	border-color: #bababa;    color: #5e5e5e;	cursor: no-drop;}
.btn-link{	font-size: .85rem;    padding: .3rem .8rem;    color: #5e5e5e;
	padding:.35rem .29rem;	border:solid 1px #5e5e5e;	border-radius:3px;}
.btn-position{	position:absolute;	top: 33px;    right: 15px;    padding: .47rem .9rem!important;    border-radius: 0 4px 4px 0!important;}
/*embed*/
.embed-responsive {    position: relative;    height: 0;    padding-bottom: 56.5%;}

.embed-responsive iframe,
.embed-responsive embed,
.embed-responsive object,
.embed-responsive video {  position: absolute;  top: 0;  bottom: 0;  left: 0;  width: 100%;  height: 100%;  border: 0;  background:#000}

/*img*/
.img-fluido{max-width:100%;}
.form-campo{	width:100%; 	max-width:100%; 	padding:10px; 	background: #f5f4f400;    border:solid 1px #523593;    border-radius: 4px;    box-shadow: 0 0 5px inset #00000021;	color:#868686dd}
.form-campo::placeholder{color:#a3a1a1dd}

input[type=date].form-campo::-webkit-calendar-picker-indicator {
	filter: invert(0.8) brightness(90%) sepia(100%) saturate(0%) hue-rotate(20deg); height: 16px;
  }
input[type=date].form-campo{padding:8px 10px; }
select.form-campo{padding:10px!important; }
.form-campo.grande, input[type=date].grande, select.grande {
    padding: .8rem!important;   font-size: 1rem;}
.form-campo.neutro, input[type=date].neutro, select.neutro {        padding: .4rem 0!important;    font-size: 1.1rem;    background: none!important;    border: 0!important;    box-shadow: none!important;    color: #333;}
.text-label{	display:block;	color:#ffffffde;	padding-bottom:.3rem;	font-size:.9rem}

.bg-title {    background: none;    color: #e7e7e7;    text-align: center;	display:flex;	justify-content:center;	align-items:center}
.bg-title.between {justify-content:space-between!important;}
.bg-title .icon{margin-right:10px}
.bg-title .icon.cadastro path{stroke:#A383FF!important}
.bg-title .icon.compra path{stroke:#FDFF83!important}
.bg-title .icon.venda path{stroke:#F66648!important}
.bg-title .icon.estoque path{stroke:#DC6FEE!important}
.bg-title .icon.financeiro path{stroke:#03DA73!important}
.bg-title .icon.pdv path{stroke:#3ada03!important}
.bg-title .icon.loja path{stroke:#f78527!important}
.bg-title .icon.producao path{stroke:#8AC6E9!important}
.bg-title2 {   background:#5e76ca!important;}
.bg-title3 {   background: #361f6a!important;}

/*cat-estoque
.bg-estoque {background: #8e1ea1!important;}
.cat-estoque .table{border-color:#d760eb9c!important;}
.cat-estoque .table td{border-color:#d760eb9c!important;}
.cat-estoque .caixa{border-color:#761ea1!important;}
.cat-estoque .cx{    border-color: #5a1b64!important; background: #271140!important;}
.cat-estoque .table th {   background: #341d62!important;color:#ffffffcf!Important}
.cat-estoque .btn.btn-azul { border: solid 1px #8c3aea!important;  background: #963aea!important;}
*/

/*cat-financeiro
.bg-financeiro {background: #216e4b!important;}
.cat-financeiro .table,.cat-financeiro .dataTables_wrapper{border-color:#1c995d94!important;}
.cat-financeiro .table td{border-color:#1c995d94!important;}
.cat-financeiro .caixa{border-color:#1c995d94!important;}
.cat-financeiro .table th {   background: #19292c!important;color:#ffffffcf!Important;    border-bottom: 1px solid #155944;}
.cat-financeiro .btn.btn-azul {border: solid 1px #154230!important;   background: #60e2a6!important;   color: #000!important;}
.cat-financeiro fieldset,.cat-financeiro .caixafield,.cat-financeiro .mostraFiltro,.cat-financeiro .cx,.cat-financeiro .dataTables_filter input,.cat-financeiro  .dataTables_length select {  background:#122f30!important; border: solid 1px #1c995d!important;}
.cat-financeiro .form-campo {  background: #215548!important;   border: solid 1px #23ad6b!important;}
.cat-financeiro .total td {  background: #0d1822!important}

.cat-financeiro .dataTables_wrapper .dataTables_paginate .paginate_button.disabled, 
.cat-financeiro .dataTables_wrapper .dataTables_paginate .paginate_button {background: #17975c;}

.cat-financeiro .check input[type=checkbox] {  border: solid 2px #23ad6b;}
.cat-financeiro .check input[type=checkbox]:checked:before, .check input[type=checkbox]:checked {
    content: "✓";   
    border: solid 2px #23ad6b;   
    color: #23ad6b;
}

.cat-financeiro .caixa.detalhes{  background: #0d1822!important}
.cat-financeiro .caixa.detalhes .form-campo {color:#fff;  border: 0;    background: none!important;    border-bottom: solid 1px #23ad6b;box-shadow:none;border-radius: 0px;}
.cat-financeiro .caixa.detalhes .center-middle{gap:10px}
*/

.bg-padrao .btn.btn-roxo {   color: #fff;}
.bg-padrao .form-campo {    background: #f5f4f400;    border-color: #523593;}
.bg-branco{	background:#fff!important}
.bg-cinza{	background:#f5f4f4!important}
.card{position: relative;   display: -ms-flexbox;    display: flex;    -ms-flex-direction: column;    flex-direction: column;    min-width: 0;    word-wrap: break-word;    background-color: #fff;    background-clip: border-box;    border:1px solid rgb(203, 205, 224);    border-radius: .25rem;}

.table-bordered {	width:100%;    border: 1px solid #d3d9de;}
.table-bordered td, .table-bordered th {    border: 1px solid #e9ecef;	padding:.3rem;	font-size: .9rem;}
.table-bordered th {  background:#f2f3f5;}
.table-bordered tbody td {	color: #444;}
.table-bordered thead th {	color: #000;}

.table thead th {   vertical-align: bottom;    border-bottom: 1px solid #2e1b56;    padding: .3rem;    background:#747ea2;   color: #fff;    font-size: .89rem;}

/*padroes cores*/
.rolagem-tabela { height: 250px;   overflow-y: auto;}
.table tbody td {  border-bottom: 2px solid #e9ecef;	padding:.5rem;	color: #fff;    font-size: .9rem;}
.table{   width:100%;}
.table th{background: #A383FF!important;    color: #fff!important;}
.table tbody td {  border-bottom: 1px solid #a383ff;color:#fff!important}
.table{  border:solid 1px #A383FF!important; border-radius: 4px;}



#tab,#tabs {padding:0rem}
#tab ul.tabs>li,#tabs ul>li{	display: inline-block;    background: #554189;    color: #fff;    font-size: .8rem;    text-transform: uppercase;    border-radius: 4px 4px 0 0;   border: solid 1px #20123f;   border-bottom: 0;}
#tab ul.tabs>li>a,#tabs ul>li>a{	display:block;	padding:10px 15px;	color:#fff;	font-weight:300}

#tab ul.tabs>li>a:focus,#tabs ul>li>a:focus{outline:none}

#tab ul.tabs>li.ui-state-active>a,
#tabs ul>li.ui-state-active>a{background: #e83c18;    color: #e6e6e7;    border-radius: 4px 4px 0 0;    border: solid 1px #e83c18;    border-bottom: 0;    font-weight: 400;    position: relative;    bottom: -1px;}
#tab .cx-tab{	margin-top:-1px;	border:solid 1px #9ca7a0;	border-radius:0 0 4px 4px;	padding:1rem;}
.ui-widget-header {   border: 1px solid #2c1b52;    background: #20123f;   color: #333333;	padding:.3rem .3rem 0;	border-radius:4px}
.window.load{top: 190.804px!important;}

#fundo_preto{	position:fixed;	left:0;	right:0;	bottom:0;	background:#000;	z-index:1}

.msg{	display: block;    background: #de6d6d;    border-radius: 5px;    padding: 10px;    border: solid 1px #d74e4e;    color: #7f2e2e;    font-weight: 600;	margin-bottom:15px	}
	
.msg.sucesso{	background:rgba(0, 128, 0, 0.35);    border-color: #669866;    color: #4d754d;}
.msg.sucesso .fa-times{   color: #4d754d;}	
.msg.erro{	background: #e69f9f;    border-color: #967272;    color: #9a4848;}
.msg.erro .fa-times{   color: #9a4848;}
.msg.info{	background: #aed8e6;    border-color: #5899af;    color: #5594a9;}
.msg.info .fa-times{    color: #5594a9;}	


.msg ul,
.msg ol
{	padding-left:1.8rem;	padding-top:.8rem;    border-top:solid 1px #68a3ca;    margin-top: .5rem;}
.msg ul li,
.msg ol li
{	line-height:1.8rem;	font-size:.9rem}

.msg.msg-verde{	background: #a2d6ae;    border-color: #689a74;    color: #2e634d;}
.msg.msg-vermelho{	background: #e28585;    border-color: #e05c5c;    color: #942828;}
.msg.msg-amarelo{    background: #f5f0aa;    border-color: #f1cd79;    color: #c77226;}
.msg.msg-azul {    background: #a7d4f1;    border-color: #5c9ec7;    color: #206a98;}
/*mensagens de status*/
.status{position: relative;    padding: .3rem .8rem;    margin-bottom: 1rem;    border: 1px solid transparent;    border-radius: .25rem;}
.status.status-verde{	background: #a2d6ae;    border-color: #689a74;   color: #2e634d;}
.status.status-vermelho{	background: #e28585;    border-color: #e05c5c;    color: #942828;}
.status.status-amarelo{   background: #fcf489;    border-color: #cfac5c;    color: #9f5513;}
.status.status-azul {   background: #a7d4f1;    border-color: #5c9ec7;    color: #206a98;}
.status.status-roxo {    background: #c597dd;   border-color: #9d66ba;    color: #5a2f70;}

/*table*/
.tabela-responsiva{
    width: 100%;
	padding:.5rem
}

.tabela-responsiva table {
    width: 100%;
    max-width: 100%;
    min-width: 10%; /* Define uma largura mínima para a tabela */
    margin-bottom: 1rem;
    background-color: transparent;
	border:0;
}

@media (max-width:992px){
	/*table*/
.tabela-responsiva{
	display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
	padding:.5rem
}

}

/* Container Flexbox para os botões */
.button-container {
    display: flex; /* Alinha os botões na mesma linha */
    gap: 3px; /* Espaçamento entre os botões */
    flex-wrap: nowrap; /* Impede a quebra de linha */

    justify-content: center; /* Centraliza os botões horizontalmente */
    align-items: center; /* Centraliza verticalmente */
    gap: 8px; /* Espaçamento entre os botões */
    width: 100%; /* Garante que o container ocupe todo o espaço disponível */
}
/* Reset de botão */
.btn-icon {
    border: none;
    cursor: pointer;
    font-size: 24px; /* Tamanho do ícone */
    margin: 3px; /* Espaçamento entre os botões */
    padding: 3px;
    border-radius: 5px; /* Bordas arredondadas */
    color: #fff; /* Cor do ícone (branco) */

    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px; /* Define um tamanho fixo para os botões */
    height: 40px;

}

/* Botão Excluir - Vermelho */
.btn-delete {
    color: #e74c3c; /* Cor do ícone (branco) */
}

.btn-delete:hover {
    color: #c0392b; /* Vermelho mais escuro ao passar o mouse */
}

/* Botão Editar - Verde */
.btn-edit {
    color: #2ecc71; /* Verde */
}

.btn-edit:hover {
    color: #27ae60; /* Verde mais escuro ao passar o mouse */
}

/* Botão Histórico - Azul */
.btn-entrada {
    color: #3498db; /* Azul */
}

.btn-entrada:hover {
    color: #2980b9; /* Azul mais escuro ao passar o mouse */
}

.btn-alert {
    color: #f39c12; /* Laranja */
}

.btn-alert:hover {
    color: #e67e22;
}

#loader {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 9999;
    display: none;
}

#loader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.loader-content {
    text-align: center;
    color: white;
}

.spinner {
    border: 4px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    border-top: 4px solid white;
    width: 50px;
    height: 50px;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}