/* ════════════════════════════════════════
   TASKS — Work log, projects & progress
   ════════════════════════════════════════ */

/* ── Project header ── */
.proj-hdr {
  display:       flex;
  align-items:   center;
  gap:           8px;
  padding:       10px 14px;
  background:    var(--surf2);
  border-bottom: 1px solid var(--border);
  cursor:        pointer;
}

.proj-hdr.selected {
  box-shadow: inset 0 0 0 2px var(--c1);
}

/* ── Category header ── */
.cat-hdr {
  display:         flex;
  align-items:     center;
  justify-content: space-between;
  padding:         8px 14px 8px 24px;
  background:      rgba(128, 128, 128, .05);
  border-bottom:   1px solid var(--border);
  border-left:     4px solid transparent;
  font-size:       var(--text-cat);
  color:           var(--c2);
}

/* ── Task row ── */
.task-row {
  display:       flex;
  align-items:   center;
  gap:           10px;
  padding:       8px 14px 8px 34px;
  font-size:     var(--text-ui);
  border-bottom: 1px solid rgba(128, 128, 128, .05);
  cursor:        grab;
}

.task-row:active           { cursor: grabbing; }
.task-row.done .task-txt   { text-decoration: line-through; opacity: .4; }

/* Action buttons (edit, delete) hidden until row is hovered */
.task-action-btn {
  opacity:    0;
  transition: opacity .12s;
}

.task-row:hover .task-action-btn {
  opacity: .55;
}

.task-row .task-action-btn:hover {
  opacity: 1;
}

/* ── Progress bar ── */
.prog-track {
  height:        12px;
  width:         100%;
  background:    var(--surf2);
  border:        1px solid var(--border);
  border-radius: 6px;
  overflow:      hidden;
}

.prog-fill {
  height:        100%;
  border-radius: 6px;
  background:    var(--c1);
  transition:    width .5s ease;
}

/* Per-project progress block */
.project-progress {
  padding:       12px 14px;
  background:    rgba(128, 128, 128, .03);
  border-bottom: 1px solid rgba(128, 128, 128, .08);
}

.project-progress .proj-label {
  display:       block;
  font-size:     var(--text-md);
  color:         var(--dim);
  margin-bottom: 6px;
}