.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before {
  background-color: #5a595c !important;
  /*padding: 10px;*/
  border-radius: 25px;
  text-transform: lowercase;
}

.custom-checkbox .custom-control-input:checked:focus ~ .custom-control-label::before {
  box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(98, 0, 82, 0.25);
}

.custom-checkbox .custom-control-input:focus ~ .custom-control-label::before {
  box-shadow: 0 0 0 1px #fff, 0 0 0 0.2rem rgba(0, 0, 0, 0.25);
}

.custom-checkbox .custom-control-input:active ~ .custom-control-label::before {
  background-color: #5a595c;
  /*padding: 10px;*/
  border-radius: 25px;
}

input {
  text-transform: uppercase;
}

.form-select {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 16px 12px;
}

/* CSS personalizado para hacer más lento el fade-in/fade-out de Bootstrap.
  Afecta a cualquier elemento que use la transición de collapse (.collapsing, .collapse). */

.collapsing, .collapse.show {
  transition: height 2.5s ease, opacity 0.5s ease !important;
  opacity: 1;
}

/* Estado oculto (al inicio o después del fade-out) */

.collapse:not(.show) {
  opacity: 0;
  transition: opacity 2.5s ease !important;
}