.input_{

  width: 50%;
  height: auto;
  margin-left: auto;
  margin-right: auto;

}
.fila{
  background-color: #f1f1f1;
  padding:30px;
  border-radius: 8px;
  box-shadow: 0 0 12px  #095f99;
  color:#095f99;
  text-align: center;
  font-size: 18px;
  font-weight: bold;
  
}

.pedente{
  display: flex; /* Ativa o flexbox */
  justify-content: center; /* Centraliza os itens horizontalmente */
  align-items: center; /* Centraliza os itens verticalmente (opcional) */
  gap: 30px; /* Espaçamento entre os elementos */
  flex-wrap: wrap; /* Faz os itens quebrarem linha, se necessário */
  
}

.etapa_pendente{
  border: 2px solid #154889; 
  border-radius: 25px;
  padding: 20px;
  text-align: center;
  box-shadow: 0 4px 6px #154889; /* Sombra */
  background-color: #154889;
  color: white;
  font-weight: bold;
}

.etapa_pendente:hover{
 background-color:  #52c1ed;
}

/* Animação de pulsação */
.pulsante {
  animation: pulsar 1.5s infinite;
}

/* Keyframes para a animação */
@keyframes pulsar {
  0% {
      transform: scale(1); /* Tamanho normal */
      opacity: 1; /* Opacidade total */
  }
  50% {
      transform: scale(1.1); /* Aumenta um pouco */
      opacity: 0.8; /* Reduz ligeiramente a opacidade */
  }
  100% {
      transform: scale(1); /* Volta ao tamanho normal */
      opacity: 1; /* Restaura a opacidade */
  }
}


.etapa_pendente svg{
  color: #c99e67;
  
}

.i_{

  left: 70%;
  position: relative;
  background-color: red;
  width: 8%;
  height: auto; 
  border-radius: 25px;
  color: white;
  font-size: 20px;
  font-weight: bold;
  
  
  

}
.diagrama{
                       
  text-transform: uppercase;
  position: relative;
  bottom:45px;
  right: 10px;
 
}
.imprimir_fluxo{
  position: relative;
  bottom: 150px;
}
.fim{
  background-color: #095f99;
}

.sim{
  position: relative;
  left: 2px;
  bottom: 25px;
  color: green;
  font-weight: bold;
}
.nao{
  position: relative;
  left: 7px;
  bottom: 22px;
  color: red;
  font-weight: bold;
  
  
}
.ok{
  display: flex; /* Ativa o Flexbox */
  justify-content: center; /* Centraliza horizontalmente */
  align-items: center; /* Centraliza verticalmente */
}
.losango {
  width: 60px;               /* Largura do losango */
  height: 40px;              /* Altura do losango */
  background-color: #c99e67; /* Cor de fundo */
  transform: rotate(45deg);  /* Rotaciona o quadrado para parecer um losango */
  display: flex;             /* Para centralizar conteúdo, se necessário */
  justify-content: center;   /* Centraliza horizontalmente */
  align-items: center;      /* Centraliza verticalmente */
  font-weight: bold;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.482); /* Sombra */
}

.losango span {
  transform: rotate(-45deg); /* Reverte a rotação do texto ou conteúdo */
  color: white;             /* Cor do texto */
  font-size: 14px;          /* Tamanho do texto */
}
.setas_array{
 
  display: flex; /* Ativa o Flexbox */
  justify-content: center; /* Centraliza horizontalmente */
  align-items: center; /* Centraliza verticalmente */
}
.seta{
  position: relative;
  right: 20px;
  width: 20%;
  height: auto;
  text-align: center;
}
.fim_fim{
  
   width:20% ;
   text-align: center;
   position: relative;
   left: 83%;
   
}
.fim li{

  text-align: justify;
  font-weight: bold;
  
}

.fim_li{
  width: 70%;
  margin: auto;
}
.inicio li{
  text-align: justify;
}
.inicio{
  width: 20%;
  height: auto;
  position: relative;
  right: 20px;
  background-color: #154889;
  border-radius: 50%;
  color: white; /* Cor do texto */
  font-size: 10px; /* Tamanho do texto */
  text-align: center; /* Alinhamento do texto */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.482); /* Sombra */
  padding: 30px 0px 30px 0px;
  font-weight: bold;
  word-wrap: break-word;
  overflow: hidden;
  
}

