@keyframes float {
  0% {
    transform: translate(0, 0);
  }
  25% {
    transform: translate(3%, 3%);
  }
  50% {
    transform: translate(0%, 6%);
  }
  75% {
    transform: translate(-3%, 3%);
  }
  100% {
    transform: translate(0, 0);
  }
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes bounce {
  0%,
  20%,
  50%,
  80%,
  100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-15px);
  }
  60% {
    transform: translateY(-7px);
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.fab-pulse {
  animation: fabPulse 2s infinite;
}

@keyframes fabPulse {
  0% {
    box-shadow: 0 4px 15px rgba(126, 84, 237, 0.3);
  }
  50% {
    box-shadow: 0 4px 25px rgba(126, 84, 237, 0.6);
  }
  100% {
    box-shadow: 0 4px 15px rgba(126, 84, 237, 0.3);
  }
}

/* Pages Container Animation */
.pages-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  overflow: hidden;
}

.page {
  flex: 0 0 100%;
  height: 100%;
  overflow-y: auto;
  scroll-snap-align: start;
  padding-top: var(--header-height);
  padding-bottom: var(--bottom-nav-height);
  transform: translateZ(0);
  -webkit-overflow-scrolling: touch;
}