/* ═══════════════════════════════════════════════════════════════
   TAREFAS — DS BRIDGE (alinha a aba ao Design System oficial)
   Carregado por último; sobrescreve as variantes locais
   sem tocar nos arquivos existentes.

   Padrão de Clientes/Audiências:
   - Paleta warm-stone do DS (var(--bg/--bg-soft/--border/--text))
   - Card.card-accent no TOPO (4px), não na lateral
   - Filter chips (.fchip): pílula 99px neutra, ativo = preto + branco
   - Raios na escala 18/14/8/6
   - Botões/links em var(--text), não oklch(... 260)
═══════════════════════════════════════════════════════════════ */

/* ─────────────────────────────────────────────
   ONDA 1 — TOKENS (substitui oklch hue 260 azulado
   por warm-stone hue ~50 do DS)
   ───────────────────────────────────────────── */

/* Board / colunas / cards */
#tarefas-view .k10-board { background: transparent; }

#tarefas-view .k10-col {
  background: var(--bg-elev);
  border: 1px solid var(--border);
  border-radius: var(--radius);          /* 14 */
}
#tarefas-view .k10-col__head {
  border-bottom: 1px solid var(--border);
  background: var(--bg-soft);
}
#tarefas-view .k10-col__title { color: var(--text); }
#tarefas-view .k10-col__count {
  color: var(--text-3);
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-feature-settings: "tnum";
}
#tarefas-view .k10-col__add {
  color: var(--text-3);
  background: transparent;
  border-radius: var(--radius-xs);
}
#tarefas-view .k10-col__add:hover {
  color: var(--text);
  background: var(--bg-soft);
}

/* CARD — raio padrão DS, paleta neutra */
#tarefas-view .k10-card {
  background: var(--bg-elev);
  border: 1px solid var(--border);
  border-radius: var(--radius);          /* 14, era 10 */
  padding: 16px 16px 14px 16px;          /* compensa edge no topo */
  transition: border-color var(--dur-fast) var(--ease),
              box-shadow var(--dur) var(--ease);
}
#tarefas-view .k10-card:hover {
  border-color: var(--border-strong);
  box-shadow: 0 4px 20px rgba(0,0,0,.07);
}
#tarefas-view .k10-card:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
  border-color: var(--border-strong);
}

/* ─────────────────────────────────────────────
   ONDA 2 — EDGE NO TOPO (igual .card-accent)
   ───────────────────────────────────────────── */
#tarefas-view .k10-card { overflow: hidden; }

#tarefas-view .k10-card__edge {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: auto !important;
  width: auto !important;
  height: 4px !important;
  border-radius: 0 !important;
}

/* Mapeia prioridade -> cores semânticas do DS */
#tarefas-view .k10-card[data-prio="urgente"] .k10-card__edge,
#tarefas-view .k10-card[data-prio="critica"] .k10-card__edge { background: var(--danger) !important; }
#tarefas-view .k10-card[data-prio="alta"]    .k10-card__edge { background: var(--orange) !important; }
#tarefas-view .k10-card[data-prio="media"]   .k10-card__edge { background: var(--accent) !important; }
#tarefas-view .k10-card[data-prio="baixa"]   .k10-card__edge { background: var(--info)   !important; }
#tarefas-view .k10-card:not([data-prio]) .k10-card__edge,
#tarefas-view .k10-card[data-prio=""] .k10-card__edge       { background: var(--border-strong) !important; }

/* Card selecionado (bulk) — usa accent do DS */
#tarefas-view .k10-card.is-bulk-selected {
  border-color: var(--text) !important;
  box-shadow: 0 0 0 2px var(--bg-soft),
              0 8px 20px rgba(0,0,0,.06) !important;
  background: var(--bg-elev) !important;
}
#tarefas-view .k10-card.is-bulk-selected .k10-card__edge {
  background: var(--text) !important;
}

