/* ===== TOKENS ===== */
.negociacao-modal {
  --bg:#E9ECF1; --surface:#FFFFFF; --surface-2:#F3F6FA;
  --border:#E4E8EE; --border-strong:#D4DAE3; --text:#101A2B; --text-2:#33425A;
  --muted:#647084; --muted-2:#98A2B3;
  --brand:#003DA5; --brand-ink:#0A4DBA; --brand-soft:#E9F1FC;
  --accent:#E4002B; --accent-soft:#FCE8EC;
  --green:#0B8F62; --green-soft:#E2F5EE;
  --amber:#B26A00; --amber-soft:#FAEEDB;
  --stage-blue:#1D6FD0; --gold:#9C7400;
  --shadow-sm:0 1px 2px rgba(16,26,43,.06);
  --radius:16px; --radius-sm:11px; --radius-xs:8px; --pad:18px; --gap:14px;
}
.negociacao-modal *{box-sizing:border-box;}
.negociacao-modal html,body{margin:0;padding:0;background:var(--bg);font-family:Manrope,sans-serif;color:var(--text);}
.negociacao-modal a{color:var(--brand-ink);} .negociacao-modal a:hover{color:var(--brand);}
.negociacao-modal input,.negociacao-modal textarea,.negociacao-modal select,.negociacao-modal button{font-family:Manrope,sans-serif;}

/* ===== PÁGINA ===== */
.negociacao-modal .ng{padding:22px 24px 40px;display:flex;flex-direction:column;gap:16px;max-width:1080px;}

/* header */
.negociacao-modal .ng-head{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap;}
.negociacao-modal .ng-h1{margin:0;font:800 23px Manrope;letter-spacing:-.025em;color:var(--text);white-space:nowrap;}
.negociacao-modal .ng-sub{margin:0;font:500 13px Manrope;color:var(--muted);}
.negociacao-modal .pill{font:800 10px Manrope;letter-spacing:.06em;padding:4px 11px;border-radius:20px;}
.negociacao-modal .pill.aceito{color:var(--green);background:var(--green-soft);}
.negociacao-modal .pill.lancada{color:#fff;background:var(--green);}
.negociacao-modal .agent{display:flex;align-items:center;gap:9px;margin-left:auto;padding:6px 14px 6px 6px;background:var(--surface);border:1px solid var(--border);border-radius:999px;box-shadow:var(--shadow-sm);}
.negociacao-modal .agent-av{width:34px;height:34px;border-radius:50%;background:var(--brand);color:#fff;font:800 11px Manrope;display:flex;align-items:center;justify-content:center;}
.negociacao-modal .agent-n{font:800 12.5px Manrope;color:var(--text);}
.negociacao-modal .agent-r{font:600 10px Manrope;color:var(--muted);}

/* cartões genéricos */
.negociacao-modal .card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);}
.negociacao-modal .card.pad{padding:18px 20px;display:flex;flex-direction:column;gap:14px;}
.negociacao-modal .card.split{overflow:hidden;}
.negociacao-modal .split-row{display:flex;flex-wrap:wrap;}
.negociacao-modal .sec{font:800 12px Manrope;color:var(--brand-ink);letter-spacing:.02em;}

