/* ============================================================
   CRM del Embudo IA (2026-09-18) — bandeja de 3 columnas, ficha del
   contacto, vistas inteligentes, reloj de 24hs, temperatura, respuestas
   rápidas, notas/etiquetas/recordatorios, hitos en el hilo, tablero.
   La lógica vive en /lib/crmEmbudo.js. Usa los mismos tokens de color que
   public/index.html (--panel, --border, --yellow…), en los dos temas.
   ============================================================ */

/* ---------- barra de herramientas ---------- */
#crmToolbar{display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:12px;}
.crm-seg{display:inline-flex; border:1px solid var(--border); border-radius:9px; overflow:hidden; background:var(--panel);}
.crm-seg button{background:none; border:0; color:var(--muted); font:700 12px 'Inter',sans-serif; padding:8px 13px; cursor:pointer;}
.crm-seg button.on{background:var(--yellow); color:#1a1200;}
:root[data-theme="light"] .crm-seg button.on{color:#fff;}
.crm-tool-btn{background:var(--panel); border:1px solid var(--border); color:var(--text); font:600 12px 'Inter',sans-serif; padding:8px 12px; border-radius:9px; cursor:pointer;}
.crm-tool-btn:hover{border-color:var(--yellow);}
#crmOrdenSel{background:var(--panel); border:1px solid var(--border); color:var(--text); font:600 12px 'Inter',sans-serif; padding:8px 10px; border-radius:9px;}
#crmToolbar .crm-spacer{flex:1;}

/* ---------- shell ---------- */
#crmShell{display:grid; grid-template-columns:minmax(290px,350px) minmax(0,1fr); gap:14px; height:clamp(560px, calc(100vh - 170px), 940px);}
#crmShell.ficha-abierta{grid-template-columns:minmax(280px,330px) minmax(0,1fr) 310px;}
#crmShell > *{min-height:0; min-width:0;}
#crmShell.crm-full{position:fixed; inset:0; z-index:95; height:auto; padding:12px; background:var(--bg);}
#crmShell.crm-modo-tablero{display:block; height:auto;}
#crmShell.crm-modo-tablero > .embudo-list-card{display:none;}
#crmShell.crm-modo-tablero.ficha-abierta #crmFicha{position:fixed; top:0; right:0; bottom:0; width:min(340px,92vw); z-index:97; border-radius:0; box-shadow:-18px 0 40px rgba(0,0,0,.45);}

/* columna lista */
#crmShell .embudo-list-card{display:flex; flex-direction:column; padding:12px; overflow:hidden;}
#crmShell .embudo-header-fila{display:none;}
#crmShell .embudo-buscador{margin-bottom:8px; gap:8px;}
#crmShell .embudo-buscador input{min-width:0; width:100%; flex:1 1 100%;}
#crmShell #embudoFiltroEtapas{flex-wrap:nowrap !important; overflow-x:auto; scrollbar-width:none; padding-bottom:2px; width:100%;}
#crmShell #embudoFiltroEtapas::-webkit-scrollbar{display:none;}
#crmShell .embudo-filtro-chip{flex:0 0 auto; white-space:nowrap; padding:5px 9px; font-size:11px;}
#crmShell #embudoGrid{flex:1; overflow-y:auto; margin:0 -6px; padding:0 6px; scrollbar-width:thin;}
#crmVistas{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:10px;}
.crm-vista{display:inline-flex; align-items:center; gap:6px; background:var(--panel-2); border:1px solid var(--border); color:var(--text); font:700 11.5px 'Inter',sans-serif; padding:6px 10px; border-radius:999px; cursor:pointer; white-space:nowrap;}
.crm-vista .n{font-variant-numeric:tabular-nums; background:var(--panel); border-radius:999px; padding:0 6px; font-size:10.5px; color:var(--muted);}
.crm-vista.on{background:var(--yellow); border-color:var(--yellow); color:#1a1200;}
.crm-vista.on .n{background:rgba(0,0,0,.16); color:#1a1200;}
:root[data-theme="light"] .crm-vista.on, :root[data-theme="light"] .crm-vista.on .n{color:#fff;}
.crm-vista.alerta:not(.on) .n{background:var(--red); color:#fff;}
.crm-vista.vacia{opacity:.5;}

/* fila */
.crm-row{display:grid; grid-template-columns:34px minmax(0,1fr) auto; gap:10px; align-items:center; padding:10px 8px; border-bottom:1px solid var(--border); cursor:pointer; border-radius:8px; position:relative;}
.crm-row:hover{background:var(--panel-2);}
.crm-row.sel{background:var(--panel-2); box-shadow:inset 3px 0 0 var(--yellow);}
.crm-row .embudo-avatar{width:34px; height:34px; font-size:12px;}
.crm-row-main{display:flex; flex-direction:column; gap:2px; min-width:0;}
.crm-row-top{display:flex; align-items:center; gap:6px; min-width:0;}
.crm-row-top b{font-size:13px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.crm-row-msg{font-size:12px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.crm-row-msg.espera{color:var(--text); font-weight:600;}
.crm-row-tags{display:flex; gap:4px; flex-wrap:wrap; align-items:center;}
.crm-mini{font-size:10px; font-weight:700; padding:1px 6px; border-radius:5px; border:1px solid var(--border); color:var(--muted); white-space:nowrap;}
.crm-mini.et-listo_para_comprar{color:var(--orange); border-color:currentColor;}
.crm-mini.et-interesado{color:var(--yellow); border-color:currentColor;}
.crm-mini.et-cliente{color:var(--green); border-color:currentColor;}
.crm-mini.tag{background:var(--panel-2);}
.crm-mini.rojo{color:var(--red); border-color:currentColor;}
.crm-mini.azul{color:var(--blue); border-color:currentColor;}
.crm-row-side{display:flex; flex-direction:column; align-items:flex-end; gap:3px;}
.crm-temp{font:800 11px 'Inter',sans-serif; font-variant-numeric:tabular-nums; padding:1px 7px; border-radius:6px; color:#fff; min-width:28px; text-align:center;}
.crm-temp.t-hot{background:#E5322B;} .crm-temp.t-warm{background:#E8650F;} .crm-temp.t-mid{background:#2D7FC4;} .crm-temp.t-cold{background:#6b6b64;}
.crm-clock{font-size:10.5px; font-variant-numeric:tabular-nums; color:var(--muted); white-space:nowrap;}
.crm-clock.warn{color:var(--orange); font-weight:800;}
.crm-clock.off{color:var(--red);}
.crm-row-listo{font-size:10px; font-weight:700; background:none; border:1px solid var(--border); color:var(--green); border-radius:6px; padding:2px 6px; cursor:pointer;}
.crm-lista-mas{display:block; width:100%; margin:10px 0 4px;}
.crm-vacio{color:var(--muted); font-size:12.5px; padding:18px 8px; text-align:center;}

/* columna chat */
#crmChatCol{display:flex; flex-direction:column; min-height:0;}
#crmChatVacio{flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; border:1px dashed var(--border); border-radius:12px; color:var(--muted); font-size:13px; text-align:center; padding:24px;}
#crmChatVacio .big{font-size:34px;}
#crmChatVacio kbd, .crm-ayuda kbd{font:700 10.5px 'Inter',sans-serif; background:var(--panel-2); border:1px solid var(--border); border-bottom-width:2px; border-radius:5px; padding:1px 6px; color:var(--text);}
#crmChatCol #chatViewerPanel{margin-top:0 !important; flex:1; min-height:0; flex-direction:column; animation:none; border:1px solid var(--border); box-shadow:none; padding:14px 16px;}
#crmChatCol #chatViewerPanel > *{flex:0 0 auto;}
#crmChatCol #chatViewerBodyWrap{flex:1 1 auto; min-height:0;}
#crmChatCol #chatViewerBody{max-height:none !important; height:100%; border-radius:10px;}
#crmChatCol #chatViewerBody .asistente-msg{max-width:min(78%, 620px);}
#crmChatExtras{display:flex; align-items:center; gap:6px; flex-wrap:wrap; margin:6px 0 0;}
.crm-pill{display:inline-flex; align-items:center; gap:5px; font:700 11px 'Inter',sans-serif; padding:3px 9px; border-radius:7px; border:1px solid var(--border); color:var(--muted); white-space:nowrap;}
.crm-pill.warn{color:var(--orange); border-color:currentColor;}
.crm-pill.off{color:var(--red); border-color:currentColor;}
.crm-pill.ok{color:var(--green); border-color:currentColor;}
a.crm-pill{text-decoration:none; cursor:pointer;}
#crmBtnVolver{display:none;}

/* respuestas rápidas */
#crmRapidas{display:flex; gap:6px; flex-wrap:wrap; align-items:center; margin-bottom:8px;}
.crm-rapida{background:var(--panel-2); border:1px solid var(--border); color:var(--text); font:600 11.5px 'Inter',sans-serif; padding:5px 10px; border-radius:999px; cursor:pointer; white-space:nowrap;}
.crm-rapida:hover{border-color:var(--yellow);}
.crm-rapida.mark{border-color:rgba(0,230,118,.45); color:var(--green);}
.crm-rapida[disabled]{opacity:.55; cursor:wait;}
#crmSlashMenu{position:absolute; left:0; bottom:100%; margin-bottom:6px; width:min(420px,100%); max-height:240px; overflow-y:auto; background:var(--panel); border:1px solid var(--border); border-radius:10px; box-shadow:0 10px 28px rgba(0,0,0,.35); z-index:6; display:none;}
#crmSlashMenu .it{padding:8px 12px; cursor:pointer; border-bottom:1px solid var(--border); font-size:12.5px;}
#crmSlashMenu .it:last-child{border-bottom:0;}
#crmSlashMenu .it.on, #crmSlashMenu .it:hover{background:var(--panel-2);}
#crmSlashMenu .it b{color:var(--yellow); margin-right:8px;}
#crmSlashMenu .it span{color:var(--muted); display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:11.5px;}
#crmBorradorAviso{display:none; font-size:11.5px; color:var(--green); margin:0 0 6px;}

/* hitos y notas dentro del hilo */
.crm-hito{align-self:center; font-size:10.5px; font-weight:600; color:var(--muted); background:var(--panel); border:1px dashed var(--border); border-radius:999px; padding:3px 11px; margin:6px 0; text-align:center; max-width:90%;}
.crm-hito.venta{color:var(--green); border-color:rgba(0,230,118,.45); border-style:solid;}
.crm-hito.alerta{color:var(--red); border-color:currentColor;}
.crm-nota-hilo{align-self:stretch; background:rgba(255,224,0,.12); border:1px solid rgba(255,224,0,.35); border-left:3px solid var(--yellow); border-radius:8px; padding:7px 10px; margin:6px 0; font-size:12px; line-height:1.45; white-space:pre-wrap;}
.crm-nota-hilo small{display:block; font-size:10px; color:var(--muted); margin-bottom:2px; font-weight:700; letter-spacing:.04em; text-transform:uppercase;}

/* ficha */
#crmFicha{display:none; background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:14px; overflow-y:auto; scrollbar-width:thin; flex-direction:column; gap:16px;}
#crmShell.ficha-abierta #crmFicha{display:flex;}
.crm-f-head{display:flex; align-items:center; gap:10px;}
.crm-f-head .embudo-avatar{width:44px; height:44px; font-size:15px; flex:none;}
.crm-f-head b{font:800 14.5px 'Montserrat',sans-serif; display:block; line-height:1.2; word-break:break-word;}
.crm-f-head a, .crm-f-head small{font-size:11.5px; color:var(--muted);}
.crm-f-head .x{margin-left:auto; background:none; border:0; color:var(--muted); font-size:16px; cursor:pointer; align-self:flex-start;}
.crm-f-sec h4{margin:0 0 7px; font:800 10px 'Inter',sans-serif; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); display:flex; justify-content:space-between; align-items:center;}
.crm-gauge{height:8px; border-radius:999px; background:var(--panel-2); overflow:hidden;}
.crm-gauge i{display:block; height:100%; border-radius:999px; background:linear-gradient(90deg,#2D7FC4,#E8650F 60%,#E5322B);}
.crm-gauge-row{display:flex; align-items:baseline; gap:8px; margin-bottom:6px;}
.crm-gauge-row b{font:900 22px 'Montserrat',sans-serif; font-variant-numeric:tabular-nums;}
.crm-gauge-row span{font-size:11.5px; color:var(--muted);}
.crm-motivos{display:flex; flex-wrap:wrap; gap:4px; margin-top:7px;}
.crm-kv{display:grid; grid-template-columns:auto 1fr; gap:5px 12px; font-size:12.5px; margin:0;}
.crm-kv dt{color:var(--muted);} .crm-kv dd{margin:0; text-align:right; font-weight:600; font-variant-numeric:tabular-nums; word-break:break-word;}
.crm-kv select{background:var(--panel-2); color:var(--text); border:1px solid var(--border); border-radius:6px; padding:3px 6px; font-size:11.5px; max-width:150px;}
.crm-compra{display:flex; justify-content:space-between; gap:8px; font-size:12px; padding:5px 0; border-bottom:1px dashed var(--border);}
.crm-compra:last-child{border-bottom:0;}
.crm-compra span{color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.crm-compra b{font-variant-numeric:tabular-nums; white-space:nowrap;}
.crm-tags{display:flex; flex-wrap:wrap; gap:5px; align-items:center;}
.crm-tag{display:inline-flex; align-items:center; gap:4px; font:600 11.5px 'Inter',sans-serif; background:var(--panel-2); border:1px solid var(--border); border-radius:999px; padding:3px 9px;}
.crm-tag button{background:none; border:0; color:var(--muted); cursor:pointer; padding:0; font-size:12px; line-height:1;}
.crm-input{width:100%; background:var(--panel-2); border:1px solid var(--border); border-radius:8px; padding:7px 9px; color:var(--text); font:500 12.5px 'Inter',sans-serif;}
textarea.crm-input{resize:vertical; min-height:54px;}
.crm-tag-input{width:110px; flex:1 1 90px; padding:4px 8px; border-radius:999px; font-size:11.5px;}
.crm-btn{background:var(--yellow); color:#1a1200; border:0; border-radius:8px; font:800 12px 'Inter',sans-serif; padding:9px 12px; cursor:pointer; text-align:center;}
:root[data-theme="light"] .crm-btn{color:#fff;}
.crm-btn.ghost{background:none; color:var(--text); border:1px solid var(--border);}
.crm-btn.ghost:hover{border-color:var(--yellow);}
.crm-btn.chico{padding:5px 9px; font-size:11px; font-weight:700;}
.crm-acts{display:flex; flex-direction:column; gap:6px;}
.crm-rec-row{display:flex; flex-wrap:wrap; gap:5px; margin-top:6px;}
.crm-rec-activo{background:rgba(61,169,252,.1); border:1px solid rgba(61,169,252,.4); border-radius:8px; padding:8px 10px; font-size:12px; display:flex; gap:8px; align-items:flex-start;}
.crm-rec-activo.vencido{background:rgba(255,59,48,.1); border-color:rgba(255,59,48,.45);}
.crm-nota-item{background:rgba(255,224,0,.1); border-left:3px solid var(--yellow); border-radius:6px; padding:6px 9px; font-size:12px; margin-bottom:6px; white-space:pre-wrap; position:relative;}
.crm-nota-item small{display:block; color:var(--muted); font-size:10px; margin-bottom:2px;}
.crm-nota-item button{position:absolute; top:4px; right:5px; background:none; border:0; color:var(--muted); cursor:pointer; font-size:12px;}

/* tablero */
#crmKanban{display:none; grid-template-columns:repeat(5,minmax(210px,1fr)); gap:10px; overflow-x:auto; padding-bottom:8px; height:clamp(520px, calc(100vh - 190px), 900px);}
#crmShell.crm-modo-tablero ~ #crmKanban, #crmKanban.on{display:grid;}
.crm-kcol{background:var(--panel); border:1px solid var(--border); border-radius:12px; display:flex; flex-direction:column; min-height:0;}
.crm-kcol.drop{border-color:var(--yellow); box-shadow:0 0 0 2px rgba(255,224,0,.25);}
.crm-kcol-h{padding:11px 12px; border-bottom:1px solid var(--border); display:flex; justify-content:space-between; align-items:center; font:800 12px 'Inter',sans-serif;}
.crm-kcol-h .n{color:var(--muted); font-variant-numeric:tabular-nums;}
.crm-kcol-b{flex:1; overflow-y:auto; padding:8px; display:flex; flex-direction:column; gap:7px; scrollbar-width:thin;}
.crm-kcard{background:var(--panel-2); border:1px solid var(--border); border-radius:9px; padding:9px 10px; cursor:grab; display:flex; flex-direction:column; gap:4px;}
.crm-kcard:active{cursor:grabbing;}
.crm-kcard.arrastrando{opacity:.4;}
.crm-kcard .top{display:flex; justify-content:space-between; gap:6px; align-items:center;}
.crm-kcard .top b{font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.crm-kcard .msg{font-size:11.5px; color:var(--muted); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.crm-kcard .bot{display:flex; justify-content:space-between; align-items:center;}
/* en tablero el chat abre como panel lateral */
#crmShell.crm-modo-tablero #crmChatCol{position:fixed; top:0; right:0; bottom:0; width:min(560px,100vw); z-index:96; background:var(--bg); padding:12px; box-shadow:-18px 0 40px rgba(0,0,0,.45); display:none;}
#crmShell.crm-modo-tablero.chat-abierto #crmChatCol{display:flex;}
#crmShell.crm-modo-tablero #crmChatVacio{display:none !important;}

/* modal propio (respuestas rápidas, ayuda) */
.crm-modal{position:fixed; inset:0; z-index:99; background:rgba(0,0,0,.8); display:flex; align-items:center; justify-content:center; padding:16px;}
.crm-modal-box{background:var(--panel); border:1px solid var(--border); border-radius:14px; padding:20px; width:min(620px,100%); max-height:86vh; overflow-y:auto; display:flex; flex-direction:column; gap:12px;}
.crm-modal-box h3{margin:0; font:800 16px 'Montserrat',sans-serif;}
.crm-rr-item{display:grid; grid-template-columns:120px 1fr auto; gap:8px; align-items:start;}
.crm-ayuda{display:grid; grid-template-columns:auto 1fr; gap:8px 14px; font-size:13px; align-items:center;}

/* ---------- ficha como panel lateral (pantallas medianas) ---------- */
@media (max-width:1279px){
  #crmShell.ficha-abierta{grid-template-columns:minmax(280px,340px) minmax(0,1fr);}
  #crmShell.ficha-abierta #crmFicha{position:fixed; top:0; right:0; bottom:0; width:min(340px,92vw); z-index:97; border-radius:0; box-shadow:-18px 0 40px rgba(0,0,0,.45);}
}
/* ---------- celular: una columna por vez ---------- */
@media (max-width:860px){
  #crmShell{display:block; height:auto;}
  #crmShell .embudo-list-card{overflow:visible;}
  #crmShell #embudoGrid{overflow:visible; flex:none;}
  #crmChatVacio{display:none !important;}
  /* el chat abierto se muda a <body> (ver crmMovilAbrir): un ancestro con filter/transform rompe position:fixed */
  #crmChatCol.crm-movil{position:fixed; top:0; left:0; right:0; bottom:0; height:100dvh; z-index:96; background:var(--bg); padding:8px; padding-top:calc(8px + env(safe-area-inset-top,0px)); padding-bottom:calc(8px + env(safe-area-inset-bottom,0px)); overscroll-behavior:contain;}
  #crmChatCol.crm-movil #crmBtnVolver{background:var(--yellow); color:#1a1200; border-color:var(--yellow); font-weight:800; font-style:normal;}
  html.crm-sin-scroll, html.crm-sin-scroll body{overflow:hidden !important;}
  #crmChatCol #chatViewerPanel{padding:10px;}
  #crmChatCol #chatViewerBody .asistente-msg{max-width:88%;}
  #crmBtnVolver{display:inline-flex;}
  #crmBtnFull, #crmSegModo{display:none;}
  #crmKanban{grid-template-columns:repeat(5,78vw);}
  .crm-rr-item{grid-template-columns:1fr;}
}
@media (prefers-reduced-motion:no-preference){
  #crmShell.ficha-abierta #crmFicha{animation:crmFichaIn .18s ease-out;}
  @keyframes crmFichaIn{from{opacity:0; transform:translateX(10px);} to{opacity:1; transform:none;}}
}

/* ---------- encabezado del chat compacto (dentro del CRM) ----------
   Lo que antes eran 4 renglones de texto ("último mensaje…", "Mark
   respondió…", seguimientos, aviso largo de 24 hs) ahora vive en la ficha y
   en las pastillas de #crmChatExtras — acá se ocultan para que el hilo de
   mensajes se quede con el alto. El selector de etapa de #chatViewerBarra
   también se oculta: ya está el de arriba ("Etapa:"), que marca etapaManual. */
#crmChatCol #chatViewerEstado, #crmChatCol #chatViewerEstadoMark,
#crmChatCol #chatViewerSeguimientos, #crmChatCol #chatViewer24hAviso{display:none !important;}
#crmChatCol #chatViewerPanel > div:first-child{margin-bottom:8px !important;}
#crmChatCol #chatViewerBarra{margin-bottom:8px !important; padding:5px 10px !important; gap:8px !important; background:none !important; border:1px solid var(--border);}
#crmChatCol #chatViewerBarra > select, #crmChatCol #chatViewerBarra > select + div{display:none;}
#crmChatCol .chatviewer-resumen-bar{margin-bottom:8px; padding:6px 10px; font-size:11.5px; cursor:pointer;}
#crmChatCol .chatviewer-resumen-bar > div{display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden;}
#crmChatCol .chatviewer-resumen-bar.abierto > div{display:block;}
#crmChatCol .chatviewer-pin-bar{margin-bottom:8px;}
#crmChatCol #chatViewerPanel > div:has(> #chatViewerToolbarNormal){margin-top:8px !important; padding-top:8px !important;}
#crmChatCol #chatViewerInput{min-height:52px;}
@media (max-width:860px){
  #crmChatCol #chatViewerPanel > div:first-child{flex-direction:column; gap:6px !important;}
  #crmChatCol #chatViewerPanel > div:first-child > div:last-child{justify-content:flex-start !important;}
  #crmChatCol #chatViewerTitulo{font-size:12px;}
}

/* ajustes tras la primera prueba en navegador */
.crm-vista{padding:5px 9px;}
.crm-row .crm-clock.off, .crm-kcard .crm-clock.off{color:var(--muted); opacity:.75; font-weight:500;}
.crm-f-sec h4 span{text-transform:none; letter-spacing:0; font-weight:500; font-size:10.5px; text-align:right;}

.crm-num{font:500 9.5px 'Inter',sans-serif; font-variant-numeric:tabular-nums; color:var(--muted); opacity:.8; letter-spacing:.02em; white-space:nowrap; flex:none;}
#crmTotalGlobal{font-size:10px;}

/* celular: salida bien visible + ficha acompañando al chat en <body> */
#crmFicha.crm-movil-ficha{display:flex; position:fixed; top:0; right:0; bottom:0; width:min(340px,92vw); z-index:97; border-radius:0; box-shadow:-18px 0 40px rgba(0,0,0,.5); padding-top:calc(14px + env(safe-area-inset-top,0px));}
@media (max-width:860px){
  #crmChatCol #chatViewerPanel > div:first-child > div:last-child{order:-1; width:100%; align-items:center;}
  #crmChatCol.crm-movil #crmBtnVolver{flex:1 1 auto; padding:11px 16px !important; font-size:14px !important; border-radius:10px; text-align:left; text-transform:none; letter-spacing:0;}
  #crmChatCol.crm-movil #chatViewerPanel > div:first-child .tab-btn.ghost:not(#crmBtnVolver){display:none;} /* "✕ Cerrar" sobra: ya está Volver */
}

/* ---------- panel "Hoy" + bandeja en cero ---------- */
#crmHoy{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)) minmax(180px,1.4fr); gap:8px; margin-bottom:12px;}
.crm-hoy-t{background:var(--panel); border:1px solid var(--border); border-radius:10px; padding:9px 12px; text-align:left; cursor:pointer; display:flex; align-items:baseline; gap:8px; color:var(--text); font-family:'Inter',sans-serif;}
.crm-hoy-t:hover{border-color:var(--yellow);}
.crm-hoy-t b{font:900 20px 'Montserrat',sans-serif; font-variant-numeric:tabular-nums;}
.crm-hoy-t span{font-size:11.5px; color:var(--muted); line-height:1.2;}
.crm-hoy-t.alerta b{color:var(--red);} .crm-hoy-t.aviso b{color:var(--orange);}
.crm-hoy-prog{background:var(--panel); border:1px solid var(--border); border-radius:10px; padding:9px 12px; display:flex; flex-direction:column; justify-content:center; gap:6px; font-size:11.5px; color:var(--muted); font-weight:600;}
button.crm-pill{background:none; cursor:pointer; font-family:'Inter',sans-serif;}
.crm-hecho-btn{color:var(--green) !important; border-color:currentColor !important;}
.crm-hecho-btn:hover{background:rgba(0,230,118,.12);}
@media (max-width:860px){
  #crmHoy{grid-template-columns:repeat(2,minmax(0,1fr));}
  .crm-hoy-prog{grid-column:1 / -1;}
  .crm-hoy-t{flex-direction:column; gap:0; padding:8px 10px;}
}

/* ---------- tercera tanda (crmEmbudo2.js) ---------- */
.crm2-sub{margin:8px 0 0; font:800 10px 'Inter',sans-serif; letter-spacing:.12em; text-transform:uppercase; color:var(--muted);}
.crm2-nota{margin:0; font-size:12px; color:var(--muted); line-height:1.5;}
#crm2Filtros{display:flex; gap:6px; margin-bottom:8px;}
#crm2Filtros select{flex:1; min-width:0; background:var(--panel-2); border:1px solid var(--border); color:var(--text); border-radius:8px; padding:6px 8px; font:600 11.5px 'Inter',sans-serif;}
.crm2-prodlista{max-height:38vh; overflow-y:auto; display:flex; flex-direction:column; gap:4px; scrollbar-width:thin;}
.crm2-prod{display:flex; justify-content:space-between; gap:10px; align-items:center; background:var(--panel-2); border:1px solid var(--border); border-radius:8px; padding:8px 10px; color:var(--text); cursor:pointer; font:500 12.5px 'Inter',sans-serif; text-align:left;}
.crm2-prod:hover{border-color:var(--yellow);} .crm2-prod b{font-variant-numeric:tabular-nums; white-space:nowrap;}
#crm2Clientes{margin-bottom:14px;}
.crm2-cl-top{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin-bottom:10px;}
.crm2-cl-barra{display:flex; gap:8px; margin-bottom:10px;}
.crm2-cl-tabla{background:var(--panel); border:1px solid var(--border); border-radius:12px; overflow:auto; max-height:calc(100vh - 330px);}
.crm2-cl-tabla table{width:100%; border-collapse:collapse; font-size:12.5px;}
.crm2-cl-tabla th{position:sticky; top:0; background:var(--panel-2); text-align:left; padding:9px 12px; font:800 10px 'Inter',sans-serif; letter-spacing:.08em; text-transform:uppercase; color:var(--muted);}
.crm2-cl-tabla td{padding:9px 12px; border-top:1px solid var(--border); font-variant-numeric:tabular-nums;}
.crm2-cl-tabla td small{color:var(--muted); margin-left:6px;}

/* ---------- cuarta tanda (2026-09-19): PDF en respuestas rápidas,
   buscar en mensajes, reporte mensual ---------- */
.crm-rr-adj{display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.crm-rr-adj-nombre{font-size:11.5px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:180px;}
.crm-adj-rapida-chip{display:none; align-items:center; gap:8px; background:rgba(255,224,0,.12); border:1px solid rgba(255,224,0,.35); border-radius:8px; padding:6px 10px; margin:0 0 8px; font-size:12px;}
.crm-adj-rapida-chip span{flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.crm-adj-rapida-chip button{background:none; border:1px solid var(--border); border-radius:6px; color:var(--text); font:700 11px 'Inter',sans-serif; padding:3px 9px; cursor:pointer;}
.crm-adj-rapida-chip button:first-of-type{border-color:var(--yellow); color:var(--yellow);}
.crm-adj-rapida-chip button[disabled]{opacity:.6; cursor:wait;}

/* ===== Color por canal / por línea de WhatsApp (2026-09-19) ===== */
.crm-row.crm-canal, .crm-kcard.crm-canal{ background:color-mix(in srgb, var(--crm-canal) 11%, transparent); box-shadow:inset 3px 0 0 var(--crm-canal); }
.crm-row.crm-canal:hover{ background:color-mix(in srgb, var(--crm-canal) 18%, transparent); }
.crm-row.crm-canal.sel{ background:color-mix(in srgb, var(--crm-canal) 26%, transparent); }
.crm-canal-chip{ display:inline-block; margin-left:6px; padding:1px 6px; border-radius:999px; font-size:9.5px; font-weight:800; letter-spacing:.03em; color:var(--crm-canal); border:1px solid color-mix(in srgb, var(--crm-canal) 55%, transparent); background:color-mix(in srgb, var(--crm-canal) 14%, transparent); vertical-align:middle; white-space:nowrap; }
.crm-canal-chip.largo{ margin:4px 6px 4px 0; font-size:10.5px; padding:2px 9px; }
#chatViewerPanel.crm-canal-panel{ border-top:3px solid var(--crm-canal); background-image:linear-gradient(180deg, color-mix(in srgb, var(--crm-canal) 9%, transparent), transparent 140px); }
#crmLeyendaCanales{ display:flex; flex-wrap:wrap; gap:6px; margin:8px 0 4px; }
.crm-leyenda-btn{ display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:999px; border:1px solid var(--border); background:none; color:var(--muted); font:600 11px 'Inter',sans-serif; cursor:pointer; }
.crm-leyenda-btn i{ width:9px; height:9px; border-radius:50%; background:var(--crm-canal); display:inline-block; }
.crm-leyenda-btn b{ color:var(--text); }
.crm-leyenda-btn.on{ border-color:var(--crm-canal); color:var(--text); background:color-mix(in srgb, var(--crm-canal) 16%, transparent); }