/* NEXEI v291 - nodes compactos por icone, gerenciamento limpo e visualizador com retorno contextual. */

/* Cards da administracao: remove botoes redundantes e mantem apenas o controle de status. */
.workflow-card-actions-v291{justify-content:flex-end!important;min-height:34px}
.workflow-card-actions-v291 .workflow-toggle-form{margin-left:auto}
.workflow-card-actions-v291 .workflow-toggle-form button{min-width:82px}

/* Canvas: cada acao passa a ser reconhecida por um card compacto com icone. */
.workflow-canvas-grid .canvas-node.node-icon-card:not(.start):not(.end):not(.cancel){
  --node-accent:#3b82f6;
  --node-soft:#eff6ff;
  width:112px!important;
  min-width:112px!important;
  height:112px!important;
  min-height:112px!important;
  padding:12px 10px 10px!important;
  border:2px solid color-mix(in srgb,var(--node-accent) 58%,#ffffff)!important;
  border-radius:28px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  text-align:center!important;
  overflow:visible!important;
  background:linear-gradient(155deg,#ffffff 0%,var(--node-soft) 100%)!important;
  box-shadow:0 14px 30px rgba(15,23,42,.12)!important;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease!important;
}
.workflow-canvas-grid .canvas-node.node-icon-card:not(.start):not(.end):not(.cancel):hover,
.workflow-canvas-grid .canvas-node.node-icon-card.selected:not(.start):not(.end):not(.cancel){
  transform:translateY(-2px)!important;
  border-color:var(--node-accent)!important;
  box-shadow:0 20px 42px rgba(15,23,42,.18),0 0 0 4px color-mix(in srgb,var(--node-accent) 15%,transparent)!important;
}
.workflow-canvas-grid .canvas-node.node-icon-card.dragging:not(.start):not(.end):not(.cancel){
  transform:scale(1.04)!important;
  box-shadow:0 24px 52px rgba(37,99,235,.28)!important;
}
.workflow-canvas-grid .canvas-node.node-icon-card .canvas-node-symbol{
  position:static!important;
  inset:auto!important;
  width:52px!important;
  height:52px!important;
  min-width:52px!important;
  min-height:52px!important;
  border-radius:18px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:var(--node-accent)!important;
  background:#fff!important;
  border:1px solid color-mix(in srgb,var(--node-accent) 26%,#e2e8f0)!important;
  box-shadow:0 8px 18px color-mix(in srgb,var(--node-accent) 18%,transparent)!important;
  font-size:27px!important;
  line-height:1!important;
  font-weight:900!important;
  opacity:1!important;
  transform:none!important;
  pointer-events:none!important;
}
.workflow-canvas-grid .canvas-node.node-icon-card .node-head{
  width:100%!important;
  min-height:27px!important;
  padding:0 4px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.workflow-canvas-grid .canvas-node.node-icon-card .node-head b{
  display:-webkit-box!important;
  -webkit-box-orient:vertical!important;
  -webkit-line-clamp:2!important;
  overflow:hidden!important;
  max-width:96px!important;
  color:#0f172a!important;
  font-size:10px!important;
  line-height:1.18!important;
  font-weight:900!important;
  text-transform:none!important;
}
.workflow-canvas-grid .canvas-node.node-icon-card .node-meta,
.workflow-canvas-grid .canvas-node.node-icon-card .node-sla{display:none!important}
.workflow-canvas-grid .canvas-node.node-icon-card .node-delete{
  position:absolute!important;
  top:-8px!important;
  right:-8px!important;
  width:24px!important;
  height:24px!important;
  min-width:24px!important;
  min-height:24px!important;
  padding:0!important;
  border-radius:999px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:#fff!important;
  color:#64748b!important;
  border:1px solid #cbd5e1!important;
  box-shadow:0 6px 14px rgba(15,23,42,.14)!important;
  font-size:15px!important;
  line-height:1!important;
}
.workflow-canvas-grid .canvas-node.node-icon-card .node-delete:hover{background:#fef2f2!important;color:#dc2626!important;border-color:#fecaca!important}
.workflow-canvas-grid .canvas-node.node-icon-card .port{
  width:16px!important;
  height:16px!important;
  min-width:16px!important;
  min-height:16px!important;
  z-index:6!important;
  font-size:8px!important;
  line-height:10px!important;
  font-style:normal!important;
  font-weight:900!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:#fff!important;
}
.workflow-canvas-grid .canvas-node.node-icon-card .port-in{left:-10px!important;top:50%!important;background:#64748b!important}
.workflow-canvas-grid .canvas-node.node-icon-card .port-true{right:-10px!important;top:34%!important;background:#16a34a!important;box-shadow:0 0 0 2px #bbf7d0!important}
.workflow-canvas-grid .canvas-node.node-icon-card .port-false{right:-10px!important;top:70%!important;background:#ef4444!important;box-shadow:0 0 0 2px #fecaca!important}

/* Cores semanticas dos tipos. */
.workflow-canvas-grid .canvas-node.approval{--node-accent:#2563eb;--node-soft:#eff6ff}
.workflow-canvas-grid .canvas-node.condition,.workflow-canvas-grid .canvas-node.gateway_exclusive{--node-accent:#d97706;--node-soft:#fffbeb}
.workflow-canvas-grid .canvas-node.gateway_parallel{--node-accent:#ca8a04;--node-soft:#fefce8}
.workflow-canvas-grid .canvas-node.email{--node-accent:#2563eb;--node-soft:#eff6ff}
.workflow-canvas-grid .canvas-node.notification{--node-accent:#d97706;--node-soft:#fffbeb}
.workflow-canvas-grid .canvas-node.document_request{--node-accent:#dc2626;--node-soft:#fef2f2}
.workflow-canvas-grid .canvas-node.status_change{--node-accent:#7c3aed;--node-soft:#f5f3ff}
.workflow-canvas-grid .canvas-node.task{--node-accent:#0891b2;--node-soft:#ecfeff}
.workflow-canvas-grid .canvas-node.history_event{--node-accent:#475569;--node-soft:#f8fafc}
.workflow-canvas-grid .canvas-node.route_user{--node-accent:#0f766e;--node-soft:#f0fdfa}
.workflow-canvas-grid .canvas-node.route_department{--node-accent:#0369a1;--node-soft:#f0f9ff}
.workflow-canvas-grid .canvas-node.deadline{--node-accent:#ea580c;--node-soft:#fff7ed}
.workflow-canvas-grid .canvas-node.webhook{--node-accent:#4f46e5;--node-soft:#eef2ff}
.workflow-canvas-grid .canvas-node.subprocess{--node-accent:#9333ea;--node-soft:#faf5ff}
.workflow-canvas-grid .canvas-node.lane{--node-accent:#334155;--node-soft:#f8fafc}

/* Inicio/fim/cancelamento continuam circulares, agora com dimensao compativel com os cards de icone. */
.workflow-canvas-grid .canvas-node.node-icon-card.start,
.workflow-canvas-grid .canvas-node.node-icon-card.end,
.workflow-canvas-grid .canvas-node.node-icon-card.cancel{width:88px!important;min-width:88px!important;height:88px!important;min-height:88px!important}

/* Feedback visual durante uma conexao. */
.workflow-canvas-grid .canvas-node.node-icon-card:has(.port:hover){outline:3px solid rgba(37,99,235,.14)!important;outline-offset:5px!important}

@media(max-width:900px){
  .workflow-canvas-grid .canvas-node.node-icon-card:not(.start):not(.end):not(.cancel){width:104px!important;min-width:104px!important;height:104px!important;min-height:104px!important;border-radius:25px!important}
  .workflow-canvas-grid .canvas-node.node-icon-card .canvas-node-symbol{width:48px!important;height:48px!important;min-width:48px!important;min-height:48px!important;font-size:24px!important}
}
