@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Anonymous+Pro:wght@400;700&display=swap');
/*--------------------HOME-MUNICÍPIOS--------------------*/
:root {
    --bg-color: #efeff8;
    --cor-base:#186cdf;
    --sobretom:#2499FF;
    --cinza-claro:#9C9C9C;
    --cinza-escuro:#333;
    --shadow: 0 0 06px 0px rgba(119,121,147,0.2);
}
.produtos{
    max-width:1000px;
    margin:20px 30px 0;
    flex-wrap:wrap;
} 

.produtos a{
    box-sizing: border-box;
    display:flex;
    text-align: center;
    flex-direction:column;
    justify-content: center;
    align-items: center;
    color:white;
    font-size:1.0em;
    font-weight:bold;
    margin:20px;
    width:190px;
    height:200px;
    background-color:var(--cor-base);
    box-shadow:var(--shadow);
    border-radius:10px;
}
.produtos a:hover{
    background-color:var(--sobretom);
    color:white;
}
.produtos a img{
    width:130px;
    
    
}
/*--------------------LIGHTBOX-----------------------------*/
#lbback{
    width:100vw;
    height:100vh;
    position:fixed;
    top:0;
    left:0;
    opacity: 0.3;
    background-color:#000;
}
#lightbox{
    position:fixed;
    top:25%;
    left:50%;
    transform:translateX(-50%);
    padding:20px 50px;
    box-sizing: border-box;
    background:white;
    width:50%;height:50%;
    max-width:800px;
    box-shadow: var(--shadow);
    min-height:240px;
}
#lightbox>ul{
    flex-wrap:wrap;
    align-items:center;
    height:90%;
    display:flex;
}
#lightbox>ul>li{
    margin:0 20px;
    display:flex;
    flex-direction:column;
}
#editinputs>li>label{
    font-size:0.8rem;
    color:var(--tom-medio);
}
#close{
    position:absolute;
    top:10px;
    right:20px;
}
/*-------------------MUNICIPIO - DASHBOARD ---------------------------------*/
.bloco{
    width:250px;
    height:180px;
    background:white;
    display: flex;
    flex-direction: column;
    border-radius:10px;
    align-items:left;
    box-sizing: border-box;
    padding:20px 10px;
}

.bloco .numeronegativo{
    text-align:left;
}
.bloco > div{
    display:flex;
    align-items: center;
    gap:10px;
}
.bloco h3{
    color:#1D2742;
    font-size:0.9em;
    font-weight: 600;
}
.bloco h4{
    font-weight:400;
    font-size:0.7em;
}
.bloco p{
    font-size:1.2em;
    color:var( --cinza-claro);
    font-weight: 300;
    margin:10px;
}
.bloco.medio{
    height:230px;
}
.bloco .smalltext{
    margin-top:15px;
    font-size:0.8em;

}
#omissao-anual .smalltext{
    margin:0;
}
.bloco span{
    font-size:0.6em;
}
#resumo-dashboard{
    margin:50px 50px 0;
    display:grid;
    grid-auto-flow: row;
    column-gap:32px;
}
#detalhes-dashboard{
    margin:40px 50px;
    display:grid;
	grid-template-columns: 830px 250px;
    column-gap:40px;
}
#movimentacao-economica{
    margin:40px 50px;
    display:flex;
    gap:40px;
}
#resumo-dashboard.escola{
    grid-template-columns:repeat(6, 200px);
}
#resumo-dashboard.isscard{
    width:890px;
    column-gap:40px;
    grid-template-columns:repeat(4, 250px);
}

.bloco.escola{
    width: 200px!important;
}

