.chat-button{position:fixed;bottom:70px;right:20px;width:50px;height:50px;background-color:var(--card-color);color:var(--primary-color);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px #0003;cursor:pointer;z-index:10000;transition:all .3s ease;overflow:visible}.chat-icon-container{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%}.chat-icon-container .material-icons{font-size:22px;color:var(--primary-color);line-height:1}.chat-dots{display:flex;margin-top:2px}.chat-dots span{color:var(--primary-color);font-size:6px;margin:0 1px}.chat-button:hover{transform:scale(1.1);box-shadow:0 6px 15px #0000004d}.chat-modal{display:none;position:fixed;bottom:110px;right:20px;width:350px;height:500px;background-color:var(--card-color);border-radius:10px;box-shadow:0 5px 20px #0003;z-index:9999;overflow:hidden;flex-direction:column;border:1px solid var(--border-color)}.chat-modal.active{display:flex!important}.chat-modal-content{display:flex;flex-direction:column;height:100%;overflow:hidden}.chat-header{display:flex;justify-content:space-between;align-items:center;padding:15px;background-color:var(--primary-color);color:#fff;position:sticky;top:0;z-index:10;flex-shrink:0}.chat-header h3{margin:0;font-size:16px}.close-chat{background:none;border:none;color:#fff;font-size:24px;cursor:pointer}.chat-messages{flex:1;padding:15px;overflow-y:auto;display:flex;flex-direction:column;gap:10px;height:calc(100% - 130px);scroll-behavior:smooth;position:relative}.scroll-to-bottom{position:absolute;bottom:20px;right:20px;width:40px;height:40px;background-color:var(--primary-color);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 10px #0003;z-index:5;opacity:.8;transition:all .3s ease}.scroll-to-bottom:hover{opacity:1;transform:scale(1.1)}.message{max-width:80%;padding:10px 15px;border-radius:18px;margin-bottom:5px;word-break:break-word;position:relative}.message-time{font-size:10px;opacity:.7;margin-top:5px}.message.admin{align-self:flex-start;background-color:var(--primary-color);color:var(--font-color);border-bottom-left-radius:5px}.message.user{align-self:flex-end;background-color:var(--primary-color);color:var(--btn-font-color);border-bottom-right-radius:5px}.chat-input-container{display:flex;padding:10px;border-top:1px solid #eee;background-color:var(--bg-color);position:sticky;bottom:0;z-index:10;min-height:60px;flex-shrink:0}#chatInput{flex:1;border:1px solid var(--border-color);border-radius:20px;padding:8px 15px;resize:none;outline:none;font-family:inherit;max-height:100px;overflow-y:auto;color:var(--font-color);background-color:var(--input-color)}#sendMessageBtn{background-color:var(--primary-color);color:#fff;border:none;border-radius:20px;padding:8px 15px;margin-left:10px;cursor:pointer;transition:background-color .3s;align-self:flex-end}#sendMessageBtn:hover{background-color:var(--primary-color)}#sendMessageBtn:disabled{background-color:#a5a5a5;cursor:not-allowed}.chat-loading{display:flex;justify-content:center;align-items:center;height:100%}.spinner{width:40px;height:40px;border:4px solid rgba(0,0,0,.1);border-radius:50%;border-top-color:var(--primary-color);animation:spin 1s ease-in-out infinite}@keyframes spin{to{transform:rotate(360deg)}}.no-messages{text-align:center;color:var(--placeholder-text-color);margin-top:20px}.unread-count{position:absolute;top:-5px;right:-5px;background-color:var(--error-text-color);color:#fff;border-radius:50%;width:18px;height:18px;font-size:11px;display:flex;align-items:center;justify-content:center;font-weight:700;border:1px solid white;box-shadow:0 2px 5px #0003;z-index:10002}#newChatButton{position:fixed;bottom:30px;right:30px;width:50px;height:50px;background-color:var(--card-color);color:var(--primary-color);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 10px #0003;cursor:pointer;z-index:10001;overflow:visible}.image-upload{display:flex;align-items:flex-end;padding:5px;cursor:pointer}.image-upload .el-icon{color:var(--primary-color);font-size:24px;transition:none}.image-upload label{cursor:pointer;display:flex;align-items:center;justify-content:center;background:none}.image-upload label:hover{background:none}.image-upload label:active,.image-upload label:focus{background:none;outline:none}.input-wrapper{flex:1;display:flex;flex-direction:column;gap:5px;margin-right:0}.image-preview{position:relative;max-width:200px;margin-top:5px}.image-preview img{max-width:100%;max-height:100px;border-radius:8px}.remove-image{position:absolute;top:-8px;right:-8px;background:var(--error-text-color);color:#fff;border:none;border-radius:50%;width:20px;height:20px;line-height:20px;text-align:center;cursor:pointer;font-size:14px;padding:0;z-index:1}.remove-image:hover{background:var(--error-text-color);transform:scale(1.1)}.image-viewer-modal{display:none;position:fixed;z-index:99999;padding:20px;left:0;top:0;width:100%;height:100%;background-color:#000000e6;overflow:auto}.modal-image{margin:auto;display:block;max-width:90%;max-height:90vh;-o-object-fit:contain;object-fit:contain;cursor:zoom-out}.close-viewer{position:absolute;right:35px;top:15px;color:#fff;font-size:40px;font-weight:700;cursor:pointer}.close-viewer:hover,.close-viewer:focus{color:#bbb;text-decoration:none;cursor:pointer}