/* Fade-in e fade-out */
.fade-in {
  animation: fadeIn 0.6s ease forwards;
}
.fade-out {
  animation: fadeOut 0.6s ease forwards;
}

@keyframes fadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes fadeOut {
  from { opacity: 1; transform: translateY(0); }
  to { opacity: 0; transform: translateY(-10px); }
}

/* Spinner personalizzato */
.loader {
  display: none;
  border: 4px solid #f3f3f3;
  border-top: 4px solid #0d6efd; /* colore primario bootstrap */
  border-radius: 50%;
  width: 32px;
  height: 32px;
  animation: spin 1s linear infinite;
  margin: 10px auto;
}
@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}