.parcel-item.rated {
  border-left: 3px solid #ffdd57;
}

/* Subtle background gradient for rated items */
.parcel-item.rated .parcel-item__header {
  background: linear-gradient(to right, rgba(255, 221, 87, 0.05), transparent);
}

.parcel-item__status--delivered {
  display: flex;
  align-items: center;
}

/* Add a small checkmark icon next to rated parcels */
.rating-system.rated::after {
  content: "✓";
  font-size: 0.8em;
  color: #00a950;
  margin-left: 3px;
  font-weight: bold;
}

/* Pulse animation for the tooltip to draw attention */
@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(255, 221, 87, 0.4);
  }
  70% {
    box-shadow: 0 0 0 10px rgba(255, 221, 87, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(255, 221, 87, 0);
  }
}

.rating-system:not(.rated) .rating-tooltip {
  animation: pulse 2s infinite;
  z-index: 1000;
}

/* Tooltip styles for rated items */
.rating-system.rated .rating-tooltip {
  background-color: #f0f7ff;
  border: 1px solid #d0e3ff;
  z-index: 1000;
}

.rating-system.rated .rating-tooltip::after {
  border-color: #f0f7ff transparent transparent transparent;
}

/* Make the stars slightly larger on hover for better UX */
.rating-system:not(.rated) label:hover,
.rating-system:not(.rated) label:hover ~ label {
  transform: scale(1.2);
  transition: transform 0.2s ease;
}

/* Add a subtle animation to draw attention to unrated parcels */
@keyframes subtle-glow {
  0% {
    box-shadow: 0 0 3px rgba(255, 221, 87, 0.3);
  }
  50% {
    box-shadow: 0 0 5px rgba(255, 221, 87, 0.5);
  }
  100% {
    box-shadow: 0 0 3px rgba(255, 221, 87, 0.3);
  }
}

.rating-system:not(.rated) {
  animation: subtle-glow 2s infinite;
  border-radius: 4px;
  padding: 2px 4px;
}