/* Pchip de prioridade — pílula DS */
#tarefas-view .k10-pchip {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 8px;
  border-radius: 99px;
  font-size: 11px; font-weight: 500;
  border: 1px solid var(--border);
  background: var(--bg-soft);
  color: var(--text-2);
  letter-spacing: 0;
  text-transform: none;
  font-family: 'Inter', sans-serif;
}
#tarefas-view .k10-pchip[data-prio="urgente"],
#tarefas-view .k10-pchip[data-prio="critica"] {
  background: var(--danger-soft); color: var(--danger);
  border-color: oklch(0.64 0.20 25 / 0.25);
}
#tarefas-view .k10-pchip[data-prio="alta"] {
  background: var(--orange-soft); color: oklch(0.45 0.18 50);
  border-color: oklch(0.70 0.18 50 / 0.25);
}
#tarefas-view .k10-pchip[data-prio="media"] {
  background: var(--accent-soft); color: oklch(0.5 0.14 60);
  border-color: oklch(0.78 0.14 75 / 0.30);
}
#tarefas-view .k10-pchip[data-prio="baixa"] {
  background: var(--info-soft); color: oklch(0.42 0.13 245);
  border-color: oklch(0.64 0.13 245 / 0.25);
}

/* Cliente row, dateline, tags, resp — paleta neutra DS */
#tarefas-view .k10-cliente,
#tarefas-view .k10-dateline,
#tarefas-view .k10-resp,
#tarefas-view .k10-desc { color: var(--text-2); }
#tarefas-view .k10-cliente__name { color: var(--text); }
#tarefas-view .k10-tags .k10-tag,
#tarefas-view .k10-chip {
  background: var(--bg-soft);
  border: 1px solid var(--border);
  color: var(--text-2);
  border-radius: 99px;
}
#tarefas-view .k10-empty {
  background: var(--bg-soft);
  border: 1px dashed var(--border);
  border-radius: var(--radius-sm);
  color: var(--text-2);
}

/* Subtarefas */
#tarefas-view .k10-subs__head,
#tarefas-view .k10-subs__lbl { color: var(--text-3); }

/* ─────────────────────────────────────────────
   ONDA 3 — FILTER BAR canônica (.fchip pattern)
   ───────────────────────────────────────────── */

/* Container dos filtros — neutraliza glassmorphism Tailwind */
#tarefas-view section:has(> div > div > [data-action="filter-date"]) {
  background: var(--bg-elev) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;          /* 14, não 24 */
  box-shadow: none !important;
  backdrop-filter: none !important;
  padding: 12px 14px !important;
}

/* Botões de filtro de data — vira .fchip neutro */
#tarefas-view [data-action="filter-date"] {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
  padding: 4px 11px !important;
  border-radius: 99px !important;
  font-family: 'Inter', sans-serif !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  border: 1px solid var(--border) !important;
  background: var(--bg-soft) !important;
  color: var(--text-2) !important;
  box-shadow: none !important;
  transition: all var(--dur-fast) var(--ease) !important;
  white-space: nowrap !important;
}
#tarefas-view [data-action="filter-date"]:hover {
  border-color: var(--text-2) !important;
  color: var(--text) !important;
  background: var(--bg-soft) !important;
}
/* Estado ativo: o JS marca com bg-{red|blue|orange}-500 — sobrescrevemos */
#tarefas-view [data-action="filter-date"].bg-red-500,
#tarefas-view [data-action="filter-date"].bg-blue-500,
#tarefas-view [data-action="filter-date"].bg-orange-500 {
  background: var(--text) !important;
  color: #fff !important;
  border-color: var(--text) !important;
}

/* Tags / pipelines / prioridade — também viram .fchip */
#tarefas-view [data-filter-tag],
#tarefas-view [data-filter-prioridade],
#tarefas-view [data-filter-status],
#tarefas-view [data-filter-pipeline] {
  border-radius: 99px !important;
  border: 1px solid var(--border) !important;
  background: var(--bg-soft) !important;
  color: var(--text-2) !important;
  font-size: 12px !important;
  padding: 4px 11px !important;
  box-shadow: none !important;
}
#tarefas-view [data-filter-tag].bg-gray-900 {
  background: var(--text) !important;
  color: #fff !important;
  border-color: var(--text) !important;
}

/* Chips Minhas/Urgentes/Selecionar (do polish) — mesmo padrão */
#tarefas-view button[data-tf-chip],
#tarefas-view button[data-action="toggle-bulk-mode"] {
  border-radius: 99px !important;
  border: 1px solid var(--border) !important;
  background: var(--bg-soft) !important;
  color: var(--text-2) !important;
  font-size: 12px !important;
  padding: 4px 11px !important;
  box-shadow: none !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}
