.responsive-chat-container{z-index:1000;background:#f8f9fa;flex-direction:column;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;display:flex;position:fixed;inset:0}.chat-header{background:#fff;border-bottom:1px solid #e9ecef;justify-content:space-between;align-items:center;padding:1rem 1.5rem;display:flex;box-shadow:0 2px 4px #0000001a}.chat-header h2{color:#333;margin:0;font-size:1.5rem;font-weight:600}.close-btn{cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:.5rem;transition:background .2s;display:flex}.close-btn:hover{background:#f8f9fa}.chat-content{flex:1;display:flex;overflow:hidden}.chat-sidebar{background:#fff;border-right:1px solid #e9ecef;flex-direction:column;width:300px;min-width:300px;display:flex}.search-box{background:#f8f9fa;border:1px solid #e9ecef;border-radius:20px;align-items:center;margin:1rem;padding:.5rem 1rem;display:flex}.search-box svg{color:#666;margin-right:.5rem}.search-box input{background:0 0;border:none;outline:none;flex:1;font-size:.9rem}.search-box input::placeholder{color:#999}.chats-list{flex:1;padding:.5rem 0;overflow-y:auto}.chat-item{cursor:pointer;border-bottom:1px solid #f8f9fa;align-items:center;padding:1rem;transition:background .2s;display:flex}.chat-item:hover{background:#f8f9fa}.chat-item.active{background:#e3f2fd;border-right:3px solid #0063b1}.chat-avatar{margin-right:.75rem}.chat-avatar img{-o-object-fit:cover;object-fit:cover;border-radius:50%;width:48px;height:48px}.chat-info{flex:1;min-width:0}.chat-name{color:#333;white-space:nowrap;text-overflow:ellipsis;margin-bottom:.25rem;font-weight:600;overflow:hidden}.chat-preview{color:#666;white-space:nowrap;text-overflow:ellipsis;font-size:.85rem;overflow:hidden}.chat-time{color:#999;margin-left:.5rem;font-size:.75rem}.chat-main{background:#f8f9fa;flex-direction:column;flex:1;display:flex}.empty-chat{color:#999;text-align:center;flex-direction:column;justify-content:center;align-items:center;height:100%;padding:2rem;display:flex}.empty-chat h3{color:#666;margin:1rem 0 .5rem;font-size:1.5rem}.empty-chat p{max-width:300px;font-size:1rem}.chat-header-main{background:#fff;border-bottom:1px solid #e9ecef;padding:1rem 1.5rem;box-shadow:0 2px 4px #0000000d}.user-info{align-items:center;display:flex}.user-avatar{-o-object-fit:cover;object-fit:cover;border-radius:50%;width:40px;height:40px;margin-right:.75rem}.user-info h3{color:#333;margin:0 0 .25rem;font-size:1.1rem;font-weight:600}.messages-area{flex-direction:column;flex:1;gap:.75rem;padding:1rem;display:flex;overflow-y:auto}.message{align-items:flex-end;gap:.5rem;max-width:70%;display:flex}.message.own{flex-direction:row-reverse;align-self:flex-end}.message.other{align-self:flex-start}.message-bubble{word-wrap:break-word;background:#fff;border-radius:18px;padding:.75rem 1rem;position:relative;box-shadow:0 1px 2px #0000001a}.message.own .message-bubble{color:#fff;background:#0063b1}.message-bubble p{margin:0;font-size:.9rem;line-height:1.4}.message-time{color:#999;margin-top:.25rem;font-size:.75rem;display:block}.message.own .message-time{color:#fffc}.message-input-area{background:#fff;border-top:1px solid #e9ecef;align-items:center;gap:.5rem;padding:1rem;display:flex}.message-input-area input{background:#f8f9fa;border:1px solid #e9ecef;border-radius:24px;outline:none;flex:1;padding:.75rem 1rem;font-size:.9rem;transition:border-color .2s}.message-input-area input:focus{background:#fff;border-color:#0063b1}.message-input-area input::placeholder{color:#999}.send-btn{color:#fff;cursor:pointer;background:#0063b1;border:none;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;transition:background .2s;display:flex}.send-btn:hover{background:#103996}.mobile-chat-list-header{background:#fff;border-bottom:1px solid #e9ecef;justify-content:space-between;align-items:center;padding:1rem 1.5rem;display:flex;box-shadow:0 2px 4px #0000001a}.mobile-chat-list-header h2{color:#333;margin:0;font-size:1.5rem;font-weight:600}.mobile-chat-list{background:#fff;flex-direction:column;flex:1;display:flex}.mobile-chat-list .search-box{margin:1rem}.mobile-chat-list .chats-list{flex:1;padding:.5rem 0;overflow-y:auto}.mobile-chat-header{z-index:10;background:#fff;border-bottom:1px solid #e9ecef;align-items:center;padding:1rem;display:flex;box-shadow:0 2px 4px #0000001a}.back-button,.close-button{cursor:pointer;color:#0063b1;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:.5rem;font-size:1rem;transition:background .2s;display:flex}.back-button:hover,.close-button:hover{background:#f8f9fa}.chat-user-info{flex:1;align-items:center;margin:0 1rem;display:flex}.user-avatar{margin-right:.75rem}.user-avatar img{-o-object-fit:cover;object-fit:cover;border-radius:50%;width:40px;height:40px}.user-details h3{color:#333;margin:0;font-size:1rem;font-weight:600}.online-status{color:#28a745;font-size:.75rem}.mobile-chat-view{background:#f8f9fa;flex-direction:column;flex:1;display:flex}.mobile-chat-view .messages-area{flex-direction:column;flex:1;gap:.75rem;padding:1rem;display:flex;overflow-y:auto}.mobile-chat-view .message-input-area{background:#fff;border-top:1px solid #e9ecef;align-items:center;gap:.5rem;padding:1rem;display:flex}@media (max-width:768px){.responsive-chat-container.mobile{flex-direction:column;width:100vw;height:100vh;display:flex}.responsive-chat-container.mobile .chat-sidebar{width:100%;min-width:auto}.responsive-chat-container.mobile .chat-main{width:100%}.message{max-width:85%}.message-bubble{padding:.75rem 1rem}.message-input-area{padding:.75rem}.message-input-area input{padding:.5rem .75rem}.mobile-chat-list,.mobile-chat-view{height:100%;overflow:hidden}}@media (min-width:769px) and (max-width:1024px){.chat-sidebar{width:280px;min-width:280px}}@media (min-width:1200px){.chat-sidebar{width:350px;min-width:350px}}.chats-list::-webkit-scrollbar{width:4px}.messages-area::-webkit-scrollbar{width:4px}.chats-list::-webkit-scrollbar-track{background:#f1f1f1}.messages-area::-webkit-scrollbar-track{background:#f1f1f1}.chats-list::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:2px}.messages-area::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:2px}.chats-list::-webkit-scrollbar-thumb:hover{background:#a8a8a8}.messages-area::-webkit-scrollbar-thumb:hover{background:#a8a8a8}.chat-item,.message,.message-bubble{transition:all .2s}.close-btn:focus,.send-btn:focus,.chat-item:focus{outline-offset:2px;outline:2px solid #0063b1}