/* ===== ANIMATIONS ===== */
@keyframes shimmer {
  0% {
    left: -100%;
  }
  100% {
    left: 100%;
  }
}

@keyframes slideDown {
  from {
    opacity: 0;
    max-height: 0;
    transform: translateY(-10px);
  }
  to {
    opacity: 1;
    max-height: 600px;
    transform: translateY(0);
  }
}

@keyframes slideUp {
  from {
    opacity: 1;
    max-height: 600px;
    transform: translateY(0);
  }
  to {
    opacity: 0;
    max-height: 0;
    transform: translateY(-10px);
  }
}

/* The max-height keyframes clamp the box while it animates; overflow must
   be hidden or content taller than the clamp paints outside the section
   mid-animation. album-manager.js removes .slide-down on animationend so
   the section returns to natural (unclamped) height once open — the
   InvokeAI board form is taller than the 600px the keyframes assume. */
.slide-down {
  animation: slideDown 0.3s ease forwards;
  overflow: hidden;
}

.slide-up {
  animation: slideUp 0.3s ease forwards;
  overflow: hidden;
}