/* Wiggle animation for fullscreen toggle */
@keyframes toggle-wiggle {
  0%, 100% {
    transform: rotate(0deg);
  }

  25% {
    transform: rotate(-4deg);
  }

  75% {
    transform: rotate(3deg);
  }
}

[data-toggle-fullscreen]:hover i,
[data-toggle-fullscreen]:focus-visible i {
  animation: toggle-wiggle .3s ease-in-out;
}

@keyframes fade-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fade-in {
  animation: fade-in .25s ease-out forwards;
}

@keyframes fade-out {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.fade-out {
  animation: fade-out .25s ease-out forwards;
}