.quadro{
    height:400px;
    border-radius:10px;
    background:white;
    display:flex;
    flex-direction:column;
    overflow:hidden;
    color:#9E9E9E;
    font-weight: 400;
}
.info{
    flex-grow: 1;
    border-bottom:solid 1px #CCC;
}
.quadro ul{
   padding-left:20px;
   padding-right:20px;
   box-sizing:border-box;
}
.quadro ul:last-child{
    border-bottom:none!important;
}
.quadro ul li{
    display:flex;
	justify-content:flex-end;
    align-items:center;
    font-size:0.7em;
}
#resumo-bairros,#resumo-cnaes{
    overflow-y: auto;
    width:540px;
}
#resumo-bairros > .blue-titles, #resumo-cnaes > .blue-titles{
    position: sticky;
    top: 0; /* Fixa o elemento no topo do contêiner ao rolar */
    background: white; /* Define o fundo para sobrepor o conteúdo rolado */
    z-index: 1; /* Garante que fique acima dos outros elementos */
}
#resumo-bairros ul li {
    width: 20%; /* Define a largura padrão para todos os itens */
}
#resumo-bairros ul li:first-child {
    width: 60%; /* Sobrescreve a largura para o primeiro item */
    text-align:left;
    justify-content: start;
}
#resumo-cnaes ul li {
    width: 15%; /* Define a largura padrão para todos os itens */
}
#resumo-cnaes ul li:first-child {
    justify-content: start;
}
#resumo-cnaes ul li:nth-child(2) {
    width: 55%; /* Sobrescreve a largura para o primeiro item */
    text-align:left;
    justify-content: start;
}
#resumo-cnaes ul:not(:first-child), #resumo-bairros ul:not(:first-child) {
    padding: 5px; /* Aplica padding apenas às <ul> que não sejam a primeira */
}
#resumo-corban{
   width:600px;
}
#resumo-isscard{
    width:830px;
    height:450px;
}
#resumo-isscard ul li{
   width:23.75%;
}#resumo-isscard ul li:first-child{
   width:5%;
    
}
#resumo-escolas{
   width:350px;
}
#resumo-corban ul li:first-child{
   justify-content:flex-start!important;
   width:80%;
}
#resumo-corban ul li{
   width:20%;
    
}
#resumo-escolas ul li{
   width:33.33%;
}
#omissao-anual .grafico-container {
    display: flex;
    align-items: flex-end; /* Alinha as barras na base */
    justify-content:space-around;
    height: 90px; /* Ajuste o divisor conforme necessário */
    gap: 20px;
    text-align: center;
    margin-top:10px;
}  
#omissao-anual .barra {
    flex: 0.5;
    max-width:15px;
    background-color: #186CDF;
    position: relative;
    transition: height 0.5s ease;
    text-align: center;
}

#omissao-anual .rotulo {
    position: absolute;
    bottom: -25px;
    left:-4px;
    width: 100%;
    text-align: center;
    font-size: 10px;
}

/*--------------------MODULOS - MUNICIPIOS--------------------*/

#modulos-txt{
    width:70%;
    max-width:1200px;
    text-align:center;
}
#modulos-txt p{
        text-align:justify;

}
#modulos-txt img{
    width:200px;
}
.ass {
    font-weight:bold;
	font-size:16px;
	margin-top: 50px;
	text-align: justify;
}
.painel-municipio{
    width:calc(100vw - 5px);
    height:calc(100vh - 65px);
    box-sizing:border-box;
    padding:0!important;
    display: flex;
    justify-content:center;
    margin:0 auto;

}
/*--------------------ADM--------------------*/
.tabela_formulario{
	flex-wrap:wrap;
    padding:50px ;
    background-color:white;
    max-width:1000px;
}
.formulario li{
    display:flex;
    align-items: space-between;
    justify-content:space-between;
    margin:5px 0;
}
.formulario li label{
    font-size:12px;
}
 input, select, textarea{ 
    border: solid 1px var(--cinza-claro);
    max-width:200px;    
    padding:2px 5px;
}

