.Container {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.ExternalEventsContainer {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  min-height: 34px;
}

.ExternalEvent {
  padding: 4px 8px;
  border-radius: 4px;
  border: 1px solid var(--jade-11);
  background-color: var(--jade-3);

  &[data-placeholder] {
    opacity: 0.5;
  }

  &[data-dragging] {
    opacity: 0.5;
  }
}