#tarefas-view button[data-tf-chip].tf-chip--on,
#tarefas-view button[data-action="toggle-bulk-mode"].tf-chip--on,
#tarefas-view button[data-action="toggle-bulk-mode"][aria-pressed="true"] {
  background: var(--text) !important;
  color: #fff !important;
  border-color: var(--text) !important;
}

/* ─────────────────────────────────────────────
   QUICK-ADD INLINE — segue paleta DS
   ───────────────────────────────────────────── */
#tarefas-view .t10-qadd {
  background: var(--bg-elev);
  border: 1px dashed var(--border);
  border-radius: var(--radius-sm);     /* 8 */
}
#tarefas-view .t10-qadd:focus-within {
  border-style: solid;
  border-color: var(--text-2);
  box-shadow: 0 0 0 3px var(--bg-soft);
}
#tarefas-view .t10-qadd__in { color: var(--text); }
#tarefas-view .t10-qadd__in::placeholder { color: var(--text-3); }
#tarefas-view .t10-qadd__plus,
#tarefas-view .t10-qadd__more { color: var(--text-3); }
#tarefas-view .t10-qadd__more:hover {
  color: var(--text);
  background: var(--bg-soft);
}

/* ─────────────────────────────────────────────
   EMPTY STATE GLOBAL — paleta DS
   ───────────────────────────────────────────── */
#tarefas-view .k10-global-empty {
  background: var(--bg-elev);
  border: 1px dashed var(--border);
  border-radius: var(--radius);
  color: var(--text-2);
}
#tarefas-view .k10-global-empty__ico {
  background: var(--bg-soft);
  color: var(--text-3);
}
#tarefas-view .k10-global-empty h3 { color: var(--text); }
#tarefas-view .k10-global-empty p  { color: var(--text-2); }
#tarefas-view .k10-global-empty__btn {
  background: var(--bg-elev);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: var(--radius-sm);
}
#tarefas-view .k10-global-empty__btn:hover {
  border-color: var(--text-2);
  background: var(--bg-soft);
}
#tarefas-view .k10-global-empty__btn--primary {
  background: var(--text);
  color: #fff;
  border-color: var(--text);
}
#tarefas-view .k10-global-empty__btn--primary:hover {
  background: #1c1d20;
  border-color: #1c1d20;
}

/* ─────────────────────────────────────────────
   BULK BAR — preto puro do DS (era oklch 260)
   ───────────────────────────────────────────── */
.bulk-bar {
  background: var(--text) !important;
  border-radius: var(--radius) !important;      /* 14, era 12 */
}
.bulk-bar__num { background: var(--accent) !important; color: var(--text) !important; }
.bulk-bar__sep { background: rgba(255,255,255,.12) !important; }
.bulk-bar__btn:hover { background: rgba(255,255,255,.06) !important; }
.bulk-bar__menu {
  background: var(--text) !important;
  border-color: rgba(255,255,255,.12) !important;
}
.bulk-bar__mi:hover { background: rgba(255,255,255,.06) !important; }

/* ─────────────────────────────────────────────
   MODAL DE VISUALIZAÇÃO — alinha tokens
   ───────────────────────────────────────────── */
[data-task-detail-modal] .tv-shell,
[data-task-detail-modal] .tv-modal {
  border-radius: var(--radius-lg) !important;   /* 18 */
  border: 1px solid var(--border) !important;
  background: var(--bg-elev) !important;
}
[data-task-detail-modal] .tv-head { border-bottom: 1px solid var(--border) !important; }
[data-task-detail-modal] .tv-foot { border-top: 1px solid var(--border) !important; }

/* ─────────────────────────────────────────────
   SHORTCUT HELP OVERLAY — paleta DS
   ───────────────────────────────────────────── */
.t10-shhelp__box {
  border-radius: var(--radius-lg) !important;
  border: 1px solid var(--border) !important;
}
.t10-shhelp__head { border-bottom: 1px solid var(--border) !important; }
.t10-shhelp__head h3 { color: var(--text) !important; }
.t10-shhelp__close { color: var(--text-3) !important; }
.t10-shhelp__close:hover {
  background: var(--bg-soft) !important;
  color: var(--text) !important;
}
.t10-shhelp__grid kbd {
  background: var(--bg-soft) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}