.dateWrapper {
  background: var(--color-background-secondary);
  margin: 0 calc(var(--spacing-sitepadding-inline)*-1) var(--spacing-sitepadding-block);
  padding: var(--spacing-s) var(--spacing-sitepadding-inline) var(--spacing-m);
}

.dateList {
  list-style: none;
  display: flex;
  gap: var(--spacing-s);
}

.date {
  font-family: var(--font-serif);
  font-size: var(--font-size-body);
  position: relative;
  line-height: 1.2;
  border-right: var(--border);
  padding-right: var(--spacing-s);

  &:last-child {
    border: none;
  }
}

.time {
  width: 100%;
}

.day {
  display: block;

  &:first-letter {
    text-transform: capitalize;
  }
}

.hour {
  display: block;
}

.venue {
  font-style: italic;
}