.small-input{
    min-width:50px;
    box-sizing: border-box;
    width:70px!important;
}
/*--------------------ADM--------------------*/
#nova-senha>div{
    
    align-items:flex-start;
    font-size:12px;
}
/*--------------------DIVS Relatorios--------------------*/
#relatorio2 ul{
    display:flex;
    flex-direction: column;
    width:80%;
    max-width:800px;
}
#relatorio2 ul li{
    display:flex;
    justify-content: space-around;
    align-items:center;
    flex-direction: row;
    width:100%;
    padding:5px 10px;
}
#relatorio2 ul li div{
    width:18%;
    min-width:80px;
    margin:0 5px;
}
#relatorio1 li{
    display:flex;
    justify-content: space-between;
    align-items:center;
    flex-direction: row;
    width:100%;
    min-width:650px;
}
#relatorio1 li div{
    padding:10px 0 ;
    font-size:12px;
    text-align:right;
}
#relatorio1 li div:first-child{
    margin-left:20px;
}
#relatorio1 li div:last-child{
    margin-right:20px;
}
#relatorio1 li div {
    width:10%;
    min-width:100px;
}
.gerar_relatorio{
    
    padding:10px 50px ;
    
}
/*--------------------------FORMATO - PLANILHA---------------------------------*/
    #planilha{
        max-width:1500px;
    }
    #planilha ul{padding:0 10px;}
    #planilha ul li{
        padding:20px 10px;
        width:100px;
        justify-content: flex-end;
        text-align:right;
    }
    #planilha ul .nome{
        justify-content: flex-start;
        width:300px;
        text-align:left;
    }
    #planilha ul:hover{
        background-color:#A5AEE3;
    }
    #planilha ul li a{
        color:var(--cor-base);
        font-weight:600;
        text-decoration:underline;
    }

/*------------------- ISSCARD - EMPRESAS LOCAIS > MOVIMENTO--------------------*/
.table-emp-locais{
    display:flex;
    flex-direction:column;

    
    margin:20px 0 0 0;
    
}
.table-emp-locais ul{
    max-height:200px;
    overflow-y:auto;
}

.table-emp-locais li{
    display:flex;
    justify-content: space-between;
    align-items:center;
    flex-direction: row;
    width:100%;
    min-width:550px;
    

}
.table-emp-locais li div{
    padding:10px 0 ;
    font-size:14px;
    text-align:right;
    width:15%;
}
.table-emp-locais .table-titles{
    color:white;
    background-color:var(--cor-base);
}
.table-emp-locais ul li div:first-child{
    margin-left:20px;
}
.table-emp-locais ul li div:last-child{
    margin-right:20px;
}

#tabela1, #relatorio1{
    overflow-y:auto;
}



#table-rever tr{display:flex;justify-content:space-between;width:90%;margin:0 auto;}
#servicos{font-size:10px;}
/*------------------- IFRAMES--------------------*/
iframe{
    padding:25px 0;
    min-height:450px;
}

/* --------------------------- ISSCARD > FERRAMENTAS > CONSULTA ARQUIVOS -----------------------------*/
#consultaarquivos{
    
    width:100%;
    max-width:650px;
    margin:0 auto;
}
#consultaarquivos ul{
    border:solid 1px black;
    width:100%;
    display:flex;
    flex-direction: column;
    margin-bottom:50px;
}
#consultaarquivos ul li{
    display:flex;
    flex-direction: row; 
    justify-content: center;
    
}
#consultaarquivos ul li div{
    text-align:center;
    border:solid 1px black;
    padding:2px;
}

       

       
/* --------------------- FERRAMENTAS - FORMATAÇÃO DAS TABELAS -----------------------  */
#container, #container-2, #container-adm{
    width:90%;
    margin:0px auto;
    padding:0 0 50px;
    text-align:center;
    min-height:100vh;
}
#container,#container-adm{
    max-width:1600px;
    
}
#container-2{  
    max-width:1200px;   
}
#container-adm{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
}
#container-adm .organizador{
    margin:30px 30px 0;
}
.organizador{
    margin-bottom:30px;
    min-width:700px;}

.organizador ul{
    
    box-sizing:content-box;
    margin:5px 0 0;
    background:white;
    font-size:12px;
}
.organizador ul li{    
	display:flex;
	justify-content:center;
    align-items: center;
    padding:20px 10px;
    flex:1;
    text-align:center;
    
}
.organizador ul.numero li{
    justify-content:flex-end;
    text-align:right;
}
.organizador ul li a:visited{
    color:var(--cor-base);
}

