:root {
    --blanco: #fff;
    --primario: rgb(203, 31, 32);
  }
  
  body {
    background: url("./img/sigmund-j8C0xOCuX0U-unsplash.jpg") no-repeat center center fixed;
    background-size: cover;
    font-family: 'Montserrat', sans-serif;
    position: relative;
  }
  
  .overlay {
    background-color: rgba(0, 0, 0, 0.7);
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: 1;
  }
  
  .card-login {
    position: relative;
    z-index: 2;
    backdrop-filter: blur(12px);
    background-color: rgba(0, 0, 0, 0.55);
    color: white;
    border-radius: 1rem;
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.6);
    padding: 2rem;
    width: 100%;
  }
  
  .footer {
    font-size: 1rem;
    position: relative;
    z-index: 2;
  }
  
  @media (max-width: 768px) {
    .card-login {
      padding: 1.5rem;
    }
  
    .prefooter p {
      font-size: 1.2rem;
    }
  }
  
  
  #loading-screen {
    z-index: 1050; /* Ensures it stays on top of other elements */
}

.loading-logo {
    animation: fadeIn 1.5s ease-in-out infinite alternate; /* Subtle animation for logo */
}

.spinner-border {
    width: 3rem;
    height: 3rem;
    border-width: 0.3rem;
    color:  red !important; /* Sets the spinner color to red */
}

@keyframes fadeIn {
    0% {
    opacity: 0.7;
    }
    100% {
    opacity: 1;
    }
}