/* Módulo tareas (pantalla 6). Solo tokens: nada de colores literales. Prefijo propio `tar-`. */

/* Selector de listas: chips desplazables (sin scroll de página en 360 px). */
.tar-listas { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 2px 0 12px; max-width: 100%; }
.tar-lista-chip { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border-radius: 999px; border: 1px solid var(--border); background: var(--card); color: var(--ink-2); font: 600 13px var(--font-ui); cursor: pointer; white-space: nowrap; }
.tar-lista-chip:hover { border-color: var(--border-strong); color: var(--ink-1); }
.tar-lista-chip[aria-pressed="true"] { background: var(--accent-soft); border-color: var(--accent); color: var(--ink-1); }
.tar-lista-chip .cuenta { min-width: 20px; height: 18px; padding: 0 6px; border-radius: 999px; background: var(--sunken); color: var(--ink-2); font-size: 11.5px; display: inline-grid; place-items: center; }

.tar-barra { flex-wrap: wrap; }
.tar-orden { width: auto; min-width: 160px; height: 34px; }
.tar-check { white-space: nowrap; }

/* Alta rápida */
.tar-alta { display: flex; align-items: center; gap: 8px; padding: 10px 16px; border-bottom: 1px solid var(--border); background: var(--sunken); }
.tar-alta-icono { color: var(--accent); }
.tar-alta-nombre { flex: 1 1 220px; min-width: 0; }
.tar-alta-lista { flex: 0 1 180px; width: auto; }
.tar-alta-fecha { flex: 0 0 150px; width: auto; }
.tar-alta-error { padding: 6px 16px 0; }

/* Renglón de tarea (lista moderna) */
.tar-row { display: flex; align-items: center; gap: 12px; padding: 10px 16px; border-bottom: 1px solid var(--border); cursor: pointer; }
.tar-row:last-child { border-bottom: 0; }
.tar-row:hover { background: var(--accent-soft); }
.tar-row .who { flex: 1; min-width: 0; }
.tar-row .who-name { font: 600 14px var(--font-ui); color: var(--ink-1); overflow-wrap: anywhere; }
.tar-row .who-id { font-size: 12px; color: var(--ink-3); overflow-wrap: anywhere; }
.tar-row.tar-cerrada .who-name { text-decoration: line-through; color: var(--ink-3); }
.tar-tiene-detalle { margin-left: 4px; color: var(--ink-3); }
.tar-pill { white-space: nowrap; }
.tar-pill i { font-size: 10px; }

/* Botón ✔ (cerrar / reabrir): 32 px de área táctil, el estado también va en aria-pressed y en el texto. */
.tar-check-btn { flex: none; width: 26px; height: 26px; border-radius: 50%; border: 2px solid var(--border-strong); background: var(--card); color: transparent; display: grid; place-items: center; cursor: pointer; font-size: 12px; padding: 0; }
button.tar-check-btn:hover { border-color: var(--success); color: var(--success); }
.tar-check-btn[aria-pressed="true"], .tar-cerrada span.tar-check-btn { background: var(--success); border-color: var(--success); color: var(--card); }
.tar-check-btn:disabled { cursor: wait; color: var(--ink-3); }

/* Drawer */
.tar-pills { display: flex; flex-wrap: wrap; gap: .4rem; }
.tar-tabs { display: flex; max-width: 100%; overflow-x: auto; scrollbar-width: none; margin: 14px 0 12px; }
.tar-tabs button { flex: none; }
.tar-atajos { display: flex; flex-wrap: wrap; gap: 6px; margin-top: -4px; }
.tar-error { margin-top: 14px; }
.tar-ficha { margin: 18px 0 0; display: grid; gap: 6px; font-size: 12.5px; }
.tar-ficha > div { display: flex; gap: 8px; }
.tar-ficha dt { min-width: 84px; color: var(--ink-3); font-weight: 600; }
.tar-ficha dd { margin: 0; color: var(--ink-2); overflow-wrap: anywhere; }

/* Administración de listas */
.tar-lista-celda { display: flex; align-items: center; gap: 10px; min-width: 0; }
.tar-txt { min-width: 0; }
.tar-avatar { width: 32px; height: 32px; font-size: 11px; flex: none; }
.tar-chip-usuario { height: 28px; gap: 4px; }
.tar-chip-quitar { border: 0; background: transparent; color: var(--ink-3); cursor: pointer; width: 22px; height: 22px; border-radius: 50%; display: inline-grid; place-items: center; padding: 0; }
.tar-chip-quitar:hover { background: var(--danger-soft); color: var(--danger); }

@media (max-width: 760px) {
  .tar-orden { flex: 1 1 140px; min-width: 0; }
  .tar-total { display: none; }
  .tar-alta { flex-wrap: wrap; padding: 10px 12px; }
  .tar-alta-icono { display: none; }
  .tar-alta-nombre { flex: 1 1 100%; }
  .tar-alta-lista, .tar-alta-fecha { flex: 1 1 calc(50% - 50px); min-width: 0; }
  .tar-row { flex-wrap: wrap; row-gap: 6px; padding: 10px 12px; }
  .tar-row .who { flex: 1 1 calc(100% - 80px); }
  .tar-row .kebab { order: 2; }
  .tar-row .tar-pill { order: 3; margin-left: 38px; }
}