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

.animate-fadeIn {
  animation: fadeIn 0.3s ease;
}

@keyframes aiGlow {
  0%, 100% {
    box-shadow: 0 0 0 0 oklch(0.79 0.13 195.49 / 0.25);
  }

  50% {
    box-shadow: 0 0 24px 4px oklch(0.79 0.13 195.49 / 0.4);
  }
}

.ai-suggestion {
  border-color: oklch(0.79 0.13 195.49);
  background: oklch(0.94 0.04 195.49 / 0.35);
  animation: aiGlow 3s ease-in-out infinite;
}

@keyframes amberGlow {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(245, 158, 11, 0.1);
  }

  50% {
    box-shadow: 0 0 12px 2px rgba(245, 158, 11, 0.2);
  }
}

.unsaved-indicator {
  animation: amberGlow 3s ease-in-out infinite;
}