.task-item {
  border: 1px solid transparent;
  /* cursor: pointer; */
  @media (hover: hover) {
    &:hover {
      background-color: white;
      border-top: 1px solid var(--color-border);
      border-bottom: 1px solid var(--color-border);
      /* background-color: #f0f0f0; */
      /* box-shadow: 0 0 14px 0 rgba(0, 0, 0, 0.20); */
    }
  }
}

.completed .task-name {
  text-decoration: line-through;
  opacity: 0.3;
}

.completed .due-date {
  text-decoration: line-through;
  opacity: 0.5;
}