.inicio p{
  font-size: 16px;
}
.fim p{
  font-size: 16px;
}
.fim{
 
  width: 100%;
  height: auto;
  position: relative;
  background-color: #154889;
  border-radius: 50%;
  color: white; /* Cor do texto */
  font-size: 10px; /* Tamanho do texto */
  text-align: center; /* Alinhamento do texto */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.482); /* Sombra */
  padding: 30px 0px 30px 0px;
  font-weight: bold;
  word-wrap: break-word;
  overflow: hidden;
  
}
.retangulo li{
  font-size:90%;
  text-align: justify;
}
.retangulo{
  width:100%;
  height: auto;
  background-color: #52c1ed;
  color: white; /* Cor do texto */
  font-size: 10px; /* Tamanho do texto */
  text-align: center; /* Alinhamento do texto */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.482); /* Sombra */
  font-weight: bold;
  margin: 5px;
  word-wrap: break-word;
  overflow: hidden;
  padding: 10px;
}

.footer_fluxo{
 
  display: flex;
  flex-direction: column; /* Alinhar botões em coluna */
  align-items: flex-end; /* Alinhar ao lado direito */
  gap: 10px; /* Espaçamento entre os botões */
  
}



.preview{
  width: 100% !important;
  height: auto !important;
  border-radius: 25px !important;
  border: solid 2px #e3e7ee !important;
}
.outs{
  display: flex;
 
}
.info_{
  background-color: #095f99;
  width: 50%;
  height: auto;
  
}
.outs_outs{

  width: 50%;
  height: auto;
  

}
.recebimento{
  border-radius: 25px !important; /* Borda arredondada do campo de seleção do Select2 */
  border: solid 2px #e3e7ee !important;
  font-weight: bold;
  padding: 10px;
  text-align: center;
}

.radio{

display: flex;


}
.info{
  padding: 10px;
}
.radio div{

  
  width: 50%;
  height: auto;
  text-align: center;
  
}
  


/* Estilos para a div que contém o select */
.select-container {
  width: 100%;           /* Garante que a div ocupe 100% da largura disponível */
  max-width: 500px;      /* Limita a largura máxima se necessário */
  margin: 0 auto;        /* Centraliza a div (opcional) */
}

/* Se necessário, você pode adicionar mais estilos aqui para o Select2 */
.select2-container {
  width: 100% !important; /* Garante que o Select2 também ocupe 100% da largura da div */
  border-radius: 25px; 
      /* Bordas arredondadas no Select2 */
  
}

.select2-selection {
  border-radius: 25px !important; /* Borda arredondada do campo de seleção do Select2 */
  background-color: #f5f5f5 !important;
  border: solid 2px #e3e7ee !important;
  font-weight: bold;
}


.select2-dropdown {
  border-radius: 25px !important; /* Borda arredondada do campo de seleção do Select2 */
  background-color: #f5f5f5 !important;
  border: solid 2px #e3e7ee !important;
  font-weight: bold;
}
/* Estilizar o container do item selecionado */
.select2-selection__choice {
  background-color: #f5f5f5 !important;
  border: solid 2px #e3e7ee !important;
  border-radius: 25px !important; /* Bordas arredondadas */

}
.ea-dark-scheme  .select2-selection__choice {
  background-color:#0a0a0a !important;
}

.ea-dark-scheme  .select2-selection {
  background-color:#0a0a0a !important;
}


.ea-dark-scheme  .select2-dropdown {
  background-color:#0a0a0a !important ;
}

.ea-dark-scheme  .dynamic-select{

  background-color:#0a0a0a !important;
}

#icon1{

  font-size: 22px;
  color: #095f99;


}
#icon2{

  font-size: 22px;
  color: #095f99;


}

#icon3{

  font-size: 22px;
  color: #095f99;


}

#icon4{

  font-size: 22px;
  color: #095f99;


}
#icon5{

  font-size: 22px;
  color: #095f99;
}

.list_etapa{
  background-color: #095f99;
  border: black solid 2px;
}

.table_fluxo{

  border: solid 2px #929292;
  border-radius: 25px;
  padding: 20px;
}

.list_fluxo{

  
  width: 100%;
  height: auto;
  display: flex;
  justify-content: center; /* Centraliza horizontalmente */
  align-items: center;     /* Centraliza verticalmente */
  

}

