/* Animations */
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes scaleIn {
  from {
    transform: scale(0.9);
    opacity: 0;
  }
  to {
    transform: scale(1);
    opacity: 1;
  }
}

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

/* Apply animations */
.tab-content.active {
  animation: fadeIn 0.3s ease forwards;
}

.mood-btn.selected {
  animation: scaleIn 0.2s ease forwards;
}

.entry-card {
  animation: slideIn 0.3s ease forwards;
}

/* Hover effects */
.mood-btn:hover {
  transform: scale(1.1);
  transition: transform 0.2s ease;
}

.btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  transition: all 0.2s ease;
}

/* Transitions for theme changes */
body,
.app-container,
header,
.mood-btn,
.btn {
  transition: background-color 0.3s ease, color 0.3s ease,
    border-color 0.3s ease;
}