.error-message {
  display: none;
  color: #dc2626;
  font-size: 0.875rem;
  margin-top: -0.5rem;
  animation: slideDown 0.3s ease-out;
}

.error-message.show {
  display: block;
}

.input.error {
  border-color: #dc2626 !important;
  background-color: #fef2f2;
}

.input.error:focus {
  ring-color: #dc2626 !important;
  border-color: #dc2626 !important;
}

.input.success {
  border-color: #10b981 !important;
  background-color: #f0fdf4;
}

@keyframes slideDown {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes pulse-glow {
  0%,
  100% {
    box-shadow: 0 0 15px rgba(99, 102, 241, 0.5);
  }
  50% {
    box-shadow: 0 0 25px rgba(99, 102, 241, 0.8);
  }
}

#progress-bar.complete {
  animation: pulse-glow 1.5s ease-in-out;
}
/* Mobile Responsive Styles */
@media (max-width: 768px) {
  .input,
  .textarea {
    font-size: 16px !important;
  }

  body {
    font-size: 14px;
  }

  h1 {
    font-size: 20px;
  }

  h2 {
    font-size: 16px;
  }

  h3 {
    font-size: 14px;
  }
}

@media (max-width: 640px) {
  .step {
    padding: 0;
  }

  .entry-box {
    flex-direction: column;
  }

  button {
    font-size: 14px;
    padding: 0.5rem;
  }

  .text-right {
    text-align: left;
  }
}