/* AI Chat — animations & custom styles */

/* Message entrance animation */
@keyframes ai-message-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.ai-message-enter {
  animation: ai-message-in 0.25s ease-out both;
}

/* Bouncing dots loading indicator */
@keyframes ai-dot-bounce {
  0%, 80%, 100% {
    transform: scale(0.6);
    opacity: 0.4;
  }
  40% {
    transform: scale(1);
    opacity: 1;
  }
}

.ai-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: currentColor;
  display: inline-block;
  animation: ai-dot-bounce 1.2s ease-in-out infinite;
}

.ai-dot:nth-child(2) { animation-delay: 0.16s; }
.ai-dot:nth-child(3) { animation-delay: 0.32s; }

/* Preview flash on update */
@keyframes ai-preview-flash {
  0% { background-color: rgb(238 242 255); /* indigo-50 */ }
  100% { background-color: transparent; }
}

.ai-preview-flash {
  animation: ai-preview-flash 0.8s ease-out;
}

/* Send button glow when active */
.ai-send-ready {
  box-shadow: 0 0 0 3px rgb(99 102 241 / 0.15);
}

/* Auto-resize textarea */
.ai-autoresize {
  field-sizing: content;
  min-height: 7rem;
  max-height: 10rem;
  padding: 0.75rem 1rem;
}

/* Suggestion chips */
.ai-chip {
  transition: background-color 0.15s ease, color 0.15s ease;
}

.ai-chip:hover {
  background-color: rgb(238 242 255);
  color: rgb(79 70 229);
}

:is(.dark .ai-chip:hover) {
  background-color: rgb(49 46 129 / 0.2);
  color: rgb(165 180 252);
}

/* Drawer smooth open/close */
.ai-drawer-enter {
  transition: transform 0.3s cubic-bezier(0.32, 0.72, 0, 1);
}

/* Subtle left border for assistant messages */
.ai-msg-assistant {
  border-left: 2px solid rgb(203 213 225); /* slate-300 */
}

:is(.dark .ai-msg-assistant) {
  border-left-color: rgb(71 85 105); /* slate-600 */
}

/* Action message accent */
.ai-msg-action {
  border-left: 2px solid rgb(99 102 241); /* indigo-500 */
}