.messages-container {
  position: fixed;
  top: 70px; /* Adjust as needed to align with the navbar */
  right: 20px;
  width: 25%; /* Adjust as needed to control the container size */
  max-height: 25vh; /* Adjust as needed to control the container size */
  overflow-y: auto;
  z-index: 100;
}

.alert {
  border: none;
  border-radius: 0;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
  margin-bottom: 10px;
  position: relative;
  animation: fade-out 6s forwards;
}

.alert .btn-close {
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  color: rgba(0, 0, 0, 0.5);
  opacity: 0.5;
  transition: opacity 0.3s;
}

.alert .btn-close:hover {
  opacity: 1;
}

.alert-primary {
  background-color: #007bff;
  color: #fff;
}

.alert-secondary {
  background-color: #6c757d;
  color: #fff;
}

.alert-success {
  background-color: #28a745;
  color: #fff;
}

.alert-danger {
  background-color: #dc3545;
  color: #fff;
}

.alert-warning {
  background-color: #ffc107;
  color: #212529;
}

.alert-info {
  background-color: #17a2b8;
  color: #fff;
}

.alert-light {
  background-color: #f8f9fa;
  color: #212529;
}

.alert-dark {
  background-color: #343a40;
  color: #fff;
}

@keyframes fade-out {
  0% { opacity: 1; }
  90% { opacity: 1; }
  100% { opacity: 0; }
}
