/* Atendimento — layout B (fila por tempo de espera + notas internas) */
.atendimento-main { --ink:#0C1220; --mut:#4A5262; --line:#E2E5EA; --bg:#F2F3F5; --blue:#2E5BDB;
  --ny:#FFF4CC; --nb:#E0B83A; --nt:#3D2E00; --na:#7A5600;
  padding:0 !important; font-family:Geist,system-ui,sans-serif; color:var(--ink); background:#fff; }
.atendimento-main .topbar { display:none; }
.atendimento-main button, .atendimento-main input, .atendimento-main textarea { font-family:inherit; }
.atendimento-main .chat-layout { grid-template-columns:360px 1fr; gap:0; }
.atendimento-main .chat-list-panel { border:0; border-right:1px solid var(--line); border-radius:0; background:#fff; }
.atendimento-main .chat-view-panel { border:0; border-radius:0; background:var(--bg); position:relative; min-width:0; }
.ms { font-family:'Material Symbols Rounded'; font-style:normal; font-weight:400; font-size:20px; line-height:1; width:1em; height:1em;
  display:inline-block; overflow:hidden; white-space:nowrap; letter-spacing:normal; text-transform:none; flex-shrink:0;
  font-variation-settings:'FILL' 0; -webkit-font-smoothing:antialiased; }
.ms.fill { font-variation-settings:'FILL' 1; }
.ib { width:44px; height:44px; border:0; border-radius:10px; background:transparent; color:#3B4352; display:inline-grid;
  place-items:center; cursor:pointer; padding:0; flex-shrink:0; }
.ib:hover { background:rgba(12,18,32,.06); }
.ib.is-on { background:var(--ny); color:var(--na); }
.ib .ms { font-size:22px; }
.atendimento-main :focus-visible { outline:2px solid var(--blue); outline-offset:2px; }

/* Fila */
.atendimento-main .chat-list-header { padding:18px 16px 12px; display:flex; flex-direction:column; gap:12px; border:0; }
.queue-title { display:flex; align-items:baseline; gap:8px; }
.queue-title h2 { margin:0; font-size:20px; font-weight:600; letter-spacing:-.02em; }
.queue-title span { font-size:13px; color:var(--mut); }
.queue-search { display:flex; align-items:center; gap:8px; height:44px; padding:0 12px; border-radius:10px; background:var(--bg); }
.queue-search .ms { color:#5B6472; }
.atendimento-main .queue-search input { flex:1; min-width:0; border:0; background:transparent; outline:0; padding:0; font-size:14px; }
.queue-search kbd { font:500 12px 'Geist Mono',monospace; color:#3B4352; background:#fff; border:1px solid #D5D9E0; border-radius:5px; padding:2px 6px; }
.queue-tabs { display:flex; background:var(--bg); border-radius:10px; padding:3px; }
.queue-tabs button { flex:1; height:34px; border:0; border-radius:8px; background:transparent; font-size:13px; color:#3B4352; cursor:pointer;
  display:flex; align-items:center; justify-content:center; gap:6px; }
.queue-tabs button.is-active { background:#fff; color:var(--ink); font-weight:600; box-shadow:0 1px 2px rgba(12,18,32,.08); }
.queue-tabs b { font-size:12px; color:#B42318; }
.atendimento-main .chat-list { padding:0 8px 8px; }
.queue-group { display:flex; align-items:center; gap:8px; padding:12px 10px 6px; font-size:12px; font-weight:600; }
.queue-group .dot { width:8px; height:8px; border-radius:50%; background:currentColor; }
.queue-group em { font-style:normal; font-weight:500; color:var(--mut); }
.queue-group.is-late { color:#B42318; } .queue-group.is-wait { color:#9A3412; } .queue-group.is-done { color:var(--mut); }
.atendimento-main .chat-item { min-height:68px; padding:10px; border:0; border-radius:10px; gap:12px; align-items:center; }
.atendimento-main .chat-item:hover { background:var(--bg); }
.atendimento-main .chat-item.active { background:#E8EEFC; }
.atendimento-main .chat-item-avatar { width:40px; height:40px; font-size:13px; font-weight:600; }
.atendimento-main .chat-item-info { display:flex; flex-direction:column; gap:4px; }
.ci-top { display:flex; align-items:center; gap:6px; min-width:0; }
.atendimento-main .ci-top strong { display:block; margin:0; font-size:14px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; }
.atendimento-main .chat-item.unread .ci-top strong { font-weight:700; }
.chip { flex-shrink:0; font-style:normal; font-size:11px; font-weight:600; padding:2px 6px; border-radius:5px; }
.chip-client { background:#E8EEFC; color:#1E3FA8; } .chip-partner { background:#EFE8FB; color:#5B2FA8; }
.chip-group { background:#DDF1F3; color:#0B5A64; } .chip-lead { background:#EEF0F3; color:#3B4352; }
.ci-preview { margin:0; font-size:13px; color:var(--mut); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ci-meta { display:flex; align-items:center; gap:6px; font-size:12px; color:var(--mut); }
.ci-meta small { font-size:12px; } .ci-meta .pin { font-size:15px; color:var(--na); }
.ci-meta .pend { display:flex; align-items:center; gap:2px; color:#9A3412; font-weight:600; font-size:12px; }
.ci-meta .pend .ms { font-size:15px; }
.ci-side { display:flex; flex-direction:column; align-items:flex-end; gap:6px; flex-shrink:0; }
.wait-chip { font:600 12px 'Geist Mono',monospace; color:var(--mut); padding:2px 6px; border-radius:5px; }
.wait-chip.is-late { color:#B42318; background:#FDE7E5; } .wait-chip.is-wait { color:#9A3412; background:#FFF1DE; }
.unread-badge { min-width:20px; height:20px; padding:0 6px; border-radius:10px; background:#15803D; color:#fff; font-size:12px; font-weight:600; display:grid; place-items:center; box-sizing:border-box; }

/* Conversa */
.atendimento-main .chat-view-header.cvh { height:68px; flex-shrink:0; padding:0 12px 0 20px; background:#fff; border-bottom:1px solid var(--line); gap:12px; }
.cvh-id { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.atendimento-main .cvh-id strong { font-size:16px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.cvh-id small { font-size:13px; color:var(--mut); }
.pend-pill { height:36px; padding:0 12px; border-radius:18px; border:0; background:#FFE9D6; color:#9A3412; font-size:13px; font-weight:600; display:flex; align-items:center; gap:6px; cursor:pointer; }
.pend-pill .ms { font-size:18px; }
.atendimento-main .client-status-bar { background:#fff; border-bottom:1px solid var(--line); padding:8px 20px; font-size:13px; color:var(--mut); }
.atendimento-main .client-status-bar.client-known, .atendimento-main .client-status-bar.client-unknown { background:#fff; color:var(--mut); }
.atendimento-main .client-status-bar button { background:#fff; color:var(--ink); border:1px solid #D5D9E0; border-radius:8px; padding:6px 12px; font-size:12px; font-weight:600; }
.atendimento-main .client-status-bar button#saveClientBtn, .atendimento-main .client-status-bar button#confirmTransferBtn { background:var(--ink); color:#fff; border-color:var(--ink); }
.atendimento-main .actions-menu { border-radius:10px; }
.context-strip { flex-shrink:0; display:flex; gap:8px; padding:10px 16px; background:#FFFBEA; border-bottom:1px solid #F0DC8A; overflow-x:auto; align-items:stretch; }
.strip-label { display:flex; flex-direction:column; justify-content:center; gap:2px; padding-right:6px; flex-shrink:0; }
.strip-label b { display:flex; align-items:center; gap:4px; font-size:12px; font-weight:600; color:var(--na); }
.strip-label .ms { font-size:16px; } .strip-label small { font-size:11px; color:#5C4A12; }
.strip-card { flex-shrink:0; width:230px; background:#FFF4CC; border:1px solid #E9C84E; border-radius:9px; padding:8px 10px; display:flex; gap:6px; align-items:flex-start; }
.strip-card.is-pend { background:#FFF1DE; border-color:#E58A3A; }
.strip-card span { font-size:12px; line-height:1.4; color:var(--nt); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.strip-card .ib { width:28px; height:28px; margin:-4px 0 0 -6px; color:#B4410A; } .strip-card .ib .ms { font-size:20px; }
.strip-card .pin { font-size:18px; color:var(--na); }
.strip-all { flex-shrink:0; margin-left:auto; min-height:44px; padding:0 12px; border-radius:9px; border:1px solid var(--nb); background:#fff; color:var(--nt); font-size:12px; font-weight:600; cursor:pointer; }
.atendimento-main .chat-messages { padding:20px 28px 24px; gap:10px; background:var(--bg); }
.timeline-divider { align-self:center; font-size:12px; font-weight:500; color:#3B4352; background:#fff; padding:4px 12px; border-radius:12px; margin:6px 0; }
.atendimento-main .message-bubble { max-width:68%; font-size:14px; line-height:1.45; padding:8px 34px 6px 12px; }
.atendimento-main .message-bubble.received { background:#fff; border:1px solid var(--line); border-radius:14px 14px 14px 4px; }
.atendimento-main .message-bubble.sent { background:#DCE7FD; color:var(--ink); border-radius:14px 14px 4px 14px; }
.atendimento-main .message-bubble.sent .reply-quote { background:rgba(12,18,32,.06); color:#3B4352; border-left-color:var(--blue); }
.atendimento-main .message-bubble time { font-size:11px; color:#5B6472; opacity:1; text-align:right; }
.atendimento-main .bubble-reply-btn { background:transparent; }
/* nota interna na linha do tempo */
.internal-note { align-self:center; width:100%; max-width:540px; background:#FFF4CC; border:1.5px solid #E9C84E; border-radius:10px; padding:10px 14px; display:flex; flex-direction:column; gap:6px; color:var(--nt); margin:4px 0; }
.internal-note.is-open { background:#FFF1DE; border-color:#E58A3A; }
.internal-note.is-done { background:#F7F5EC; border-color:#D9D2B8; }
.in-head { display:flex; align-items:center; gap:8px; font-size:12px; font-weight:600; color:var(--na); }
.in-head .ms { font-size:16px; } .in-badges { margin-left:auto; display:flex; gap:6px; align-items:center; }
.nb { font-style:normal; font-size:11px; font-weight:600; padding:2px 7px; border-radius:5px; display:inline-flex; align-items:center; gap:2px; }
.nb .ms { font-size:14px; } .nb-pin { padding:0; color:var(--na); } .nb-open { background:#FFE2C7; color:#9A3412; } .nb-done { background:#DCF3E4; color:#14532D; }
.in-body { font-size:14px; line-height:1.45; white-space:pre-wrap; word-break:break-word; }
.internal-note.is-done .in-body { text-decoration:line-through; color:var(--mut); }
.in-foot { display:flex; align-items:center; gap:4px; font-size:12px; color:#5C4A12; }
.in-foot > span { flex:1; }
.note-resolve { height:32px; padding:0 10px; border-radius:8px; border:1px solid #D9B94A; background:#FFFBEA; color:var(--nt); font-size:12px; font-weight:500; display:flex; align-items:center; gap:6px; cursor:pointer; }
.note-resolve .ms { font-size:18px; }
.internal-note .ib { width:32px; height:32px; color:var(--na); } .internal-note .ib .ms { font-size:18px; } .internal-note .ib.is-on { background:#FFE08A; }

/* Composer */
.atendimento-main .composer.chat-input-area { margin:0 16px 16px; padding:0; background:#fff; border:1.5px solid #D5D9E0; border-radius:14px; display:flex; flex-direction:column; align-items:stretch; gap:0; }
.composer.is-note { background:var(--ny); border:2px solid var(--nb); box-shadow:0 0 0 4px rgba(224,184,58,.18); }
.composer-modes { display:flex; gap:4px; padding:6px 6px 0; align-items:center; flex-wrap:wrap; }
.atendimento-main .composer .cm { height:36px; padding:0 12px; border-radius:9px; border:0; background:transparent; color:#3B4352; font-size:13px; font-weight:500; display:flex; align-items:center; gap:6px; cursor:pointer; }
.atendimento-main .composer .cm.is-active { background:var(--ink); color:#fff; font-weight:600; }
.atendimento-main .composer .cm-note:not(.is-active):hover { background:#FFF4CC; color:var(--nt); }
.composer.is-note .cm { color:#5C4A12; }
.atendimento-main .composer.is-note .cm.is-active { background:var(--na); color:#fff; }
.composer .cm .ms { font-size:18px; } .cm kbd { font:400 11px 'Geist Mono',monospace; color:var(--mut); }
.note-types { margin-left:auto; display:flex; gap:4px; align-items:center; padding-right:4px; }
.note-types small { font-size:12px; color:#5C4A12; }
.atendimento-main .composer .nt { height:32px; padding:0 10px; border-radius:8px; border:1px solid var(--nb); background:transparent; color:var(--nt); font-size:12px; font-weight:600; display:flex; align-items:center; gap:4px; cursor:pointer; }
.atendimento-main .composer .nt.is-on { background:#FFE08A; border-color:var(--na); }
.composer .nt .ms { font-size:16px; }
.composer-note-banner { margin:8px 12px 0; display:flex; align-items:center; gap:8px; font-size:13px; font-weight:600; color:#5C3D00; }
.composer-note-banner .ms { font-size:18px; }
.composer-note-banner button { margin-left:auto; height:28px; padding:0 10px; border-radius:7px; border:1px solid #D9B94A; background:transparent; color:var(--nt); font-size:12px; cursor:pointer; }
.atendimento-main .composer textarea { flex:none; border:0; outline:0; border-radius:0; resize:none; padding:10px 14px; font-size:14px; line-height:1.45; background:transparent; min-height:48px; color:var(--ink); }
.composer.is-note textarea { color:var(--nt); }
.composer-actions { display:flex; align-items:center; gap:2px; padding:0 8px 8px; }
.emoji-wrap { position:relative; display:inline-block; }
.atendimento-main .composer .ib { width:40px; height:40px; background:transparent; color:#3B4352; padding:0; }
.composer.is-note #attachButton { display:none; }
.composer-hint { margin-left:auto; font-size:12px; color:var(--mut); padding-right:10px; }
.composer.is-note .composer-hint { color:#5C4A12; }
.atendimento-main .composer .send-btn { height:40px; padding:0 16px; border-radius:10px; border:0; background:var(--ink); color:#fff; font-size:14px; font-weight:600; display:flex; align-items:center; gap:6px; cursor:pointer; }
.atendimento-main .composer.is-note .send-btn { background:var(--na); }
.send-btn .ms { font-size:18px; }
.atendimento-main .reply-preview-bar { margin:0 16px; border-radius:10px 10px 0 0; background:#fff; border-left-color:var(--blue); }

/* Gaveta de contexto */
.context-drawer { position:absolute; top:0; right:0; bottom:0; width:380px; max-width:100%; background:#fff; box-shadow:-12px 0 40px rgba(12,18,32,.16);
  display:flex; flex-direction:column; overflow:auto; z-index:5; transform:translateX(105%); visibility:hidden; transition:transform .2s ease, visibility .2s; }
.context-drawer.is-open { transform:none; visibility:visible; }
.cd-head { height:68px; flex-shrink:0; display:flex; align-items:center; justify-content:space-between; padding:0 8px 0 16px; border-bottom:1px solid var(--line); }
.cd-head div { display:flex; flex-direction:column; min-width:0; } .cd-head b { font-size:15px; } .cd-head small { font-size:12px; color:var(--mut); }
.notes-panel { padding:16px 16px 12px; display:flex; flex-direction:column; gap:10px; border-bottom:1px solid var(--line); }
.np-head { display:flex; align-items:center; gap:8px; } .np-head .ms { font-size:18px; color:var(--na); }
.np-head h3 { margin:0; font-size:14px; font-weight:600; } .np-head small { font-size:12px; color:var(--mut); }
.np-new { margin-left:auto; height:32px; padding:0 10px; border-radius:8px; border:1px solid var(--nb); background:var(--ny); color:var(--nt); font-size:12px; font-weight:600; display:flex; align-items:center; gap:4px; cursor:pointer; }
.np-new .ms { font-size:16px; }
.note-item { background:#FFF4CC; border:1px solid #E9C84E; border-radius:10px; padding:10px 10px 6px 12px; display:flex; flex-direction:column; gap:4px; }
.note-item.is-open { background:#FFF1DE; border-color:#E58A3A; } .note-item.is-done { background:#F7F5EC; border-color:#D9D2B8; }
.ni-row { display:flex; align-items:flex-start; gap:8px; } .ni-row .ib { width:24px; height:24px; margin:-2px 0 0 -4px; color:#B4410A; } .ni-row .ib.is-ok { color:#15803D; }
.ni-row .ib .ms { font-size:22px; } .ni-text { flex:1; font-size:13px; line-height:1.45; white-space:pre-wrap; word-break:break-word; color:var(--nt); }
.note-item.is-done .ni-text { text-decoration:line-through; color:var(--mut); }
.ni-foot { display:flex; align-items:center; gap:2px; } .ni-foot small { flex:1; font-size:11px; color:#5C4A12; }
.ni-foot .pin { font-size:14px; color:var(--na); margin-right:2px; } .ni-foot .nb { margin-right:6px; }
.note-item .ib { width:30px; height:30px; color:var(--na); } .note-item .ib .ms { font-size:17px; } .note-item .ib.is-on { background:#FFE08A; }
.np-empty { border:1px dashed var(--nb); border-radius:10px; padding:14px; font-size:13px; color:#5C4A12; text-align:center; }
.cd-data { padding:16px; display:flex; flex-direction:column; gap:8px; font-size:13px; }
.cd-data h3 { margin:0; font-size:14px; font-weight:600; } .cd-data small { color:var(--mut); margin-right:6px; font-size:13px; }
.atb-toast { position:fixed; left:50%; bottom:110px; transform:translateX(-50%); background:var(--ink,#0C1220); color:#fff; font:13px Geist,system-ui,sans-serif; padding:10px 14px; border-radius:10px; display:flex; align-items:center; gap:8px; box-shadow:0 8px 24px rgba(12,18,32,.25); z-index:100; }
.atb-toast .ms { font-size:18px; color:#FACC15; }

@media (max-width: 768px) {
  .atendimento-main .chat-layout { grid-template-columns:1fr; height:100dvh; }
  .atendimento-main .chat-list-header { padding-left:60px; }
  .atendimento-main .chat-view-header.cvh { padding-left:56px; }
  .atendimento-main .chat-messages { padding:14px 12px; }
  .atendimento-main .message-bubble { max-width:86%; }
  .atendimento-main .composer.chat-input-area { margin:0 8px 8px; }
  .composer-hint { display:none; } .composer-actions .send-btn { margin-left:auto; }
  .strip-card { width:200px; }
}
.composer .cm.is-active kbd { color:rgba(255,255,255,.7); }
@media (max-width: 768px) {
  .pend-pill .pp-txt, .cvh-id small { display:none; }
  .pend-pill { padding:0 10px; }
}