/* tasks.css — список задач (js/tasks.js) и карточка задачи (js/task.js): фильтры, таблица, раскладка карточки
   (основная колонка + атрибуты), источник и цитата, комментарии, контекст сообщения. История — общий
   .timeline (components/timeline.css), доска — components/kanban.css. Владелец — агент `tasks` (волна 1).
   Правила: только var(--…) токены (tests/ui/test_ui_regulation.py), см. docs/THEMES.md. */

/* ---------- фильтры списка ---------- */
.task-filters { margin-bottom: var(--s3); }
.task-filters .toolbar { margin-bottom: var(--s2); }
.toolbar label.check input { min-width: 0; width: 16px; flex: none; }   /* чекбокс в панели фильтров — без min-width полей */
.tf-more summary { display: inline-flex; align-items: center; gap: var(--s1h); min-height: var(--control-h-sm); }
.tf-more summary .icon { width: 16px; height: 16px; }
.tf-more[open] summary { margin-bottom: var(--s2); }
.tf-grid > .field { flex: 1 1 200px; min-width: 0; }
.task-count { margin: 0 0 var(--s2); min-height: 1.4em; }
[data-results][aria-busy="true"], [data-board][aria-busy="true"] { opacity: .6; transition: opacity var(--dur-fast) var(--ease) var(--dur); }

/* ---------- таблица ---------- */
.task-table .task-no { width: 1%; white-space: nowrap; color: var(--fg-muted); }
.task-table .task-cell { min-width: 180px; }
.task-meta { margin-top: var(--s1); }
.task-project { display: inline-flex; align-items: center; gap: var(--s1); }
.task-project .icon { width: 14px; height: 14px; color: var(--fg-muted); }
/* телефон: строка — компактная карточка (название на всю ширину, ниже чипы статуса, срока, исполнителя и
   проекта без подписей колонок — чипы говорят сами за себя); «Обновлена» скрыта */
@media (max-width: 640px) {
  .table-wrap > table.task-table > tbody > tr { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s1h) var(--s2);
    padding: var(--s3); }
  .table-wrap > table.task-table > tbody > tr > td { padding: 0; }
  .table-wrap > table.task-table > tbody > tr > td[data-label]::before { display: none; }
  .table-wrap > table.task-table > tbody > tr > td.task-cell { order: 0; flex: 1 1 100%; min-width: 0; }
  .table-wrap > table.task-table > tbody > tr > td.task-no { order: 1; display: inline-flex; width: auto; flex: none;
    color: var(--fg-muted); font-size: var(--fs-xs); }
  .table-wrap > table.task-table > tbody > tr > td.task-no::before { content: "#"; display: inline; margin: 0; text-transform: none;
    font-size: inherit; letter-spacing: 0; }
  .table-wrap > table.task-table > tbody > tr > td:nth-child(6) { order: 2; }
  .table-wrap > table.task-table > tbody > tr > td:nth-child(4) { order: 3; }
  .table-wrap > table.task-table > tbody > tr > td:nth-child(3) { order: 4; min-width: 0; max-width: 100%; }
  .table-wrap > table.task-table > tbody > tr > td:nth-child(5) { order: 5; }
  .table-wrap > table.task-table > tbody > tr > td:nth-child(5):has(> .muted) { display: none; }
  .table-wrap > table.task-table > tbody > tr > td:nth-child(7) { display: none; }
}

/* ---------- карточка задачи ---------- */
.task-back { margin: 0 0 var(--s2); }
.task-back a { display: inline-flex; align-items: center; gap: var(--s1); color: var(--fg-muted); text-decoration: none; font-size: var(--fs-sm); }
.task-back a:hover { color: var(--fg); text-decoration: underline; }
.task-back .icon { width: 16px; height: 16px; }
.page-head .muted .chip, .page-head .muted .status { vertical-align: middle; }
.task-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, 320px); gap: var(--s4); align-items: start; }
.task-main { min-width: 0; }
.task-main > .card + .card { margin-top: 0; }
.task-side { position: sticky; top: calc(var(--topbar-h) + var(--s3)); }
@media (max-width: 900px) {
  .task-layout { grid-template-columns: minmax(0, 1fr); }
  .task-side { position: static; order: -1; }
}
.task-attrs { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--s1); margin: 0; }
.task-attrs dt { margin-top: var(--s2); color: var(--fg-muted); font-size: var(--fs-xs); font-weight: var(--fw-medium);
  text-transform: uppercase; letter-spacing: var(--tracking-caps); }
.task-attrs dt:first-child { margin-top: 0; }
.task-attrs dd { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: var(--s1) var(--s2); min-width: 0; overflow-wrap: anywhere; }
.task-attrs dd a { display: inline-flex; align-items: center; gap: var(--s1); }
.task-attrs dd .icon { width: 14px; height: 14px; }
.task-attrs .hint { width: 100%; color: var(--fg-muted); font-size: var(--fs-xs); }
@media (max-width: 900px) {   /* узкий экран: атрибуты парами «подпись — значение», описание не уезжает вниз */
  .task-attrs { grid-template-columns: minmax(96px, auto) minmax(0, 1fr); column-gap: var(--s3); row-gap: var(--s2); }
  .task-attrs dt, .task-attrs dt:first-child { margin-top: 0; padding-top: 2px; }
}
.task-silent { display: inline-flex; align-items: center; gap: var(--s1); }
.task-exact { width: 100%; }
.task-watchers { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--s1); width: 100%; }
.task-watcher { display: flex; align-items: center; gap: var(--s1); flex-wrap: wrap; min-width: 0; }
.task-watcher .chip-x { width: 24px; height: 24px; }   /* цель ≥ 24×24 px (WCAG 2.5.8): общий .chip-x — 18 px */
.task-desc { line-height: var(--lh-body); overflow-wrap: anywhere; }
.task-desc > * + * { margin-top: var(--s2); }

/* источник: цитата-доказательство (только если сервер её отдал — есть доступ к контейнеру) */
.task-quote { margin: 0 0 var(--s3); padding: var(--s2) var(--s3); border-left: calc(var(--border-w) + 2px) solid var(--accent);
  background: var(--surface-2); border-radius: 0 var(--r) var(--r) 0; white-space: pre-wrap; overflow-wrap: anywhere;
  line-height: var(--lh-body); }
.task-source-hidden { margin-top: 0; }
.task-source-hidden p { line-height: var(--lh-body); }
.task-main > .notice + .card { margin-top: 0; }

/* комментарии */
.task-comments { list-style: none; margin: 0 0 var(--s3); padding: 0; display: flex; flex-direction: column; gap: var(--s3); }
.task-comment { display: flex; gap: var(--s2); align-items: flex-start; }
.task-comment.deleted { opacity: .75; }
.stack-tight { display: flex; flex-direction: column; gap: var(--s1); flex: 1; }
.tc-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--s1) var(--s2); }
.tc-head .who { font-weight: var(--fw-semibold); }
.tc-actions { margin-left: auto; display: inline-flex; gap: 2px; }
.tc-text { overflow-wrap: anywhere; line-height: var(--lh-body); }
.tc-text > * + * { margin-top: var(--s1); }
.task-comment-form textarea { min-height: 84px; }

/* контекст сообщения-источника (окно) */
.task-ctx { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--s2); }
.task-ctx li { padding: var(--s2) var(--s3); border-radius: var(--r); background: var(--surface-2); }
.task-ctx li.task-ctx-target { background: var(--accent-soft); border-left: calc(var(--border-w) + 2px) solid var(--accent); }
.board-hint { margin: 0 0 var(--s3); }
@media (max-width: 640px) { .board-hint { display: none; } }