:root{
  --bg:#f6f7f9; --surface:#ffffff; --surface-2:#fbfcfd; --border:#e8eaef; --border-strong:#d8dbe3;
  --text:#1b1f27; --muted:#6b7280; --muted-2:#9aa1ad;
  --accent:#5b5bd6; --accent-soft:#ececfb; --accent-text:#4f46e5;
  --green:#16a34a; --green-soft:#e7f6ec;
  --orange:#ea580c; --orange-soft:#fdeede;
  --blue:#2563eb; --blue-soft:#e6effe;
  --amber:#d97706; --amber-soft:#fcefd6;
  --rose:#e11d48; --rose-soft:#fde7ec;
  --slate:#64748b; --slate-soft:#eef1f5;
  --shadow:0 1px 2px rgba(16,24,40,.04), 0 4px 16px rgba(16,24,40,.06);
  --shadow-lg:0 12px 40px rgba(16,24,40,.16);
  --radius:14px; --radius-sm:10px;
}
[data-theme="dark"]{
  --bg:#0e1014; --surface:#161922; --surface-2:#1b1f29; --border:#262b36; --border-strong:#323845;
  --text:#e7e9ee; --muted:#98a1b1; --muted-2:#6c7686;
  --accent:#7c7cf0; --accent-soft:#23234a; --accent-text:#a5a5f5;
  --green:#34d399; --green-soft:#11321f;
  --orange:#fb923c; --orange-soft:#3a2412;
  --blue:#60a5fa; --blue-soft:#102338;
  --amber:#fbbf24; --amber-soft:#33260a;
  --rose:#fb7185; --rose-soft:#3a1019;
  --slate:#94a3b8; --slate-soft:#222834;
  --shadow:0 1px 2px rgba(0,0,0,.3), 0 4px 16px rgba(0,0,0,.35);
  --shadow-lg:0 16px 50px rgba(0,0,0,.55);
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text);font-size:14px;line-height:1.45;-webkit-font-smoothing:antialiased}
a{color:inherit}
button{font-family:inherit;cursor:pointer}
::selection{background:var(--accent-soft)}

/* ---------- login ---------- */
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:24px}
.login-card{background:var(--surface);border:1px solid var(--border);border-radius:18px;box-shadow:var(--shadow-lg);padding:34px;width:100%;max-width:380px;text-align:center}
.login-card .logo{width:48px;height:48px;border-radius:13px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--accent),#9b6bf0);font-size:22px;margin:0 auto 16px;box-shadow:var(--shadow)}
.login-card h1{font-size:20px;margin:0 0 6px;letter-spacing:-.3px}
.login-card p{color:var(--muted);font-size:13px;margin:0 0 22px}
.login-card input{width:100%;padding:12px 14px;border:1px solid var(--border);border-radius:11px;background:var(--surface-2);color:var(--text);font-size:14px;outline:none;text-align:center}
.login-card input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.login-card button.primary{width:100%;margin-top:12px;padding:12px;border:0;border-radius:11px;background:var(--accent);color:#fff;font-weight:700;font-size:14px}
.login-card button.primary:disabled{opacity:.6}
.login-msg{margin-top:18px;font-size:13px;color:var(--muted);line-height:1.5}
.login-msg.err{color:var(--rose)}
.login-msg.ok{color:var(--green)}
.login-msg a{color:var(--accent-text);font-weight:700;word-break:break-all}

/* ---------- layout ---------- */
.app{display:flex;flex-direction:column;min-height:100vh}
header.top{position:sticky;top:0;z-index:40;display:flex;align-items:center;gap:14px;padding:11px 20px;background:color-mix(in srgb, var(--surface) 88%, transparent);backdrop-filter:saturate(160%) blur(10px);border-bottom:1px solid var(--border)}
.brand{display:flex;align-items:center;gap:10px;font-weight:700;letter-spacing:-.2px;white-space:nowrap}
.brand .logo{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--accent),#9b6bf0);box-shadow:var(--shadow);font-size:15px}
.brand small{display:block;font-weight:500;color:var(--muted);font-size:11px;letter-spacing:0}
/* ⚠️ A barra de abas ROLA dentro de si em vez de alargar a página. Com 10 abas o cabeçalho
   passava de 1.366px: o documento ficava 250px mais largo que a tela, e clicar numa aba do
   fim deslocava o CRM inteiro para o lado (o "E-mail" até quebrava em duas linhas). */
nav.tabs{display:flex;gap:4px;margin-left:6px;min-width:0;overflow-x:auto;scrollbar-width:thin}
nav.tabs button{flex:none;white-space:nowrap;border:0;background:transparent;color:var(--muted);padding:8px 14px;border-radius:9px;font-weight:600;font-size:13px;display:flex;align-items:center;gap:7px;transition:.15s}
nav.tabs button:hover{background:var(--surface-2);color:var(--text)}
nav.tabs button.active{background:var(--accent-soft);color:var(--accent-text)}
.spacer{flex:1}
.search{position:relative;display:flex;align-items:center;min-width:200px;max-width:340px;flex:1}
.search svg{position:absolute;left:11px;color:var(--muted-2);pointer-events:none}
.search input{width:100%;padding:9px 12px 9px 34px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--text);font-size:13px;outline:none;transition:.15s}
.search input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.search kbd{position:absolute;right:9px;font-size:11px;color:var(--muted-2);border:1px solid var(--border);border-radius:5px;padding:1px 6px;background:var(--surface-2)}
.icon-btn{border:1px solid var(--border);background:var(--surface);color:var(--muted);width:38px;height:38px;border-radius:10px;display:grid;place-items:center;transition:.15s}
.icon-btn:hover{color:var(--text);border-color:var(--border-strong);background:var(--surface-2)}
.who{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);font-weight:600;padding-left:4px}
.menu-wrap{position:relative}
.menu{position:absolute;right:0;top:46px;background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-lg);padding:6px;min-width:240px;z-index:60;display:none}
.menu.open{display:block}
.menu button{width:100%;text-align:left;border:0;background:transparent;color:var(--text);padding:9px 11px;border-radius:8px;font-size:13px;display:flex;align-items:center;gap:10px;font-weight:500}
.menu button:hover{background:var(--surface-2)}
.menu button .mi{color:var(--muted);width:18px;display:grid;place-items:center}
.menu .sep{height:1px;background:var(--border);margin:5px 2px}
.menu .danger{color:var(--rose)}
.menu .danger .mi{color:var(--rose)}

main{padding:22px 24px 60px;max-width:1380px;width:100%;margin:0 auto}
.view{display:none;animation:fade .25s ease}
.view.active{display:block}
@keyframes fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
h2.section{font-size:17px;font-weight:700;margin:0 0 2px;letter-spacing:-.3px}
.sub{color:var(--muted);font-size:12.5px;margin-bottom:18px}

.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-bottom:22px}
.kpi{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:16px 17px;box-shadow:var(--shadow);position:relative;overflow:hidden}
.kpi .label{color:var(--muted);font-size:12px;font-weight:600;display:flex;align-items:center;gap:7px}
.kpi .val{font-size:27px;font-weight:780;letter-spacing:-.6px;margin-top:8px;line-height:1}
.kpi .delta{font-size:12px;color:var(--muted);margin-top:7px}
.kpi .ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;position:absolute;top:15px;right:15px}
.grid2{display:grid;grid-template-columns:1.3fr 1fr;gap:16px;margin-bottom:16px}
.grid2.even{grid-template-columns:1fr 1fr}
.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}
/* Diagnóstico técnico: fechado por padrão. Some do caminho de quem só quer operar o
   funil, sem sumir de quem precisa investigar. O marcador nativo é escondido porque
   ele varia demais entre navegadores; a seta é nossa e gira ao abrir. */
.diag{border:1px dashed var(--border-strong);border-radius:var(--radius);background:transparent}
.diag>summary{cursor:pointer;padding:12px 16px;font-size:13px;color:var(--muted);list-style:none;display:flex;align-items:center;gap:8px;user-select:none}
.diag>summary::-webkit-details-marker{display:none}
.diag>summary::before{content:"▸";display:inline-block;transition:transform .15s;color:var(--muted)}
.diag[open]>summary::before{transform:rotate(90deg)}
.diag>summary:hover{color:var(--text)}
.diag[open]{padding:0 12px 12px;background:var(--surface-2)}
.panel h3{margin:0 0 14px;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:space-between}
.panel h3 .hint{font-size:11.5px;font-weight:500;color:var(--muted-2)}

