@tailwind base;
@tailwind components;
@tailwind utilities;

:root {
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
}

body {
  margin: 0;
  padding: 0;
  overscroll-behavior: none;
}

/* Custom Animations for Page Transitions */
@keyframes zoom-in-enter {
  0% {
    opacity: 0;
    transform: scale(0.99);
  }

  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes slide-in-right-enter {
  0% {
    opacity: 0;
    transform: translateX(50px);
  }

  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

.animate-zoom-in {
  animation: zoom-in-enter 0.3s ease-out forwards;
}

.animate-slide-in-right {
  animation: slide-in-right-enter 0.5s ease-out forwards;
}