/* AI Creature & Logo Animations
   These CSS animations can be applied to any of the SVG logos in the assets/logos/ folder
   to create dynamic, breathing, or thinking dashboard creatures!
*/

/* 1. Pulse / Breathing (Good for idle state) */
@keyframes ai-breathe {
  0% { transform: scale(1); opacity: 0.8; }
  50% { transform: scale(1.05); opacity: 1; }
  100% { transform: scale(1); opacity: 0.8; }
}
.anim-breathe {
  animation: ai-breathe 3s infinite ease-in-out;
}

/* 2. OpenAI / ChatGPT style thinking spin */
@keyframes ai-think-spin {
  0% { transform: rotate(0deg) scale(1); }
  50% { transform: rotate(180deg) scale(0.9); }
  100% { transform: rotate(360deg) scale(1); }
}
.anim-think-spin {
  animation: ai-think-spin 2.5s infinite cubic-bezier(0.4, 0, 0.2, 1);
}

/* 3. Claude / Anthropic style blink & compute */
@keyframes ai-compute {
  0% { opacity: 1; filter: brightness(1); }
  10% { opacity: 0.5; filter: brightness(1.5); }
  20% { opacity: 1; filter: brightness(1); }
  80% { opacity: 1; filter: brightness(1); }
  90% { opacity: 0.7; filter: brightness(1.2); }
  100% { opacity: 1; filter: brightness(1); }
}
.anim-compute {
  animation: ai-compute 4s infinite;
}

/* 4. OpenClaw / Codex energetic processing */
@keyframes ai-process {
  0% { transform: translateY(0px); }
  25% { transform: translateY(-3px) scale(1.02); }
  50% { transform: translateY(0px) scale(1); }
  75% { transform: translateY(2px) scale(0.98); }
  100% { transform: translateY(0px); }
}
.anim-process {
  animation: ai-process 0.8s infinite ease-in-out;
}

/* Base utility class for logo application */
.ai-creature-logo {
  display: inline-block;
  transition: all 0.3s ease;
  will-change: transform, opacity, filter;
}
