body {
  background-color: #eef6fa;
  font-family: 'Segoe UI', sans-serif;
}

.card {
  border-radius: 10px;
  animation: zoomIn 0.6s ease-out;
}

.btn-info {
  font-weight: bold;
  transition: background-color 0.3s ease;
}

.btn-info:hover {
  background-color: #17a2b8;
}

input, textarea, select {
  transition: box-shadow 0.3s ease;
}

input:hover, textarea:hover, select:hover {
  box-shadow: 0 0 10px rgba(0, 123, 255, 0.3);
}

@keyframes zoomIn {
  from {transform: scale(0.8); opacity: 0;}
  to {transform: scale(1); opacity: 1;}
}

@keyframes bounceIn {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); }
}

body {
  animation: bgChange 15s ease infinite alternate;
}

@keyframes bgChange {
  0% { background-color: #eef6fa; }
  100% { background-color: #e0f3ff; }
}

.btn-info:active {
  transform: scale(0.96);
  box-shadow: inset 0 3px 5px rgba(0,0,0,0.2);
}

input, textarea {
  border-bottom: 2px solid transparent;
  transition: border-color 0.3s ease;
}

input:focus, textarea:focus {
  border-color: #17a2b8;
}

.list-group-item {
  animation: slideInLeft 0.6s ease;
}

@keyframes slideInLeft {
  from { transform: translateX(-30px); opacity: 0; }
  to { transform: translateX(0); opacity: 1; }
}