.blue-titles{
    background-color:var(--cor-base)!important;
    color:#FFFFFF!important;
    font-size:14px;
    padding-top:20px;
    padding-bottom:20px;
}

.blue-titles  li a{
    text-decoration: underline;
}
.blue-titles  li a:visited{
    color:white!important;    
}
.desc{
    justify-content:flex-start!important;
    text-align:left!important;
    flex:0 0 50% !important;

}
.edit{
    min-width:20px!important;
    max-width:20px!important;
    flex:0 0 20px;
    font-size:16px;
}.id{
    min-width:30px!important;
    max-width:50px!important;
    flex:0 1 50px; 
}
.edit:hover, .edit:hover a, .edit:hover a:visited{
    background-color:var(--cor-base);
    color:white;
}
    


/* -------------------------------MINHAS DEMANDAS/CONTRATOS --------------------------------------- */
/* Container das ABAS */

.tabs-container{
    position: relative;
    height: auto;
    max-width: 1600px;
    display:flex;
    justify-content: center;
    margin:50px auto;

}
/* ABAS */
input.tabs {
    display: none;
}
input.tabs + label + div {
    width: 100%;
    max-width:1200px;
    opacity: 0;
    position: absolute;
    background: var(--bg-color);
    top: 40px;
    left: 0;
    padding: 0px;
    z-index: -1;
    

   
}
input.tabs:checked + label + div {
    opacity: 1;
    z-index:10;
}

/* Labels */
input.tabs + label {
    width:50%;
    padding:10px 20px;
    background: var(--bg-color);
    color:black;
    cursor: pointer;
}
input.tabs:checked + label {
    color:white;
    background: var(--cor-base);
}

/* ------------------------------- PAGINA DA DEMANDA/PAGINA DO CONTRATO--------------------------------------- */
/* Formulario de Alteração */
#atualizar-demanda, #atualizar-contrato{
    margin: 30px 0;
}
#atualizar-demanda ul, #atualizar-contrato ul{
    justify-content: center;
    align-items: flex-start;
    flex-wrap:wrap;
    font-size:12px;
    background:white;
    padding:20px 0px;
}
#atualizar-demanda ul li, #atualizar-contrato ul li{
	margin:0 10px;
}
/* ------------------------------- INCLUSÃO DE DEMANDA --------------------------------------- */
.desc textarea, #incluir-demanda textarea{
    width:100%;
    max-width:100%;
    border:solid 1px var(--cinza-claro);
    border-radius:5px;
}
#incluir-demanda ul li{margin:15px 5px;}
#incluir-demanda textarea {min-width:310px !important;}

/* ------------------------------- INCLUSÃO DE CONTRATO --------------------------------------- */
.contrato input, .contrato select{
    width:90%;
    max-width:100px
}
.incluir_contrato ul{
	min-width:300px;
}
.incluir_contrato ul li select, .incluir_contrato ul li input{
	max-width:175px;
}
/* ------------------------------- TICKETS (SÓ PARA MUNICÍPIOS) --------------------------------------- */

.ticket input, .ticket select{
    width:90%;
    max-width:200px; }
/* ------------------------------- IBANCOS - INTERAÇÕES --------------------------------------- */
#interacoes inputs, #interacoes select, #interacoes textarea{
    width:366px;
    max-width:366px;
    padding:2px;
    
    box-sizing: border-box;
}
/*------------------------------- PORTAL CONTRIBUINTE ---------------------------------*/
#portal-contribuinte{
    max-width:800px;
    min-width:400px!important;
    width:100%;
    box-sizing: border-box;
}
#portal-contribuinte div ul li{
    flex-direction: column;
    width:100%;
    margin:10px 10px;
    display:flex;
    justify-content:center;
    align-items: center;
    gap:10px;
}
#portal-contribuinte div a,#portal-contribuinte label{
    font-size:0.9em;
}

#portal-contribuinte h3{
    text-align:center;
    color:var(--cinza-escuro);
}
#portal-contribuinte input, #portal-contribuinte select{
    padding:5px;
    box-sizing: border-box;
    max-width:175px;
    min-width:175px;
    
}