/* painel azul (hero) */
.negociacao-modal .hero{flex:1;min-width:300px;padding:20px 22px;background:linear-gradient(150deg,var(--brand),var(--brand-ink));display:flex;flex-direction:column;gap:8px;}
.negociacao-modal .hero-l{font:700 10px Manrope;letter-spacing:.1em;color:rgba(255,255,255,.72);text-transform:uppercase;}
.negociacao-modal .hero-in{display:flex;align-items:center;gap:9px;}
.negociacao-modal .hero-cur{font:700 16px Manrope;color:rgba(255,255,255,.75);}
.negociacao-modal .hero-input{flex:1;min-width:0;border:none;background:none;outline:none;font:800 27px Manrope;color:#fff;letter-spacing:-.02em;font-variant-numeric:tabular-nums;}
.negociacao-modal .hero-s{font:600 11.5px Manrope;color:rgba(255,255,255,.7);}
.negociacao-modal .hero-base{font:600 12px Manrope;color:rgba(255,255,255,.8);}
.negociacao-modal .hero-div{display:flex;align-items:center;gap:10px;flex-wrap:wrap;row-gap:8px;padding-top:10px;border-top:1px solid rgba(255,255,255,.2);}
.negociacao-modal .hero-pct{display:flex;align-items:center;gap:5px;height:34px;padding:0 11px;border-radius:8px;background:rgba(255,255,255,.16);}
.negociacao-modal .hero-pct input{width:34px;border:none;background:none;outline:none;font:800 14px Manrope;color:#fff;text-align:right;}
.negociacao-modal .hero-pct span{font:700 13px Manrope;color:rgba(255,255,255,.8);}
.negociacao-modal .hero-tot{margin-left:auto;white-space:nowrap;font:800 17px Manrope;color:#fff;font-variant-numeric:tabular-nums;}
.negociacao-modal .ng-locacao-resumo{display:flex;flex-direction:column;gap:8px;margin-top:8px;padding-top:10px;border-top:1px solid rgba(255,255,255,.2);}
.negociacao-modal .ng-locacao-resumo div{display:flex;justify-content:space-between;gap:12px;font:600 11px Manrope;color:rgba(255,255,255,.82);}
.negociacao-modal .ng-locacao-resumo strong{font-weight:800;color:#fff;}
.negociacao-modal .ng-referencia-resumo{display:flex;flex-direction:column;gap:3px;margin-top:10px;padding-top:10px;border-top:1px solid rgba(255,255,255,.2);font:600 11px Manrope;color:rgba(255,255,255,.82);}
.negociacao-modal .ng-referencia-resumo strong{color:#fff;font-weight:800;}
.negociacao-modal .ng-referencia-resumo small{color:rgba(255,255,255,.65);font-size:10px;}

/* painel branco ao lado */
.negociacao-modal .side{flex:1.6;min-width:320px;padding:20px 22px;display:flex;flex-direction:column;gap:14px;}
.negociacao-modal .side.narrow{flex:1.4;min-width:330px;}
.negociacao-modal .lbl{font:700 10.5px Manrope;letter-spacing:.06em;color:var(--muted);text-transform:uppercase;}
.negociacao-modal .lbl-sm{font:700 10px Manrope;letter-spacing:.06em;color:var(--muted);text-transform:uppercase;}
.negociacao-modal .row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}

/* segmented (toggles) */
.negociacao-modal .seg{display:flex;gap:8px;flex:1;max-width:300px;}
.negociacao-modal .seg-opt{flex:1;height:42px;padding:0 14px;display:flex;align-items:center;justify-content:center;text-align:center;white-space:nowrap;border-radius:var(--radius-sm);cursor:pointer;font:700 12.5px Manrope;border:1px solid var(--border);background:var(--surface-2);color:var(--text-2);}
.negociacao-modal .seg-opt.on{background:var(--brand);color:#fff;border-color:var(--brand);}
/* venda lançada (etapa 'finalizado'): página somente-leitura — o bloqueio real
   está no guard de wireSeg (js/views/negociacaoModal.js), isto é só afordância */
.negociacao-modal .seg[aria-disabled="true"] .seg-opt{cursor:not-allowed;opacity:.55;}

/* barra proporcional */
.negociacao-modal .bar{display:flex;height:12px;border-radius:20px;overflow:hidden;background:var(--surface-2);border:1px solid var(--border);}
.negociacao-modal .bar > span{height:100%;}

/* linhas de composição */
.negociacao-modal .comp{display:flex;flex-direction:column;gap:9px;}
.negociacao-modal .comp-row{display:flex;align-items:center;gap:11px;}
.negociacao-modal .dot{width:9px;height:9px;flex:none;border-radius:50%;}
.negociacao-modal .comp-t{font:700 12.5px Manrope;color:var(--text);}
.negociacao-modal .comp-h{font:500 10.5px Manrope;color:var(--muted-2);}
.negociacao-modal .comp-pct{font:700 11px Manrope;color:var(--muted);width:38px;text-align:right;}
.negociacao-modal .money{display:flex;align-items:center;gap:5px;width:150px;height:38px;padding:0 12px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-2);}
.negociacao-modal .money:focus-within{border-color:var(--brand);background:var(--surface);}
.negociacao-modal .money > span{font:600 11px Manrope;color:var(--muted-2);}
.negociacao-modal .money input{flex:1;min-width:0;border:none;background:none;outline:none;font:700 13px Manrope;color:var(--text);text-align:right;font-variant-numeric:tabular-nums;}
/* O contêiner já sinaliza o foco; não desenhar um segundo anel azul sobre o
   texto mascarado do input (ui-foundation.css é carregado antes deste arquivo). */
.negociacao-modal .money input:focus-visible{outline:none !important;box-shadow:none !important;}
.negociacao-modal .sum{display:flex;align-items:center;gap:10px;padding-top:12px;border-top:1px solid var(--border);}
.negociacao-modal .sum-l{font:700 11px Manrope;letter-spacing:.05em;color:var(--muted);text-transform:uppercase;}
.negociacao-modal .sum-v{font:800 15px Manrope;color:var(--text);font-variant-numeric:tabular-nums;}
.negociacao-modal .saldo{margin-left:auto;font:800 13px Manrope;}
.negociacao-modal .saldo.ok{color:var(--green);} .negociacao-modal .saldo.bad{color:var(--accent);}

/* partes */
.negociacao-modal .parties{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--gap);}
.negociacao-modal .party{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px 18px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:12px;}
.negociacao-modal .btn-add{margin-left:auto;height:30px;padding:0 12px;border-radius:8px;font:700 11px Manrope;cursor:pointer;}
.negociacao-modal .btn-add.solid{border:1px solid var(--brand);background:var(--brand);color:#fff;}
.negociacao-modal .btn-add.solid:hover{filter:brightness(1.08);}
.negociacao-modal .btn-add.ghost{border:1px solid var(--border-strong);background:var(--surface);color:var(--text-2);}
.negociacao-modal .btn-add.ghost:hover{border-color:var(--brand);color:var(--brand-ink);}
.negociacao-modal .person{display:flex;align-items:center;gap:11px;padding:11px 13px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);}
.negociacao-modal .person-av{width:38px;height:38px;flex:none;border-radius:50%;color:#fff;font:800 12px Manrope;display:flex;align-items:center;justify-content:center;}
.negociacao-modal .person-n{font:800 13px Manrope;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.negociacao-modal .person-d{font:600 10.5px "JetBrains Mono",monospace;color:var(--muted-2);}

/* condições */
.negociacao-modal .ta{min-height:84px;padding:12px 14px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface-2);font:500 12.5px Manrope;color:var(--text);line-height:1.5;outline:none;resize:vertical;}
.negociacao-modal .ta:focus{border-color:var(--brand);background:var(--surface);}
.negociacao-modal .note{display:flex;align-items:center;gap:9px;padding:11px 14px;background:var(--brand-soft);border-radius:var(--radius-sm);font:600 11.5px Manrope;color:var(--text-2);line-height:1.4;}
.negociacao-modal .note-ic{flex:none;color:var(--brand);font-size:14px;}

/* selects */
.negociacao-modal .field{flex:1;min-width:150px;display:flex;flex-direction:column;gap:6px;}
.negociacao-modal .sel{height:40px;padding:0 12px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface-2);font:700 13px Manrope;color:var(--text);cursor:pointer;outline:none;}

/* linhas de comissão */
.negociacao-modal .split-lines{display:flex;flex-direction:column;gap:8px;padding-top:4px;}
.negociacao-modal .split-line{display:flex;align-items:center;gap:10px;}
.negociacao-modal .split-line-l{font:600 12px Manrope;color:var(--text-2);flex:1;min-width:0;}
.negociacao-modal .split-line-v{font:700 13px Manrope;font-variant-numeric:tabular-nums;}

/* totais */
.negociacao-modal .totals{display:flex;border-top:1px solid var(--border);flex-wrap:wrap;}
.negociacao-modal .total{flex:1;min-width:180px;padding:14px 20px;border-right:1px solid var(--border);display:flex;flex-direction:column;gap:3px;}
.negociacao-modal .total.muted{background:var(--surface-2);}
.negociacao-modal .total:last-child{border-right:none;}
.negociacao-modal .total-l{font:700 9.5px Manrope;letter-spacing:.07em;color:var(--muted);text-transform:uppercase;}
.negociacao-modal .total-v{font:800 19px Manrope;font-variant-numeric:tabular-nums;}

/* documentos */
.negociacao-modal .docs-head{display:flex;align-items:center;gap:9px;flex-wrap:wrap;}
.negociacao-modal .chip-ok{font:700 9.5px Manrope;color:var(--green);background:var(--green-soft);padding:3px 10px;border-radius:20px;}
.negociacao-modal .chip-pend{font:700 9.5px Manrope;color:var(--accent);background:var(--accent-soft);padding:3px 10px;border-radius:20px;}
.negociacao-modal .docs{display:flex;flex-direction:column;gap:8px;}
.negociacao-modal .doc{display:flex;align-items:center;gap:11px;padding:12px 14px;border-radius:var(--radius-sm);}
.negociacao-modal .doc.ok{border:1px solid var(--green);background:var(--green-soft);}
.negociacao-modal .doc.req{border:1px solid var(--accent);background:var(--accent-soft);}
.negociacao-modal .doc.opt{border:1px solid var(--border);background:var(--surface);}
.negociacao-modal .doc-ic{width:32px;height:32px;flex:none;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:15px;border:1px solid var(--border);background:var(--surface);color:var(--muted);}
.negociacao-modal .doc.ok .doc-ic{background:var(--green);color:#fff;border-color:var(--green);}
.negociacao-modal .doc.req .doc-ic{color:var(--accent);}
.negociacao-modal .doc-body{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0;}
.negociacao-modal .doc-t{font:700 12.5px Manrope;color:var(--text);}
.negociacao-modal .doc-f{font:600 10.5px Manrope;color:var(--green);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.negociacao-modal .doc-d{font:500 10.5px Manrope;color:var(--muted-2);}
.negociacao-modal .doc-badge{font:700 8.5px Manrope;letter-spacing:.03em;text-transform:uppercase;}
.negociacao-modal .doc-badge.req{color:var(--accent);} .negociacao-modal .doc-badge.opt{color:var(--muted);}
.negociacao-modal .doc-dl{flex:none;width:30px;height:30px;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;border:1px solid var(--border-strong);background:var(--surface);color:var(--brand-ink);font-size:13px;}
.negociacao-modal .doc-dl:hover{border-color:var(--brand);}
.negociacao-modal .doc-act{flex:none;height:30px;padding:0 12px;border-radius:8px;cursor:pointer;font:700 11px Manrope;display:flex;align-items:center;gap:5px;}
.negociacao-modal .doc-act.attach{border:1px solid var(--brand);background:var(--brand);color:#fff;}
.negociacao-modal .doc-act.attach:hover{filter:brightness(1.08);}
.negociacao-modal .doc-act.remove{border:1px solid var(--border);background:var(--surface);color:var(--muted);}
.negociacao-modal .doc-act.remove:hover{border-color:var(--accent);color:var(--accent);}
.negociacao-modal .docs-extra{display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--border);padding-top:13px;}
.negociacao-modal .docs-extra-h{font:800 11px Manrope;color:var(--muted);letter-spacing:.04em;}

/* ações */
.negociacao-modal .actions{display:flex;align-items:center;gap:14px;padding:16px 20px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);flex-wrap:wrap;}
.negociacao-modal .checks{display:flex;flex-direction:column;gap:5px;}
.negociacao-modal .check{display:flex;align-items:center;gap:7px;font:700 11.5px Manrope;}
.negociacao-modal .check.ok{color:var(--green);} .negociacao-modal .check.bad{color:var(--accent);}
.negociacao-modal .btn-draft{height:46px;padding:0 18px;border-radius:var(--radius-sm);background:transparent;border:1px solid var(--border-strong);color:var(--text-2);font:700 13px Manrope;cursor:pointer;}
.negociacao-modal .btn-draft:hover{background:var(--surface-2);}
.negociacao-modal .btn-main{height:46px;padding:0 24px;border-radius:var(--radius-sm);border:none;font:700 13.5px Manrope;}
.negociacao-modal .btn-main.on{background:var(--green);color:#fff;cursor:pointer;box-shadow:0 8px 20px -8px var(--green);}
.negociacao-modal .btn-main.on:hover{filter:brightness(1.06);}
.negociacao-modal .btn-main.off{background:var(--surface-2);color:var(--muted-2);cursor:not-allowed;border:1px solid var(--border);}
.negociacao-modal .btn-main.done{background:var(--green-soft);color:var(--green);cursor:default;border:1px solid var(--green);}
.negociacao-modal .toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);z-index:90;display:flex;align-items:center;gap:8px;padding:12px 22px;background:var(--green);color:#fff;border-radius:999px;box-shadow:0 14px 34px -14px rgba(11,143,98,.7);font:700 13px Manrope;}

/* Integração com o shell de modal do app (css/components/modals.css) */
.modal-overlay #negociacao-modal-box.modal {
    max-width: 1120px;
    width: calc(100vw - 40px);
    padding: 0;
    background: var(--bg, #E9ECF1);
}
.negociacao-modal .ng { max-width: none; }
.negociacao-modal-close {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid var(--border, #E4E8EE);
    background: var(--surface, #fff);
    color: var(--muted, #647084);
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    z-index: 5;
}
.negociacao-modal-close:hover { border-color: var(--accent, #E4002B); color: var(--accent, #E4002B); }
