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

.animate-slide-out {
    animation: slideOut 0.4s ease forwards;
  }

.po-highlight {
    box-shadow: 0 0 0 6px #3b82f6; 
    transition: box-shadow 0.8s ease;
  }

.po-highlight-fadeout {
    box-shadow: 0 0 0 0 transparent;
    transition: box-shadow 0.8s ease;
  }

/* Add this to your main CSS file or in a <style> tag in warehouse_management.html */
#purchase-orders-list #item-list-container.initially-hidden {
  visibility: hidden; /* Or display: none; if you prefer, but visibility can be smoother */
}