.dynamic-select{
  border-radius: 25px;
  background-color: #f5f5f5 !important;
  border: solid 2px #e3e7ee !important;
  
}

.list_fluxo div li{

  font-size:80%;
  text-align: justify;
  
}
.list_fluxo div{

  
  width: 20%;
  height: auto;
  border-radius: 25px;
  border: 2px solid #929292;;
  text-align: center;
  justify-content: center; /* Centraliza horizontalmente */
  align-items: center;     /* Centraliza verticalmente */
  padding: 10px;
  
  
}

.fluxo{
  border: #e3e7ee solid 1px;
  border-radius: 25px;
  padding: 10px;
  width: 70%;
  height: auto;
  margin-left: auto;
  margin-right: auto;
}

.titulofluxo {
  width:30% ;
  height: auto;
  font-weight: bold;
  color: #095f99;
}

.pagination {
  display: flex;
  justify-content: center; /* Centraliza a paginação */
  padding: 20px 0; /* Espaçamento vertical */
}

.pagination a {
  text-decoration: none; /* Remove o sublinhado */
  color: #095f99; /* Cor do texto */
  padding: 10px 15px; /* Espaçamento interno */
  border: 1px solid #095f99; /* Borda */
  margin: 0 5px; /* Espaçamento lateral */
  border-radius: 5px; /* Bordas arredondadas */
  transition: background-color 0.3s, color 0.3s; /* Efeito de transição */
  border-radius: 25px;
}

.pagination a:hover {
  background-color: #095f99; /* Cor de fundo ao passar o mouse */
  color: white; /* Cor do texto ao passar o mouse */
}

.pagination .active {
  background-color: #095f99; /* Cor de fundo do item ativo */
  color: white; /* Cor do texto do item ativo */
  border: 1px solid #095f99; /* Borda do item ativo */
}

.pagination .disabled {
  color: #ccc; /* Cor do texto do item desativado */
  pointer-events: none; /* Desabilita a interação */
  border: 1px solid #ccc; /* Borda do item desativado */
}

/* Borda do item desativado */

input{
  border-radius: 15px;
}
.form_export{

  
  display: flex;
  
}

.form_index{
  
  width: 50%;
  border: #929292 solid 1px;
  border-radius: 25px;
  margin: 5px;
  padding: 10px;
}


.form_export div{

 
  width: 50%;
  border: #929292 solid 1px;
  border-radius: 25px;
  margin: 5px;
  padding: 10px;
  
}

.form_export section{

 
  width: 55%;
  
 
  
}

.form_export ol{

  width: 45%;
  border: #929292 solid 1px;
  border-radius: 25px;
  margin: 5px;
  padding: 10px;
  

}


.form_export label{

 
  width: 50%;
 
  
}


button{
  cursor: pointer;
}
a{
  cursor: pointer;
}
.espera {
  position: absolute; /* Faz com que o elemento seja posicionado em relação ao elemento pai mais próximo com position relativo ou ao viewport se não houver um elemento pai com position relativo. */
  top: 0; /* Alinha o elemento ao topo do contêiner pai ou da tela. */
  left: 0; /* Alinha o elemento à esquerda do contêiner pai ou da tela. */
  width: 100%; /* Faz com que o elemento ocupe toda a largura do contêiner pai ou da tela. */
  height: 100%; /* Faz com que o elemento ocupe toda a altura do contêiner pai ou da tela. */
  z-index: 9999; /* Garante que o elemento fique à frente de outros elementos. Ajuste o valor se necessário. */
  display: flex; /* Usa Flexbox para centralizar o conteúdo. */
  justify-content: center; /* Centraliza horizontalmente o conteúdo. */
  align-items: center; /* Centraliza verticalmente o conteúdo. */
  background-color: rgba(0, 0, 0, 0.5); /* Opcional: adiciona um fundo semi-transparente para destacar o conteúdo. */
}

.list_client{
  font-weight: bold;
  font-size: 20px;
  background-color: #000000fd;
  text-align: center;
  position: absolute;
  width:99.9%;
  height: 99.9vh;
  top: 1px;
  left: 1px;
  display: flex; /* Ativa o flexbox */
  justify-content: center; /* Centraliza os itens horizontalmente */
  align-items: center; /* Centraliza os itens verticalmente (opcional) */
}


