/* =====================================================================
   DOMINO — Tasks hub
   ===================================================================== */
.tk-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--hairline); border-top: 1px solid var(--hairline); border-bottom: 1px solid var(--hairline); }
.tk-metric { background: var(--surface); padding: 14px var(--gutter); }
.tk-metric__l { font-size: 10px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--slate-400); }
.tk-metric__v { font-size: 26px; font-weight: 300; color: var(--ink-900); letter-spacing: -0.02em; margin-top: 6px; font-feature-settings: "tnum" 1; }
.tk-metric--danger .tk-metric__v { color: var(--danger); }
.tk-metric--warn .tk-metric__v { color: var(--warning); }

.tk-assignfilter select { font-family: var(--font-sans); font-size: 12.5px; }

.tk-list { padding: 14px var(--gutter) 28px; display: flex; flex-direction: column; }
.tk-row { display: grid; grid-template-columns: 26px 1fr auto auto 30px; gap: 14px; align-items: center; padding: 13px 0; border-top: 1px solid var(--hairline-soft); }
.tk-row:first-child { border-top: 0; }
.tk-row.is-done { opacity: 0.55; }
.tk-row.is-done .tk-title { text-decoration: line-through; color: var(--slate-500); }

.tk-check { width: 22px; height: 22px; flex: 0 0 auto; border-radius: 50%; border: 1.5px solid var(--slate-300); background: var(--surface); cursor: pointer; display: grid; place-items: center; color: #fff; padding: 0; transition: all var(--duration-fast) var(--ease-out); }
.tk-check:hover { border-color: var(--ac); }
.tk-row.is-done .tk-check { background: var(--success); border-color: var(--success); }

.tk-main { min-width: 0; }
.tk-title { font-size: 13.5px; font-weight: 600; color: var(--ink-900); letter-spacing: -0.01em; display: flex; align-items: center; gap: 7px; }
.tk-ai { display: inline-flex; color: var(--ac-700); }
.tk-meta { display: flex; align-items: center; gap: 10px; margin-top: 5px; flex-wrap: wrap; }
.tk-deal { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; color: var(--slate-500); }
.tk-deal svg { color: var(--slate-400); }
.tk-src { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; color: var(--slate-400); }
.tk-prio { flex: 0 0 auto; }
.tk-due { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 600; color: var(--slate-500); white-space: nowrap; min-width: 96px; justify-content: flex-end; }
.tk-due svg { color: var(--slate-400); }
.tk-due.is-overdue { color: var(--danger); }
.tk-due.is-overdue svg { color: var(--danger); }
.tk-due.is-soon { color: var(--warning); }
.tk-due.is-soon svg { color: var(--warning); }
.tk-assignee { width: 30px; height: 30px; flex: 0 0 auto; border-radius: 50%; overflow: hidden; background: var(--ink-700); color: var(--ivory); font-size: 10.5px; font-weight: 700; display: grid; place-items: center; }
.app.theme-dark .tk-assignee { background: var(--chip); color: var(--chip-fg); }

.tk-empty { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 60px 0; color: var(--slate-400); font-size: 13px; }
.tk-empty svg { color: var(--success); }

/* sidebar open-task badge reuses .nav__badge */

@media (max-width: 900px) {
  .tk-metrics { grid-template-columns: repeat(2, 1fr); }
  .tk-row { grid-template-columns: 26px 1fr 30px; }
  .tk-prio, .tk-due { display: none; }
}