.task {
  grid-template-columns: 34px minmax(180px, 1fr) 150px 100px 30px;
}

.delete-btn,
.card-delete,
.account-delete {
  border: 0;
  background: transparent;
  color: #a1a49f;
  cursor: pointer;
  transition: .2s;
}

.delete-btn {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  font-size: 18px;
}

.delete-btn:hover,
.card-delete:hover {
  background: #f4ddd8;
  color: var(--coral);
}

.content-card {
  position: relative;
}

.card-delete {
  position: absolute;
  right: 8px;
  top: 8px;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  font-size: 16px;
}

.content-card > p {
  padding-right: 22px;
}

.account-delete {
  padding: 7px 9px;
  border-radius: 8px;
  color: var(--coral);
  font-size: 11px;
  font-weight: 700;
}

.account-delete:hover {
  background: #f4ddd8;
}

@media (max-width: 900px) {
  .task { grid-template-columns: 30px 1fr 90px 28px; }
}

@media (max-width: 580px) {
  .task { grid-template-columns: 30px 1fr 74px 26px; }
  .task-time { display: none; }
}