/* Componentes partilhados — dimensões em rem (escalam com a fonte do browser) */

.error-box {
  min-height: 2.625rem; /* espaço reservado */
  opacity: 0;
  visibility: hidden;
  transition: opacity .25s ease;
  margin-bottom: 0.75rem;
  padding: 0.625rem 0.75rem;
  border-radius: 0.5rem;
  font-size: 0.8125rem;
  background: #fee2e2;
  color: #b91c1c;
  border: 1px solid #fecaca;
}

.error-box.show {
  opacity: 1;
  visibility: visible;
}

.loader {
  width: 3rem;
  height: 3rem;
  display: none;
}
.loader::after,
.loader::before {
  content: '';  
  box-sizing: border-box;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  border: 0.625rem solid #6366f1;
  position: absolute;
  left: 0;
  top: 0;
  animation: animloader 2s linear infinite;
}
.loader::after {
  animation-delay: 1s;
}

.loader.middle{
    position: absolute !important;
    top: 50%;
    left: 45%;
}

@keyframes animloader {
  0% {
    transform: scale(0);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 0;
  }
}

.input-error{
    border-color: #b91c1c !important;
    outline: none;
}