/* LIZA + CRM: burbuja de la web, chats, páginas del panel (LIZA, asistente, bandeja, marcas, ManyChat).
   Todo con prefijo lz- (LIZA) y crm- (bandeja). Colores de marca: butter yellow para LIZA, marrón para Liz. */

/* ── Avatar de LIZA (foto de Liz con marco butter yellow) ─────────────── */
.lz-avatar { position: relative; flex-shrink: 0; display: inline-grid; aspect-ratio: 1 / 1; place-items: center; width: 40px; height: 40px; border-radius: 999px; padding: 2px; background: #3D9BFF; box-shadow: 0 0 0 2px #fff, 0 8px 18px -10px rgba(17, 24, 39,.6); }
.lz-avatar img { width: 100%; height: auto; aspect-ratio: 1 / 1; max-height: 100%; border-radius: 999px; object-fit: cover; object-position: 50% 22%; display: block; }
.lz-avatar.sm { width: 30px; height: 30px; padding: 2px; box-shadow: 0 0 0 1.5px #fff; }
.lz-avatar.md { width: 42px; height: 42px; }
.lz-avatar.lg { width: 58px; height: 58px; padding: 3px; }
.lz-avatar.xl { width: 72px; height: 72px; padding: 3px; }
@media (min-width: 768px) { .lz-avatar.xl { width: 84px; height: 84px; } }
.lz-punto { display: inline-block; width: 8px; height: 8px; border-radius: 999px; background: #34C759; box-shadow: 0 0 0 3px color-mix(in srgb, #34C759 22%, transparent); }

/* ── Burbujas de chat ─────────────────────────────────────────────────── */
.lz-msj { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; max-width: 86%; }
.lz-msj + .lz-msj { margin-top: 6px; }
.lz-msj.liza, .lz-msj.liz { align-self: flex-end; align-items: flex-end; margin-left: auto; }
.lz-msj.liza.izq { align-self: flex-start; align-items: flex-end; flex-direction: row; gap: 8px; margin-left: 0; max-width: 92%; }
.lz-globo { padding: 10px 14px; border-radius: 20px; font-size: 14.5px; line-height: 1.45; white-space: normal; overflow-wrap: anywhere; background: var(--widget-2); color: var(--texto); border-bottom-left-radius: 6px; }
.lz-globo a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.lz-msj.liza .lz-globo { background: #3D9BFF; color: #1D1D1F; border-radius: 20px; border-bottom-right-radius: 6px; }
.lz-msj.liza.izq .lz-globo { border-radius: 20px; border-bottom-left-radius: 6px; background: var(--widget-2); color: var(--texto); }
.lz-msj.liz .lz-globo { background: #1D1D1F; color: #FFFFFF; border-radius: 20px; border-bottom-right-radius: 6px; }
:root[data-theme="dark"] .lz-msj.liz .lz-globo { background: #3D9BFF; }
.lz-meta { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--texto-3); padding: 0 4px; }
.lz-chip-liza, .lz-chip-liz { display: inline-flex; align-items: center; gap: 3px; padding: 1px 7px; border-radius: 999px; font-weight: 700; font-size: 11px; letter-spacing: .02em; }
.lz-chip-liza { background: #3D9BFF; color: #6B4A12; }
.lz-chip-liza svg { width: 11px; height: 11px; }
.lz-chip-liz { background: #1D1D1F; color: #FFFFFF; }
.lz-escribiendo .lz-globo { display: inline-flex; gap: 4px; padding: 14px 16px; }
.lz-escribiendo .lz-globo i { width: 7px; height: 7px; border-radius: 999px; background: #1473FF; opacity: .35; animation: lz-punto 1s infinite ease-in-out; }
.lz-escribiendo .lz-globo i:nth-child(2) { animation-delay: .15s; }
.lz-escribiendo .lz-globo i:nth-child(3) { animation-delay: .3s; }
@keyframes lz-punto { 0%, 80%, 100% { opacity: .3; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-3px); } }

.lz-chat-msjs { display: flex; flex-direction: column; overflow-y: auto; overscroll-behavior: contain; padding: 14px 2px; scroll-behavior: smooth; }
.lz-rapidas { display: flex; gap: 6px; overflow-x: auto; padding: 8px 0; scrollbar-width: none; }
.lz-rapidas::-webkit-scrollbar { display: none; }
.lz-rapidas .chip { flex-shrink: 0; cursor: pointer; border: 0; font-family: inherit; }
.lz-rapidas .chip:hover { background: var(--acento-suave); }
.lz-caja { display: flex; gap: 8px; align-items: center; }
.lz-caja .entrada { flex: 1; min-width: 0; min-height: 46px; border-radius: 999px; }
.lz-enviar { flex-shrink: 0; width: 46px; height: 46px; border-radius: 999px; border: 0; cursor: pointer; display: grid; place-items: center; color: #fff; background: var(--degradado-boton); }
.lz-enviar svg { width: 18px; height: 18px; }
.lz-enviar:active { transform: scale(.94); }

/* ── Burbuja de LIZA en la web ────────────────────────────────────────── */
#lz-web { position: fixed; right: calc(16px + env(safe-area-inset-right)); bottom: calc(18px + env(safe-area-inset-bottom)); z-index: 50; font-family: var(--letra); }
body.con-barra-compra #lz-web { bottom: calc(96px + env(safe-area-inset-bottom)); }
@media (min-width: 768px) { #lz-web { right: 24px; bottom: calc(24px + env(safe-area-inset-bottom)); } body.con-barra-compra #lz-web { bottom: calc(24px + env(safe-area-inset-bottom)); } }
.lz-lanzador { display: flex; align-items: center; gap: 0; padding: 0; border: 0; background: none; cursor: pointer; line-height: 1; }
.lz-lanzador[hidden] { display: none; }
.lz-lanzador .lz-avatar { width: 60px; height: 60px; padding: 3px; box-shadow: 0 0 0 3px #fff, 0 18px 36px -14px rgba(17, 24, 39,.75); animation: lz-flota 3.6s ease-in-out infinite; }
.lz-lanzador .lz-avatar::after { content: ""; position: absolute; right: 3px; bottom: 3px; width: 13px; height: 13px; border-radius: 999px; background: #34C759; box-shadow: 0 0 0 2.5px #fff; }
.lz-lanzador-txt { order: -1; margin-right: 10px; padding: 9px 14px; border-radius: 999px; font-size: 13.5px; font-weight: 600; color: #1D1D1F; background: #fff; box-shadow: 0 0 0 1px rgba(17, 24, 39,.08), 0 12px 26px -14px rgba(17, 24, 39,.55); white-space: nowrap; }
@media (max-width: 420px) { .lz-lanzador-txt { display: none; } }
@keyframes lz-flota { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
.lz-ventana { position: fixed; left: 8px; right: 8px; bottom: calc(8px + env(safe-area-inset-bottom)); height: min(680px, calc(100dvh - var(--alto-cinta) - 16px - env(safe-area-inset-bottom))); display: flex; flex-direction: column; border-radius: 26px; overflow: hidden; background: #FFFFFF; color: #1D1D1F; box-shadow: 0 0 0 1px rgba(17, 24, 39,.08), 0 40px 80px -30px rgba(0, 0, 0,.6); animation: sube .3s var(--curva) both; }
.lz-ventana[hidden] { display: none; }
@media (min-width: 768px) { .lz-ventana { left: auto; right: 22px; bottom: 22px; width: 390px; height: min(620px, calc(100vh - 90px)); } }
.lz-ventana-cab { display: flex; align-items: center; gap: 12px; padding: 14px 14px 14px 16px; background: linear-gradient(180deg, #3D9BFF 0%, #F8EDC4 100%); }
.lz-cab-txt { flex: 1; min-width: 0; display: grid; }
.lz-cab-txt b { font-size: 15px; line-height: 1.2; }
.lz-cab-txt span { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: #3C3C43; margin-top: 2px; }
.lz-ventana-cab .redondo { background: rgba(255,255,255,.7); }
.lz-ventana-msjs { flex: 1; display: flex; flex-direction: column; overflow-y: auto; overscroll-behavior: contain; padding: 16px 14px 8px; background: #fff; }
.lz-ventana .lz-globo { background: #F5F5F7; color: #1D1D1F; }
.lz-ventana .lz-msj.liza .lz-globo { background: #3D9BFF; }
.lz-ventana .lz-rapidas { padding: 8px 12px; background: #fff; }
.lz-ventana .lz-rapidas .chip { background: #FFFFFF; color: #1D1D1F; }
.lz-ventana .lz-caja { padding: 10px 12px 12px; background: #fff; border-top: 1px solid rgba(17, 24, 39,.08); }
.lz-ventana .entrada { background: #FFFFFF; color: #1D1D1F; }

/* ── Panel: piezas comunes ────────────────────────────────────────────── */
.lz-sub { font-weight: 700; font-size: 15px; padding: 14px 0 6px; }
.lz-peq { font-size: 13px; }
.lz-fila-tit { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.lz-cabecera-liza { display: flex; align-items: center; gap: 16px; }
.lz-cabecera-liza > div:last-child { flex: 1; min-width: 0; }
.lz-cabecera-liza .admin-titulo { margin-bottom: 18px; }
.lz-estado { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; font-weight: 600; color: var(--texto-2); }
.lz-estado:not(.on) .lz-punto { background: var(--texto-3); box-shadow: none; }
.lz-pestanas { margin-bottom: 18px; }
.lz-cuerpo { min-width: 0; }
.lz-seg-mini button { min-height: 30px; padding: 0 11px; font-size: 12px; }
.lz-grupo-t { margin: 18px 0 8px; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--texto-3); }
.lz-campos { gap: 10px; }
.lz-campos .campo { min-width: 0; }
.lz-faq { gap: 10px; }
.lz-faq-item { position: relative; }
.lz-quitar { display: inline-flex; align-items: center; gap: 5px; margin-top: 8px; font-size: 13px; background: none; border: 0; cursor: pointer; color: var(--texto-2); }
.lz-quitar svg { width: 14px; height: 14px; }
.lz-subir { cursor: pointer; }
.lz-fuentes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
@media (min-width: 640px) { .lz-fuentes { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .lz-fuentes { grid-template-columns: repeat(7, minmax(0, 1fr)); } }
.lz-fuente { position: relative; aspect-ratio: 9 / 14; border-radius: 14px; overflow: hidden; border: 0; padding: 0; cursor: pointer; background: var(--widget-2); box-shadow: 0 0 0 1px var(--linea); color: var(--texto); text-decoration: none; }
.lz-fuente img { width: 100%; height: 100%; object-fit: cover; object-position: top; display: block; }
.lz-fuente > span { position: absolute; top: 6px; right: 6px; width: 20px; height: 20px; border-radius: 999px; display: grid; place-items: center; color: #fff; background: #34C759; box-shadow: 0 0 0 2px #fff; }
.lz-fuente > span svg { width: 12px; height: 12px; }
.lz-fuente.doc, .lz-fuente.extra { display: grid; place-items: center; text-align: center; padding: 10px; background: var(--acento-suave); }
.lz-fuente.doc > div, .lz-fuente.extra > div { display: grid; justify-items: center; gap: 8px; font-size: 12px; line-height: 1.3; }
.lz-fuente.doc svg, .lz-fuente.extra > div svg { width: 26px; height: 26px; color: var(--acento); }
.lz-fuente.extra b { overflow-wrap: anywhere; }
.lz-candado { color: var(--texto-3); }
.lz-candado svg { width: 16px; height: 16px; }
.lz-chips { gap: 8px; }
.lz-vetado { gap: 6px; text-transform: capitalize; }
.lz-vetado button { border: 0; background: none; cursor: pointer; display: grid; place-items: center; padding: 0; color: var(--texto-3); }
.lz-vetado button svg { width: 13px; height: 13px; }
.lz-caja-plana .entrada { border-radius: 14px; }
.lz-cifra { font-family: var(--letra); font-weight: 800; font-size: 44px; letter-spacing: -0.03em; line-height: 1; }
.lz-cifra span { font-size: 14px; font-weight: 500; letter-spacing: 0; color: var(--texto-2); margin-left: 8px; }
.lz-voz { gap: 0; display: flex; flex-direction: column; }
.lz-voz .lz-msj { max-width: 100%; }
.lz-tachado { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 14px; background: var(--widget-2); color: var(--texto-2); font-size: 14px; }
.lz-tachado span { text-decoration: line-through; text-decoration-color: color-mix(in srgb, var(--urgente) 60%, transparent); }
.lz-tachado svg { width: 16px; height: 16px; color: var(--urgente); flex-shrink: 0; }
.lz-no { gap: 8px; }

/* 22-oct: estado real del bot */
.lz-mal { color: var(--urgente); font-weight: 600; }
.lz-error { display: block; margin-top: 6px; padding: 8px 10px; border-radius: 10px; background: var(--widget-2); font-size: 12px; line-height: 1.45; overflow-wrap: anywhere; white-space: pre-wrap; }
.lz-contexto summary { cursor: pointer; list-style: none; }
.lz-contexto summary::-webkit-details-marker { display: none; }
.lz-contexto pre { margin: 14px 0 0; font-family: inherit; font-size: 13px; line-height: 1.55; white-space: pre-wrap; overflow-wrap: anywhere; color: var(--texto-2); }

/* Probar a LIZA */
.lz-probar { display: flex; flex-direction: column; }
.lz-seg-canales { display: flex; overflow-x: auto; scrollbar-width: none; max-width: 100%; }
.lz-seg-canales::-webkit-scrollbar { display: none; }
.lz-seg-canales button { display: inline-flex; align-items: center; gap: 6px; }
.lz-seg-canales button svg { width: 15px; height: 15px; }
@media (max-width: 520px) { .lz-seg-canales button span { display: none; } .lz-seg-canales button { padding: 0 14px; } }
.lz-probar .lz-chat-msjs { min-height: 320px; max-height: 56vh; }
.lz-probar .vacio { margin: auto; }
.lz-analisis { align-self: flex-end; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 5px; margin: 6px 0 10px; max-width: 92%; }
.lz-analisis .insignia { font-size: 11px; }
.lz-limpiar { align-self: center; display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; font-size: 13px; background: none; border: 0; cursor: pointer; color: var(--texto-2); }
.lz-limpiar svg { width: 14px; height: 14px; }

/* Pregúntale a LIZA */
.lz-asist { display: flex; flex-direction: column; }
.lz-asist-msjs { min-height: 360px; height: calc(100dvh - 400px); max-height: 640px; }
.lz-asist-vacio { margin: auto; display: grid; justify-items: center; gap: 14px; text-align: center; padding: 20px; }
.lz-asist-hola { font-family: var(--letra-display); font-size: 26px; font-weight: 600; line-height: 1.2; max-width: 16ch; }
@media (min-width: 768px) { .lz-asist-hola { font-size: 32px; } }
.lz-asist .lz-msj.liza.izq .lz-globo { font-size: 15px; }
.lz-asist .lz-msj.liza.izq .lz-globo b { font-size: 1.15em; }

/* ── Bandeja ──────────────────────────────────────────────────────────── */
.crm { display: grid; gap: var(--hueco); grid-template-columns: minmax(0, 1fr); }
.crm .crm-chat, .crm .crm-ficha { display: none; }
.crm.con-chat .crm-lista { display: none; }
.crm.con-chat .crm-chat { display: flex; }
@media (max-width: 1023px) { .crm-tit.con-chat { display: none; } }
@media (min-width: 1024px) {
  .crm { grid-template-columns: 320px minmax(0, 1fr); height: calc(100vh - var(--alto-cinta) - 60px - 160px); min-height: 560px; }
  .crm .crm-lista, .crm.con-chat .crm-lista { display: flex; }
  .crm .crm-chat { display: flex; }
  .crm-solo-movil { display: none !important; }
}
@media (min-width: 1360px) { .crm { grid-template-columns: 320px minmax(0, 1fr) 280px; } .crm .crm-ficha { display: block; } .crm-btn-ficha { display: none !important; } }

.crm-lista { display: flex; flex-direction: column; min-width: 0; min-height: 0; border-radius: var(--radio-widget); background: var(--widget); box-shadow: 0 0 0 1px var(--linea); overflow: hidden; }
.crm-filtros { display: grid; gap: 10px; padding: 12px 12px 10px; box-shadow: inset 0 -1px 0 var(--linea); }
.crm-filtros .buscador > span { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); display: grid; color: var(--texto-3); }
.crm-filtros .buscador > span svg { position: static; transform: none; width: 17px; height: 17px; }
.crm-canales, .crm-estados, .crm-etqs { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.crm-canales::-webkit-scrollbar, .crm-estados::-webkit-scrollbar, .crm-etqs::-webkit-scrollbar { display: none; }
.crm-canales button { flex-shrink: 0; display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px 4px 4px; border-radius: 999px; border: 0; cursor: pointer; background: var(--widget-2); color: var(--texto-2); font-size: 12.5px; font-weight: 600; }
.crm-canales button .icono { border-radius: 999px; }
.crm-canales button.activo { background: var(--vino); color: #fff; }
.crm-estados button, .crm-etqs button { flex-shrink: 0; padding: 6px 11px; border-radius: 999px; border: 0; cursor: pointer; background: none; color: var(--texto-2); font-size: 12.5px; font-weight: 600; box-shadow: inset 0 0 0 1px var(--linea); white-space: nowrap; }
.crm-estados button b { font-weight: 700; color: var(--texto-3); margin-left: 2px; }
.crm-estados button.activo { background: var(--acento-suave); color: var(--texto); box-shadow: inset 0 0 0 1.5px #1473FF; }
.crm-estados button.alerta b { color: var(--urgente); }
.crm-etqs button { font-size: 12px; padding: 4px 10px; }
.crm-etqs button.activo { background: #3D9BFF; color: #1D1D1F; box-shadow: none; }
.crm-lista-items { flex: 1; overflow-y: auto; overscroll-behavior: contain; padding: 4px 6px 8px; }
.crm-item { display: flex; gap: 12px; padding: 11px 8px; border-radius: 16px; color: inherit; text-decoration: none; }
.crm-item + .crm-item { margin-top: 2px; }
.crm-item:hover { background: var(--widget-2); }
.crm-item.activo { background: color-mix(in srgb, #3D9BFF 45%, var(--widget)); }
.crm-item .cuerpo { flex: 1; min-width: 0; }
.crm-item-1 { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.crm-item-1 b { font-size: 14.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-item-1 span { flex-shrink: 0; font-size: 11.5px; color: var(--texto-3); }
.crm-item.sin-leer .crm-item-1 b { font-weight: 800; }
.crm-item-2 { margin-top: 2px; font-size: 13px; color: var(--texto-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-item.sin-leer .crm-item-2 { color: var(--texto); font-weight: 500; }
.crm-item-3 { display: flex; gap: 5px; align-items: center; flex-wrap: wrap; margin-top: 6px; }
.crm-item-3:empty { display: none; }
.crm-et { font-size: 11px; font-weight: 600; padding: 2px 7px; border-radius: 999px; background: var(--widget-2); color: var(--texto-2); }
.crm-punto-liz { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; padding: 2px 8px 2px 6px; border-radius: 999px; color: var(--urgente); background: color-mix(in srgb, var(--urgente) 11%, transparent); }
.crm-punto-liz::before { content: ""; width: 6px; height: 6px; border-radius: 999px; background: var(--urgente); }
.crm-venta { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 999px; color: var(--ok); background: color-mix(in srgb, var(--ok) 12%, transparent); }
.crm-venta svg { width: 11px; height: 11px; }
.crm-nl { margin-left: auto; min-width: 19px; height: 19px; padding: 0 6px; border-radius: 999px; display: grid; place-items: center; font-size: 11px; font-weight: 700; color: #fff; background: var(--vino); }
.crm-av { position: relative; flex-shrink: 0; width: 44px; height: 44px; }
.crm-av .avatar { width: 44px; height: 44px; font-size: 14px; }
.crm-av.chico, .crm-av.chico .avatar { width: 38px; height: 38px; font-size: 13px; }
.crm-av.grande, .crm-av.grande .avatar { width: 68px; height: 68px; font-size: 22px; }
.crm-mini { position: absolute; right: -3px; bottom: -3px; width: 20px; height: 20px; border-radius: 999px; display: grid; place-items: center; color: #fff; box-shadow: 0 0 0 2px var(--widget); }
.crm-mini svg { width: 11px; height: 11px; }
.crm-mini.tono-amarillo { color: #1D1D1F; }
.crm-av.grande .crm-mini { width: 26px; height: 26px; }
.crm-av.grande .crm-mini svg { width: 14px; height: 14px; }

.crm-chat { flex-direction: column; min-width: 0; min-height: 0; border-radius: var(--radio-widget); background: var(--widget); box-shadow: 0 0 0 1px var(--linea); overflow: hidden; height: calc(100dvh - var(--alto-cinta) - 60px - 52px - 40px); min-height: 460px; }
@media (min-width: 1024px) { .crm-chat { height: auto; min-height: 0; } }
.crm-chat.vacia { align-items: center; justify-content: center; }
.crm-chat-cab { display: flex; align-items: center; gap: 10px; padding: 10px 12px; box-shadow: inset 0 -1px 0 var(--linea); }
.crm-cab-txt { flex: 1; min-width: 0; display: grid; }
.crm-cab-txt b { font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-cab-txt span { font-size: 12px; color: var(--texto-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-cab-acc { display: flex; gap: 6px; align-items: center; flex-shrink: 0; }
.crm-cab-acc .btn-sec.chico { min-height: 38px; padding: 0 12px; }
@media (max-width: 767px) { .crm-cab-acc .btn-sec.chico { width: 38px; padding: 0; } }
.crm-msjs { flex: 1; padding: 14px 14px 10px; background: color-mix(in srgb, var(--suelo) 60%, var(--widget)); }
.crm-origen { align-self: center; display: inline-flex; align-items: center; gap: 6px; margin: 0 auto 12px; max-width: 92%; padding: 5px 12px; border-radius: 999px; font-size: 11.5px; color: var(--texto-2); background: var(--widget); box-shadow: 0 0 0 1px var(--linea); text-align: center; }
.crm-origen svg { width: 13px; height: 13px; flex-shrink: 0; }
.crm-aviso-liz { align-self: center; display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; padding: 8px 14px; border-radius: 14px; font-size: 12.5px; color: var(--urgente); background: color-mix(in srgb, var(--urgente) 9%, var(--widget)); max-width: 92%; }
.crm-aviso-liz svg { width: 15px; height: 15px; flex-shrink: 0; }
.crm-caja { padding: 10px 12px 12px; box-shadow: inset 0 1px 0 var(--linea); display: grid; gap: 8px; }
.crm-caja textarea.entrada { min-height: 56px; max-height: 180px; border-radius: 16px; font-size: 14.5px; }
.crm-caja-bot { display: flex; justify-content: space-between; gap: 8px; }
.crm-correo-bor { align-self: stretch; display: grid; gap: 10px; margin-top: 14px; padding: 12px 14px; border-radius: 16px; background: color-mix(in srgb, #3D9BFF 35%, var(--widget)); box-shadow: 0 0 0 1px var(--linea); }
.crm-correo-bor-t { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 12.5px; color: #6B4A12; }
.crm-correo-bor-t svg { width: 14px; height: 14px; }
.crm-correo-bor-t span { flex-basis: 100%; color: var(--texto-2); font-size: 12px; }
.crm-correo-bor .lz-globo { max-width: 100%; background: var(--widget); }
.crm-aviso-liz.crm-correo-ok { color: var(--texto-2); background: var(--widget); box-shadow: 0 0 0 1px var(--linea); }
.crm-caja-dm { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; font-size: 13px; color: var(--texto-2); }
.crm-caja-dm > svg { width: 16px; height: 16px; flex-shrink: 0; }
.crm-caja-dm > span { flex: 1 1 220px; }
.crm-borrador { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: #6B4A12; }
.crm-borrador svg { width: 13px; height: 13px; }

.crm-ficha { min-width: 0; overflow-y: auto; border-radius: var(--radio-widget); background: var(--widget); box-shadow: 0 0 0 1px var(--linea); padding: 20px 16px; }
.crm-ficha.en-hoja { display: block; box-shadow: none; padding: 0; background: none; }
.crm-ficha-cab { display: grid; justify-items: center; gap: 4px; text-align: center; margin-bottom: 16px; }
.crm-ficha-cab .crm-av { margin-bottom: 6px; }
.crm-ficha-cab b { font-size: 16px; }
.crm-ficha-cab span { font-size: 13px; color: var(--texto-2); overflow-wrap: anywhere; }
.crm-ficha-dl { display: grid; gap: 10px; }
.crm-ficha-dl div { display: grid; gap: 2px; }
.crm-ficha-dl span, .crm-ficha-t { font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--texto-3); }
.crm-ficha-dl b { font-size: 13.5px; font-weight: 500; overflow-wrap: anywhere; }
.crm-ficha-t { margin: 16px 0 8px; }
.crm-etqs.ficha { flex-wrap: wrap; overflow: visible; }
.crm-compra { display: flex; justify-content: space-between; gap: 8px; font-size: 13.5px; padding: 8px 10px; border-radius: 12px; background: var(--widget-2); }
.crm-compra.total { background: none; font-weight: 700; padding-top: 2px; }
.crm-liza-vendio { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding: 10px 12px; border-radius: 14px; font-size: 13px; font-weight: 600; color: #6B4A12; background: color-mix(in srgb, #3D9BFF 60%, transparent); }
.crm-liza-vendio svg { width: 15px; height: 15px; }

/* 23-oct: ✦ Redactar en la caja y el asistente a la derecha (crm.js · lib/redactar.js) */
.crm-caja-btns { display: flex; gap: 8px; align-items: center; margin-left: auto; }
.crm-caja-bot > span:empty { display: none; }
.crm-btn-redactar svg { width: 15px; height: 15px; color: #B8860B; }
.crm-redactar { display: flex; gap: 8px; }
.crm-redactar[hidden] { display: none; }
.crm-redactar .entrada { flex: 1; min-width: 0; min-height: 40px; border-radius: 14px; font-size: 14px; }
.crm-caja.escribiendo textarea.entrada { opacity: .55; }
.crm-lado-ficha { flex: 1; overflow-y: auto; padding: 20px 16px; }
.crm-lado-tabs { display: flex; align-items: center; gap: 4px; padding: 10px 10px 8px; box-shadow: inset 0 -1px 0 var(--linea); }
.crm-lado-tabs [role="tab"] { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 0 12px; border: 0; border-radius: 999px; background: none; color: var(--texto-2); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.crm-lado-tabs [role="tab"] svg { width: 14px; height: 14px; }
.crm-lado-tabs [aria-selected="true"] { background: var(--widget-2); color: var(--texto); box-shadow: inset 0 0 0 1px var(--linea); }
.crm-lado-tabs .crm-asis-borrar { margin-left: auto; width: 34px; height: 34px; }
.crm-asis { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.crm-asis-msjs { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: 12px; padding: 14px 14px 10px; }
.crm-asis-msjs .lz-msj { max-width: 92%; }
.crm-asis-msjs .lz-msj + .lz-msj { margin-top: 0; }
.crm-asis-msjs .lz-msj.liz .lz-globo { font-size: 13.5px; padding: 8px 12px; }
.crm-asis-m { display: grid; gap: 8px; }
.crm-asis-t { font-size: 13.5px; line-height: 1.5; color: var(--texto); overflow-wrap: anywhere; }
.crm-asis-t.error { color: var(--urgente); }
.crm-asis-bor { display: grid; gap: 0; border-radius: 16px; overflow: hidden; background: var(--widget); box-shadow: 0 0 0 1px color-mix(in srgb, #1473FF 70%, var(--linea)); }
.crm-asis-bor-t { padding: 12px 14px; font-size: 13.5px; line-height: 1.5; overflow-wrap: anywhere; background: color-mix(in srgb, #3D9BFF 22%, var(--widget)); }
.crm-asis-bor-b { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 8px; box-shadow: inset 0 1px 0 var(--linea); }
.crm-asis-bor-b > :only-child { grid-column: 1 / -1; }
.crm-asis-bor-b .btn, .crm-asis-bor-b .btn-sec { width: 100%; justify-content: center; }
.crm-asis-ok, .crm-asis-prop b { display: inline-flex; align-items: center; justify-content: center; gap: 6px; font-size: 13px; font-weight: 600; color: var(--ok); }
.crm-asis-ok svg, .crm-asis-prop b svg, .crm-asis-hecho svg { width: 14px; height: 14px; flex-shrink: 0; }
.crm-asis-hecho { display: flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 12px; font-size: 12.5px; font-weight: 600; color: var(--ok); background: color-mix(in srgb, var(--ok) 9%, var(--widget)); }
.crm-asis-hecho.mal { color: var(--urgente); background: color-mix(in srgb, var(--urgente) 9%, var(--widget)); }
.crm-asis-hecho span { flex: 1; min-width: 0; }
.crm-asis-hecho .enlace { font-size: 12.5px; }
.crm-asis-prop { display: flex; align-items: center; gap: 10px; padding: 10px 10px 10px 14px; border-radius: 14px; font-size: 13px; font-weight: 600; background: var(--widget-2); }
.crm-asis-prop span { flex: 1; min-width: 0; }
.crm-asis-vacio { flex: 1; display: grid; place-items: center; }
.crm-asis-caja { display: flex; gap: 8px; align-items: center; padding: 10px 12px 12px; box-shadow: inset 0 1px 0 var(--linea); }
.crm-asis-caja .entrada { flex: 1; min-width: 0; min-height: 42px; border-radius: 999px; font-size: 14px; }
.crm-asis-caja .redondo { flex-shrink: 0; background: #1D1D1F; color: #FFFFFF; }
:root[data-theme="dark"] .crm-asis-caja .redondo { background: #3D9BFF; color: #1D1D1F; }
.crm-lado.en-hoja { display: flex; flex-direction: column; height: min(72vh, 660px); margin: -4px -4px 0; }
.crm-lado.en-hoja .crm-lado-tabs { padding: 0 0 8px; }
.crm-lado.en-hoja .crm-asis-msjs { padding: 12px 2px 10px; }
.crm-lado.en-hoja .crm-asis-caja { padding: 10px 0 0; }
.crm-lado.en-hoja .crm-lado-ficha { padding: 16px 2px 0; }

.crm-sim-canales { display: flex; gap: 6px; flex-wrap: wrap; }
.crm-sim-canales button { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px 5px 5px; border-radius: 999px; border: 0; cursor: pointer; background: var(--widget); color: var(--texto-2); font-weight: 600; font-size: 13px; box-shadow: 0 0 0 1px var(--linea); }
.crm-sim-canales button .icono { border-radius: 999px; }
.crm-sim-canales button.activo { background: var(--vino); color: #fff; box-shadow: none; }

/* ── Marcas: embudo ───────────────────────────────────────────────────── */
.crm-col-tabs { margin: var(--hueco) 0 4px; }
.crm-col-tabs button b { font-weight: 700; color: var(--texto-3); margin-left: 3px; }
.crm-embudo { margin-top: var(--hueco); display: grid; gap: var(--hueco); }
.crm-col { display: none; flex-direction: column; min-width: 0; border-radius: var(--radio-widget); background: var(--widget-2); padding: 10px; transition: box-shadow .15s; }
.crm-col.visible { display: flex; }
.crm-col.sobre { box-shadow: inset 0 0 0 2px #1473FF; background: color-mix(in srgb, #3D9BFF 30%, var(--widget-2)); }
@media (min-width: 1024px) {
  .crm-col-tabs { display: none; }
  .crm-embudo { grid-auto-flow: column; grid-auto-columns: minmax(232px, 1fr); overflow-x: auto; padding-bottom: 6px; align-items: start; }
  .crm-col { display: flex; min-height: 420px; }
}
.crm-col-cab { display: flex; align-items: center; gap: 8px; padding: 2px 4px 10px; font-size: 14px; }
.crm-col-cab .icono { border-radius: 7px; }
.crm-col-cab > span:nth-child(3) { font-size: 12px; font-weight: 700; color: var(--texto-3); }
.crm-col-suma { margin-left: auto; font-size: 12.5px; font-weight: 700; font-variant-numeric: tabular-nums; }
.crm-col-lista { display: grid; gap: 8px; }
.crm-col-vacia { padding: 26px 10px; text-align: center; font-size: 12.5px; color: var(--texto-3); border-radius: 16px; box-shadow: inset 0 0 0 1.5px var(--linea); }
.crm-tarjeta { border-radius: 18px; background: var(--widget); box-shadow: 0 0 0 1px var(--linea), 0 10px 22px -18px var(--sombra); cursor: grab; }
.crm-tarjeta.arrastrando { opacity: .45; }
.crm-tarjeta-abrir { display: grid; gap: 10px; width: 100%; padding: 12px 12px 8px; border: 0; background: none; text-align: left; cursor: pointer; color: inherit; font-family: inherit; }
.crm-tarjeta-1 { display: flex; gap: 10px; align-items: center; min-width: 0; }
.crm-tarjeta-1 > div { display: grid; min-width: 0; }
.crm-tarjeta-1 b { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-tarjeta-1 span { font-size: 12px; color: var(--texto-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-tarjeta-monto { font-size: 22px; font-weight: 800; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.crm-tarjeta-monto .texto-3 { font-size: 13px; font-weight: 600; letter-spacing: 0; }
.crm-tarjeta-dl { display: flex; flex-wrap: wrap; gap: 4px 10px; font-size: 12px; color: var(--texto-2); }
.crm-tarjeta-dl span { display: inline-flex; align-items: center; gap: 4px; }
.crm-tarjeta-dl svg { width: 13px; height: 13px; color: var(--texto-3); }
.crm-tarjeta-ex { display: flex; flex-wrap: wrap; gap: 4px; }
.crm-tarjeta-ex span { font-size: 11px; font-weight: 600; padding: 2px 7px; border-radius: 999px; background: var(--acento-suave); color: #6B4A12; }
.crm-tarjeta-fac .insignia { font-size: 11px; }
.crm-tarjeta-bot { display: flex; justify-content: space-between; gap: 6px; padding: 8px 12px 10px; box-shadow: inset 0 1px 0 var(--linea); }
.crm-tarjeta-bot .enlace { display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; font-weight: 600; background: none; border: 0; cursor: pointer; color: var(--acento); padding: 0; }
.crm-tarjeta-bot .enlace svg { width: 14px; height: 14px; }

/* Cotizador */
.crm-cot { display: grid; gap: 12px; }
.crm-checks { display: flex; flex-wrap: wrap; gap: 8px; }
.crm-check { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 999px; background: var(--widget); box-shadow: 0 0 0 1px var(--linea); font-size: 13px; font-weight: 600; cursor: pointer; }
.crm-check input { accent-color: #1473FF; width: 16px; height: 16px; }
.crm-cot-res { border-radius: 18px; background: var(--widget); box-shadow: 0 0 0 1px var(--linea); padding: 12px 14px; }
.crm-cot-lineas { display: grid; gap: 6px; }
.crm-cot-lineas div { display: flex; justify-content: space-between; gap: 10px; font-size: 13.5px; color: var(--texto-2); }
.crm-cot-lineas b { color: var(--texto); font-variant-numeric: tabular-nums; flex-shrink: 0; }
.crm-cot-total { display: flex; justify-content: space-between; align-items: baseline; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--linea); }
.crm-cot-total span { font-weight: 700; }
.crm-cot-total b { font-size: 30px; font-weight: 800; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.crm-idioma { position: relative; }
.crm-idioma input { position: absolute; opacity: 0; pointer-events: none; }
.crm-idioma span { display: inline-flex; align-items: center; min-height: 32px; padding: 0 14px; border-radius: 999px; font-size: 13px; font-weight: 600; color: var(--texto-2); cursor: pointer; }
.crm-idioma input:checked + span { color: var(--texto); background: var(--perilla); box-shadow: 0 3px 8px rgba(0,0,0,.14); }
.crm-cot-texto { font-size: 13.5px; line-height: 1.5; min-height: 220px; }

/* ── ManyChat ─────────────────────────────────────────────────────────── */
.crm-conectado { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px; font-size: 13px; font-weight: 600; background: var(--widget); box-shadow: 0 0 0 1px var(--linea); }
.crm-flujo { display: flex; flex-direction: column; align-items: stretch; gap: 6px; }
.crm-paso { display: grid; justify-items: center; gap: 4px; text-align: center; padding: 14px 12px; border-radius: 18px; background: var(--widget-2); }
.crm-paso b { font-size: 14px; margin-top: 4px; }
.crm-paso span:last-child { font-size: 12px; color: var(--texto-2); }
.crm-paso.destacado { background: color-mix(in srgb, #3D9BFF 55%, var(--widget)); }
.crm-paso.ok { background: color-mix(in srgb, var(--ok) 10%, var(--widget)); }
.crm-paso.liz { background: color-mix(in srgb, #8EC8FF 35%, var(--widget)); }
.crm-flecha { display: grid; place-items: center; color: var(--texto-3); transform: rotate(90deg); }
.crm-flecha svg { width: 18px; height: 18px; }
.crm-salidas { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
@media (min-width: 1100px) {
  .crm-flujo { flex-direction: row; align-items: center; }
  .crm-flujo > .crm-paso { flex: 1; }
  .crm-flecha { transform: none; }
  .crm-salidas { flex: 1.3; grid-template-columns: 1fr; }
}
.crm-pcs { gap: var(--hueco); }
.crm-pc { display: grid; gap: 12px; align-content: start; }
.crm-pc.apagada { opacity: .78; }
.crm-pc-cab { display: flex; align-items: center; gap: 12px; }
.crm-pc-cab .cuerpo { flex: 1; min-width: 0; display: grid; }
.crm-pal { font-size: 17px; font-weight: 800; letter-spacing: .04em; }
.crm-pc-cab .cuerpo span { font-size: 13px; color: var(--texto-2); }
.crm-pc-sin { display: flex; flex-wrap: wrap; gap: 6px; }
.crm-pc-sin .chip { font-size: 12px; padding: 4px 10px; }
.crm-pc-mas { border: 0; cursor: pointer; padding: 4px 8px !important; }
.crm-pc-mas svg { width: 13px; height: 13px; }
/* 24-oct: sin números por palabra (los inventaba el navegador); «Probar a LIZA» en una franja */
.crm-probar { display: flex; align-items: center; justify-content: space-between; gap: 12px; }

/* ── Contactos de LIZA: ventas por confirmar del cruce diario (24-oct) ── */
.lz-cruce { margin-bottom: 12px; }
.lz-cruce .lz-sub { display: flex; align-items: center; gap: 8px; }
.lz-cruce .lz-sub .insignia { font-size: 11px; padding: 1px 8px; }
.lz-cruce-lista { display: grid; }
.lz-cruce-fila { display: grid; gap: 8px; padding: 14px 0; border-top: 1px solid var(--linea); }
.lz-cruce-fila:first-child { border-top: 0; padding-top: 6px; }
.lz-cruce-par { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "a t" "f f" "b b"; align-items: center; gap: 2px 12px; }
.lz-cruce-par > .lz-cruce-quien:first-child { grid-area: a; }
.lz-cruce-flecha { grid-area: f; display: flex; color: var(--texto-3); transform: rotate(90deg); width: 16px; height: 16px; margin: 2px 0; }
.lz-cruce-flecha svg { width: 14px; height: 14px; }
.lz-cruce-par > .lz-cruce-quien:nth-child(3) { grid-area: b; }
.lz-cruce-total { grid-area: t; font-size: 15px; font-variant-numeric: tabular-nums; }
.lz-cruce-quien { display: grid; min-width: 0; }
.lz-cruce-quien b, .lz-cruce-quien span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lz-cruce-quien b { font-size: 14.5px; }
.lz-cruce-quien span { font-size: 12.5px; color: var(--texto-3); }
.lz-cruce-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.lz-cruce-chips .insignia { font-size: 11px; }
.lz-cruce-chips .chip { font-size: 12px; padding: 3px 10px; }
.lz-cruce-botones { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.lz-cruce-botones .chico { justify-content: center; }
.lz-cruce-linea { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 14px; }
@media (min-width: 768px) {
  .lz-cruce-par { grid-template-columns: minmax(0, 1fr) 24px minmax(0, 1fr) 110px; grid-template-areas: "a f b t"; }
  .lz-cruce-total { text-align: right; }
  .lz-cruce-flecha { transform: none; margin: 0 4px; }
  .lz-cruce-botones { display: flex; justify-content: flex-start; }
  .lz-cruce-linea { justify-content: flex-start; }
}

/* ── Bandeja a pantalla completa (modelo CRM tipo WhatsApp, 13-oct) ───────
   En escritorio la bandeja ocupa todo el alto y ancho debajo de la cabecera:
   lista | chat | ficha, unidas por líneas finas, sin tarjetas flotando. */
.crm-lista-cab { display: none; }
@media (min-width: 1024px) {
  .admin-contenido:has(> .crm), .admin-contenido:has(> .crm-tit) { max-width: none; padding: 0; }
  .crm-tit { display: none; }
  .crm { gap: 0; height: calc(100dvh - var(--alto-cinta) - 60px); min-height: 520px; grid-template-columns: clamp(320px, 28vw, 400px) minmax(0, 1fr); }
  .crm-lista, .crm-chat, .crm-ficha { border-radius: 0; box-shadow: none; }
  .crm-lista { background: var(--widget); box-shadow: inset -1px 0 0 var(--linea); }
  .crm-lista-cab { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 20px 20px 6px; }
  .crm-lista-cab > div { display: grid; gap: 2px; min-width: 0; }
  .crm-lista-cab b { font-size: 24px; font-weight: 700; letter-spacing: -0.02em; }
  .crm-lista-cab span { font-size: 13px; color: var(--texto-2); }
  .crm-filtros { padding: 12px 20px 14px; gap: 12px; }
  .crm-lista-items { padding: 0; }
  .crm-item { gap: 14px; padding: 14px 20px; border-radius: 0; align-items: center; }
  .crm-item + .crm-item { margin-top: 0; }
  .crm-item .cuerpo { padding-bottom: 14px; margin-bottom: -14px; box-shadow: inset 0 -1px 0 var(--linea); }
  .crm-item:last-child .cuerpo { box-shadow: none; }
  .crm-item.activo { background: color-mix(in srgb, #3D9BFF 38%, var(--widget)); }
  .crm-item-1 b { font-size: 15.5px; }
  .crm-item-2 { margin-top: 3px; font-size: 14px; }
  .crm-av, .crm-av .avatar { width: 52px; height: 52px; font-size: 16px; }

  .crm-chat { height: auto; background: var(--suelo); }
  .crm-chat-cab { padding: 12px 24px; min-height: 68px; background: var(--widget); }
  .crm-msjs { padding: 24px max(24px, 6%) 16px;
    background-color: color-mix(in srgb, var(--suelo) 70%, var(--widget));
    background-image: radial-gradient(color-mix(in srgb, var(--texto) 7%, transparent) 1px, transparent 1.4px);
    background-size: 22px 22px; }
  .crm-msjs .lz-msj { max-width: min(62%, 620px); }
  .crm-msjs .lz-msj + .lz-msj { margin-top: 10px; }
  .crm-msjs .lz-msj:not(.liza):not(.liz) .lz-globo { background: var(--widget); box-shadow: 0 1px 1px color-mix(in srgb, var(--texto) 8%, transparent); }
  .crm-msjs .lz-globo { font-size: 15px; line-height: 1.5; padding: 10px 14px; }
  .crm-caja { padding: 12px 24px 16px; background: var(--widget); grid-template-columns: auto minmax(0, 1fr) auto; align-items: end; gap: 10px 12px; }
  .crm-caja > .crm-borrador { grid-column: 1 / -1; }
  .crm-caja textarea.entrada { grid-column: 2; grid-row: -2; min-height: 48px; }
  .crm-caja-bot { display: contents; }
  .crm-caja-bot > :first-child { grid-column: 1; grid-row: -2; min-height: 48px; }
  .crm-caja-bot > :last-child { grid-column: 3; grid-row: -2; min-height: 48px; }

  .crm-ficha { padding: 28px 24px; background: var(--widget); box-shadow: inset 1px 0 0 var(--linea); }
}
/* La ficha fija sólo cuando sobra ancho; antes se abre con su botón */
@media (min-width: 1024px) and (max-width: 1679px) { .crm .crm-ficha { display: none; } .crm-btn-ficha { display: inline-grid !important; } }
@media (min-width: 1680px) { .crm { grid-template-columns: 400px minmax(0, 1fr) 360px; } }
/* 23-oct: la columna de la derecha es el asistente (con la ficha en su pestaña): a la vista desde 1360 px; antes, con el botón ✦ */
.crm .crm-lado { padding: 0; }
@media (min-width: 1024px) {
  .crm-caja > .crm-redactar { grid-column: 1 / -1; grid-row: 1; }
  .crm-caja:has(> .crm-redactar:not([hidden])) > textarea.entrada, .crm-caja:has(> .crm-redactar:not([hidden])) > .crm-caja-bot > * { grid-row: 2; }
}
@media (min-width: 1360px) {
  .crm { grid-template-columns: clamp(280px, 22vw, 400px) minmax(0, 1fr) 320px; }
  .crm .crm-lado { display: flex; flex-direction: column; overflow: hidden; }
  .crm-btn-asis, .crm-btn-ficha { display: none !important; }
}
@media (min-width: 1024px) and (max-width: 1679px) { .crm-btn-redactar { width: 40px; padding: 0 !important; justify-content: center; } .crm-btn-redactar span { display: none; } }
@media (min-width: 1680px) { .crm { grid-template-columns: 400px minmax(0, 1fr) 380px; } }

/* ── Filtros de la bandeja en desplegables tipo Monday (13-oct) ─────────── */
.crm-dds { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.crm-dd { position: relative; }
.crm-dd-btn { display: inline-flex; align-items: center; gap: 6px; height: 36px; padding: 0 10px 0 14px; border: 0; border-radius: 999px; cursor: pointer;
  font: inherit; font-size: 13.5px; font-weight: 600; color: var(--texto); background: var(--widget); box-shadow: inset 0 0 0 1px var(--linea); white-space: nowrap; }
.crm-dd-btn:hover { background: var(--widget-2); }
.crm-dd-btn > svg { width: 14px; height: 14px; color: var(--texto-3); transition: transform .15s; }
.crm-dd.abierto .crm-dd-btn > svg { transform: rotate(180deg); }
.crm-dd-btn.activo { background: #3D9BFF; color: #1D1D1F; box-shadow: inset 0 0 0 1.5px #1473FF; }
.crm-dd-btn.activo > svg { color: #6B4A12; }
.crm-dd-alerta { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; display: grid; place-items: center; font-style: normal; font-size: 11px; font-weight: 700; color: #fff; background: var(--urgente); }
.crm-dd-menu { position: absolute; top: calc(100% + 6px); left: 0; z-index: 40; min-width: 240px; max-height: 340px; overflow-y: auto; padding: 6px;
  border-radius: 16px; background: var(--widget); box-shadow: 0 0 0 1px var(--linea), 0 18px 40px -12px rgba(17, 24, 39,.28); }
.crm-dd:last-of-type .crm-dd-menu { left: auto; right: 0; }
.crm-dd-menu button { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 40px; padding: 0 10px; border: 0; border-radius: 10px; cursor: pointer;
  background: none; color: var(--texto); font: inherit; font-size: 14px; text-align: left; }
.crm-dd-menu button:hover { background: var(--widget-2); }
.crm-dd-menu button[aria-checked="true"] { font-weight: 600; background: color-mix(in srgb, #3D9BFF 45%, transparent); }
.crm-dd-menu .icono { border-radius: 999px; }
.crm-dd-t { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.crm-dd-menu b { font-size: 12px; font-weight: 600; color: var(--texto-3); font-variant-numeric: tabular-nums; }
.crm-dd-ok { display: grid; color: #1473FF; } .crm-dd-ok svg { width: 16px; height: 16px; }
.crm-dd-punto { width: 8px; height: 8px; border-radius: 999px; background: var(--urgente); margin: 0 4px; }
.crm-dd-limpiar { width: 36px; height: 36px; display: grid; place-items: center; padding: 0; border: 0; border-radius: 999px; cursor: pointer; background: var(--widget-2); color: var(--texto-2); }
.crm-dd-limpiar:hover { color: var(--texto); }
.crm-dd-limpiar svg { width: 15px; height: 15px; }
.crm-dds { flex-wrap: nowrap; }
.crm-dd-btn { padding: 0 9px 0 12px; }
.crm-lista { overflow: visible; } .crm-lista-items { border-radius: 0 0 var(--radio-widget) var(--radio-widget); }
@media (min-width: 1024px) { .crm-lista-items { border-radius: 0; } }
.crm-dd { min-width: 0; }
.crm-dd-btn > span { max-width: 104px; overflow: hidden; text-overflow: ellipsis; }
.crm-dd-limpiar { flex-shrink: 0; }
.crm-dd { flex: 0 1 auto; }
.crm-dd-btn { max-width: 100%; }
.crm-dd-btn > span { min-width: 0; flex: 0 1 auto; }
.crm-dd-btn > svg, .crm-dd-alerta { flex-shrink: 0; }
.crm-dds { min-width: 0; } .crm-filtros { min-width: 0; }
.crm-dd-btn > .icono { border-radius: 999px; width: 22px; height: 22px; margin-left: -4px; }
.crm-dds { gap: 5px; } .crm-dd-btn { gap: 4px; padding: 0 8px 0 11px; font-size: 13px; } .crm-dd-btn > span { max-width: 120px; }

/* ── Chat de la web como WhatsApp: la visitante a la derecha, LIZA a la izquierda (auditoría 17-oct) ── */
.lz-ventana .lz-msj.liza { align-self: flex-start; align-items: flex-start; margin-left: 0; }
.lz-ventana .lz-msj.liza .lz-globo { border-bottom-right-radius: 20px; border-bottom-left-radius: 6px; }
.lz-ventana .lz-msj:not(.liza):not(.liz) { align-self: flex-end; align-items: flex-end; margin-left: auto; }

/* 22-oct (tanda C): la burbuja de la web contesta con el bot de verdad */
.lz-enviar[disabled] { opacity: .45; cursor: default; transform: none; }
.lz-rapidas[hidden] { display: none; }
.lz-rapidas .chip[disabled] { opacity: .5; cursor: default; }
.lz-ventana .lz-msj.lz-fallo .lz-globo { background: #FFFFFF; box-shadow: inset 0 0 0 1px rgba(17, 24, 39,.16); }
.lz-globo a.lz-wa { display: inline-flex; align-items: center; gap: 6px; margin: 4px 0 0; padding: 6px 12px; border-radius: 999px; background: #25D366; color: #fff; font-weight: 600; text-decoration: none; }
.lz-globo a.lz-wa svg { width: 15px; height: 15px; }

/* #/admin/liza?t=web: conversaciones del chat de la web (solo lectura) */
.lz-web-conv summary { cursor: pointer; list-style: none; display: grid; gap: 8px; }
.lz-web-conv summary::-webkit-details-marker { display: none; }
.lz-web-conv-1 { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.lz-web-conv-1 b { font-weight: 600; overflow-wrap: anywhere; }
.lz-web-conv-1 span { flex-shrink: 0; font-size: 12.5px; color: var(--texto-3); }
.lz-web-conv-2 { display: flex; flex-wrap: wrap; gap: 6px; }
.lz-web-conv-2 .insignia { font-size: 11px; }
.lz-web-conv[open] summary { padding-bottom: 12px; border-bottom: 1px solid var(--linea, rgba(17, 24, 39,.1)); }
.lz-web-leer { max-height: 60vh; }
.lz-web-leer .lz-msj.lz-fallo .lz-globo { background: transparent; box-shadow: inset 0 0 0 1px var(--linea, rgba(17, 24, 39,.18)); color: var(--texto-2); font-size: 13px; }

/* 23-oct: «Pregúntale a LIZA» con archivos y notas de voz */
.lz-boton-ico { flex-shrink: 0; width: 42px; height: 42px; border-radius: 999px; border: 1px solid rgba(17, 24, 39,.14); background: #fff; color: inherit; display: grid; place-items: center; cursor: pointer; }
.lz-boton-ico svg { width: 18px; height: 18px; }
.lz-boton-ico:active { transform: scale(.94); }
.lz-boton-ico.grabando { background: #e5484d; border-color: #e5484d; color: #fff; animation: lz-latido 1.2s ease-in-out infinite; }
@keyframes lz-latido { 50% { box-shadow: 0 0 0 7px rgba(229,72,77,.18); } }
.lz-adj { display: flex; flex-wrap: wrap; gap: 6px; }
.lz-adj-pendientes:not(:empty) { margin-bottom: 8px; }
.lz-adj-chip { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 6px 8px 6px 10px; border-radius: 999px; background: rgba(61, 155, 255,.55); font-size: 13px; line-height: 1.2; }
.lz-adj-chip > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 220px; }
.lz-adj-chip button { border: 0; background: none; padding: 2px; cursor: pointer; display: grid; color: inherit; }
.lz-adj-chip svg { width: 14px; height: 14px; flex-shrink: 0; }
.lz-globo .lz-adj { margin-top: 6px; }
.lz-globo .lz-adj-chip { background: rgba(255,255,255,.18); }
.lz-voz-marca { display: inline-flex; vertical-align: -2px; margin-right: 6px; opacity: .8; }
.lz-voz-marca svg { width: 14px; height: 14px; }
@media (max-width: 420px) { .lz-boton-ico { width: 38px; height: 38px; } .lz-caja { gap: 6px; } }