.bars{display:flex;flex-direction:column;gap:11px}
.bar-row{display:grid;grid-template-columns:130px 1fr 48px;align-items:center;gap:12px;font-size:12.5px}
.bar-row .bl{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bar-track{height:9px;background:var(--surface-2);border-radius:6px;overflow:hidden;border:1px solid var(--border)}
.bar-fill{height:100%;border-radius:6px;background:linear-gradient(90deg,var(--accent),#9b6bf0);transition:width .6s cubic-bezier(.2,.8,.2,1)}
.bar-row .bv{text-align:right;font-variant-numeric:tabular-nums;font-weight:600;color:var(--text)}
.months{display:flex;align-items:flex-end;gap:8px;height:170px;padding-top:6px}
.mcol{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;height:100%;justify-content:flex-end}
.mcol .mbar{width:100%;max-width:34px;background:linear-gradient(180deg,var(--accent),#9b6bf0);border-radius:6px 6px 3px 3px;transition:height .6s cubic-bezier(.2,.8,.2,1);position:relative}
.mcol .mbar:hover::after{content:attr(data-v);position:absolute;top:-22px;left:50%;transform:translateX(-50%);background:var(--text);color:var(--surface);font-size:10.5px;padding:2px 6px;border-radius:5px;white-space:nowrap}
.mcol .ml{font-size:10.5px;color:var(--muted-2);white-space:nowrap}
.mcol .mv{font-size:10.5px;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums;line-height:1;white-space:nowrap}
.tlist{display:flex;flex-direction:column}
.tlist .ti{display:flex;align-items:center;gap:11px;padding:9px 4px;border-bottom:1px solid var(--border);cursor:pointer;border-radius:8px}
.tlist .ti:last-child{border-bottom:0}
.tlist .ti:hover{background:var(--surface-2)}
.tlist .ti .nm{flex:1;min-width:0}
.tlist .ti .nm b{display:block;font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tlist .ti .nm span{font-size:11.5px;color:var(--muted)}
.tlist .ti .amt{font-weight:700;font-variant-numeric:tabular-nums;font-size:13px}

.av{width:34px;height:34px;border-radius:50%;flex:none;display:grid;place-items:center;color:#fff;font-weight:700;font-size:12.5px;letter-spacing:.3px}
.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;font-size:11.5px;font-weight:600;white-space:nowrap}
.dot{width:7px;height:7px;border-radius:50%;flex:none}
.b-cliente{background:var(--green-soft);color:var(--green)} .b-cliente .dot{background:var(--green)}
.b-quente{background:var(--orange-soft);color:var(--orange)} .b-quente .dot{background:var(--orange)}
.b-frio{background:var(--blue-soft);color:var(--blue)} .b-frio .dot{background:var(--blue)}
.s-novo{background:var(--slate-soft);color:var(--slate)} .s-novo .dot{background:var(--slate)}
.s-contato{background:var(--blue-soft);color:var(--blue)} .s-contato .dot{background:var(--blue)}
.s-negociando{background:var(--amber-soft);color:var(--amber)} .s-negociando .dot{background:var(--amber)}
.s-call_feita{background:var(--orange-soft);color:var(--orange)} .s-call_feita .dot{background:var(--orange)}
.s-cliente{background:var(--green-soft);color:var(--green)} .s-cliente .dot{background:var(--green)}
.s-perdido{background:var(--rose-soft);color:var(--rose)} .s-perdido .dot{background:var(--rose)}
.chip{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:7px;font-size:11px;font-weight:600;background:var(--surface-2);border:1px solid var(--border);color:var(--muted)}
.chip.on{background:var(--accent-soft);color:var(--accent-text);border-color:transparent}

.filters{display:flex;flex-wrap:wrap;gap:9px;align-items:center;margin-bottom:14px}
select.f, .filters input.f{border:1px solid var(--border);background:var(--surface);color:var(--text);padding:8px 11px;border-radius:9px;font-size:12.5px;outline:none;font-weight:500}
select.f:focus{border-color:var(--accent)}
.toggle{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--border);background:var(--surface);padding:7px 11px;border-radius:9px;font-size:12.5px;font-weight:600;color:var(--muted);user-select:none}
.toggle input{accent-color:var(--accent)}
.count-pill{margin-left:auto;font-size:12.5px;color:var(--muted);font-weight:600}

/* overflow VISÍVEL no desktop: o sticky do thead precisa prender no viewport (60px = altura do header do app);
   overflow:hidden aqui fazia o cabeçalho prender DENTRO do painel, com linhas vazando na faixa acima dele */
.tablewrap{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
.tablewrap thead th:first-child{border-top-left-radius:var(--radius)}
.tablewrap thead th:last-child{border-top-right-radius:var(--radius)}
table{width:100%;border-collapse:collapse}
thead th{position:sticky;top:60px;z-index:10;background:var(--surface);text-align:left;font-size:11.5px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted);font-weight:700;padding:12px 14px;border-bottom:1px solid var(--border);white-space:nowrap;cursor:pointer;user-select:none}
thead th.no-sort{cursor:default}
thead th .arr{opacity:.35;font-size:10px;margin-left:3px}
thead th.sorted .arr{opacity:1;color:var(--accent-text)}
tbody td{padding:11px 14px;border-bottom:1px solid var(--border);font-size:13px;vertical-align:middle}
tbody tr{cursor:pointer;transition:background .12s}
tbody tr:hover{background:var(--surface-2)}
tbody tr:last-child td{border-bottom:0}
.cell-name{display:flex;align-items:center;gap:11px;min-width:0}
.cell-name .nm{min-width:0}
.cell-name .nm b{font-weight:600;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:230px}
.cell-name .nm span{color:var(--muted);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:230px;display:block}
.qa{display:flex;gap:6px}
.qa a{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;border:1px solid var(--border);background:var(--surface);color:var(--muted);transition:.15s}
.qa a:hover{color:#fff;border-color:transparent}
.qa a.wa:hover{background:#25d366} .qa a.mail:hover{background:var(--accent)}
.qa a.dis{opacity:.32;pointer-events:none}
.val-cell{font-variant-numeric:tabular-nums;font-weight:600}
.muted{color:var(--muted)}
.empty{padding:60px 20px;text-align:center;color:var(--muted)}
.empty .big{font-size:40px;margin-bottom:8px;opacity:.5}
.pager{display:flex;align-items:center;gap:10px;justify-content:flex-end;padding:13px 16px;border-top:1px solid var(--border);font-size:12.5px;color:var(--muted)}
.pager button{border:1px solid var(--border);background:var(--surface);color:var(--text);width:32px;height:32px;border-radius:8px;font-weight:600}
.pager button:disabled{opacity:.4;cursor:default}
.pager select{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:8px;padding:5px 8px}

.kanban{display:grid;grid-template-columns:repeat(5,1fr);gap:13px;align-items:start}
.kcol{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);display:flex;flex-direction:column;min-height:160px}
.kcol.drag{outline:2px dashed var(--accent);outline-offset:-2px;background:var(--accent-soft)}
.khead{padding:12px 13px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px;position:sticky;top:60px;background:var(--surface-2);border-radius:var(--radius) var(--radius) 0 0;z-index:2}
.khead .ktit{font-weight:700;font-size:13px;display:flex;align-items:center;gap:7px}
.khead .kcount{font-size:11.5px;color:var(--muted);background:var(--surface);border:1px solid var(--border);border-radius:999px;padding:1px 8px;font-weight:700}
.khead .ksum{margin-left:auto;font-size:11px;color:var(--muted);font-weight:600}
.kbody{padding:10px;display:flex;flex-direction:column;gap:9px;min-height:60px}
.kcard{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:11px;box-shadow:var(--shadow);cursor:grab;transition:.12s}
.kcard:hover{border-color:var(--border-strong);transform:translateY(-1px)}
.kcard:active{cursor:grabbing}
.kcard.dragging{opacity:.4}
.kcard .kc-top{display:flex;align-items:center;gap:9px}
.kcard .kc-top .nm{font-weight:600;font-size:12.5px;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kcard .kc-meta{display:flex;align-items:center;gap:6px;margin-top:9px;flex-wrap:wrap}
.kcard .kc-val{margin-left:auto;font-weight:700;font-size:12px;font-variant-numeric:tabular-nums}
.kcard .kc-owner{font-size:10.5px;color:var(--muted-2);margin-top:6px;display:flex;align-items:center;gap:4px}
.loadmore{margin:4px 6px 10px;border:1px dashed var(--border-strong);background:transparent;color:var(--muted);padding:8px;border-radius:9px;font-weight:600;font-size:12px;width:calc(100% - 12px)}
.loadmore:hover{color:var(--text);border-color:var(--accent)}

.scrim{position:fixed;inset:0;background:rgba(15,18,24,.42);z-index:80;opacity:0;pointer-events:none;transition:.25s}
.scrim.open{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;height:100%;width:460px;max-width:94vw;background:var(--surface);border-left:1px solid var(--border);box-shadow:var(--shadow-lg);z-index:90;transform:translateX(100%);transition:transform .28s cubic-bezier(.3,.9,.3,1);display:flex;flex-direction:column}
.drawer.open{transform:none}
.dhead{padding:20px;border-bottom:1px solid var(--border);display:flex;gap:14px;align-items:flex-start}
.dhead .av{width:46px;height:46px;font-size:16px}
.dhead .info{flex:1;min-width:0}
.dhead .info h3{margin:0 0 4px;font-size:17px;font-weight:750;letter-spacing:-.3px}
.dhead .info .em{color:var(--muted);font-size:12.5px;word-break:break-all}
.dbody{padding:18px 20px;overflow:auto;flex:1;display:flex;flex-direction:column;gap:18px}
.contact-row{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.cbtn{display:flex;align-items:center;justify-content:center;gap:8px;padding:11px;border-radius:10px;border:1px solid var(--border);background:var(--surface);font-weight:600;font-size:13px;color:var(--text);transition:.15s;text-decoration:none}
.cbtn:hover{background:var(--surface-2);border-color:var(--border-strong)}
.cbtn.wa{background:#25d366;border-color:transparent;color:#053d1c}
.cbtn.wa:hover{filter:brightness(1.05)}
.cbtn.dis{opacity:.4;pointer-events:none}
.fieldset{display:flex;flex-direction:column;gap:13px}
.field label{display:block;font-size:11.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.3px;margin-bottom:6px}
.field select,.field input,.field textarea{width:100%;border:1px solid var(--border);background:var(--surface-2);color:var(--text);padding:10px 12px;border-radius:10px;font-size:13px;outline:none;font-family:inherit}
.field select:focus,.field input:focus,.field textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);background:var(--surface)}
.field textarea{min-height:74px;resize:vertical;line-height:1.5}
.meta-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.meta-item .k{font-size:11px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.3px}
.meta-item .v{font-size:13.5px;font-weight:600;margin-top:3px}
.flags{display:flex;flex-wrap:wrap;gap:7px}
.tag-input-row{display:flex;gap:8px}
.tag-input-row input{flex:1}
.tag-input-row button{border:1px solid var(--border);background:var(--surface-2);border-radius:10px;padding:0 14px;font-weight:700;color:var(--accent-text)}
.tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.tag{display:inline-flex;align-items:center;gap:6px;background:var(--accent-soft);color:var(--accent-text);padding:4px 9px;border-radius:7px;font-size:12px;font-weight:600}
.tag button{border:0;background:transparent;color:var(--accent-text);font-weight:800;line-height:1;opacity:.6;padding:0}
.tag button:hover{opacity:1}
.icon-close{border:0;background:transparent;color:var(--muted);width:32px;height:32px;border-radius:8px;display:grid;place-items:center}
.icon-close:hover{background:var(--surface-2);color:var(--text)}
.pr-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.pr-tabs{display:flex;gap:5px}
.pr-tab{border:1px solid var(--border);background:var(--surface-2);color:var(--muted);border-radius:99px;padding:4px 11px;font-size:11.5px;font-weight:600;cursor:pointer;transition:.15s}
.pr-tab:hover{border-color:var(--border-strong)}
.pr-tab.on{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-text)}
.prontuario .hint{margin-top:6px}
.note-add{display:flex;gap:8px;align-items:flex-end}
.note-add textarea{min-height:44px}
.note-add button{border:0;background:var(--accent);color:#fff;border-radius:10px;padding:0 16px;height:44px;font-weight:700;font-size:13px;white-space:nowrap}
.timeline{display:flex;flex-direction:column;gap:0;margin-top:12px}
.tl-item{display:flex;gap:11px;padding-bottom:14px;position:relative}
.tl-item:not(:last-child)::before{content:"";position:absolute;left:13px;top:26px;bottom:-2px;width:2px;background:var(--border)}
.tl-dot{width:28px;height:28px;border-radius:50%;flex:none;display:grid;place-items:center;font-size:12px;background:var(--surface-2);border:1px solid var(--border);z-index:1}
.tl-body{flex:1;min-width:0}
.tl-body .tl-meta{font-size:11px;color:var(--muted-2);font-weight:600}
.tl-body .tl-text{font-size:13px;margin-top:2px;white-space:pre-wrap;word-break:break-word}
.tl-note .tl-text{background:var(--surface-2);border:1px solid var(--border);border-radius:9px;padding:8px 10px;margin-top:4px}

.toast-wrap{position:fixed;bottom:22px;left:50%;transform:translateX(-50%);z-index:120;display:flex;flex-direction:column;gap:8px;align-items:center}
.toast{background:var(--text);color:var(--surface);padding:11px 18px;border-radius:11px;font-size:13px;font-weight:600;box-shadow:var(--shadow-lg);animation:pop .25s ease}
@keyframes pop{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.boot{min-height:100vh;display:grid;place-items:center;color:var(--muted);font-size:13px}

/* ---------- em atendimento (claim) ---------- */
.claim-pill{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;font-size:11px;font-weight:700;white-space:nowrap}
.claim-pill.other{background:var(--rose-soft);color:var(--rose)}
.claim-pill.mine{background:var(--green-soft);color:var(--green)}
tbody tr.claimed-other{opacity:.6}
tbody tr.claimed-other:hover{opacity:1}
.kcard.claimed-other{opacity:.62;border-style:dashed}
.kcard.claimed-other:hover{opacity:1}
.claim-btn{width:100%;border:0;border-radius:12px;background:var(--accent);color:#fff;font-weight:800;font-size:14px;padding:12px;display:flex;flex-direction:column;align-items:center;gap:2px;cursor:pointer;box-shadow:var(--shadow);transition:.15s}
.claim-btn span{font-weight:500;font-size:11px;opacity:.85}
.claim-btn:hover{filter:brightness(1.07)}
.claim-box{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px}
.claim-box .ci{flex:1;display:flex;flex-direction:column;min-width:0}
.claim-box .ci b{font-size:13.5px}
.claim-box .ci span{font-size:11.5px;color:var(--muted)}
.claim-box.mine{background:var(--green-soft)} .claim-box.mine .ci b{color:var(--green)}
.claim-box.other{background:var(--rose-soft)} .claim-box.other .ci b{color:var(--rose)}
.claim-release{border:1px solid var(--border-strong);background:var(--surface);color:var(--text);border-radius:9px;padding:8px 12px;font-weight:700;font-size:12.5px;cursor:pointer;white-space:nowrap}
.claim-release:hover{background:var(--surface-2)}

/* ---------- editar / criar / importar ---------- */
.data-save{width:100%;border:0;border-radius:10px;background:var(--accent);color:#fff;font-weight:700;font-size:13.5px;padding:11px;cursor:pointer;margin-top:4px;transition:.15s}
.data-save:hover{filter:brightness(1.06)} .data-save:disabled{opacity:.6;cursor:default}
.lead-delete{width:100%;border:1px solid var(--rose);background:transparent;color:var(--rose);font-weight:700;font-size:13px;padding:10px;border-radius:10px;cursor:pointer;margin-top:8px}
.lead-delete:hover{background:var(--rose-soft)}
.lead-erase{width:100%;border:1px dashed var(--rose);background:transparent;color:var(--muted);font-weight:600;font-size:12px;padding:8px;border-radius:10px;cursor:pointer;margin-top:6px}
.lead-erase:hover{color:var(--rose);border-style:solid}
.newlead-btn{border:1px solid var(--accent);background:var(--accent-soft);color:var(--accent-text);font-weight:700;font-size:12.5px;padding:8px 13px;border-radius:9px;cursor:pointer}
.newlead-btn:hover{filter:brightness(.97)}
.imp-prev{border:1px solid var(--border);border-radius:10px;overflow:auto;max-height:210px}
.imp-prev table{width:100%;border-collapse:collapse;font-size:12px}
.imp-prev th{position:sticky;top:0;background:var(--surface-2);text-align:left;padding:7px 9px;border-bottom:1px solid var(--border);font-weight:700;color:var(--muted)}
.imp-prev td{padding:6px 9px;border-bottom:1px solid var(--border);white-space:nowrap;max-width:150px;overflow:hidden;text-overflow:ellipsis}

/* ---------- campanha ---------- */
.camp-count{margin-top:12px;font-size:13px;color:var(--muted)} .camp-count b{color:var(--text);font-size:16px}
.camp-preview{background:var(--surface-2);border:1px solid var(--border);border-radius:10px;padding:11px 13px;font-size:13px;white-space:pre-wrap;line-height:1.5;min-height:40px}
.seg-tabs{display:flex;gap:8px;margin-bottom:14px;flex-wrap:wrap}
.seg{border:1px solid var(--border);background:var(--surface);color:var(--muted);padding:9px 14px;border-radius:10px;font-weight:600;font-size:13px;cursor:pointer}
.seg.on{background:var(--accent-soft);color:var(--accent-text);border-color:transparent}
.api-setup{background:var(--amber-soft);color:var(--text);border-radius:10px;padding:12px 14px;font-size:12.5px;line-height:1.6}
.api-setup code{background:var(--surface);border:1px solid var(--border);border-radius:5px;padding:1px 5px;font-size:11.5px}

@media (max-width:1100px){ .kanban{grid-template-columns:repeat(3,1fr)} .grid2{grid-template-columns:1fr} }
@media (max-width:780px){
  nav.tabs span{display:none} .search{min-width:120px} .who span{display:none}
  .kanban{grid-template-columns:1fr} main{padding:16px 14px 50px}
  .tablewrap{overflow-x:auto} /* tabela larga rola na horizontal no celular */
  thead th{top:0} .khead{top:0}
}
.hide{display:none !important}

/* ── Campanha guiada (3 passos) ── */
.camp-step{margin-bottom:16px}
.step-head{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.step-n{width:30px;height:30px;border-radius:50%;background:var(--accent-soft);color:var(--accent-text);font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center;flex:0 0 30px}
.step-tit h3{margin:0}
.step-tit .hint{display:block;margin-top:2px}
.camp-count-big{margin-left:auto;text-align:right;font-size:12px;color:var(--muted)}
.camp-count-big b{display:block;font-size:26px;color:var(--accent-text);line-height:1.05}
.presets{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:10px;margin-bottom:10px}
.preset{border:1.5px solid var(--border);background:var(--surface-2);border-radius:12px;padding:12px 13px;text-align:left;cursor:pointer;font-weight:700;font-size:13.5px;color:var(--text);transition:border-color .15s, background .15s}
.preset small{display:block;font-weight:500;color:var(--muted);font-size:11.5px;margin-top:3px}
.preset:hover{border-color:var(--accent)}
.preset.on{border-color:var(--accent);background:var(--accent-soft)}
.camp-adv summary{cursor:pointer;color:var(--muted);font-size:13px;font-weight:600;user-select:none}
.camp-msg-grid{display:grid;grid-template-columns:1fr 340px;gap:16px;align-items:start}
.wa-mock{border:1px solid var(--border);border-radius:14px;overflow:hidden}
.wa-mock-head{font-size:11.5px;color:var(--muted);padding:8px 12px;border-bottom:1px solid var(--border);background:var(--surface-2)}
.wa-mock-screen{background:#e4ddd3;padding:18px 14px;min-height:150px}
[data-theme="dark"] .wa-mock-screen{background:#0b141a}
.wa-bubble{background:#fff;color:#111;border-radius:10px;border-top-left-radius:2px;padding:9px 11px;font-size:13.5px;line-height:1.5;max-width:96%;box-shadow:0 1px 1px rgba(0,0,0,.12);white-space:pre-wrap;word-break:break-word}
[data-theme="dark"] .wa-bubble{background:#202c33;color:#e9edef}
.var-chips{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:8px}
.chip-btn{border:1px solid var(--border);background:var(--surface-2);border-radius:999px;padding:4px 11px;font-size:12px;cursor:pointer;color:var(--text)}
.chip-btn:hover{border-color:var(--accent)}
.tpl-card{border:1.5px dashed var(--border-strong);border-radius:12px;padding:14px;background:var(--surface-2)}
.tpl-name{font-size:14px}
.mode-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:14px}
.mode-card{border:1.5px solid var(--border);border-radius:14px;background:var(--surface-2);padding:14px 15px;text-align:left;cursor:pointer;transition:border-color .15s, background .15s;color:var(--text)}
.mode-card:hover{border-color:var(--accent)}
.mode-card.on{border-color:var(--accent);background:var(--accent-soft)}
.mode-card .mc-tit{font-weight:800;font-size:14.5px;margin-bottom:5px}
.mode-card .mc-desc{font-size:12.5px;color:var(--muted);line-height:1.55}
.mode-card .mc-lock{margin-top:8px;font-size:12px;color:var(--orange);font-weight:700}
.mode-card.locked{opacity:.72}
.data-save.big{font-size:15px;padding:14px 18px;max-width:430px}
.send-row .hint{margin-top:9px;display:block;max-width:560px}
@media (max-width:780px){ .camp-msg-grid{grid-template-columns:1fr} .mode-cards{grid-template-columns:1fr} .step-head{flex-wrap:wrap} .camp-count-big{margin-left:42px;text-align:left} }

/* ── Caixa de entrada WhatsApp (aba Conversas) ── */
.tab-badge{margin-left:6px;background:var(--rose);color:#fff;border-radius:999px;font-size:10.5px;font-weight:800;padding:1px 6px;min-width:17px;display:inline-block;text-align:center;vertical-align:1px}
/* grid-template-rows:minmax(0,1fr) + min-height:0 nos painéis = a linha vira a
   altura FIXA do wrap (não max-content), e cada painel pode encolher → .chat-msgs
   e .chat-list viram áreas roláveis internas em vez de esticar com o conteúdo */
.chat-wrap{display:grid;grid-template-columns:330px 1fr;grid-template-rows:minmax(0,1fr);gap:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden;height:calc(100vh - 148px);min-height:420px}
.chat-pane-list{border-right:1px solid var(--border);display:flex;flex-direction:column;min-width:0;min-height:0}
.chat-list-head{padding:10px;border-bottom:1px solid var(--border);background:var(--surface-2)}
.chat-list-head input{width:100%;padding:9px 12px;border:1px solid var(--border);border-radius:9px;background:var(--surface);color:var(--text);font-size:13px;outline:none}
.chat-list-head input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.chat-list{flex:1;overflow-y:auto}
.chat-item{display:flex;gap:10px;align-items:center;width:100%;text-align:left;border:0;background:transparent;padding:11px 12px;cursor:pointer;border-bottom:1px solid var(--border);color:var(--text)}
.chat-item:hover{background:var(--surface-2)}
.chat-item.on{background:var(--accent-soft)}
.chat-item .av{flex:0 0 38px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:700;font-size:13px}
.chat-item-mid{flex:1;min-width:0}
.chat-item-top{display:flex;align-items:baseline;gap:8px}
.chat-item-name{font-weight:700;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.chat-item-time{font-size:11px;color:var(--muted-2);white-space:nowrap}
.chat-item.unread .chat-item-time{color:var(--green);font-weight:700}
.chat-item-preview{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.chat-item.unread .chat-item-preview{color:var(--text);font-weight:600}
.chat-unread-pill{flex:0 0 auto;background:var(--green);color:#fff;border-radius:999px;font-size:10.5px;font-weight:800;padding:2px 7px;min-width:19px;text-align:center}
.chat-empty-list{padding:26px 18px;color:var(--muted);font-size:13px;text-align:center;line-height:1.6}

.chat-pane-thread{display:flex;flex-direction:column;min-width:0;min-height:0;background:var(--bg)}
.chat-placeholder{margin:auto;text-align:center;color:var(--muted);padding:30px;max-width:420px}
.chat-ph-icon{font-size:40px;margin-bottom:10px}
.chat-placeholder h3{margin:0 0 8px;color:var(--text)}
.chat-placeholder p{font-size:13px;line-height:1.65;margin:0}
.chat-thread{display:flex;flex-direction:column;flex:1;min-height:0}
.chat-head{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--border);background:var(--surface)}
.chat-head .av{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:700;font-size:12px;flex:0 0 34px}
.chat-head-info{flex:1;min-width:0;overflow:hidden}
/* display:block é essencial: ellipsis/overflow:hidden não recortam <span> inline
   (o sub vazava por baixo da pílula da janela de 24h) */
.chat-head-name{display:block;font-weight:800;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-head-name .b-link{color:var(--accent-text);cursor:pointer;text-decoration:none}
.chat-head-name .b-link:hover{text-decoration:underline}
.chat-head-sub{display:block;font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px}
.chat-window-chip{flex:0 0 auto;margin-left:8px;font-size:11px;font-weight:700;border-radius:999px;padding:3px 10px;white-space:nowrap}
.chat-window-chip.open{background:var(--green-soft);color:var(--green)}
.chat-window-chip.closed{background:var(--slate-soft);color:var(--slate)}
.chat-back{display:none;border:0;background:transparent;color:var(--accent-text);font-size:20px;cursor:pointer;padding:4px 6px}

.chat-msgs{flex:1;overflow-y:auto;padding:16px 18px;background:#e4ddd3}
[data-theme="dark"] .chat-msgs{background:#0b141a}
.chat-day{display:flex;justify-content:center;margin:10px 0}
.chat-day span{background:rgba(255,255,255,.85);color:#54656f;font-size:11px;font-weight:600;border-radius:8px;padding:4px 10px;box-shadow:0 1px 1px rgba(0,0,0,.08)}
[data-theme="dark"] .chat-day span{background:#182229;color:#8696a0}
.msg{display:flex;margin:3px 0}
.msg .bubble{max-width:72%;border-radius:10px;padding:7px 10px 5px;font-size:13.5px;line-height:1.45;box-shadow:0 1px 1px rgba(0,0,0,.1);white-space:pre-wrap;word-break:break-word}
.msg.in .bubble{background:#fff;color:#111;border-top-left-radius:2px}
[data-theme="dark"] .msg.in .bubble{background:#202c33;color:#e9edef}
.msg.out{justify-content:flex-end}
.msg.out .bubble{background:#d9fdd3;color:#111;border-top-right-radius:2px}
[data-theme="dark"] .msg.out .bubble{background:#005c4b;color:#e9edef}
.msg .m-author{display:block;font-size:11px;font-weight:700;color:var(--accent-text);margin-bottom:2px}
[data-theme="dark"] .msg.out .m-author{color:#8fdccb}
.msg .m-meta{display:flex;justify-content:flex-end;gap:4px;align-items:center;font-size:10.5px;color:#667781;margin-top:2px}
[data-theme="dark"] .msg .m-meta{color:#8696a0}
.msg .ticks{letter-spacing:-2px}
.msg .ticks.read{color:#53bdeb}
.msg .ticks.failed{color:var(--rose);letter-spacing:0}
.msg.template .bubble{border:1.5px dashed rgba(0,0,0,.18);font-style:italic}
[data-theme="dark"] .msg.template .bubble{border-color:rgba(255,255,255,.2)}

.chat-banner{padding:10px 16px;font-size:12.5px;line-height:1.5;background:var(--amber-soft);color:var(--text);border-top:1px solid var(--border)}
.chat-composer{position:relative;display:flex;gap:8px;align-items:flex-end;padding:10px 12px;border-top:1px solid var(--border);background:var(--surface)}
.chat-snip-btn{flex:0 0 38px;width:38px;height:38px;border-radius:50%;border:1px solid var(--border);background:var(--surface-2);color:var(--text);font-size:16px;display:grid;place-items:center;cursor:pointer;transition:.15s}
.chat-snip-btn:hover{border-color:var(--accent);background:var(--accent-soft)}
.chat-snip-btn:disabled{opacity:.45;cursor:default}
.chat-snips{position:absolute;left:10px;right:10px;bottom:calc(100% + 6px);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-lg);max-height:min(340px,48vh);overflow:auto;z-index:30}
.chat-snips-head{position:sticky;top:0;background:var(--surface);padding:10px 14px 8px;border-bottom:1px solid var(--border);font-size:11.5px;color:var(--muted)}
.chat-snips-head b{display:block;font-size:13px;color:var(--text);margin-bottom:1px}
.snip-item{display:block;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--border);padding:9px 14px;cursor:pointer;font-family:inherit}
.snip-item:last-child{border-bottom:0}
.snip-item:hover{background:var(--surface-2)}
.snip-label{display:block;font-size:12.5px;font-weight:600;color:var(--text)}
.snip-prev{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:11.5px;color:var(--muted);margin-top:2px}
.chat-composer textarea{flex:1;resize:none;border:1px solid var(--border);border-radius:12px;background:var(--surface-2);color:var(--text);font-size:13.5px;font-family:inherit;padding:10px 13px;outline:none;max-height:120px;line-height:1.45}
.chat-composer textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.chat-composer textarea:disabled{opacity:.55}
.chat-send{flex:0 0 42px;width:42px;height:42px;border-radius:50%;border:0;background:var(--accent);color:#fff;display:grid;place-items:center;cursor:pointer;transition:.15s}
.chat-send:hover{filter:brightness(1.08)}
.chat-send:disabled{opacity:.5;cursor:default}
/* envio assistido: o botão faz outra coisa (copia e abre o WhatsApp), então não pode
   ter a mesma cara do envio direto — senão a pessoa acha que o CRM mandou. */
.chat-send.assistido{background:var(--amber)}
.banner-act{margin-top:8px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
/* vale pra <button> e pra <a>: o "Abrir no WhatsApp" é âncora de verdade de propósito
   (bloqueador de pop-up não barra link), então precisa perder cara de link. */
.banner-btn{display:inline-block;text-decoration:none;border:1px solid var(--border-strong);background:var(--surface);color:var(--text);border-radius:999px;padding:5px 12px;font:inherit;font-size:12px;line-height:1.4;cursor:pointer;transition:.15s}
.banner-btn:hover{border-color:var(--accent);background:var(--accent-soft)}
.banner-btn.ghost{color:var(--muted)}

@media (max-width:780px){
  .chat-wrap{grid-template-columns:1fr;height:calc(100vh - 128px)}
  .chat-pane-thread{display:none}
  .chat-wrap.thread-open .chat-pane-list{display:none}
  .chat-wrap.thread-open .chat-pane-thread{display:flex}
  .chat-back{display:block}
  .msg .bubble{max-width:86%}
  .chat-head{flex-wrap:wrap}
  .chat-window-chip{order:5;flex-basis:100%;text-align:center;margin-top:4px}
}

/* estrela "Interessado" no cabeçalho da conversa */
.chat-star{flex:0 0 auto;border:1px solid var(--border);background:var(--surface-2);border-radius:9px;width:34px;height:34px;font-size:16px;cursor:pointer;display:grid;place-items:center;transition:.15s}
.chat-star:hover{border-color:var(--amber)}
.chat-star.on{background:var(--amber-soft);border-color:var(--amber)}
.chat-star:disabled{opacity:.5}

/* ── mídia nas conversas do WhatsApp ── */
.wa-media-img{max-width:260px;max-height:300px;border-radius:10px;display:block;margin:2px 0 6px}
.wa-media-video{max-width:280px;max-height:320px;border-radius:10px;display:block;margin:2px 0 6px}
.wa-media-audio{width:250px;max-width:100%;display:block;margin:2px 0 6px}
.wa-media-doc{display:inline-block;margin:2px 0 6px;font-weight:700;text-decoration:underline}

/* ── Perfil vendedor: call + encaminhamento + desfecho ── */
.vend-pill{display:inline-flex;align-items:center;gap:4px;background:var(--blue-soft);color:var(--blue);border-radius:999px;padding:3px 10px;font-size:12px;font-weight:700;white-space:nowrap}
.call-chip{display:inline-flex;align-items:center;gap:4px;border-radius:8px;padding:3px 8px;font-size:12px;font-weight:600;white-space:nowrap}
.call-chip.next{background:var(--green-soft);color:var(--green)}
.call-chip.past{background:var(--slate-soft);color:var(--slate)}
.call-panel{border-left:3px solid var(--accent)}
.outcome-btns{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ob{border:1.5px solid var(--border);background:var(--surface-2);border-radius:10px;padding:9px 6px;font-size:12.5px;font-weight:700;color:var(--text);cursor:pointer;transition:.15s}
.ob:hover{border-color:var(--border-strong)}
.ob.ob-cliente.on{background:var(--green-soft);border-color:var(--green);color:var(--green)}
.ob.ob-follow.on{background:var(--amber-soft);border-color:var(--amber);color:var(--amber)}
.ob.ob-nao.on{background:var(--rose-soft);border-color:var(--rose);color:var(--rose)}
@media (max-width:780px){ .outcome-btns{grid-template-columns:1fr} }

/* ── Foto de perfil ── */
.av.av-img{background-size:cover;background-position:center;color:transparent}
.profile-av .av{width:88px;height:88px;font-size:30px;margin:0 auto}
.profile-av .av.av-img{width:88px;height:88px}

/* ── Status da call na ficha ── */
.call-status{border-radius:10px;padding:9px 12px;font-size:12.5px;line-height:1.5;margin-bottom:4px}
.call-status.prop{background:var(--amber-soft);color:var(--text)}
.call-status.conf{background:var(--green-soft);color:var(--green)}
.call-status.decl{background:var(--rose-soft);color:var(--rose)}
.call-resp{display:flex;gap:8px;margin-top:8px}
.call-resp .ob{flex:1;padding:8px}

/* ── Agenda (calendário) ── */
.ag-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:12px;flex-wrap:wrap}
.ag-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ag-controls .f{min-width:180px}
.ag-nav{display:flex;align-items:center;gap:8px}
.ag-nav button{width:32px;height:32px;border:1px solid var(--border);background:var(--surface);border-radius:9px;font-size:16px;color:var(--text)}
.ag-nav button:hover{background:var(--surface-2)}
.ag-nav b{min-width:150px;text-align:center;text-transform:capitalize;font-size:14px}
.ag-legend{display:flex;gap:16px;flex-wrap:wrap;font-size:11.5px;color:var(--muted);margin-bottom:12px}
.ag-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.dot-free{background:var(--green)}.dot-prop{background:var(--amber)}.dot-conf{background:var(--accent)}.dot-decl{background:var(--rose)}
.ag-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:12px;box-shadow:var(--shadow)}
.ag-dow{text-align:center;font-size:11px;font-weight:700;color:var(--muted-2);text-transform:uppercase;padding-bottom:4px}
.ag-cell{min-height:82px;border:1px solid var(--border);border-radius:10px;padding:5px 6px;cursor:pointer;background:var(--surface-2);transition:.12s;display:flex;flex-direction:column;gap:3px;overflow:hidden}
.ag-cell:hover{border-color:var(--accent);background:var(--accent-soft)}
.ag-cell.out{opacity:.4}
.ag-cell.today{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent) inset}
.ag-daynum{font-size:12px;font-weight:700;color:var(--text)}
.ag-chip{font-size:10.5px;font-weight:600;border-radius:5px;padding:1px 5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.5}
.ag-chip.free{background:var(--green-soft);color:var(--green)}
.ag-chip.prop{background:var(--amber-soft);color:var(--amber)}
.ag-chip.conf{background:var(--accent-soft);color:var(--accent-text)}
.ag-chip.decl{background:var(--rose-soft);color:var(--rose);text-decoration:line-through}
.ag-more{font-size:10px;color:var(--muted-2)}
.ag-slots{display:flex;flex-direction:column;gap:8px}
.ag-slot{display:flex;align-items:center;gap:10px;border:1px solid var(--border);border-left-width:3px;border-radius:9px;padding:9px 11px}
.ag-slot.free{border-left-color:var(--green)}.ag-slot.prop{border-left-color:var(--amber)}.ag-slot.conf{border-left-color:var(--accent)}.ag-slot.decl{border-left-color:var(--rose)}
.ag-slot-main{flex:1;min-width:0;font-size:13px}
.ag-slot-sub{font-size:11.5px;color:var(--muted);margin-top:2px}
.ag-slot-act{display:flex;gap:5px}
.ag-slot-act .ob{padding:5px 9px;font-size:13px}
.ag-cell.out{opacity:.4;pointer-events:none;cursor:default}
@media (max-width:780px){
  .ag-cell{min-height:54px;align-items:flex-start}
  .ag-chip,.ag-more{display:none}
  /* no celular, um badge com a contagem de horários do dia */
  .ag-cell[data-count]:not([data-count=""])::after{content:attr(data-count);display:inline-block;min-width:16px;height:16px;line-height:16px;text-align:center;font-size:10px;font-weight:800;color:#fff;background:var(--accent);border-radius:8px;margin-top:2px}
}

/* ── Fila do Agora ("Meu Dia") ── */
.agora-pulse{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.pulse-chip{background:var(--surface);border:1px solid var(--border);border-radius:999px;padding:6px 13px;font-size:12.5px;color:var(--muted);box-shadow:var(--shadow)}
.pulse-chip b{color:var(--text);font-size:15px;font-variant-numeric:tabular-nums;margin-right:2px}
.qband{margin-bottom:22px}
.qband-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.qband-title{font-weight:750;font-size:14.5px;letter-spacing:-.01em}
.qband-n{font-family:var(--mono,ui-monospace);font-size:11.5px;font-weight:700;background:var(--surface-2);border:1px solid var(--border);border-radius:999px;padding:1px 9px;color:var(--muted);font-variant-numeric:tabular-nums}
.qband-hint{font-size:11.5px;color:var(--muted-2);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qlist{display:flex;flex-direction:column;gap:8px}
.qcard{display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--border-strong);border-radius:12px;padding:11px 14px;cursor:pointer;box-shadow:var(--shadow);transition:border-color .12s,transform .12s}
.qcard:hover{border-color:var(--accent);transform:translateX(2px)}
.qcard .av{flex:0 0 40px;width:40px;height:40px}
.qc-mid{flex:1;min-width:0}
.qc-name{font-weight:700;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qc-why{font-size:12.5px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qc-side{display:flex;gap:5px;flex-wrap:wrap;justify-content:flex-end;max-width:190px}
.qc-wa{flex:0 0 auto;width:38px;height:38px;border-radius:10px;display:grid;place-items:center;background:var(--green-soft);color:var(--green);border:1px solid transparent}
.qc-wa:hover{border-color:var(--green)}
.qc-wa.dis{opacity:.35;pointer-events:none}
/* cor da barra lateral por faixa */
.b-sinal .qcard{border-left-color:var(--rose)}
.b-retorno .qcard{border-left-color:var(--amber)}
.b-aluno .qcard{border-left-color:var(--blue)}
.b-poscall .qcard{border-left-color:var(--orange)}
.ob.ob-callfeita.on{background:var(--orange-soft);border-color:var(--orange);color:var(--orange)}
.calldone-box{margin-top:8px;padding:10px 12px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm)}
.badge.b-alunocurso{background:var(--blue-soft);color:var(--blue)}
.tpl-pick.pend,.tpl-pick:disabled{opacity:.55;cursor:default}
#dBriefing{margin:12px 0;padding:12px 14px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius)}
.brief-head{font-size:12.5px;font-weight:700;margin-bottom:8px}
.brief-chips{display:flex;flex-wrap:wrap;gap:5px}
.brief-chip{font-size:11px;padding:3px 9px;border-radius:99px;background:var(--surface);border:1px solid var(--border);color:var(--text)}
.brief-thread{margin-top:10px;display:flex;flex-direction:column;gap:4px;max-height:180px;overflow:auto}
.brief-msg{max-width:88%;padding:5px 9px;border-radius:10px;font-size:11.5px;line-height:1.4;background:var(--surface);border:1px solid var(--border)}
.brief-msg.out{align-self:flex-end;background:var(--accent-soft);border-color:transparent}
.brief-msg i{display:block;font-style:normal;font-size:9.5px;color:var(--muted-2);margin-top:1px}
.brief-cue{margin-top:8px;font-size:11.5px;color:var(--muted)}
.brief-cue.warn{color:var(--amber);font-weight:600}
.pxfunnel{display:flex;flex-direction:column;gap:10px}
.pxrow{display:grid;grid-template-columns:180px 1fr 44px;align-items:center;gap:12px}
.pxlab{font-size:12.5px;line-height:1.25}
.pxlab span{display:block;font-size:10.5px;color:var(--muted)}
.pxbarwrap{background:var(--surface-2);border-radius:99px;height:14px;overflow:hidden}
.pxbar{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-text));border-radius:99px;min-width:2px;transition:width .4s}
.pxn{text-align:right;font-weight:700;font-size:14px}
@media (max-width:600px){.pxrow{grid-template-columns:130px 1fr 36px;gap:8px}}
.b-call .qcard{border-left-color:var(--accent)}
.b-novo .qcard{border-left-color:var(--blue)}
.b-reativado .qcard{border-left-color:var(--amber)}
.b-parado .qcard{border-left-color:var(--orange)}
.qc-empty{text-align:center;padding:56px 20px;color:var(--muted)}
.qc-empty .big{font-size:44px;margin-bottom:10px}
.qc-empty b{display:block;font-size:16px;color:var(--text);margin-bottom:4px}
.qc-empty p{font-size:13px;margin:0}
@media(max-width:780px){
  .ag-head{flex-direction:column;align-items:flex-start;gap:10px}
  .qc-side{display:none}
  .qband-hint{display:none}
}
.qmore{margin-top:8px;width:100%;border:1px dashed var(--border-strong);background:transparent;color:var(--muted);border-radius:10px;padding:9px;font-size:12.5px;font-weight:600}
.qmore:hover{border-color:var(--accent);color:var(--accent-text)}
/* prévia do e-mail: mostra exatamente o que a pessoa vai receber */
.prev-mail{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;background:var(--surface)}
.prev-head{background:var(--surface-2);padding:10px 14px;font-size:11.5px;color:var(--muted);line-height:1.7;border-bottom:1px solid var(--border)}
.prev-head b{color:var(--text)}
.prev-body{padding:16px 18px;font-size:13.5px;line-height:1.65;color:var(--text);max-height:340px;overflow:auto}
.prev-rodape{margin-top:22px;padding-top:12px;border-top:1px solid var(--border);color:var(--muted-2);font-size:11px;line-height:1.6}
/* painel de métricas do e-mail */
.mkpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}
.mkpi{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);padding:12px 13px}
.mk-lab{font-size:11.5px;color:var(--muted);font-weight:600}
.mk-val{font-size:22px;font-weight:780;letter-spacing:-.5px;margin-top:4px;line-height:1}
.mk-sub{font-size:10.5px;color:var(--muted-2);margin-top:5px;line-height:1.4}

/* ── Placar do copiloto (Dashboard) ────────────────────────────────────────── */
/* .pxbar é gradiente de accent; aqui a cor É a informação, não decoração */
.pxbar.px-ok{background:var(--green)}
.pxbar.px-mid{background:var(--amber)}
.pxbar.px-no{background:var(--rose)}

.copi-gate{margin-top:14px;padding:11px 13px;background:var(--surface-2);border:1px solid var(--border);
  border-left:3px solid var(--accent);border-radius:var(--radius-sm);font-size:12.5px;line-height:1.6;color:var(--muted)}
.copi-gate b{color:var(--text)}
.copi-gate.ok{border-left-color:var(--green)}
.copi-track{height:6px;background:var(--surface);border:1px solid var(--border);border-radius:99px;overflow:hidden;margin-top:8px}
.copi-track i{display:block;height:100%;background:var(--accent);border-radius:99px;transition:width .4s}
.copi-gate.ok .copi-track i{background:var(--green)}

.copi-aviso{margin-top:12px;padding:9px 12px;border-radius:var(--radius-sm);font-size:12px;line-height:1.55;
  background:var(--amber-soft);color:var(--text)}
.copi-aviso.grave{background:var(--rose-soft)}

/* par sugerido × enviado — reusa a bolha do briefing, só solta a largura.
   pre-wrap + break-word porque o texto é de terceiro: um link colado sem espaço
   estourava o painel. */
.copi-pair{border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px 11px;margin-top:10px}
.copi-pair .cp-head{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:700;color:var(--muted);margin-bottom:7px;flex-wrap:wrap}
.copi-pair .cp-d{margin-left:auto;font-variant-numeric:tabular-nums;color:var(--amber)}
.copi-pair .cp-viol{background:var(--rose-soft);color:var(--rose);border-radius:5px;padding:1px 6px;font-size:10.5px}
.copi-pair .brief-msg{max-width:100%;white-space:pre-wrap;word-break:break-word;margin-top:4px}
.copi-pair .cp-lab{font-size:10px;font-weight:700;color:var(--muted-2);text-transform:uppercase;letter-spacing:.4px;margin-top:7px}

/* Notas fiscais (NFS-e própria). Só admin vê esta tela. */
.nf-form{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin:12px 0 6px}
.nf-form .field{flex:1 1 150px;margin:0}
.nf-form .newlead-btn{height:36px}
.nf-st{display:inline-block;border-radius:999px;padding:3px 9px;font-size:11.5px;font-weight:600;white-space:nowrap}
.nf-ok{background:var(--accent-soft);color:var(--accent-text)}
.nf-pend{background:var(--surface-2);color:var(--muted)}
.nf-canc{background:var(--surface-2);color:var(--muted-2);text-decoration:line-through}
.nf-erro{background:var(--rose-soft);color:var(--rose)}
/* Emitir e cancelar são as ações caras: pintadas para não serem clicadas por engano. */
.chip-btn.nf-emitir{border-color:var(--accent);color:var(--accent-text);background:var(--accent-soft);font-weight:600}
.chip-btn.nf-cancelar{border-color:var(--rose);color:var(--rose)}
.nf-aviso{border:1px dashed var(--rose);background:var(--rose-soft);color:var(--text);border-radius:10px;padding:10px 12px;font-size:12.5px;margin:10px 0}
.nf-lead-form{display:flex;gap:8px;margin:8px 0}
.nf-lead-form input{flex:1;min-width:0}
/* Resumo do painel de vendas. O bloco "sem nota" é destacado de propósito: é o número
   que precisa incomodar até alguém emitir. */
.nf-resumo{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0}
.nf-resumo>div{flex:1 1 130px;border:1px solid var(--border);border-radius:10px;padding:10px 12px;background:var(--surface-2)}
.nf-resumo b{display:block;font-size:16px}
.nf-resumo span{font-size:11.5px;color:var(--muted)}
.nf-resumo .alerta{border-color:var(--rose);background:var(--rose-soft)}
.nf-sem{background:var(--rose-soft);color:var(--rose)}
.nf-lead-form select{flex:1;min-width:0}
/* Linha de formulário que nasce embaixo da venda ao clicar em "Emitir nota". */
.nf-form-row>td{background:var(--surface-2);border-top:0}
.nf-form-row .nf-form{margin:4px 0}
.nf-acoes{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}
.nf-nova{border:1.5px dashed var(--accent);border-radius:12px;padding:12px;margin:8px 0;background:var(--surface-2)}
/* Aviso de possível cadastro repetido. É MARCA, não fusão: juntar por semelhança
   esconderia venda real — três clientes chamados "Gustavo" eram três pessoas. */
.nf-dup{display:inline-block;margin-left:6px;border-radius:999px;padding:1px 7px;font-size:10.5px;font-weight:600;background:var(--rose-soft);color:var(--rose);cursor:help}
/* Links que se parecem com botão na coluna de ações da venda. */
a.chip-btn{display:inline-block;text-decoration:none;line-height:1.5}
/* Selo de origem da nota — eNotas importado vs emitida por aqui. */
.nf-org{display:inline-block;border-radius:999px;padding:1px 6px;font-size:10px;font-weight:600;background:var(--surface-2);color:var(--muted);border:1px solid var(--border)}

/* ── Nova venda: os dois caminhos ─────────────────────────────────────────── */
.nf-abas{display:flex;gap:8px;margin-bottom:10px}
.nf-abas .chip-btn.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.nv-achados{display:flex;flex-direction:column;gap:6px;margin:8px 0}
.nv-achado{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;
  padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:var(--surface-2);
  color:inherit;cursor:pointer;font:inherit}
.nv-achado:hover{border-color:var(--accent)}
.nv-escolhido{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 10px;
  border:1px solid var(--accent);border-radius:8px;background:var(--surface-2);margin:8px 0}
/* A pergunta de duplicado é ÂMBAR, não vermelha: nada deu errado — o sistema parou para
   perguntar antes de emitir, e emitir é o que não tem volta. */
.nv-duvida{border:1px solid var(--amber);border-radius:8px;padding:10px 12px;margin-top:10px;
  background:color-mix(in srgb, var(--amber) 8%, transparent)}
.nv-cand{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;
  padding:8px 0;border-top:1px solid var(--border)}
.nv-cand .sub{display:block}

/* ── Fila de conferência ──────────────────────────────────────────────────── */
.conf-item{border:1px solid var(--border);border-radius:8px;padding:10px 12px;margin-bottom:10px;
  background:var(--surface-2)}
.conf-item p{margin:0 0 8px}
/* Lado a lado de propósito: a pergunta é uma COMPARAÇÃO, e comparar em coluna é mais difícil. */
.conf-par{display:flex;gap:10px;flex-wrap:wrap}
.conf-lado{flex:1 1 220px;display:flex;flex-direction:column;gap:2px;padding:8px 10px;
  border:1px solid var(--border);border-radius:8px;background:var(--surface)}
.conf-acoes{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}

/* ── Selo de matrícula no portal de alunos ─────────────────────────────────── */
.nf-mat{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:999px;
  font-size:11px;font-weight:600;white-space:nowrap;border:1px solid transparent}
.nf-mat.ok{background:color-mix(in srgb, var(--green) 14%, transparent);color:var(--green);border-color:color-mix(in srgb, var(--green) 35%, transparent)}
/* Âmbar, não vermelho: esperar o portal puxar é o funcionamento normal, não uma falha. */
.nf-mat.wait{background:color-mix(in srgb, var(--amber) 14%, transparent);color:var(--amber);border-color:color-mix(in srgb, var(--amber) 35%, transparent)}
.nf-mat.off{background:var(--surface-2);color:var(--muted);border-color:var(--border)}

/* Selo de "nota já enviada ao cliente" */
.nf-env{font-size:11px;color:var(--green);white-space:nowrap}

/* "Quem paga é outra pessoa" — pai/cônjuge pagando a mentoria do aluno */
.nf-outro{flex:1 1 100%;display:flex;align-items:center;gap:7px;font-size:13px;cursor:pointer;
  margin:2px 0 0;padding:6px 0 0;border-top:1px dashed var(--border);color:var(--muted)}
.nf-outro:hover{color:inherit}
.nf-outro input{margin:0}

/* ── Campo de dinheiro ─────────────────────────────────────────────────────
   ⚠️ Era <input type="number">, que lê no formato INGLÊS: "20.000" virava 20 e
   "17.500,00" esvaziava o campo. O eco por extenso existe porque vírgula mal lida
   some no meio de um número, mas "vinte reais" não some. */
.dinheiro{display:flex;align-items:center;gap:0;border:1px solid var(--border);
  border-radius:8px;background:var(--surface);overflow:hidden}
.dinheiro i{font-style:normal;font-size:12px;font-weight:700;color:var(--muted);
  padding:0 8px;background:var(--surface-2);align-self:stretch;display:flex;align-items:center}
.dinheiro input{border:0;background:transparent;outline:none;padding:8px 10px;
  width:100%;font:inherit;font-variant-numeric:tabular-nums;color:inherit}
.dinheiro:focus-within{border-color:var(--accent)}
.dinheiro-eco{display:block;margin-top:4px;font-size:11.5px;color:var(--green);
  min-height:15px;line-height:1.3}
.dinheiro-eco.ruim{color:var(--amber)}

/* Forma de pagamento na linha da venda — é com ela que se concilia o extrato */
.nf-pgto{display:inline-block;margin-top:3px;padding:1px 6px;border-radius:4px;
  font-size:10.5px;font-weight:600;background:var(--surface-2);color:var(--muted);
  border:1px solid var(--border)}

/* ── Pix parcelado ─────────────────────────────────────────────────────────────
   O bloco do plano fica FORA do grid do formulário de propósito: dentro dele a prévia
   do cronograma era espremida numa coluna de 150px e ninguém lia as datas — que é
   justamente o que precisa ser conferido antes de aprovar dez notas fiscais. */
.parc-bloco{border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:10px;
  padding:2px 12px 12px;margin:6px 0 10px;background:var(--surface-2)}
.parc-previa{font-size:12.5px;line-height:1.5}
.parc-previa b{display:block;font-size:14px}
.parc-previa span{display:block;color:var(--muted);font-size:11.5px}
.parc-aviso{color:var(--muted)}
.parc-aviso.ruim{color:var(--rose)}
/* A barra é leitura de relance: "quanto desta venda já entrou". O número exato está do lado. */
.parc-barra{height:6px;border-radius:999px;background:var(--surface);border:1px solid var(--border);
  overflow:hidden;margin:0 0 4px;max-width:160px}
.parc-barra i{display:block;height:100%;background:var(--accent)}
.parc-atrasada>td{background:var(--rose-soft)}
.parc-venc-atraso{color:var(--rose);font-weight:600}
.chip-btn.parc-aba.on{border-color:var(--accent);color:var(--accent-text);background:var(--accent-soft);font-weight:600}
.newlead-btn.parc-receber{font-size:12px;padding:6px 10px}

/* Seletor de comissário na tabela de vendas. Discreto: é uma coluna de leitura que ACEITA
   correção, não um formulário. Largura travada para a coluna não pular ao trocar de nome. */
.nf-comis { max-width: 160px; font: inherit; font-size: .86rem; padding: 2px 4px;
  border: 1px solid transparent; border-radius: 6px; background: transparent; color: inherit; }
.nf-comis:hover, .nf-comis:focus { border-color: currentColor; opacity: .95; }
.nf-comis:disabled { opacity: .5; }

/* ── Canal de aquisição (0037) ─────────────────────────────────────── */
.badge.c-meta_ads{background:var(--blue-soft);color:var(--blue)}
.badge.c-openai_ads{background:var(--accent-soft);color:var(--accent-text)}
.badge.c-google_ads{background:var(--amber-soft);color:var(--amber)}
.badge.c-youtube{background:var(--rose-soft);color:var(--rose)}
.badge.c-instagram{background:var(--orange-soft);color:var(--orange)}
.badge.c-facebook{background:var(--blue-soft);color:var(--blue)}
.badge.c-google_organico{background:var(--green-soft);color:var(--green)}
.badge.c-chatgpt_organico{background:var(--slate-soft);color:var(--slate)}
.badge.c-email,.badge.c-whatsapp{background:var(--green-soft);color:var(--green)}
.badge.c-hotmart,.badge.c-venda{background:var(--slate-soft);color:var(--slate)}
.badge.c-importacao,.badge.c-manual,.badge.c-outro,.badge.c-direto{background:var(--surface-2);color:var(--muted);border:1px solid var(--border)}
.badge.c-pago{box-shadow:inset 0 0 0 1px currentColor}
.canais-wrap{overflow-x:auto}
table.canais{width:100%;border-collapse:collapse;font-size:12.5px}
table.canais th,table.canais td{padding:6px 8px;border-bottom:1px solid var(--border);white-space:nowrap;text-align:left}
table.canais th{color:var(--muted);font-weight:600;font-size:11.5px}
table.canais .num{text-align:right;font-variant-numeric:tabular-nums}
table.canais tr.pago td:first-child{font-weight:700}
table.canais tbody tr:hover{background:var(--surface-2)}
table.canais tfoot td{border-bottom:0;border-top:2px solid var(--border-strong)}