.ticket-people-grid {
  display: grid;
  gap: 1rem;

  @media (width >= 40rem) {
    grid-template-columns: 1fr 1fr 10rem;
  }
}

.ticket-dates-grid {
  display: grid;
  gap: 1rem;

  @media (width >= 40rem) {
    grid-template-columns: auto auto 1fr 1fr 1fr;
  }
}

select[data-status="opened"],
select[data-status="scheduled"] { --input-background: var(--blue-100);   --input-border-color: var(--blue-300); }
select[data-status="in_progress"] { --input-background: var(--orange-100); --input-border-color: var(--orange-300); }
select[data-status="closed"]    { --input-background: var(--green-100);  --input-border-color: var(--green-300); }
select[data-status="canceled"]  { --input-background: var(--red-100);    --input-border-color: var(--red-300); }

.checklist-container {
  display: grid;
  grid-template-columns: auto 50px;
  gap: 10px;
}

.tasks-grid-container {
  display: grid;
  grid-template-columns: auto 200px 140px 140px 100px;
  gap: 10px;
  padding: 10px;
}

.ticket-tasks-grid-container {
  display: grid;
  grid-template-columns: auto 200px 115px 100px;
  gap: 10px;
  padding: 10px;
}