#esperar {
    display: flex;
    position: fixed; /* o absolute */
    width: 100%;
    height: 100%;    
    justify-content: center; /* Centra horizontalmente */
    align-items: center; /* Centra verticalmente */
    z-index: 9999; 
}

.loading{
    content: "";
    text-align: center;
    padding: 10px;
    display: inline-block;
    border-radius: 50%;
    width: 54px;
    height: 54px;
    /*margin: 0 10px -6px 0;*/
    border: 10px solid #00FFFF;
    border-top-color: #FFFF;
    animation: animate-loading 1s linear infinite;
       
}

@keyframes animate-loading {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}


table.dataTable tbody td {
      vertical-align: middle !important;
}

table.transparente {
    --bs-table-bg: transparent !important;
}




/* modalConfig */

.modalConfig {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.50);
  z-index: 9999;
}
.modalConfig.active {
  display: flex;
  align-items: center;
  justify-content: center;
}
.modalConfig .modal-70{
  width: 70rem;
  background: #F8F8FF;
  padding: 2rem;
  border-radius: 10px;
  border: 2px solid #D8BFD8;
  opacity: 0;
  transform: translateX(-80px);
  animation: anim-modal 0.5s forwards;
}

.modalConfig .modal-50{
  width: 50rem;
  background: #F8F8FF;
  padding: 2rem;
  border-radius: 10px;
  border: 2px solid #D8BFD8;
  opacity: 0;
  transform: translateX(-80px);
  animation: anim-modal 0.5s forwards;
}

.modalConfig .modal-30{
  width: 30rem;
  background: #F8F8FF;
  padding: 2rem;
  border-radius: 10px;
  border: 2px solid #D8BFD8;
  opacity: 0;
  transform: translateX(-80px);
  animation: anim-modal 0.5s forwards;
}

@keyframes anim-modal {
  to {
    opacity: 1;
    transform: translateX(0);
  }
}