:root{
  /*--cor-principal: #6e1896;*/
  --cor-principal: rgba(60, 15, 138, 1);
  --btn-hover: rgba(30, 7, 80, 1);
  --cor-secundaria: rgba(109, 47, 196, 1);
  --cor-disabled: rgba(60, 15, 138, 0.5);
  --cor-compl: rgba(250, 250, 250, 1);
}

.btn-principal {
  color: #fff !important;
  background-color: var(--cor-principal) !important;
  border-color: var(--cor-principal) !important;
}

.btn-branco {
  color: var(--cor-principal) !important;
  background-color: #fff !important;
  border-color: #fff !important;
}

.btn-principal:hover {
  color: #fff !important;
  background-color: var(--btn-hover) !important;
  border-color: var(--btn-hover) !important;
}

.btn-branco:hover {
  color: var(--btn-principal) !important;
  background-color: rgba(200,200,200,1) !important;
  border-color: rgba(200,200,200,1) !important;
}

.btn-principal:focus, .btn-principal.focus {
  box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5) !important;
}

.btn-principal.disabled, .btn-principal:disabled {
  color: #fff !important;
  background-color: var(--cor-disabled) !important;
  border-color: var(--cor-disabled) !important;
}

.btn-principal:not(:disabled):not(.disabled):active, .btn-principal:not(:disabled):not(.disabled).active,
.show > .btn-principal.dropdown-toggle {
  color: #fff !important;
  background-color: #0062cc !important;
  border-color: #005cbf !important;
}

.btn-principal:not(:disabled):not(.disabled):active:focus, .btn-principal:not(:disabled):not(.disabled).active:focus,
.show > .btn-principal.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.5) !important;
}