/* new updated */
/* Skeleton Animation */
.skeleton {
  background: #e0e0e0;
  border-radius: 4px;
  animation: skeleton-loading 1.5s infinite linear;
}

@keyframes skeleton-loading {
  0% { opacity: 0.6; }
  50% { opacity: 1; }
  100% { opacity: 0.6; }
}

/* List Item Skeleton */
.skeleton-item {
  height: 60px; /* Password card ki height */
  width: 100%;
  margin-bottom: 10px;
}

.modal {
  transition: opacity 0.2s ease, visibility 0.2s ease;
  opacity: 0;
  visibility: hidden;
}

.modal.active,
.modal.open {
  opacity: 1;
  visibility: visible;
}

.modal-content {
  transition:
    transform 0.25s var(--ease-smooth),
    opacity 0.25s ease;
  opacity: 0;
  transform: scale(0.95) translateY(10px);
}

.modal.active .modal-content,
.modal.open .modal-content {
  opacity: 1;
  transform: scale(1) translateY(0);
  animation: modalPop 0.3s var(--ease-smooth); 
}

@keyframes modalPop {
  0% { opacity: 0; transform: scale(0.95) translateY(10px); }
  100% { opacity: 1; transform: scale(1) translateY(0); }
}