/* WhalyBot · Bandeja CRM 360° — rediseño v5 (capa final, reversible quitando este archivo) */
:root{
  --ix-bg:#f4f5f7; --ix-surface:#fff; --ix-line:#e5e7eb; --ix-line-soft:#eef0f3;
  --ix-ink:#111827; --ix-ink-2:#374151; --ix-muted:#6b7280; --ix-faint:#9ca3af;
  --ix-brand:#0f7a67; --ix-brand-600:#0c6656; --ix-brand-50:#ecf7f4; --ix-brand-100:#d5eee8;
  --ix-ai:#6d5bd0; --ix-ai-50:#f1effd; --ix-warn:#b45309; --ix-warn-50:#fef3c7; --ix-danger:#dc2626;
  --ix-r:12px; --ix-r-sm:8px; --ix-shadow:0 1px 2px rgba(17,24,39,.04),0 1px 3px rgba(17,24,39,.06);
}

/* ---------- Estructura ---------- */
.crm-inbox-shell{gap:0!important;background:var(--ix-surface)!important;border:1px solid var(--ix-line)!important;border-radius:var(--ix-r)!important;box-shadow:var(--ix-shadow)!important;overflow:hidden!important;padding:0!important}
.crm-inbox-shell>aside.crm-inbox-list,.crm-inbox-shell>section.crm-inbox-chat,.crm-inbox-shell>aside.crm-inbox-context{border-radius:0!important;box-shadow:none!important;border:0!important;margin:0!important;background:var(--ix-surface)!important}
.crm-inbox-shell>aside.crm-inbox-list{border-right:1px solid var(--ix-line)!important}
.crm-inbox-shell>aside.crm-inbox-context{border-left:1px solid var(--ix-line)!important;background:#fbfbfc!important}

/* ---------- Lista ---------- */
.crm-inbox-list .crm-inbox-list-head{padding:18px 16px 10px!important}
.crm-inbox-list .crm-list-heading h2,.crm-inbox-list .crm-list-heading strong{font-size:17px!important;font-weight:650!important;color:var(--ix-ink)!important;letter-spacing:-.01em}
.crm-inbox-list .crm-list-heading small,.crm-inbox-list .crm-list-heading p{font-size:12px!important;color:var(--ix-muted)!important}
.crm-inbox-count{min-width:22px!important;height:22px!important;padding:0 7px!important;border-radius:999px!important;font-size:12px!important;font-weight:600!important;background:var(--ix-line-soft)!important;color:var(--ix-ink-2)!important;display:inline-flex!important;align-items:center;justify-content:center}
.crm-inbox-count.crm-count-new{background:var(--ix-brand)!important;color:#fff!important}
.crm-inbox-list .crm-source-filter,.crm-inbox-list label:has(input[data-crm-inbox="search"]){margin:0 16px 8px!important;border:1px solid var(--ix-line)!important;border-radius:var(--ix-r-sm)!important;background:var(--ix-surface)!important;box-shadow:none!important;min-height:36px!important}
.crm-inbox-list input[data-crm-inbox="search"]{font-size:13px!important}
.crm-inbox-filters{display:flex!important;gap:4px!important;padding:4px!important;margin:4px 16px 10px!important;background:var(--ix-line-soft)!important;border-radius:10px!important;border:0!important}
.crm-inbox-filters button{flex:1 1 auto;border:0!important;background:transparent!important;border-radius:7px!important;padding:6px 8px!important;font-size:12px!important;font-weight:550!important;color:var(--ix-muted)!important;box-shadow:none!important;white-space:nowrap}
.crm-inbox-filters button.selected,.crm-inbox-filters button[aria-pressed="true"],.crm-inbox-filters button.active{background:var(--ix-surface)!important;color:var(--ix-ink)!important;box-shadow:var(--ix-shadow)!important}
.crm-inbox-filters button::after{display:none!important}
.crm-conversation-items{padding:4px 8px 8px!important;gap:2px!important}
button.crm-conversation-item{position:relative;display:grid!important;grid-template-columns:40px 1fr auto!important;gap:10px!important;align-items:center!important;padding:10px 10px!important;margin:0!important;border:0!important;border-radius:10px!important;background:transparent!important;box-shadow:none!important;min-height:0!important;transition:background .12s}
button.crm-conversation-item:hover{background:#f7f8f9!important}
button.crm-conversation-item.selected,button.crm-conversation-item[aria-current="true"],button.crm-conversation-item.active{background:var(--ix-brand-50)!important}
button.crm-conversation-item.selected::before,button.crm-conversation-item[aria-current="true"]::before,button.crm-conversation-item.active::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:3px;background:var(--ix-brand)}
button.crm-conversation-item.unread,button.crm-conversation-item:has(.crm-unread-badge){border-left:0!important}
.crm-conversation-item .crm-avatar,.crm-chat-header .crm-avatar{width:40px!important;height:40px!important;border-radius:999px!important;font-size:13px!important;font-weight:650!important;letter-spacing:.02em;background:var(--ix-brand-100)!important;color:var(--ix-brand-600)!important;border:0!important}
.crm-conversation-item:nth-child(5n+2) .crm-avatar{background:#e0e7ff!important;color:#3730a3!important}
.crm-conversation-item:nth-child(5n+3) .crm-avatar{background:#fde68a!important;color:#92400e!important}
.crm-conversation-item:nth-child(5n+4) .crm-avatar{background:#fbcfe8!important;color:#9d174d!important}
.crm-conversation-item:nth-child(5n+5) .crm-avatar{background:#e5e7eb!important;color:#374151!important}
.crm-conversation-copy{min-width:0;display:flex!important;flex-direction:column!important;gap:2px!important}
.crm-conversation-copy strong,.crm-conversation-copy b:first-child{font-size:14px!important;font-weight:600!important;color:var(--ix-ink)!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.crm-conversation-copy small,.crm-conversation-copy span:not(.crm-source-pill){font-size:13px!important;color:var(--ix-muted)!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.crm-conversation-item:has(.crm-unread-badge) .crm-conversation-copy strong{font-weight:700!important}
.crm-conversation-item:has(.crm-unread-badge) .crm-conversation-copy small,.crm-conversation-item:has(.crm-unread-badge) .crm-conversation-copy span:not(.crm-source-pill){color:var(--ix-ink-2)!important}
.crm-source-pill{align-self:flex-start;margin-top:3px!important;padding:1px 6px!important;border-radius:5px!important;font-size:10.5px!important;font-weight:500!important;background:transparent!important;color:var(--ix-faint)!important;border:1px solid var(--ix-line)!important}
.crm-conversation-meta{display:flex!important;flex-direction:column!important;align-items:flex-end!important;gap:6px!important;align-self:start!important;padding-top:2px}
.crm-conversation-meta time,.crm-conversation-meta small{font-size:11.5px!important;color:var(--ix-faint)!important}
.crm-conversation-item:has(.crm-unread-badge) .crm-conversation-meta time,.crm-conversation-item:has(.crm-unread-badge) .crm-conversation-meta small{color:var(--ix-brand)!important;font-weight:600!important}
.crm-channel-mark{width:14px!important;height:14px!important;opacity:.55}
.crm-unread-badge{min-width:18px!important;height:18px!important;padding:0 5px!important;border-radius:999px!important;font-size:11px!important;font-weight:700!important;background:var(--ix-brand)!important;color:#fff!important;display:inline-flex!important;align-items:center;justify-content:center}
.crm-load-more{margin:8px 16px 14px!important;border:1px dashed var(--ix-line)!important;background:transparent!important;color:var(--ix-muted)!important;border-radius:var(--ix-r-sm)!important;font-size:12px!important}

/* ---------- Conversación ---------- */
.crm-chat-header{padding:12px 20px!important;min-height:64px!important;border-bottom:1px solid var(--ix-line)!important;background:var(--ix-surface)!important;box-shadow:none!important}
.crm-chat-person strong,.crm-chat-person h2,.crm-chat-person h3{font-size:15px!important;font-weight:650!important;color:var(--ix-ink)!important}
.crm-chat-person small,.crm-chat-person p,.crm-chat-person span{font-size:12px!important;color:var(--ix-muted)!important}
.crm-chat-header .badge,.crm-chat-header [class*="status"]{font-size:11px!important;font-weight:600!important;padding:3px 9px!important;border-radius:999px!important;background:var(--ix-brand-50)!important;color:var(--ix-brand-600)!important;border:0!important}
.crm-chat-messages{background:var(--ix-bg)!important;background-image:none!important;padding:20px 24px!important}
.crm-history-tools{justify-content:center}
.crm-history-tools>*{font-size:11.5px!important;color:var(--ix-muted)!important;background:var(--ix-surface)!important;border:1px solid var(--ix-line)!important;border-radius:999px!important;box-shadow:none!important;padding:4px 12px!important}
.crm-message-items{gap:6px!important}
.crm-message-items article.communication-message{max-width:min(560px,72%)!important;padding:9px 13px 7px!important;border-radius:14px 14px 14px 4px!important;background:var(--ix-surface)!important;border:1px solid var(--ix-line)!important;box-shadow:none!important;color:var(--ix-ink)!important;font-size:14px!important;line-height:1.45!important}
.crm-message-items article.communication-message.outbound{border-radius:14px 14px 4px 14px!important;background:var(--ix-brand-50)!important;border-color:var(--ix-brand-100)!important}
.crm-message-items article.communication-message time,.crm-message-items article.communication-message small{font-size:10.5px!important;color:var(--ix-faint)!important}
.crm-attention-bar{margin:0!important;padding:10px 16px!important;border-top:1px solid var(--ix-line)!important;background:var(--ix-surface)!important;box-shadow:none!important;border-radius:0!important;gap:12px!important}
.crm-attention-status{font-size:12.5px!important;color:var(--ix-ink-2)!important}
.crm-attention-bar .btn{background:var(--ix-brand)!important;color:#fff!important;border:0!important;border-radius:var(--ix-r-sm)!important;padding:8px 16px!important;font-weight:600!important;font-size:13px!important;box-shadow:none!important}
.crm-attention-bar .btn:hover{background:var(--ix-brand-600)!important}
.crm-chat-composer{margin:0 16px 14px!important;padding:6px 6px 6px 10px!important;border:1px solid var(--ix-line)!important;border-radius:var(--ix-r)!important;background:var(--ix-surface)!important;box-shadow:var(--ix-shadow)!important}
.crm-chat-composer:focus-within{border-color:var(--ix-brand)!important;box-shadow:0 0 0 3px rgba(15,122,103,.12)!important}
.crm-composer-input{font-size:14px!important;color:var(--ix-ink)!important}
.crm-send-button{background:var(--ix-brand)!important;border-radius:var(--ix-r-sm)!important;border:0!important;box-shadow:none!important}

/* ---------- Ficha del cliente ---------- */
.crm-context-head{padding:18px 18px 12px!important}
.crm-context-tabs{margin:0 18px!important;border-bottom:1px solid var(--ix-line)!important;gap:18px!important}
.crm-context-tabs button{font-size:12.5px!important;font-weight:550!important;color:var(--ix-muted)!important;padding:8px 0!important;background:transparent!important;border:0!important;border-bottom:2px solid transparent!important;border-radius:0!important;box-shadow:none!important}
.crm-context-tabs button.selected,.crm-context-tabs button[aria-selected="true"],.crm-context-tabs button.active{color:var(--ix-ink)!important;border-bottom-color:var(--ix-brand)!important}
.crm-inbox-context .crm-contact-card,.crm-inbox-context .crm-context-section,.crm-inbox-context .crm-context-actions{margin:0!important;padding:14px 18px!important;border:0!important;border-bottom:1px solid var(--ix-line-soft)!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.crm-inbox-context .crm-context-section>strong,.crm-inbox-context .crm-context-section-head strong,.crm-inbox-context .crm-context-actions>strong,.crm-inbox-context .crm-contact-card h3,.crm-inbox-context .crm-contact-card strong:first-child{font-size:11px!important;font-weight:650!important;text-transform:uppercase;letter-spacing:.06em;color:var(--ix-faint)!important}
.crm-contact-data dt{font-size:12px!important;color:var(--ix-muted)!important}
.crm-contact-data dd{font-size:13px!important;color:var(--ix-ink)!important}
.crm-inbox-context select{border:1px solid var(--ix-line)!important;border-radius:var(--ix-r-sm)!important;background:var(--ix-surface)!important;font-size:13px!important;min-height:34px!important;box-shadow:none!important}
.crm-context-actions .btn{background:var(--ix-surface)!important;color:var(--ix-ink-2)!important;border:1px solid var(--ix-line)!important;border-radius:var(--ix-r-sm)!important;font-size:12.5px!important;font-weight:550!important;box-shadow:none!important}
.crm-context-actions .btn:hover{border-color:var(--ix-brand)!important;color:var(--ix-brand)!important}
.crm-tags-open{border:1px solid var(--ix-line)!important;background:var(--ix-surface)!important;color:var(--ix-ink-2)!important;border-radius:var(--ix-r-sm)!important;font-size:12px!important;box-shadow:none!important}

/* ---------- v2: ajustes tras la primera vista previa ---------- */
.crm-inbox-shell .crm-conversation-items button.crm-conversation-item.unread,.crm-inbox-shell .crm-conversation-items button.crm-conversation-item.unread-new{background:transparent!important;background-image:none!important;border:0!important;box-shadow:none!important}
.crm-inbox-shell .crm-conversation-items button.crm-conversation-item.unread:hover{background:#f7f8f9!important}
.crm-inbox-shell .crm-conversation-items button.crm-conversation-item.selected{background:var(--ix-brand-50)!important;background-image:none!important}
.crm-conversation-item.unread .crm-conversation-copy strong{font-weight:700!important}
.crm-conversation-item.unread .crm-conversation-copy small{color:var(--ix-ink-2)!important}
.crm-conversation-item.unread .crm-conversation-meta time,.crm-conversation-item.unread .crm-conversation-meta small,.crm-conversation-item.unread .crm-conversation-meta>span:first-child{color:var(--ix-brand)!important;font-weight:650!important}
/* Número de origen: solo si hay más de una cuenta conectada */
.crm-conversation-copy em{display:none!important;font-style:normal}
.crm-inbox-list:has(.crm-source-filter option:nth-of-type(3)) .crm-conversation-copy em{display:block!important}
.crm-inbox-list .crm-list-heading small,.crm-inbox-list .crm-list-heading p{display:none!important}
.crm-inbox-filters{overflow-x:auto!important;scrollbar-width:none;flex-wrap:nowrap!important}
.crm-inbox-filters::-webkit-scrollbar{display:none}
.crm-inbox-filters button{flex:0 0 auto!important;padding:6px 10px!important}
.crm-conversation-meta{min-width:34px}
.crm-conversation-meta .crm-channel-mark{display:none!important}
.crm-inbox-list:has(.crm-source-filter option:nth-of-type(3)) .crm-conversation-meta .crm-channel-mark{display:inline-block!important}
.crm-conversation-meta{flex-direction:column!important;gap:4px!important}

/* ---------- v4: asistente IA ---------- */
.ix-ai-tools{display:flex;gap:6px;margin-left:auto;margin-right:8px}
.ix-ai-btn{border:1px solid #ddd6fe;background:var(--ix-ai-50);color:var(--ix-ai);border-radius:999px;padding:6px 12px;font:600 12.5px/1 inherit;cursor:pointer;white-space:nowrap}
.ix-ai-btn:hover{background:#e7e2fb;border-color:var(--ix-ai)}
.ix-ai-card{margin:10px 20px 0;padding:12px 14px;border:1px solid #ddd6fe;border-left:3px solid var(--ix-ai);border-radius:var(--ix-r);background:#fcfbff;box-shadow:var(--ix-shadow);font-size:13.5px;line-height:1.5;color:var(--ix-ink)}
.ix-ai-card header{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.ix-ai-card header strong{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ix-ai)}
.ix-ai-close{border:0;background:transparent;color:var(--ix-faint);font-size:18px;line-height:1;cursor:pointer}
.ix-ai-actions{display:flex;gap:8px;margin-top:10px}
.ix-ai-use{border:0;background:var(--ix-ai);color:#fff;border-radius:var(--ix-r-sm);padding:7px 12px;font:600 12.5px/1 inherit;cursor:pointer}
.ix-ai-copy{border:1px solid var(--ix-line);background:#fff;color:var(--ix-ink-2);border-radius:var(--ix-r-sm);padding:7px 12px;font:600 12.5px/1 inherit;cursor:pointer}
.ix-ai-muted{color:var(--ix-muted);font-size:12px}
.ix-ai-error{color:var(--ix-danger);margin:0}
.ix-ai-tools{flex-wrap:nowrap!important;flex-shrink:0}
.ix-ai-btn{display:inline-flex;align-items:center;gap:5px;padding:6px 11px!important;font-size:12px!important}
.ix-ai-ico{flex:0 0 auto}
@media (max-width:760px){.ix-ai-tools .ix-ai-btn{font-size:12px}}
/* AI buttons: horizontal, content width (override legacy full-width buttons) */
.crm-inbox-shell .crm-chat-header .ix-ai-tools{display:flex!important;flex-direction:row!important;gap:6px!important;width:auto!important;margin:0 8px 0 auto!important}
.crm-inbox-shell .crm-chat-header .ix-ai-btn{width:auto!important;min-width:0!important;height:30px!important;flex:0 0 auto!important;margin:0!important}

/* ---------- v5: etiquetas y responsable en la bandeja ---------- */
.crm-inbox-shell .ix-labels{display:flex!important;flex-wrap:nowrap!important;gap:4px!important;margin-top:4px!important;min-width:0;overflow:hidden!important;white-space:nowrap!important}
.crm-inbox-shell .ix-labels .ix-tag{--tag:#6b7280;display:inline-flex!important;align-items:center;flex:0 1 auto;min-width:0;max-width:110px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;padding:0 7px!important;border-radius:999px!important;font-size:10.5px!important;font-weight:600!important;line-height:17px!important;color:var(--tag)!important;background:var(--tag-bg,#f3f4f6)!important;border:1px solid var(--tag-bd,#e5e7eb)!important}
.crm-inbox-shell .ix-labels .ix-tag-more{flex:0 0 auto}
.crm-inbox-shell .ix-labels .ix-owner{display:inline-flex!important;align-items:center;flex:0 0 auto;padding:0 7px!important;border-radius:999px!important;font-size:10.5px!important;font-weight:700!important;line-height:17px!important;color:var(--ix-brand-600)!important;background:var(--ix-brand-50)!important;border:1px solid var(--ix-brand-100)!important;white-space:nowrap!important}
.crm-inbox-shell .ix-labels-header{margin-top:6px!important;flex-wrap:wrap!important}
.crm-inbox-shell .ix-labels-header .ix-tag{max-width:200px!important}

/* v6 (2026-09-25): all four inbox filters stay visible; the row wraps instead of hiding "Sin asignar" under the chat. */
.crm-inbox-filters{flex-wrap:wrap!important;overflow:visible!important;row-gap:4px!important}
.crm-inbox-filters button{flex:1 0 auto!important}

/* v7 (2026-09-25): selected chat = quiet neutral card (no green bar); new/incoming chats stay the strongest highlight. */
.crm-inbox-shell .crm-conversation-items button.crm-conversation-item{transition:background-color .22s ease,box-shadow .22s ease,transform .22s ease!important}
.crm-inbox-shell .crm-conversation-items button.crm-conversation-item::before{content:none!important;display:none!important}
.crm-inbox-shell .crm-conversation-items button.crm-conversation-item.selected{background:#f3f5f7!important;background-image:none!important;border-left:0!important;box-shadow:0 1px 2px rgba(16,24,40,.06),0 4px 12px -6px rgba(16,24,40,.12)!important;border-radius:12px!important;animation:crmSelectIn .28s ease-out}
.crm-inbox-shell .crm-conversation-items button.crm-conversation-item.selected strong{color:var(--ix-ink)!important}
@keyframes crmSelectIn{from{background-color:#fff;box-shadow:0 0 0 rgba(16,24,40,0);transform:scale(.985)}to{transform:scale(1)}}
/* New / incoming: clearly stronger than the selection. */
.crm-inbox-shell .crm-conversation-items button.crm-conversation-item.unread:not(.selected),.crm-inbox-shell .crm-conversation-items button.crm-conversation-item.unread-new:not(.selected){background:#ecf8f1!important}
.crm-inbox-shell .crm-conversation-items button.crm-conversation-item.unread:not(.selected):hover{background:#e2f4ea!important}
.crm-inbox-shell .crm-conversation-items button.crm-conversation-item.unread.selected{background:#eef6f1!important}
@media (prefers-reduced-motion:reduce){.crm-inbox-shell .crm-conversation-items button.crm-conversation-item.selected{animation:none}}

/* v8 (2026-09-25): inline audio player (no pop-up). */
.crm-audio{display:flex;align-items:center;gap:10px;min-width:240px;max-width:320px;padding:6px 4px}
.crm-audio-play{flex:0 0 38px;height:38px;border-radius:50%;border:0;background:#0f7a67;color:#fff;cursor:pointer;display:grid;place-items:center;box-shadow:0 2px 6px rgba(15,122,103,.35);transition:transform .12s}
.crm-audio-play:hover{transform:scale(1.06)}.crm-audio-play::before{content:"";width:0;height:0;border-left:12px solid #fff;border-top:7px solid transparent;border-bottom:7px solid transparent;margin-left:3px}
.crm-audio.playing .crm-audio-play::before{width:11px;height:13px;border:0;margin:0;background:linear-gradient(90deg,#fff 0 4px,transparent 4px 7px,#fff 7px 11px)}
.crm-audio.loading .crm-audio-play{opacity:.7}
.crm-audio-body{flex:1;min-width:0;display:grid;gap:5px}
.crm-audio-track{--p:0%;position:relative;height:6px;border-radius:999px;background:#d6e4e1;cursor:pointer}.crm-audio-track i{position:absolute;inset:0 auto 0 0;width:var(--p);border-radius:999px;background:#0f7a67}
.crm-audio-track::after{content:"";position:absolute;top:50%;left:var(--p);width:12px;height:12px;border-radius:50%;background:#0f7a67;transform:translate(-50%,-50%);opacity:0;transition:opacity .15s}
.crm-audio.active .crm-audio-track::after,.crm-audio-track:hover::after,.crm-audio-track:focus-visible::after{opacity:1}.crm-audio-track:focus-visible{outline:2px solid #0f7a67;outline-offset:3px}
.crm-audio-meta{display:flex;justify-content:space-between;align-items:center;font-size:11.5px;color:#667a86}
.crm-audio-rate{border:0;background:#e6efed;color:#35524a;border-radius:999px;padding:1px 8px;font-size:11px;font-weight:700;cursor:pointer}

/* v9 (2026-09-25): subtle voice-note transcript under the audio player. */
.crm-transcript{margin:4px 2px 2px;max-width:340px;font-size:12.5px;color:#4a5d69;border-left:2px solid #cfe3de;padding-left:8px}
.crm-transcript summary{list-style:none;cursor:pointer;display:flex;flex-wrap:wrap;gap:4px 6px;align-items:baseline}.crm-transcript summary::-webkit-details-marker{display:none}
.crm-transcript-label{font-size:11px;font-weight:700;color:#0f7a67;letter-spacing:.2px}
.crm-transcript-peek{color:#667a86;font-style:italic}.crm-transcript-more{font-size:11px;font-weight:600;color:#0f7a67}
.crm-transcript[open] .crm-transcript-peek,.crm-transcript[open] .crm-transcript-more{display:none}
.crm-transcript p{margin:3px 0 0;white-space:pre-wrap;line-height:1.45;font-style:italic;color:#35524a}
.crm-transcript-state{display:block;text-align:left;margin:4px 2px 2px;font-size:11.5px;color:#8a9aa3}