/* stylelint-disable no-descending-specificity */
/* stylelint-disable no-duplicate-selectors */

.agent-assistant-fab.is-action-eye-roll .agent-assistant-fab__head {
  animation: agent-fab-action-eye-roll-head 1.9s ease-in-out both;
}

.agent-assistant-fab.is-action-eye-roll .agent-assistant-fab__eye {
  animation:
    agent-fab-blink 4.8s ease-in-out infinite,
    agent-fab-action-eye-roll 0.95s ease-in-out 2;
}

@keyframes agent-fab-action-eye-roll-head {
  0%,
  100% {
    transform: translate(var(--agent-assistant-head-x), var(--agent-assistant-head-y)) rotate(0deg);
  }

  24% {
    transform: translate(var(--agent-assistant-head-x), calc(var(--agent-assistant-head-y) - 0.06rem)) rotate(-6deg);
  }

  52% {
    transform: translate(var(--agent-assistant-head-x), var(--agent-assistant-head-y)) rotate(5deg);
  }

  78% {
    transform: translate(var(--agent-assistant-head-x), calc(var(--agent-assistant-head-y) - 0.03rem)) rotate(-3deg);
  }
}

@keyframes agent-fab-action-eye-roll {
  0%,
  100% {
    transform: translate(var(--agent-assistant-eye-x), var(--agent-assistant-eye-y));
  }

  22% {
    transform: translate(0.22rem, -0.2rem);
  }

  48% {
    transform: translate(0, -0.3rem);
  }

  72% {
    transform: translate(-0.22rem, -0.2rem);
  }
}
