/* CRM Ágile — identidade visual alinhada ao Sistema de Lotes e ao site (azul-marinho + verde da marca). */
:root{
  --navy:#042569;--navy-dark:#031b4d;--navy-2:#0a3a8f;--green:#4ab90d;--green-dark:#3a9309;
  --ink:#0f1b2d;--txt:#0f1b2d;--mut:#5c6b80;--bg:#f4f7fb;--card:#fff;--line:#e6ebf2;
  --ok:#2f9e44;--warn:#d98a00;--bad:#d63a3a;--blue:#2f80ed;
  --wa:#25d366;--ig:#c13584;--fb:#0b84ff;
  --bubble-in:#fff;--bubble-out:#e3edff;
  --r:16px;--r-sm:10px;
  --sh:0 1px 2px rgba(4,37,105,.06),0 8px 24px rgba(4,37,105,.06);
  --sh-lg:0 12px 40px rgba(4,37,105,.18);
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font:15px/1.5 'Segoe UI',system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}
a{color:var(--navy-2)}
h1{font-size:26px;line-height:1.2;margin:0 0 16px;color:var(--navy);letter-spacing:-.3px}
h2{font-size:17px;margin:0 0 10px;color:var(--navy)}
code{background:#eef2f9;border-radius:6px;padding:1px 6px;font-size:12.5px;word-break:break-all}

/* Cabeçalho */
header.top{background:linear-gradient(135deg,var(--navy) 0%,var(--navy-dark) 100%);color:#fff;display:flex;align-items:center;gap:22px;padding:0 20px;height:62px;position:sticky;top:0;z-index:30;box-shadow:0 2px 14px rgba(3,27,77,.35)}
header.top .brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#fff;flex-shrink:0}
header.top .brand img{height:34px;width:auto;display:block}
header.top .brand span{font-size:11px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:#cdd9f3;border-left:1px solid rgba(255,255,255,.3);padding-left:10px}
header.top nav{display:flex;gap:4px;flex:1;overflow-x:auto;scrollbar-width:none}
header.top nav::-webkit-scrollbar{display:none}
header.top nav a{color:#cdd9f3;text-decoration:none;padding:8px 14px;border-radius:999px;white-space:nowrap;font-weight:500;transition:background .15s,color .15s}
header.top nav a:hover{background:rgba(255,255,255,.1);color:#fff}
header.top nav a.on{background:#fff;color:var(--navy);font-weight:600}
header.top .who{display:flex;align-items:center;gap:10px;font-size:13px;color:#cdd9f3;white-space:nowrap}
header.top .who .eu{display:flex;align-items:center;gap:9px}
header.top .who .eu b{display:block;color:#fff;font-size:13px;line-height:1.1}
header.top .who .eu small{font-size:11px;color:#9fb3df}
header.top .who a{color:#fff;text-decoration:none;opacity:.85;font-size:12.5px}
header.top .who a:hover{opacity:1;text-decoration:underline}
.avatar{width:34px;height:34px;border-radius:50%;background:var(--green);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;flex-shrink:0}
main.page{max-width:1280px;margin:0 auto;padding:24px 18px 70px}
main.page>h2{display:flex;align-items:center;gap:10px;margin:30px 0 12px;font-size:18px}
main.page>h2::before{content:"";width:5px;height:20px;border-radius:3px;background:var(--green)}

/* Cartões e KPIs */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px;margin-bottom:18px;box-shadow:var(--sh)}
.grid{display:grid;gap:16px}.g2{grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}.g4{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;box-shadow:var(--sh);position:relative;overflow:hidden}
.kpi::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(var(--green),var(--navy-2))}
.kpi .v{font-size:28px;font-weight:700;color:var(--navy);letter-spacing:-.5px;line-height:1.2;margin:2px 0}
.kpi .l{color:var(--mut);font-size:12px;text-transform:uppercase;letter-spacing:.6px;font-weight:600}
.kpi .d{font-size:12px;margin-top:2px;display:block}
.up{color:var(--ok)}.down{color:var(--bad)}

/* Botões e campos */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--navy);background:var(--navy);color:#fff;border-radius:var(--r-sm);padding:9px 16px;font:inherit;font-weight:600;cursor:pointer;text-decoration:none;transition:transform .12s,box-shadow .12s,background .15s}
.btn:hover{background:var(--navy-2);box-shadow:0 4px 14px rgba(4,37,105,.25);transform:translateY(-1px)}
.btn:active{transform:none}
.btn.sec{background:#fff;color:var(--navy);border-color:#cfd8e6}.btn.sec:hover{background:#f0f4fb;box-shadow:none}
.btn.sm{padding:5px 12px;font-size:13px}
.btn.ok{background:var(--green);border-color:var(--green)}.btn.ok:hover{background:var(--green-dark);box-shadow:0 4px 14px rgba(74,185,13,.35)}
.btn.bad{background:var(--bad);border-color:var(--bad)}
.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
input,select,textarea{font:inherit;border:1px solid #d5dde9;border-radius:var(--r-sm);padding:9px 12px;background:#fff;color:var(--ink);max-width:100%;transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(74,185,13,.18)}
input[type=checkbox]{accent-color:var(--green);width:16px;height:16px}
label{display:block;font-size:12px;color:var(--mut);margin:12px 0 4px;font-weight:600;text-transform:uppercase;letter-spacing:.4px}
label input[type=checkbox]{margin-right:6px;vertical-align:-3px}

/* Tabelas e etiquetas */
table{border-collapse:collapse;width:100%}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);font-size:14px;vertical-align:top}
th{color:var(--mut);font-weight:700;font-size:11.5px;text-transform:uppercase;letter-spacing:.6px;background:#f8fafd}
tbody tr:hover td,table tr:hover td{background:#fafcff}
.tablewrap{overflow-x:auto}
.pill{display:inline-block;border-radius:999px;padding:2px 10px;font-size:12px;font-weight:600;background:#e8eefb;color:var(--navy)}
.pill.ok{background:#e1f5dd;color:#2a7a12}.pill.warn{background:#fff0d0;color:#8a5a00}.pill.bad{background:#fde3e3;color:#a02525}
.canal{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;background:var(--mut)}
.canal.whatsapp{background:var(--wa)}.canal.instagram{background:var(--ig)}.canal.messenger{background:var(--fb)}
.msg-erro{background:#fde3e3;color:#a02525;padding:10px 14px;border-radius:var(--r-sm);margin-bottom:14px;border-left:4px solid var(--bad)}
.msg-ok{background:#e6f6e1;color:#25700f;padding:10px 14px;border-radius:var(--r-sm);margin-bottom:14px;border-left:4px solid var(--green)}
.mut{color:var(--mut)}.sub{color:var(--mut);font-size:13px}.right{text-align:right}.nowrap{white-space:nowrap}
.filtros{display:flex;gap:12px;flex-wrap:wrap;align-items:end;margin-bottom:18px}
.filtros label{margin:0 0 4px}

/* Atendimento */
body.inbox main.page{max-width:none;padding:0}
.ib{display:grid;grid-template-columns:320px minmax(0,1fr) 340px;height:calc(100vh - 62px);background:#fff;overflow:hidden}
.ib>section{background:var(--card);min-height:0;display:flex;flex-direction:column;border-right:1px solid var(--line)}
.ib>section:last-child{border-right:0}
.ib .head{padding:12px;border-bottom:1px solid var(--line);display:flex;gap:8px;align-items:center;background:#fbfcfe}
.ib .head input,.ib .head select{flex:1;min-width:0;padding:8px 11px}
.conv-list{overflow-y:auto;flex:1}
.conv{padding:12px 14px;border-bottom:1px solid var(--line);cursor:pointer;display:flex;gap:11px;align-items:flex-start;transition:background .12s}
.conv:hover{background:#f6f9fe}.conv.on{background:#eaf1ff;box-shadow:inset 3px 0 0 var(--green)}
.conv .tx{min-width:0;flex:1}
.conv .l1{display:flex;justify-content:space-between;gap:8px;font-weight:600;color:var(--ink)}
.conv .l2{color:var(--mut);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.conv .l3{font-size:12px;color:var(--mut);display:flex;gap:6px;align-items:center;margin-top:3px;flex-wrap:wrap}
.av{width:40px;height:40px;border-radius:50%;background:var(--navy);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;flex-shrink:0;position:relative}
.av::after{content:"";position:absolute;right:-1px;bottom:-1px;width:12px;height:12px;border-radius:50%;border:2px solid #fff;background:var(--mut)}
.av.whatsapp::after{background:var(--wa)}.av.instagram::after{background:var(--ig)}.av.messenger::after{background:var(--fb)}
.badge{background:var(--green);color:#fff;border-radius:999px;font-size:11px;font-weight:700;padding:1px 8px}
.chat-head{padding:11px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;background:#fbfcfe}
.chat-head .back{display:none}
.chat-body{flex:1;overflow-y:auto;padding:18px;background:linear-gradient(180deg,#eaf0f9,#e4ebf6);display:flex;flex-direction:column;gap:7px}
.b{max-width:72%;padding:8px 12px;border-radius:16px;white-space:pre-wrap;word-wrap:break-word;box-shadow:0 1px 2px rgba(4,37,105,.1);line-height:1.45}
.b.in{align-self:flex-start;background:var(--bubble-in);border-bottom-left-radius:5px}
.b.out{align-self:flex-end;background:var(--bubble-out);border-bottom-right-radius:5px}
.b small{display:block;color:var(--mut);font-size:11px;margin-top:3px}
.b .auto{font-size:10px;text-transform:uppercase;color:var(--mut);letter-spacing:.5px;font-weight:700}
.b img{max-width:260px;border-radius:10px;display:block;margin-bottom:4px}
.b audio{max-width:250px;display:block}
.b a.doc{display:inline-block;background:rgba(4,37,105,.07);padding:7px 11px;border-radius:9px;text-decoration:none;font-weight:600;margin-bottom:3px}
.b .trans{margin-top:6px;padding:7px 10px;background:rgba(74,185,13,.1);border-left:3px solid var(--green);border-radius:6px;font-size:13.5px;font-style:italic}
.composer{border-top:1px solid var(--line);padding:12px;display:flex;gap:8px;align-items:flex-end;background:#fbfcfe}
.composer textarea{flex:1;resize:none;height:46px}
.janela{background:#fff0d0;color:#8a5a00;padding:7px 14px;font-size:13px;border-bottom:1px solid #f0d99b}
.side{overflow-y:auto;padding:16px;background:#fbfcfe}
.side h3{font-size:11px;text-transform:uppercase;letter-spacing:.7px;color:var(--mut);margin:18px 0 7px;font-weight:700}
.side select,.side input,.side textarea{width:100%}
.evt{font-size:13px;border-left:3px solid var(--green);padding:2px 0 2px 10px;margin-bottom:8px}
.empty{display:flex;align-items:center;justify-content:center;color:var(--mut);flex:1;padding:30px;text-align:center}
.modal-bg{position:fixed;inset:0;background:rgba(3,27,77,.55);backdrop-filter:blur(3px);z-index:50;display:none;align-items:center;justify-content:center;padding:16px}
.modal-bg.on{display:flex}
.modal{background:#fff;border-radius:20px;max-width:520px;width:100%;padding:24px;max-height:92vh;overflow:auto;box-shadow:var(--sh-lg)}
.modal .acts{display:flex;gap:8px;justify-content:flex-end;margin-top:16px;flex-wrap:wrap}
.previa{background:var(--bg);border:1px solid var(--line);border-radius:var(--r-sm);padding:12px;white-space:pre-wrap;font-size:14px}

/* Funil */
.kanban{display:flex;gap:14px;overflow-x:auto;padding-bottom:12px;align-items:flex-start}
.col{background:#e9eef7;border-radius:var(--r);min-width:262px;width:262px;padding:10px;flex-shrink:0;border-top:4px solid var(--navy-2)}
.col[data-etapa=novo]{border-top-color:#8da2c9}.col[data-etapa=aquecendo]{border-top-color:var(--blue)}
.col[data-etapa=com_consultor]{border-top-color:#7c4dff}.col[data-etapa=visita]{border-top-color:var(--warn)}
.col[data-etapa=proposta]{border-top-color:#e8a33d}.col[data-etapa=venda]{border-top-color:var(--green)}.col[data-etapa=perdido]{border-top-color:var(--bad)}
.col h3{margin:4px 6px 10px;font-size:13px;display:flex;justify-content:space-between;color:var(--navy)}
.col.over{outline:2px dashed var(--green);outline-offset:-2px}
.col .cards{min-height:44px}
.kc{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 12px;margin-bottom:9px;cursor:grab;font-size:14px;box-shadow:0 1px 3px rgba(4,37,105,.06);transition:box-shadow .12s,transform .12s}
.kc:hover{box-shadow:0 6px 16px rgba(4,37,105,.14);transform:translateY(-1px)}
.kc .n{font-weight:600}.kc .s{color:var(--mut);font-size:12px}.kc.parado{border-left:4px solid var(--warn)}

/* Relatórios */
.bar{height:22px;background:#e8eefb;border-radius:7px;overflow:hidden;position:relative}
.bar>i{display:block;height:100%;background:linear-gradient(90deg,var(--navy-2),var(--green));border-radius:7px}
.barrow{display:grid;grid-template-columns:160px 1fr 100px;gap:12px;align-items:center;margin:8px 0;font-size:14px}
@media print{header.top,.filtros,.noprint{display:none!important}body{background:#fff}.card,.kpi{break-inside:avoid;box-shadow:none}}

@media(max-width:1000px){
  header.top{gap:10px;padding:0 12px}
  header.top .brand span,header.top .who .eu div{display:none}
  .ib{grid-template-columns:1fr;height:calc(100vh - 62px)}
  .ib>section{display:none}
  .ib[data-view="list"]>.s-list,.ib[data-view="chat"]>.s-chat,.ib[data-view="side"]>.s-side{display:flex}
  .chat-head .back{display:inline-flex}
  .b{max-width:88%}
  .barrow{grid-template-columns:100px 1fr 76px}
  h1{font-size:22px}
}