#portal-contribuinte .back{
    font-weight:600;
}
.info-contribuinte{
    display:flex;
    flex-direction:column;
}
.info-contribuinte li{
    display:flex;
    justify-content: space-between;
    margin:10px 0;
}
.info-contribuinte input{
    padding:5px;
    margin:0 10px;
}
.overlay {
    position:fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.7);
    height:100vh;
    display:flex;
    flex-direction:column;
    justify-content: center;
    overflow:auto;
}
#popup div {
    height:90vh;
    background:white;
    width:90%;    
    max-width:1000px; 
    min-width:400px;
    margin:20px auto;
    overflow:auto;
    box-sizing:border-box;
    padding:50px 20px 20px;
    
    
}
.bloco-texto{
    display:flex;
    flex-direction:column;
    justify-content: space-between;
}
.bloco-texto span{
    display:block;
    font-size:6pt;
    width:80%;
    text-align:left;
    margin:5px auto;
    color:#0A1761;
}
.bloco-texto{text-align:center;}
.bloco-texto p{
    font-size:14px;
    color:var(--cinza-escuro);
    width:80%;
    margin: 10px auto;
    text-align:justify;
}
.legenda li {
    margin:0 5px;
    font-size:12px;}
.legenda li img{
    margin:0px 2px;
}
/*-----------------------------COBRARBAN------------------------------*/
#graphdata{
    display:flex;
    justify-content: center;
    font-weight:400;
}
#graphdata ul{
    display:flex;
    flex-direction: column;
} 
#graphdata ul li{
    
    padding:2px;
    margin:5px;}
.graphtitle li{
    text-align:right;
}
.table-lines{
    background:white;
    
}
.table-lines td{
    padding:10px;
    font-size:12px;
    font-weight:300;
    color:black;
}
/*-----------------------------MODULO ESCOLAS------------------------------*/
#escolas ul li input,#malhafina ul li input{
    max-width:40px;
}
#escolas ul li select{
    max-width:65px;
    
}
#escolas ul li input.button{
    max-width:100px;
}
.dados-mestres select, .dados-mestres input{
    margin:0 0 0 10px;
    
}.endereco{
    text-align:left!important;
    justify-content: flex-start!important;
    width:20%!important;
}
/*-----------------------------FERRAMENTAS - BOLETIM ------------------------------*/
.ul-inputs li{
    padding:15px 0!important;
}
.ul-inputs input.button{
    padding:10px 15px!important;
}
.ocordesc-input{
    justify-content: space-between!important;
    text-align: left!important;
    width: 50% !important;
}
.ocordesc{
    justify-content: flex-start!important;
    text-align: left!important;
    width: 80% !important;
}
.ocordesc-input input[type=text]{
    width:100%;
}
#dataalvo, #conclusao,#nomeusuario {
    max-width:100px!important;   
}
#boletim-detalhes ul li{
        width:132.5px;
}
/*-------------------------- FINANCEIRO SAFETY ----------------------------------*/
#receita{
    margin:0 auto;
}
#receita ul{
    display:flex;
    justify-content: space-between;
}
#receita ul .nome{
    font-weight:bold;
    color:var(--cor-base);
    width:calc(80% - 20px);
}

#receita ul li{
    justify-content:flex-start;
}
#receita ul .edit{
    justify-content:center;
}
#receita ul li:last-child{
    justify-content:flex-end;
    width:20%;
}
/*--------------------------MALHA FINA ----------------------------*/
#razaosocial{
    overflow: hidden;
    text-overflow:ellipsis;
    max-height:100px;
    box-sizing: border-box;
    white-space: nowrap;
    justify-content: flex-start;
}
.malhafina li{
    width:80px;
    max-width:80px;
    min-width:80px;
}
.malhafina li:nth-child(2), .malhafina li:nth-child(3),.malhafina li:nth-child(8){
    width:95px;
    max-width:95px;
    min-width:95px;
}
/*------------------------MAPA----------------------------*/

#mapa{
    width:100%;
    padding:0;
    margin:0;
    height:calc(100vh - 60px);
    overflow: hidden;
    
}
