/* 23-tasks.css — the task board, blocked rail, materials tracker. */

.tsk-wrap { display: flex; flex-direction: column; gap: 14px; }
.tsk-h { font-size: 13px; }

/* blocked rail — what can't move and why */
.tsk-blocked { padding: 14px; border-color: var(--redline); box-shadow: 0 0 0 1px var(--redline), var(--shadow); }
.tsk-blocked-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 9px; }
.tsk-rackbtn { background: none; border: 0; cursor: pointer; color: var(--ink); font-size: 15px; padding: 0; }
.tsk-rackbtn:hover { color: var(--blueline); }
.tsk-blocked-why { font-size: 13.5px; }
.tsk-mat {
  font-size: 11.5px; color: var(--amber);
  border: 1px solid var(--amber); background: var(--amber-soft);
  border-radius: 2px; padding: 1px 7px;
}

.tsk-bar { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.tsk-chip {
  font-family: var(--font-draw); font-weight: 600; text-transform: uppercase; letter-spacing: .06em;
  font-size: 11.5px; color: var(--steel);
  background: var(--card); border: 1px solid var(--hair); border-radius: 14px;
  padding: 4px 12px; cursor: pointer;
}
.tsk-chip:hover { border-color: var(--steel); color: var(--ink); }
.tsk-chip.active { background: var(--ink); border-color: var(--ink); color: var(--card); }
:root[data-theme="dark"] .tsk-chip.active { color: #14181B; }

.tsk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; align-items: start; }
.tsk-rack { padding: 10px 12px 12px; }
.tsk-rack-head {
  display: flex; align-items: baseline; gap: 9px; width: 100%;
  background: none; border: 0; cursor: pointer; color: var(--ink);
  padding: 2px 0 8px; font-size: 16px; text-align: left;
  border-bottom: 1px solid var(--hair); margin-bottom: 6px;
}
.tsk-rack-head:hover .draw-title { color: var(--blueline); }

/* one task row: verb · meter · count · assignee · block */
.tsk-row { display: flex; align-items: center; gap: 8px; padding: 5px 0; }
.tsk-row.done { opacity: .55; }
.tsk-verb { font-size: 11.5px; width: 96px; flex-shrink: 0; letter-spacing: .06em; }
.tsk-row.blocked .tsk-verb { color: var(--redline); }
.tsk-meter { flex: 1; } .tsk-meter .meter { width: 100%; }
.tsk-count { font-size: 11px; color: var(--steel); min-width: 38px; text-align: right; }
.tsk-assign {
  width: 30px; height: 26px; border-radius: 3px; flex-shrink: 0;
  font-family: var(--font-mono); font-size: 10.5px; cursor: pointer;
  background: none; border: 1.5px dashed var(--ghost); color: var(--steel);
}
.tsk-assign:hover { border-color: var(--blueline); color: var(--blueline); }
.tsk-assign.has { background: var(--ink); border: 1.5px solid var(--ink); color: var(--card); }
:root[data-theme="dark"] .tsk-assign.has { color: #14181B; }
.tsk-blockbtn {
  background: none; border: 0; color: var(--ghost); cursor: pointer;
  font-size: 12px; padding: 2px 3px; flex-shrink: 0;
}
.tsk-blockbtn:hover { color: var(--redline); }

/* materials tracker */
.tsk-mats, .tsk-punch { padding: 14px; }
.tsk-mats-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.tsk-mat-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 6px 0; border-top: 1px solid var(--hair); }
.tsk-mat-qty { min-width: 62px; font-size: 12.5px; }
.tsk-mat-item { font-weight: 600; }
.tsk-mat-pill {
  margin-left: auto; cursor: pointer;
  font-family: var(--font-draw); font-weight: 700; font-size: 10.5px; letter-spacing: .08em;
  border-radius: 2px; padding: 3px 10px; border: 1.5px solid;
}
.tsk-mat-pill.st-requested { color: var(--redline); border-color: var(--redline); background: var(--redline-soft); }
.tsk-mat-pill.st-ordered { color: var(--amber); border-color: var(--amber); background: var(--amber-soft); }
.tsk-mat-pill.st-received { color: var(--stamp); border-color: var(--stamp); background: var(--stamp-soft); cursor: default; }