@import "tailwindcss";
@import "@nuxt/ui";

:root {
  --animate-wave: wave 3s infinite;

  --ui-bg: #f8f8f8;

  --ui-font-family: 'DM Sans', sans-serif;
  transition-duration: 0.7s;
}

.dark {
  --animate-wave: wave 3s infinite;
  
  --ui-bg: #0f0f0f;

  --ui-font-family: 'DM Sans', sans-serif;
  transition-duration: 0.7s;
}

.sofia {
  --ui-font-family: 'Sofia Sans', sans-serif;
}

@keyframes wave {

  0%,
  50%,
  100% {
    transform: rotate(-12deg);
  }

  25%,
  75% {
    transform: rotate(3deg) scale(1.5);
  }
}