.giffyWebChat-interface #intro-emailtext,.giffyWebChat-interface #intro-nametext,.giffyWebChat-interface #intro-text{color:#333;background-color:#f2f2f2;text-align:left;padding:10px;font-weight:400;box-shadow:0 4px 6px rgba(0,0,0,.1)}.giffyWebChat-interface{margin:0;padding:0;box-sizing:border-box}.giffyWebChat-interface body{display:flex;min-height:100vh;background-color:#f4f7fc}.giffyWebChat-interface .sidebar{width:180px;background-color:#2c3e50;color:#fff;height:100vh;padding:20px}.giffyWebChat-interface .sidebar h2{color:#fff;text-align:center;margin-bottom:30px}.giffyWebChat-interface .sidebar ul{list-style:none}.giffyWebChat-interface .sidebar ul li{margin:20px 0}.giffyWebChat-interface .sidebar ul li a{color:#fff;text-decoration:none;font-size:18px}.giffyWebChat-interface .sidebar ul li a:hover{color:#1abc9c}.giffyWebChat-interface .webChat-content{flex:1;display:flex;flex-direction:column}.giffyWebChat-interface .header{background-color:#34495e;color:#fff;padding:15px 20px;text-align:center;height:60px}.giffyWebChat-interface .header h1{font-size:24px;color:#fff;margin:0}.giffyWebChat-interface #main-div{justify-content:right;animation:.3s forwards slideIn;position:fixed;bottom:65px;right:75px;z-index:10}.giffyWebChat-interface #chat-container{z-index:1000;margin-top:30px;animation:.3s forwards slideIn}.giffyWebChat-interface .title{text-align:center;font-weight:700;background-color:#fff;width:100%;max-width:300px;height:55px;border-radius:8px 8px 0 0;box-shadow:0 0 10px rgba(0,0,0,.4);position:relative}.giffyWebChat-interface .title h2{text-align:left;font-size:20px;margin-top:0;padding-top:6px}.giffyWebChat-interface .title #icon{margin:4px 5px 0 9px;height:35px;width:150px}.giffyWebChat-interface .closeBtn{color:#000;float:right}.giffyWebChat-interface .close-button{float:right;margin:9px 4px 9px 10px;cursor:pointer;font-weight:700}.giffyWebChat-interface .close-button:hover{color:#aaabfe}.giffyWebChat-interface .min-img{height:25px;width:25px;border-radius:50%;cursor:pointer;transition:.2s;margin:5px 6px -10px 0}.giffyWebChat-interface .min-img:active{transform:translateY(2px)}.giffyWebChat-interface .min-img:hover{background-color:#eef3f9}.giffyWebChat-interface .chat-container{height:302px;overflow-y:auto;width:100%;max-width:296px;border-style:solid;border-color:#f5f7f8;background:#fff;box-shadow:0 6px 12px rgba(0,0,0,.4)}.giffyWebChat-interface .chat-container::-webkit-scrollbar{width:3px;height:8px}.giffyWebChat-interface #intro{position:relative}.giffyWebChat-interface #intro img{display:block}.giffyWebChat-interface #intro img:first-child{height:70px;width:70px;margin:40px auto 100px;object-fit:cover}.giffyWebChat-interface #intro img:last-child{border-radius:50%;height:35px;width:35px;object-fit:cover;margin:-60px 0 50px 3px}.giffyWebChat-interface #intro-emailtext,.giffyWebChat-interface #intro-text{font-size:12px;border-radius:0 18px 18px;margin:-60px 8px 9px 42px;width:200px}.giffyWebChat-interface #intro-nametext{font-size:12px;border-radius:0 18px 18px;margin:0 8px 9px 42px;width:200px}.giffyWebChat-interface .message{padding:10px;width:fit-content;word-wrap:break-word}.giffyWebChat-interface .user{justify-content:flex-end}.giffyWebChat-interface .bot{justify-content:flex-start}.giffyWebChat-interface .client-message{background-color:#e3f2fd;margin-left:auto;margin-right:5px;margin-bottom:3%;border-radius:25px 1px 25px 25px;color:#1565c0;font-size:14px}.giffyWebChat-interface .operator-message{background-color:#f5f5f5;color:#424242;border-radius:1px 25px 25px;margin:3% 20% 4% 38px;font-size:14px}.giffyWebChat-interface .avatar{width:30px;height:30px;border-radius:50%;margin:0 8px}.giffyWebChat-interface .user .avatar{order:2;background:url("https://ej2.syncfusion.com/demos/src/grid/images/3.png") 0 0/cover}.giffyWebChat-interface .bot .avatar{order:1;background:url("/images/main/MainIcon.png") 0 0/cover}.giffyWebChat-interface .text{margin-left:8px;margin-bottom:8px;max-width:80%;font-size:12px;color:#000;font-weight:400;padding:8px;border-radius:10px;box-shadow:0 4px 6px rgba(0,0,0,.1)}.giffyWebChat-interface .input-container,.giffyWebChat-interface .name-input-container{height:50px;width:100%;max-width:296px;border-style:solid;border-color:#f5f7f8;background:#fff;box-shadow:0 6px 10px rgba(0,0,0,.4);position:relative;display:flex}.giffyWebChat-interface .user .text{background:#fff}.JoiningClient-Name{display:inline-block;padding:5px 15px;background-color:#e3f2fd;border:1px solid #ccc;border-radius:20px;font-size:14px;color:#333;margin:5px;box-shadow:0 2px 5px rgba(0,0,0,.1);position:relative;bottom:45px;left:30px}.giffyWebChat-interface .bot .text{background:#eff8ff;word-wrap:break-word}.giffyWebChat-interface .name-input-container{text-align:center;border-bottom-left-radius:14px}.giffyWebChat-interface .name-input-container input{background-color:#f2f2f2;border:none;color:#111827;font-size:14px;border-radius:5.375rem;padding:18px 30px 18px 15px;width:calc(100% - 50px);margin:5px 6px 5px 5px;outline:0}.giffyWebChat-interface #sendEmailBtn,.giffyWebChat-interface .button,.giffyWebChat-interface .send-button{position:absolute;right:8px;transform:translateY(-50%);cursor:pointer}.giffyWebChat-interface .input{background-color:#f2f2f2;border:none;color:#111827;font-size:14px;border-radius:20px;padding:10px 15px;width:calc(98% - 50px);margin:6px}.giffyWebChat-interface .input:focus{outline:0;border-color:#3b82f6}.giffyWebChat-interface .button{height:32px;width:32px;top:50%}.giffyWebChat-interface #sendEmailBtn{height:36px;width:36px;top:50%}.giffyWebChat-interface .send-button{height:34px;width:34px;top:53%}.system-message{text-align:center;padding:5px;margin:15px 13px;font-size:11px;color:#000}.giffyWebChat-interface button{padding:12px 20px;background-color:#2196f3;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px;transition:background-color .3s}.giffyWebChat-interface button:hover{background-color:#1976d2}.giffyWebChat-interface .start-button{position:fixed;z-index:1000;bottom:20px;right:20px;padding:10px 20px;background-color:#2196f3;color:#fff;border:none;border-radius:20px;cursor:pointer;transition:.3s}.start-button.active{border-radius:50%;padding:15px;width:50px;height:50px;display:flex;align-items:center;justify-content:center}.giffyWebChat-interface .start-button .button-text{font-size:16px;display:inline;margin:0}.giffyWebChat-interface #closeButton{padding:10px 30px;color:#fff;border:none;border-radius:30px;cursor:pointer;transition:.3s;position:relative;width:100px;margin-right:20px;background-color:#f44336}.giffyWebChat-interface #closeButton:hover{background-color:#d32f2f}.giffyWebChat-interface .error-message{color:#000;background-color:#c3e7ff;border-radius:20px;padding:8px 15px;font-size:12px;display:inline;position:sticky;bottom:15px;left:28%;transform:translateX(-50%);box-sizing:border-box;opacity:0;transition:opacity .3s,transform .3s;z-index:9999}.giffyWebChat-interface .error-message.show{opacity:1;transform:translateX(-50%) translateY(-10px)}.giffyWebChat-interface .error-message.hide{opacity:0;transform:translateX(-50%) translateY(10px)}@media (max-width :768px){.giffyWebChat-interface .sidebar{width:70px;padding:15px 10px}.giffyWebChat-interface .sidebar h2{font-size:14px;margin-bottom:20px}.giffyWebChat-interface .sidebar ul li a{font-size:14px}.giffyWebChat-interface #main-div{margin:15px;justify-content:center}.giffyWebChat-interface .start-button{bottom:10px;right:10px}}@media (max-width :480px){.giffyWebChat-interface .sidebar{display:none}.giffyWebChat-interface .webChat-content{width:100%}.giffyWebChat-interface .header{height:50px;padding:10px}.giffyWebChat-interface .header h1{font-size:18px}.giffyWebChat-interface .chat-container,.giffyWebChat-interface .input-container,.giffyWebChat-interface .name-input-container,.giffyWebChat-interface .title{max-width:100%;width:100%}.giffyWebChat-interface #intro-text{width:70%}.giffyWebChat-interface .error-message{left:50%}}