.test-result-error {
  padding: 8px 8px 12px 16px;
  background-color: var(--bg-alpha-capella);
  border-radius: 8px;
  position: relative;
  overflow: hidden;

  &:before {
    content: "";
    display: block;
    height: 100%;
    width: 2px;
    position: absolute;
    left: 0;
    top: 0;
    background: var(--on-support-capella);
  }
}

.test-result-error-header {
  display: flex;
  gap: 4px;
  justify-content: space-between;
}

.test-result-error-text {
  margin-bottom: 8px;
  padding-left: 8px;
  color: var(--on-support-capella);
}

.test-result-error-trace {
  margin-top: 8px;
  padding-left: 8px;

  pre {
    overflow: scroll;
    padding-bottom: 24px;
  }
}

.test-result-error-message {
  padding: 8px;
  border-radius: 8px;
  cursor: pointer;
  transition: background-color 300ms;

  &:hover {
    background: var(--bg-alpha-capella);
  }
}
