.timeline-layout {
  display: grid;
  gap: 2rem;
}

.timeline-controls {
  min-width: 0;
}

.timeline-controls .timeline-search {
  display: grid;
  gap: 1rem;
}

.timeline-controls .timeline-search label {
  display: block;
  font-weight: bold;
}

.timeline-controls .timeline-search input {
  display: block;
  margin-top: 0.5rem;
  width: 100%;
}

.timeline-results {
  min-width: 0;
  overflow-x: auto;
}

.preferred-false > td {
  background-color: #eee;
}

.status-DELETE > td {
  background-color: #fee;
}

.value {
  display: block;
}

#only-show-diffs:checked ~ * .value,
#only-show-first-last:checked ~ * tbody > tr,
#only-show-origins:checked ~ * tbody > tr {
  display: none;
}

#only-show-first-last:checked ~ * tr.version-first,
#only-show-first-last:checked ~ * tr.version-last,
#only-show-origins:checked ~ * tbody > tr.type-origin {
  display: table-row;
}

#only-show-preferred:checked ~ * .preferred-false {
  display: none !important;
}

.EventList > li > a {
  cursor: pointer;
  display: block;
}

@media (min-width: 48rem) {
  .timeline-layout {
    grid-template-columns: minmax(12rem, 16rem) minmax(0, 1fr);
  }
}