/* ActivityFeedComponent + ActivityEventComponent. */

.activity-feed {
  display: flex;
  flex-direction: column;
  gap: 1px;
  max-height: 400px;
  overflow-y: auto;
  background-color: var(--surface-1);
  border: 1px solid var(--border-default);
  border-radius: var(--radius-md);
}

.activity-event {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-2);
  padding: var(--space-2) var(--space-3);
  border-left: 2px solid transparent;
  font-size: var(--text-xs);
  background-color: transparent;
  border-bottom: 1px solid var(--border-subtle);
  transition: background-color var(--transition-fast);
}
.activity-event:last-child { border-bottom: none; }
.activity-event:hover { background-color: var(--color-white-05); }

/* New events slide in from the right */
.activity-event--new {
  animation: slide-in-right var(--transition-slow) both;
}

/* Color variants — left accent */
.activity-event--green  { border-left-color: var(--color-vine); }
.activity-event--amber  { border-left-color: var(--color-amber); }
.activity-event--gold,
.activity-event--yellow { border-left-color: var(--color-sunflower); }
.activity-event--gray   { border-left-color: var(--color-ash); }

.activity-event__label {
  color: var(--color-parchment);
  font-size: var(--text-xs);
  line-height: var(--leading-snug);
  flex: 1;
  min-width: 0;
}

.activity-event__user {
  color: var(--color-amber);
  font-weight: 600;
}

.activity-event__time {
  color: var(--color-ash);
  font-size: 11px;
  white-space: nowrap;
  flex-shrink: 0;
  font-family: var(--font-mono);
}

/* Empty state */
.activity-feed--empty {
  text-align: center;
  padding: var(--space-6);
  color: var(--color-ash);
  font-size: var(--text-sm);
}