.chat-root{background:#fff;border:1px solid #dce5f2;border-radius:16px;overflow:hidden;box-shadow:0 8px 32px #18375d06}.chat-top{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid #e5ebf4;gap:12px;flex-wrap:wrap}.chat-connection{font-size:12px;font-weight:700;color:#98670d;display:flex;align-items:center;gap:8px}.chat-connection:before{content:'';width:8px;height:8px;border-radius:50%;background:#e1a841}.chat-connection.connected{color:#137b60}.chat-connection.connected:before{background:#20ae80}.chat-account-label{display:flex;gap:8px;align-items:center;font-size:11px;color:#71829a}.chat-account-label select{padding:5px 8px;border:1px solid #dce5f2;border-radius:6px;background:#fff;max-width:190px}
.chat-inbox>.chat-account-label{display:grid;grid-template-columns:92px minmax(0,1fr);gap:8px;padding:0 16px 8px}
.chat-inbox>.chat-account-label select{max-width:none;width:100%;padding:7px 9px;font-size:12px;color:#294765}.chat-error{padding:12px 20px;color:#9b392c;background:#fff2ee;font-size:12px;line-height:1.5}.chat-layout{display:grid;grid-template-columns:290px minmax(320px,1fr) 250px;height:650px;height:min(760px,calc(100vh - 300px));min-height:480px}.chat-inbox{border-right:1px solid #e5ebf4;display:flex;flex-direction:column;min-width:0;overflow:auto}.chat-inbox-title{display:flex;align-items:center;justify-content:space-between;padding:20px 16px 12px}.chat-inbox-title h2{font-size:16px;margin:0}.chat-search{display:flex;align-items:center;gap:8px;margin:0 16px 12px;background:#f2f5fa;border:1px solid transparent;border-radius:9px;padding:8px 10px;color:#8190a6}.chat-search:focus-within{border-color:#8db8ff}.chat-search input{width:100%;min-width:0;border:0;outline:none;background:transparent;font:inherit;font-size:12px;padding:0}.chat-filters{display:flex;gap:5px;padding:4px 16px 12px}.chat-filters button{border:0;background:transparent;color:#73849a;font:inherit;font-size:11px;padding:7px 10px;border-radius:20px;cursor:pointer}.chat-filters .active{color:#1a64ca;background:#eaf2ff;font-weight:700}.chat-new{margin:0 16px 12px;font-size:12px;color:#2867b8}.chat-new summary,.chat-link summary{cursor:pointer;padding:8px 0}.chat-customer-form{display:grid;gap:10px;padding:8px 0}.chat-customer-form label{display:grid;gap:6px;font-size:11px;color:#677d98}.chat-customer-form select{min-width:0;width:100%;border:1px solid #dce5f2;padding:9px 6px;border-radius:7px;background:#fff;font:inherit}.chat-contact{display:flex;align-items:center;gap:10px;padding:16px 14px;text-decoration:none;border-left:3px solid transparent;border-bottom:1px solid #f0f3f8;color:inherit;min-width:0}.chat-contact:hover{background:#f6f9fd}.chat-contact.selected{border-left-color:#216cec;background:#edf4ff}.chat-contact .avatar{width:36px;height:36px;font-size:11px;flex:none;background:#e5edf8;color:#557599}.chat-contact-main{flex:1;min-width:0;display:grid;gap:5px}.chat-contact-main strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-contact-main>span{font-size:11px;color:#7b8aa0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-contact-meta{display:grid;gap:8px;justify-items:end}.chat-contact-meta time{font-size:9px;color:#8391a5;max-width:40px;text-align:right}.chat-contact-meta b{font-size:10px;background:#216cec;color:#fff;border-radius:15px;min-width:18px;height:18px;display:grid;place-items:center}.chat-empty-small{padding:22px 18px;font-size:12px;color:#7a8a9f;line-height:1.7}.chat-empty-small strong{color:#536983;font-size:12px}.chat-conversation{display:flex;flex-direction:column;min-width:0;overflow:hidden;background:#f5f8fc}.chat-thread-head{display:flex;align-items:center;gap:10px;padding:16px 20px;background:#fff;border-bottom:1px solid #e5ebf4;min-height:72px}.chat-thread-head:empty{display:none}.chat-thread-head>div{flex:1}.chat-thread-head strong{font-size:13px}.chat-thread-head small{display:block;margin-top:4px;font-size:11px;color:#8390a4}.chat-thread-head .badge{font-size:9px}.chat-messages{flex:1;min-height:0;overflow:auto;padding:24px;display:flex;flex-direction:column;align-items:flex-start;gap:12px;scrollbar-width:thin}.chat-welcome{margin:auto;text-align:center;max-width:365px;color:#8b9bb0;line-height:1.8;padding:22px}.chat-welcome>svg{color:#4384d7;background:#e7effb;padding:12px;box-sizing:content-box;border-radius:20px}.chat-welcome h2{font-size:18px;color:#294765;line-height:1.5;font-weight:600}.chat-welcome p{font-size:12px}.chat-welcome small{font-size:10px;display:block;margin-top:22px}.chat-bubble{flex-shrink:0;max-width:85%;min-width:140px;background:#fff;border:1px solid #e8edf4;border-radius:0 13px 13px 13px;padding:12px 14px;box-shadow:0 2px 3px #122d4d03;overflow-wrap:anywhere}.chat-bubble.outgoing{align-self:flex-end;background:#e9f1ff;border-color:#dfebfe;border-radius:13px 0 13px 13px}.chat-text{white-space:pre-wrap;margin:0 0 7px;font-size:13px;line-height:1.65;color:#29415d}.chat-bubble footer{display:flex;flex-wrap:wrap;gap:5px 14px;justify-content:flex-end;font-size:9px;color:#8b9bb0;margin-top:7px}.chat-message-status.read{color:#1672d7}.chat-message-status.uncertain,.chat-message-status.failed,.chat-message-status.blocked{color:#b16a0d}.chat-message-reason{display:block;color:#98670d;line-height:1.5;margin-top:7px;font-size:10px}.chat-image-link img{display:block;max-width:100%;max-height:260px;border-radius:8px;object-fit:contain}.chat-bubble audio{width:265px;max-width:100%;height:38px}.chat-document{display:flex;gap:10px;align-items:center;color:#245a9c;text-decoration:none;font-size:12px;padding:6px 0}.chat-document span{min-width:0;flex:1}.chat-document small{display:block;font-size:10px;color:#8090a4;margin-top:6px}.chat-notice{font-style:italic;color:#76869a;background:#edf1f6;align-self:center;font-size:11px}.chat-older{align-self:center;flex:none}.chat-compose{background:#fff;padding:14px 18px 10px;border-top:1px solid #e5ebf4}.chat-compose-row{display:flex;align-items:center;gap:10px}.chat-compose textarea{flex:1;resize:none;min-width:0;max-height:130px;background:#f5f7fb;border:1px solid #e5ebf4;border-radius:10px;padding:10px 12px;font:inherit;font-size:12px;line-height:1.5;outline:none}.chat-compose textarea:focus{border-color:#94b9f3}.chat-compose .btn{flex:none;font-size:12px}.chat-compose-hint{font-size:9px;color:#93a1b3;margin:8px 0 0 37px}.chat-attach{display:grid;place-items:center;cursor:pointer;color:#6584aa;position:relative;width:28px;height:36px;overflow:hidden}.chat-attach input{position:absolute;opacity:0;inset:0;width:100%;cursor:pointer}.chat-file-preview{display:flex;align-items:center;gap:10px;background:#f3f7ff;border-radius:8px;padding:8px 10px;margin-bottom:9px;color:#446888;font-size:11px}.chat-file-preview>span{flex:1}.chat-file-preview small{display:block;color:#8291a6;margin-top:3px}.chat-reply-reason{font-size:12px;padding:14px 20px;margin:0;background:#fff8e8;color:#987231;line-height:1.6}.chat-context{background:#fff;border-left:1px solid #e5ebf4;padding:24px 18px;overflow:auto;font-size:12px;color:#74869d}.chat-context-label{font-size:9px;letter-spacing:1.2px;color:#9aa8bb;margin-bottom:24px}.chat-context h3{font-size:12px;color:#365272;margin:15px 0}.chat-context p{font-size:11px;line-height:1.7}.chat-context>small{display:block;margin-top:12px;font-size:9px;color:#8799af}.chat-context hr{border:0;border-top:1px solid #edf1f7;margin:24px 0}.chat-link{margin-top:12px;font-size:10px}.chat-order{display:grid;grid-template-columns:1fr auto;gap:10px;text-decoration:none;color:#315879;background:#f6f8fc;border:1px solid #e8edf5;border-radius:8px;margin-top:9px;padding:12px;font-size:11px}.chat-order small{grid-column:1/-1;font-size:10px;color:#8292a7;line-height:1.5}.chat-context-note{border-top:1px solid #edf1f7;padding-top:20px;margin-top:25px;font-size:10px;line-height:1.8;color:#91a0b4}.chat-context-empty{text-align:center;padding-top:65px;line-height:1.8}.chat-sr{position:absolute;clip:rect(0,0,0,0);width:1px;height:1px;overflow:hidden}.chat-back{display:none}.chat-root [hidden]{display:none!important}
@media(min-width:1550px){.chat-layout{grid-template-columns:310px minmax(350px,1fr) 265px}}@media(max-width:1200px){.chat-layout{grid-template-columns:250px minmax(260px,1fr)}.chat-context{display:none}}@media(max-width:700px){.chat-layout{display:flex;height:calc(100vh - 300px);min-height:470px}.chat-inbox{width:100%;border:0}.chat-conversation{display:none;width:100%}.chat-selected .chat-inbox{display:none}.chat-selected .chat-conversation{display:flex}.chat-back{display:flex}.chat-top{padding:12px}.chat-account-label{font-size:0}
.chat-inbox>.chat-account-label{grid-template-columns:1fr}.chat-account-label select{font-size:11px}.chat-messages{padding:16px}.chat-compose{padding:12px}.chat-bubble{max-width:94%}.chat-compose-hint{font-size:8px;margin-left:0}.chat-thread-head{padding:12px}.chat-thread-head .badge{display:none}}

.chat-thread-head{flex-wrap:wrap}.chat-stage-form{flex:1 0 100%;display:flex;gap:8px;align-items:flex-end}.chat-stage-form label{display:grid;gap:4px;font-size:10px;color:#647b99;flex:1}.chat-stage-form select{width:100%;min-height:32px}.chat-contact-main .badge{align-self:flex-start;width:max-content;max-width:100%;font-size:9px;margin:4px 0}.chat-context form[data-chat-form="crmStage"]{display:grid;gap:8px;margin-top:10px}