/* ===================================================================
   Dashboard CEO · Alucinando — estilos específicos por vista
   =================================================================== */

/* ---------------- Ojo de Dios: resumen ejecutivo ---------------- */
.resumen{list-style:none;display:flex;flex-direction:column;gap:11px}
.resumen li{display:flex;gap:11px;align-items:flex-start;font-size:12.5px;line-height:1.5;color:var(--ink-2)}
.resumen li b{color:var(--ink);font-weight:700}
.li-ic{width:22px;height:22px;border-radius:7px;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:-1px}
.li-ic.c{background:var(--crit-bg);color:var(--crit)}
.li-ic.a{background:var(--warn-bg);color:var(--warn)}
.li-ic.g{background:var(--ok-bg);color:var(--ok)}
.li-ic.v{background:var(--violet-100);color:var(--violet)}
.resumen-pie{margin-top:15px;padding-top:14px;border-top:1px solid var(--line);
  font-size:12px;color:var(--ink-2);line-height:1.55}
.resumen-pie b{color:var(--ink);font-weight:700}

/* ---------------- salud ---------------- */
.salud-nota{margin-top:13px;padding-top:12px;border-top:1px solid var(--line);
  font-size:11px;color:var(--ink-3);line-height:1.5}

/* ---------------- leads por cliente ---------------- */
.leads-sep{margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.leads-tt{font-size:11.5px;color:var(--ink-3);margin-bottom:14px}
.leads-tt b{color:var(--ink-2);font-weight:700}
.leads-fila{margin-bottom:16px;padding:10px;border-radius:var(--r);cursor:pointer;transition:background .15s}
.leads-fila:hover{background:var(--violet-50)}
.leads-fila:last-of-type{margin-bottom:0}
.leads-lbl{display:flex;align-items:center;gap:9px;font-size:12px;color:var(--ink-2);margin-bottom:9px}
.leads-lbl b{margin-left:auto;color:var(--ok);font-weight:700;font-size:11.5px;white-space:nowrap}
.leads-fila .bars{height:44px}
.leads-nota{font-size:11px;color:var(--ink-3);margin-top:14px;padding-top:12px;
  border-top:1px solid var(--line);line-height:1.55}

/* ---------------- tendencias ---------------- */
.tend-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tend{padding:13px 14px;border-radius:var(--r);background:var(--surface-2);border:1px solid var(--line)}
.tend .tk{font-size:10px;font-weight:700;color:var(--ink-3);letter-spacing:.06em;text-transform:uppercase}
.tend .tv{font-size:19px;font-weight:700;letter-spacing:-.025em;margin:7px 0 5px;color:var(--ink)}
.tend .tp{font-size:11px}

/* ---------------- alertas automáticas ---------------- */
.alerta-row{display:flex;gap:11px;align-items:flex-start;padding:11px 0;border-bottom:1px solid var(--line)}
.alerta-row:last-child{border-bottom:none}
.ar-ic{width:24px;height:24px;border-radius:7px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ar-tx{flex:1;min-width:0}
.ar-tx b{display:block;font-size:12.5px;font-weight:700;color:var(--ink)}
.ar-tx span{display:block;font-size:11.5px;color:var(--ink-3);margin-top:2px;line-height:1.45}

/* ---------------- detalle de cliente ---------------- */
.cli-head{display:flex;align-items:center;gap:16px;margin-bottom:18px;flex-wrap:wrap}
.cli-head .av{width:52px;height:52px;font-size:16px}
.cli-head h2{font-size:21px;font-weight:700;letter-spacing:-.02em}
.cli-head .meta{font-size:12.5px;color:var(--ink-3);margin-top:3px}
.cli-head .acts{margin-left:auto;display:flex;gap:9px}

.origenes{display:flex;flex-direction:column;gap:10px}
.origen{display:flex;align-items:center;gap:12px}
.origen .ol{flex:1;min-width:0;font-size:12.5px;color:var(--ink-2)}
.origen .ob{width:120px;height:7px;border-radius:4px;background:var(--line-2);overflow:hidden;flex-shrink:0}
.origen .ob i{display:block;height:100%;border-radius:4px;background:var(--violet)}
.origen .on{min-width:72px;text-align:right;font-size:12.5px;font-weight:700;color:var(--ink)}

/* ---------------- kanban (comercial y equipo) ---------------- */
.kanban{display:grid;grid-template-columns:repeat(var(--cols,4),minmax(250px,1fr));gap:14px;overflow-x:auto;padding-bottom:6px}
.kcol{background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-lg);padding:14px;min-width:250px}
.kcol-h{display:flex;align-items:center;gap:9px;margin-bottom:13px;font-size:12.5px;font-weight:700}
.kcol-h .kd{width:9px;height:9px;border-radius:50%;flex-shrink:0}
.kcol-h .kn{margin-left:auto;font-size:11px;color:var(--ink-3);font-weight:700}
.kcard{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:13px;
  margin-bottom:10px;box-shadow:var(--sh);cursor:pointer;transition:.15s}
.kcard:hover{box-shadow:var(--sh-md);transform:translateY(-1px)}
.kcard b{display:block;font-size:13px;font-weight:700;color:var(--ink);line-height:1.35}
.kcard .ks{font-size:11.5px;color:var(--ink-3);margin-top:3px}
.kcard .kf{display:flex;align-items:center;gap:8px;margin-top:11px;font-size:11px;color:var(--ink-3)}
.kcard .kf .av{width:22px;height:22px;font-size:9px}
.kcard .kv{margin-left:auto;font-weight:700;color:var(--ink)}
.kadd{width:100%;padding:10px;border-radius:9px;border:1px dashed var(--line-2);color:var(--ink-3);
  font-size:12px;font-weight:600;transition:.15s}
.kadd:hover{border-color:var(--violet);color:var(--violet);background:var(--violet-50)}

/* ---------------- reportes ---------------- */
.meses{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.mes{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px;
  box-shadow:var(--sh);min-height:132px;display:flex;flex-direction:column}
.mes.on{border-color:var(--violet);box-shadow:0 0 0 3px var(--violet-50)}
.mes-h{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.mes-h b{font-size:15px;font-weight:700}
.mes-doc{display:flex;align-items:center;gap:11px;margin-top:auto}
.mes-doc .di{width:32px;height:32px;border-radius:9px;background:var(--violet-50);color:var(--violet);
  display:flex;align-items:center;justify-content:center;flex-shrink:0}
.mes-doc .dt{flex:1;min-width:0}
.mes-doc .dt b{display:block;font-size:12px;font-weight:700}
.mes-doc .dt span{font-size:10.5px;color:var(--ink-3)}
.mes.futuro{opacity:.55}

/* ---------------- Alu.IA ---------------- */
.chat{display:flex;flex-direction:column;height:min(620px,calc(100vh - 260px));min-height:400px}
.chat-log{flex:1;overflow-y:auto;padding:6px 2px 16px;display:flex;flex-direction:column;gap:14px}
.msg-b{display:flex;gap:11px;max-width:82%}
.msg-b.yo{align-self:flex-end;flex-direction:row-reverse}
.msg-b .ma{width:30px;height:30px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.msg-b.alu .ma{background:var(--ink);color:#fff}
.msg-b.yo .ma{background:var(--violet-100);color:var(--violet)}
.msg-b .mt{padding:12px 15px;border-radius:var(--r);font-size:13px;line-height:1.6}
.msg-b.alu .mt{background:var(--surface-2);border:1px solid var(--line);border-top-left-radius:4px}
.msg-b.yo .mt{background:var(--violet);color:#fff;border-top-right-radius:4px}
.msg-b .mt b{font-weight:700}
.msg-b .mt ul{margin:8px 0 0 18px;display:flex;flex-direction:column;gap:5px}
.chat-in{display:flex;gap:10px;padding-top:14px;border-top:1px solid var(--line)}
.chat-in input{flex:1;padding:12px 15px;border-radius:var(--r-sm);background:var(--surface-2);
  border:1px solid var(--line-2);font-size:13px;outline:none}
.chat-in input:focus{border-color:var(--violet);box-shadow:0 0 0 3px var(--violet-50);background:var(--surface)}
.sugerencias{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.sug{padding:8px 13px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line-2);
  font-size:12px;color:var(--ink-2);transition:.15s}
.sug:hover{background:var(--violet-50);border-color:var(--violet-100);color:var(--violet)}

/* ---------------- paginación ---------------- */
.pag{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 20px 0;
  border-top:1px solid var(--line);margin-top:4px;flex-wrap:wrap}
.pag .info{font-size:12px;color:var(--ink-3)}
.pag .nums{display:flex;gap:5px;align-items:center}
.pnum{min-width:33px;height:33px;padding:0 9px;border-radius:9px;border:1px solid var(--line-2);
  background:var(--surface);font-size:12.5px;font-weight:600;color:var(--ink-2);transition:.15s}
.pnum:hover:not(:disabled){background:var(--violet-50);color:var(--violet)}
.pnum.on{background:var(--violet);color:#fff;border-color:var(--violet)}
.pnum:disabled{opacity:.4;cursor:not-allowed}

/* ---------------- construcción pendiente ---------------- */
.pendiente{background:var(--surface);border:1px dashed var(--line-2);border-radius:var(--r-lg);padding:34px 26px;text-align:center}
.pendiente .pi{width:52px;height:52px;border-radius:15px;background:var(--violet-50);color:var(--violet);
  display:flex;align-items:center;justify-content:center;margin:0 auto 16px}
.pendiente h3{font-size:17px;font-weight:700;margin-bottom:9px}
.pendiente p{font-size:13px;color:var(--ink-3);line-height:1.6;max-width:520px;margin:0 auto 8px}
.pendiente .lista{display:inline-flex;flex-direction:column;gap:8px;margin-top:16px;text-align:left}
.pendiente .lista div{display:flex;align-items:center;gap:9px;font-size:12.5px;color:var(--ink-2)}

@media(max-width:1100px){
  .tend-grid{grid-template-columns:1fr 1fr}
  .meses{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .meses{grid-template-columns:1fr}
  .tend-grid{grid-template-columns:1fr}
}