/* ===== Fluye — editor visual de flujos (estilo BotConversa/ManyChat) ===== */
#editor{position:fixed;inset:0;background:#efebe3;z-index:500;display:flex;flex-direction:column;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Inter,sans-serif;color:var(--ink)}
#editor.hidden{display:none}
.ed-top{height:58px;background:var(--black);color:#fff;display:flex;align-items:center;gap:10px;padding:0 14px;flex-shrink:0;flex-wrap:nowrap;overflow-x:auto}
.ed-top .ed-back{border:none;background:rgba(255,255,255,.1);color:#fff;border-radius:10px;padding:8px 12px;cursor:pointer;font-size:13px;white-space:nowrap;font-family:inherit}
.ed-top .ed-back:hover{background:rgba(255,255,255,.18)}
.ed-top .ed-name{background:transparent;border:1px solid transparent;color:#fff;font-size:16px;font-weight:600;padding:6px 10px;border-radius:8px;min-width:120px;max-width:340px;width:auto}
.ed-top .ed-name:focus{border-color:var(--gold);box-shadow:none;background:rgba(255,255,255,.06)}
.ed-top .ed-status{font-size:12px;color:rgba(255,255,255,.6);white-space:nowrap;margin-right:auto}
.ed-top .ed-status.dirty{color:#f0c05a}.ed-top .ed-status.saved{color:#7bd394}
.ed-top .btn{margin:0;padding:8px 14px;font-size:13px;white-space:nowrap}
.ed-top .btn.sec{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.15)}
.ed-top .btn.sec:hover{background:rgba(255,255,255,.2)}
.ed-top .ed-zoom{display:flex;gap:4px;align-items:center;margin-left:6px}
.ed-top .ed-zoom button{border:none;background:rgba(255,255,255,.1);color:#fff;width:30px;height:30px;border-radius:8px;cursor:pointer;font-size:15px;font-family:inherit}
.ed-top .ed-zoom span{font-size:12px;color:rgba(255,255,255,.6);min-width:40px;text-align:center}
.ed-canvas{flex:1;position:relative;overflow:hidden;cursor:grab;touch-action:none;background-color:#efebe3;background-image:radial-gradient(#cfc7ba 1.2px,transparent 1.2px);background-size:24px 24px}
.ed-canvas.panning{cursor:grabbing}
.ed-canvas.linking{cursor:crosshair}
.ed-world{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform}
.ed-edges{position:absolute;left:0;top:0;width:1px;height:1px;overflow:visible;pointer-events:none}
.ed-edges path{fill:none;stroke:var(--gold);stroke-width:2.5;pointer-events:stroke;cursor:pointer;transition:stroke .15s}
.ed-edges path.hit{stroke:transparent;stroke-width:16}
.ed-edges path:hover,.ed-edges path.sel{stroke:#7a5230;stroke-width:3.5}
.ed-edges path.temp{stroke-dasharray:6 5;stroke:#9c7a56;pointer-events:none}
.ed-edges path.run{stroke:#1f9d55;stroke-width:3.5}
/* ---- nodo ---- */
.nd{position:absolute;width:300px;background:#fff;border:1.5px solid #e2dbcf;border-radius:16px;box-shadow:0 4px 18px rgba(30,20,10,.08);user-select:none;font-size:13px}
.nd.sel{border-color:var(--gold);box-shadow:0 0 0 3px var(--gold-soft),0 6px 22px rgba(30,20,10,.12)}
.nd.run{border-color:#1f9d55;box-shadow:0 0 0 3px rgba(31,157,85,.18)}
.nd.dragging{opacity:.92;box-shadow:0 12px 30px rgba(30,20,10,.18)}
.nd-h{display:flex;align-items:center;gap:8px;padding:11px 14px;border-radius:15px 15px 0 0;font-weight:700;font-size:13.5px;cursor:grab;position:relative}
.nd-h .ic{font-size:16px}
.nd-h .x{margin-left:auto;border:none;background:transparent;color:inherit;opacity:.55;cursor:pointer;font-size:13px;width:24px;height:24px;border-radius:50%;font-family:inherit}
.nd-h .x:hover{opacity:1;background:rgba(0,0,0,.08)}
.nd-start .nd-h{background:#121212;color:#fff}
.nd-content .nd-h{background:#eaf3ff;color:#173a66}
.nd-delay .nd-h{background:#fff3d6;color:#7a4b00}
.nd-condition .nd-h{background:#efe6ff;color:#4a2c8a}
.nd-action .nd-h{background:#e3f5ea;color:#145a32}
.nd-b{padding:12px 14px 10px;display:flex;flex-direction:column;gap:8px;cursor:default}
.nd-b input,.nd-b select,.nd-b textarea{font-size:12.5px;padding:7px 9px;border-radius:8px;user-select:text}
.nd-b textarea{min-height:60px;resize:vertical;line-height:1.45}
.nd-b label{margin:2px 0 3px;font-size:11px}
.nd-b .hint{font-size:11px;margin-top:2px}
.nd-b .row{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.nd-b .row select,.nd-b .row input{width:auto;flex:1;min-width:60px}
.nd-b .row .n{max-width:70px}
.nd-b .item{background:#faf8f4;border:1px solid #efe9df;border-radius:10px;padding:8px;position:relative}
.nd-b .item .rm{position:absolute;right:6px;top:6px;border:none;background:#fff;border-radius:50%;width:20px;height:20px;font-size:11px;cursor:pointer;color:#8b8378;border:1px solid var(--border);font-family:inherit}
.nd-b .item .rm:hover{color:var(--warn);border-color:#f1c9c9}
.nd-b .item .kd{font-size:10.5px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin-bottom:5px;font-weight:700}
.nd-b .item.typing{background:#fff8ea;border-color:#f3e2b8;display:flex;align-items:center;gap:6px;padding-right:32px}
.nd-b .item.typing input{max-width:64px}
.nd-b .adds{display:flex;gap:5px;flex-wrap:wrap}
.nd-b .adds button,.nd-b .addbtn{border:1px dashed #cfc5b5;background:#fff;color:#5b544b;border-radius:8px;padding:5px 9px;font-size:11.5px;cursor:pointer;font-family:inherit}
.nd-b .adds button:hover,.nd-b .addbtn:hover{border-color:var(--gold);color:var(--gold)}
.nd-b .chips{margin:2px 0}
.nd-b .chip.mini{padding:2px 8px;font-size:11px}
.nd-b .kwchips .chip{background:#fff}
.nd-b .kwchips .chip .del{opacity:.55;margin-left:4px;cursor:pointer}
.nd-b .kwchips .chip .del:hover{opacity:1;color:var(--warn)}
.nd-b .trig{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.nd-b .trig button{border:1.5px solid var(--border);background:#fff;border-radius:10px;padding:8px 6px;font-size:11.5px;cursor:pointer;font-family:inherit;color:var(--ink);display:flex;flex-direction:column;align-items:center;gap:3px;font-weight:600}
.nd-b .trig button .em{font-size:18px}
.nd-b .trig button.sel{border-color:var(--black);background:var(--black);color:#fff}
.nd-b .sentence{display:flex;gap:6px;align-items:center;flex-wrap:wrap;font-size:12.5px;line-height:1.6}
.nd-b .sentence input{max-width:64px}.nd-b .sentence select{width:auto}
.nd-b .copyurl{display:flex;gap:4px;align-items:center}
.nd-b .copyurl code{flex:1;background:#f1ede6;padding:5px 7px;border-radius:6px;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:all}
.nd-b .copyurl button{border:none;background:var(--gold);color:#fff;border-radius:6px;padding:5px 8px;font-size:11px;cursor:pointer;font-family:inherit}
.nd-b .preview{background:#e6f4ea;border-radius:10px;padding:8px 10px;font-size:12px;white-space:pre-wrap;word-break:break-word;line-height:1.4}
/* puertos */
.port{position:absolute;width:16px;height:16px;border-radius:50%;background:var(--gold);border:3px solid #fff;box-shadow:0 0 0 1.5px var(--gold);z-index:3}
.port-in{left:-9px;top:17px;background:#fff;box-shadow:0 0 0 1.5px #cfc5b5}
.port-out{right:-9px;cursor:crosshair}
.port-out:hover{transform:scale(1.25);background:#7a5230}
.nd-outs{display:flex;flex-direction:column;gap:6px;padding:0 14px 12px}
.nd-out{position:relative;display:flex;align-items:center;justify-content:flex-end;gap:8px;min-height:28px}
.nd-out .lb{font-size:11.5px;font-weight:700;color:var(--muted);letter-spacing:.3px}
.nd-out .lb.yes{color:#146c3a}.nd-out .lb.no{color:#9b1c1c}
.nd-out .port-out{position:static;margin-right:-22px}
.nd-out .next{border:1px dashed #cfc5b5;background:#fff;color:#5b544b;border-radius:8px;padding:4px 9px;font-size:11.5px;cursor:pointer;font-family:inherit;margin-right:auto}
.nd-out .next:hover{border-color:var(--gold);color:var(--gold)}
.nd-out.linked .next{display:none}
/* FAB + menú */
.ed-fab{position:absolute;right:26px;bottom:26px;width:56px;height:56px;border-radius:50%;border:none;background:var(--gold);color:#fff;font-size:30px;line-height:1;cursor:pointer;box-shadow:0 8px 24px rgba(185,138,94,.45);z-index:20;font-family:inherit}
.ed-fab:hover{background:#a7784f}
.ed-menu{position:absolute;background:#fff;border:1px solid var(--border);border-radius:14px;box-shadow:0 12px 32px rgba(30,20,10,.18);padding:6px;z-index:30;min-width:220px}
.ed-menu button{display:flex;align-items:center;gap:10px;width:100%;border:none;background:transparent;padding:10px 12px;border-radius:10px;cursor:pointer;font-size:13.5px;text-align:left;font-family:inherit;color:var(--ink)}
.ed-menu button:hover{background:#faf8f4}
.ed-menu .em{font-size:18px;width:24px;text-align:center}
.ed-menu small{display:block;color:var(--muted);font-size:11px;font-weight:400}
.ed-help{position:absolute;left:16px;bottom:18px;font-size:11.5px;color:#7a7266;background:rgba(255,255,255,.7);padding:6px 10px;border-radius:8px;pointer-events:none}
/* dry-run */
.dry-path{display:flex;flex-direction:column;gap:6px;margin:8px 0}
.dry-path .st{display:flex;gap:8px;align-items:flex-start;background:#faf8f4;border-radius:10px;padding:8px 10px;font-size:13px}
.dry-path .st .em{font-size:16px}
.dry-msgs{display:flex;flex-direction:column;gap:6px;background:#e5ddd5;border-radius:14px;padding:14px}
.dry-msgs .bub{align-self:flex-end;background:#dcf8c6;color:#111;max-width:85%;border-radius:12px;border-bottom-right-radius:3px;padding:8px 11px;font-size:13.5px;white-space:pre-wrap;word-break:break-word;line-height:1.4;box-shadow:0 1px 1px rgba(0,0,0,.08)}
.dry-msgs .bub img{max-width:100%;border-radius:8px;display:block;margin-bottom:4px}
.dry-msgs .wait{align-self:center;font-size:11px;color:#5b544b;background:rgba(255,255,255,.6);padding:2px 10px;border-radius:10px}
@media(max-width:860px){
  .ed-top{height:auto;padding:8px 10px;gap:6px;flex-wrap:wrap}
  .ed-top .ed-name{max-width:160px;font-size:14px}
  .ed-top .ed-status{width:100%;order:9;margin:0}
  .nd{width:260px}
  .ed-help{display:none}
}

/* Pregunta con opciones */
.nd-question .nd-h{background:#fff0f4;color:#7a1f3d}
.nd-out .lb.opt{color:#7a1f3d;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nd-b .item.optrow{display:flex;align-items:center;gap:6px;padding-right:32px}
.nd-b .item.optrow .num{font-size:15px;flex:none}
.nd-b .item.optrow input{margin:0}
.dry-msgs .bub.poll{background:#fff;border:1px solid #e6dfd3}
.dry-msgs .bub.poll .pt{font-weight:700;margin-bottom:6px}
.dry-msgs .bub.poll .po{padding:5px 0;border-top:1px solid #f0ebe3;font-size:13px}
.dry-msgs .bub.poll .ph{font-size:11px;color:var(--muted);margin-top:6px}