.client{

  background-color: #f8fafc;
  width: 45%;      
  height: auto;
  max-height: 100%;     /* Altura fixa */
  margin-left: auto;
  margin-right: auto;
  overflow: auto;
  border-radius: 25px;
  font-size: 18px;
  border: #095f99 solid 1px;
  
 

}
.ea-dark-scheme .client{
  background-color:#0a0a0a ;
}

.ea-dark-scheme .client hr{
  background-color: white ;
  color: white;
}


.client h1{

  background-color: #176ea8;
  font-size: 30px;
  color: white;


}
.client::-webkit-scrollbar {
  width: 1px; /* Largura da barra de rolagem */
}

.btn_cliente{
  background-color: #26262600;
  color: #154889;
  border: #26262600;
  width: 100%;
}

.btn_cliente:hover{
  
  font-weight: bolder;
  border: #26262600;
  width: 100%;
  height: auto;
}

.ifr{
  
  width: 100%;
  height:60vw;
}

.menu_img  r{
   
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  color: #154889;
      

}

.menu_img  o{
 
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  color: #154889;
      

}


.menu_img img{
  width: 40px;
  height: 40px;
}

.menu_img {
  padding-top: 6px;
  padding-bottom: 2px;
  border-bottom: 1px solid #E2E8F0;
  
}

.ea-dark-scheme .menu_img {
  padding-top: 6px;
  padding-bottom: 2px;
  border-bottom: 1px solid #525252;
  
}

body.ea-sidebar-width-compact .sidebar .menu img{
   
  width: 40px;
  height: 40px;
}
body.ea-sidebar-width-compact .sidebar .menu_img{
 
  text-align:center;
  padding-top: 6px;
  
}

body.ea-sidebar-width-compact .sidebar .menu_img o{
 
 display: none;
  
  

}

body.ea-sidebar-width-compact .sidebar .menu_img r{
 
  display: none;
   
   

}
.ea-dark-scheme .menu_img  r{
 
  color: #2563EB;
      

}



.btn{
  font-weight: bold;
  
}
label{
  font-weight: bold;
  color: #095f99;
}
#back:hover{
  background-color: #52C1EE;
}
#btn_index_tipo:hover{
  background-color: #52C1EE;
}
*{
  font-family: Arial, Helvetica, sans-serif;
}


#index_edit{
  background-color: #095f9900;
  border: 2px solid rgba(0, 0, 0, 0);
}

#index_delet{
  background-color: #095f9900;
  border: 2px solid rgba(0, 0, 0, 0);
  color: rgb(225, 52, 52);
}

:root {
  /* make the backend contents as wide as the browser window */
  --body-max-width: 100%;
  /* change the background color of the <body> */
  --body-bg: #f5f5f5;
  /* make the base font size smaller */
  --font-size-base: 13px;
  /* remove all border radius to make corners straight */
  --border-radius: 25px;
  --color-primary:#095f99;
  
}

.titulo {
  text-align: center;
  font-weight: bold;
  color: #095f99;
}


.titulo img{
  width: 150px;
  height: 150px;
}


      
.ocr {
    display: block;
    text-align: justify;
    font-weight: 700;
    cursor: pointer;
    
  }


  
.ver_ocr{
 
 text-align: center;
}
.index{
  
  display: flex;
  width: 100%;
  height: auto;
  
 

}
#back{
  position: relative;
  bottom:40px;
}
iframe{

 border: none;
 height: 100vh;
 width: 100% ;
 border-radius: 15px;
}

.iframe{
  width: 75% ;
  height:auto;
  
 }

 .form{

  height: 100vh;
  width: 25%;
  margin-left: 10px;
  
 }

.inds{
  display: flex;
  border-bottom: 1px solid #c2d5e2;
  margin-bottom: 10px;
  padding-bottom: 10px;
}

.btn_salve div{
  background-color: #095f99;
  display: flex;
  text-align: center;
  
  
  
}
.login{
  
  width: 100%;
  height: 90vh;
  display: flex;
}

.layout_login{
  
  background: url('fundo_tcc.png') no-repeat;
  height: 100%;
  width:60%;
  background-position: center;
  background-size: contain;
}

