/* tasks.css */

.tasks-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-3);
}

.task-card {
  background: var(--clr-surface-2);
  border: 1px solid var(--clr-border);
  border-radius: var(--radius-md);
  padding: var(--space-3) var(--space-4);
  cursor: grab;
}
.task-card.dragging {
  opacity: 0.5;
  border-style: dashed;
}
.task-card--done { opacity: 0.6; }

.task-card__main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  flex-wrap: wrap;
}

.task-check,
.step-check {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  cursor: pointer;
}
.task-check input,
.step-check input {
  width: 20px;
  height: 20px;
  accent-color: var(--clr-primary);
  flex-shrink: 0;
}
.task-card--done .task-card__title { text-decoration: line-through; }

.task-card__title { font-weight: var(--font-medium); color: var(--clr-text-1); }

.task-card__meta {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-wrap: wrap;
}

.task-card__steps {
  margin-top: var(--space-3);
  padding-top: var(--space-3);
  border-top: 1px dashed var(--clr-border);
}

.steps {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
}
.step-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
}
.step-empty { margin-bottom: var(--space-3); }

.step-add {
  display: flex;
  gap: var(--space-2);
}

.voice-btn { flex-shrink: 0; }

@media (max-width: 560px) {
  .task-card__main { align-items: flex-start; }
}