.form_login{

  width: 40%;
  height:auto;
  border-top-right-radius: 15px;
  border-bottom-right-radius: 15px;
  color: #095f99;
  background-color: #ececec;
  

}

.inputs_login{
  
  width: 80%;
  height: auto;
  margin-left: auto;
  margin-right: auto;
  padding: 15px;

}

.inputs_login input{
  
  border-radius: 15px;

}
.titulo button{
  border-radius: 15px;
  background-color: #095f99;
}

.inputs_login label,input{
  padding: 10px;
}
.avisos{
  
  font-weight: bold;
  font-size: 20px;
  background-color: rgba(0, 0, 0, 0.5);
  text-align: center;
  position: absolute;
  width:99.9%;
  height: 100vh;
  top: 1px;
  left: 1px;
  
}
.avisos y{
  color:white;
  background-color:#095f99 ;
  padding: 10px;
  border-radius: 15px;
 
  
}
.avisos_erro y{
  color:white;
  background-color: rgb(225, 52, 52);
  padding: 10px;
  border-radius: 15px;
 
}

.avisos_erro {
  font-weight: bold;
  font-size: 20px;
  background-color:  rgba(225, 52, 52, 0.409);
  text-align: center;
  position: absolute;
  width:99.9%;
  height: 100vh;
  top: 1px;
  left: 1px;

}

#img_erro{
  width: 350px;
  height:350px;
}
#ocr{
  
  border: 2px solid white ;
  border-radius: 15px;
  text-align: justify;
  padding: 10px;
}
.avisos img{
  width: 30%;
  height: auto;
}
.export{
  text-align: center;
}
.log_export{
  color:#095f99;
  font-weight: bold;
}
/***************************************************  MeNu **********************************************/
#img_menu{
  width:100% ;
  height: auto;
 
}

.menu_item{
  padding-top: 10px;
  width: 95%;
  margin-left: auto;
  margin-right: auto;
  color: #095f99;
  
}

.menu_item p{
 cursor: pointer; 
 font-size: 18px;
 border-bottom: 1px solid #E2E8F0;
 padding-bottom: 10px;

  
}

body.ea-sidebar-width-compact .menu_item p:hover{
  padding: 2px; 
}

.menu_item p:hover{
  border-radius: 25px;
  background-color: #ECECEC;
  color: #52C1EE;
  padding: 10px;
}



.pagina{
  border-radius: 25px;
  background-color: #ECECEC;
  color: #52C1EE;
  padding: 10px; 
}

.pagina label{
 
  color: #52C1EE;
 
}

body.ea-sidebar-width-compact .pagina{
  padding: 2px; 
  color: #52C1EE;
}



.ea-dark-scheme .menu_item p:hover{
  
  border-radius: 25px;
  background-color: #404040;
  color: #52C1EE;
  padding: 10px;
   
}

.ea-dark-scheme .pagina{
  
  border-radius: 25px;
  background-color: #404040;
  color: #52C1EE;
  padding: 5px;
   
}



.menu_item p label{
  cursor: pointer; 
      
}

.menu_item a{
  color:#095f99; 
      
}

.ea-dark-scheme .menu_item p {
  border-bottom: 1px solid #525252;
  color:#2563EB;
}


body.ea-sidebar-width-compact .menu_item{
  width: 70%;
 
  
}
.menu_item label{
 
  padding-left: 10px;   
}
.menu_item .pagina svg{
 
  color: #52C1EE;   
}


.btn_menu{
  background-color: #2564eb00;
  border: none;
  color: #095f99;   
}

.dt-button{
  background-color: #52C1EE;
}
body.ea-sidebar-width-compact .sidebar .menu .menu_item label{
   
  display:none;
}

.ea-dark-scheme td{
  background-color: #262626;
}

.ea-dark-scheme th{
  background-color: #6b6b6b;
  
}

#btn_index_:hover{
  background-color: #52C1EE;
}

#btn_index_export:hover{
  background-color: #52C1EE;
}
table{
  border-radius: 15px;
}

.tabela{
  width: 100%;
  height: auto;
  color: #095f99;
  border-radius: 25px;
}


.tabela td{
  border: #929292 solid 1px;
  padding: 5px;
 
}


.tabela thead{
  background-color: #9292921e;
}
.boder-table{
  border: solid black 2px;
  width: 100%;
  height: auto;
}