@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap);.v-select{position:relative;font-family:inherit}.v-select,.v-select *{box-sizing:border-box}@-webkit-keyframes vSelectSpinner-ltr{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@-webkit-keyframes vSelectSpinner-rtl{0%{transform:rotate(0deg)}to{transform:rotate(-1turn)}}@keyframes vSelectSpinner-ltr{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes vSelectSpinner-rtl{0%{transform:rotate(0deg)}to{transform:rotate(-1turn)}}.vs__fade-enter-active,.vs__fade-leave-active{pointer-events:none;transition:opacity .15s cubic-bezier(1,.5,.8,1)}.vs__fade-enter,.vs__fade-leave-to{opacity:0}[dir] .vs--disabled .vs__clear,[dir] .vs--disabled .vs__dropdown-toggle,[dir] .vs--disabled .vs__open-indicator,[dir] .vs--disabled .vs__search,[dir] .vs--disabled .vs__selected{cursor:not-allowed;background-color:#f8f8f8}.v-select[dir=rtl] .vs__actions{padding:0 3px 0 6px}.v-select[dir=rtl] .vs__clear{margin-left:6px;margin-right:0}.v-select[dir=rtl] .vs__deselect{margin-left:0;margin-right:2px}.v-select[dir=rtl] .vs__dropdown-menu{text-align:right}.vs__dropdown-toggle{appearance:none;display:flex;white-space:normal}[dir] .vs__dropdown-toggle{padding:0 0 4px 0;background:none;border:1px solid #d8d6de;border-radius:.357rem}.vs__selected-options{display:flex;flex-basis:100%;flex-grow:1;flex-wrap:wrap;position:relative}[dir] .vs__selected-options{padding:0 2px}.vs__actions{display:flex;align-items:center}[dir=ltr] .vs__actions{padding:4px 6px 0 3px}[dir=rtl] .vs__actions{padding:4px 3px 0 6px}[dir] .vs--searchable .vs__dropdown-toggle{cursor:text}[dir] .vs--unsearchable .vs__dropdown-toggle{cursor:pointer}[dir] .vs--open .vs__dropdown-toggle{border-bottom-color:transparent}[dir=ltr] .vs--open .vs__dropdown-toggle,[dir=rtl] .vs--open .vs__dropdown-toggle{border-bottom-left-radius:0;border-bottom-right-radius:0}.vs__open-indicator{fill:rgba(60,60,60,.5);transition:transform .15s cubic-bezier(1,-.115,.975,.855)}[dir] .vs__open-indicator{transform:scale(1);transition-timing-function:cubic-bezier(1,-.115,.975,.855)}[dir=ltr] .vs--open .vs__open-indicator{transform:rotate(180deg) scale(1)}[dir=rtl] .vs--open .vs__open-indicator{transform:rotate(-180deg) scale(1)}.vs--loading .vs__open-indicator{opacity:0}.vs__clear{fill:rgba(60,60,60,.5)}[dir] .vs__clear{padding:0;border:0;background-color:transparent;cursor:pointer}[dir=ltr] .vs__clear{margin-right:8px}[dir=rtl] .vs__clear{margin-left:8px}.vs__dropdown-menu{display:block;box-sizing:border-box;position:absolute;top:calc(100% - 1px);z-index:1000;width:100%;max-height:350px;min-width:160px;overflow-y:auto;list-style:none}[dir] .vs__dropdown-menu{padding:5px 0;margin:0;box-shadow:0 4px 25px 0 rgba(0,0,0,.1);border:1px solid #d8d6de;border-top-style:none;border-radius:0 0 .357rem .357rem;background:#fff}[dir=ltr] .vs__dropdown-menu{left:0;text-align:left}[dir=rtl] .vs__dropdown-menu{right:0;text-align:right}[dir] .vs__no-options{text-align:center}.vs__dropdown-option{line-height:1.42857143;display:block;color:#333;white-space:nowrap}[dir] .vs__dropdown-option{padding:3px 20px;clear:both}[dir] .vs__dropdown-option:hover{cursor:pointer}.vs__dropdown-option--highlight{color:#0065af!important}[dir] .vs__dropdown-option--highlight{background:rgba(0,101,175,.12)}.vs__dropdown-option--disabled{color:rgba(60,60,60,.5)}[dir] .vs__dropdown-option--disabled{background:inherit}[dir] .vs__dropdown-option--disabled:hover{cursor:inherit}.vs__selected{display:flex;align-items:center;color:#333;line-height:1.8;z-index:0}[dir] .vs__selected{background-color:#0065af;border:0 solid rgba(60,60,60,.26);border-radius:.357rem;margin:4px 2px 0 2px;padding:0 .25em}.vs__deselect{display:inline-flex;appearance:none;fill:rgba(60,60,60,.5)}[dir] .vs__deselect{padding:0;border:0;cursor:pointer;background:none;text-shadow:0 1px 0 #fff}[dir=ltr] .vs__deselect{margin-left:4px}[dir=rtl] .vs__deselect{margin-right:4px}[dir] .vs--single .vs__selected{background-color:transparent;border-color:transparent}.vs--single.vs--open .vs__selected{position:absolute;opacity:.4}.vs--single.vs--searching .vs__selected{display:none}.vs__search::-webkit-search-cancel-button{display:none}.vs__search::-ms-clear,.vs__search::-webkit-search-decoration,.vs__search::-webkit-search-results-button,.vs__search::-webkit-search-results-decoration{display:none}.vs__search,.vs__search:focus{appearance:none;line-height:1.8;font-size:1em;outline:none;width:0;max-width:100%;flex-grow:1;z-index:1}[dir] .vs__search,[dir] .vs__search:focus{border:1px solid transparent;margin:4px 0 0 0;padding:0 7px;background:none;box-shadow:none}[dir=ltr] .vs__search,[dir=ltr] .vs__search:focus{border-left:none}[dir=rtl] .vs__search,[dir=rtl] .vs__search:focus{border-right:none}.vs__search::placeholder{color:#6e6b7b}.vs--unsearchable .vs__search{opacity:1}[dir] .vs--unsearchable:not(.vs--disabled) .vs__search:hover{cursor:pointer}.vs--single.vs--searching:not(.vs--open):not(.vs--loading) .vs__search{opacity:.2}.vs__spinner{align-self:center;opacity:0;font-size:5px;text-indent:-9999em;overflow:hidden;transition:opacity .1s}[dir] .vs__spinner{border-top:.9em solid hsla(0,0%,39.2%,.1);border-bottom:.9em solid hsla(0,0%,39.2%,.1);transform:translateZ(0)}[dir=ltr] .vs__spinner{border-right:.9em solid hsla(0,0%,39.2%,.1);border-left:.9em solid rgba(60,60,60,.45);animation:vSelectSpinner-ltr 1.1s linear infinite}[dir=rtl] .vs__spinner{border-left:.9em solid hsla(0,0%,39.2%,.1);border-right:.9em solid rgba(60,60,60,.45);animation:vSelectSpinner-rtl 1.1s linear infinite}.vs__spinner,.vs__spinner:after{width:5em;height:5em}[dir] .vs__spinner,[dir] .vs__spinner:after{border-radius:50%}.vs--loading .vs__spinner{opacity:1}.vs__open-indicator{fill:none}[dir] .vs__open-indicator{margin-top:.15rem}.vs__dropdown-toggle{transition:all .25s ease-in-out}[dir] .vs__dropdown-toggle{padding:.59px 0 4px 0}[dir=ltr] .vs--single .vs__dropdown-toggle{padding-left:6px}[dir=rtl] .vs--single .vs__dropdown-toggle{padding-right:6px}.vs__dropdown-option--disabled{opacity:.5}[dir] .vs__dropdown-option--disabled.vs__dropdown-option--selected{background:#0065af!important}.vs__dropdown-option{color:#6e6b7b}[dir] .vs__dropdown-option,[dir] .vs__no-options{padding:7px 20px}.vs__dropdown-option--selected{color:#fff;position:relative}[dir] .vs__dropdown-option--selected{background-color:#0065af}.vs__dropdown-option--selected:after{content:"";height:1.1rem;width:1.1rem;display:inline-block;position:absolute;top:50%}[dir] .vs__dropdown-option--selected:after{transform:translateY(-50%);background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-check'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:50%;background-size:1.1rem}[dir=ltr] .vs__dropdown-option--selected:after{right:20px}[dir=rtl] .vs__dropdown-option--selected:after{right:unset;left:20px}.vs__dropdown-option--selected.vs__dropdown-option--highlight{color:#fff!important}[dir] .vs__dropdown-option--selected.vs__dropdown-option--highlight{background-color:#0065af!important}.vs__clear svg{color:#6e6b7b}.vs__selected{color:#fff}.v-select.vs--single .vs__selected{color:#6e6b7b;transition:transform .2s ease}[dir] .v-select.vs--single .vs__selected{margin-top:5px}[dir=ltr] .v-select.vs--single .vs__selected input{padding-left:0}[dir=rtl] .v-select.vs--single .vs__selected input{padding-right:0}[dir=ltr] .vs--single.vs--open .vs__selected{transform:translateX(5px)}[dir=rtl] .vs--single.vs--open .vs__selected{transform:translateX(-5px)}.vs__selected .vs__deselect{color:inherit}.v-select:not(.vs--single) .vs__selected{font-size:.9rem}[dir] .v-select:not(.vs--single) .vs__selected{border-radius:3px;padding:0 .6em}[dir=ltr] .v-select:not(.vs--single) .vs__selected{margin:5px 2px 2px 5px}[dir=rtl] .v-select:not(.vs--single) .vs__selected{margin:5px 5px 2px 2px}.v-select:not(.vs--single) .vs__deselect svg{vertical-align:text-top}[dir] .v-select:not(.vs--single) .vs__deselect svg{transform:scale(.8)}.vs__dropdown-menu{top:calc(100% + 1rem)}[dir] .vs__dropdown-menu{border:none;border-radius:6px;padding:0}[dir] .vs--open .vs__dropdown-toggle{border-color:#0065af;border-bottom-color:#0065af;box-shadow:0 3px 10px 0 rgba(34,41,47,.1)}[dir=ltr] .vs--open .vs__dropdown-toggle,[dir=rtl] .vs--open .vs__dropdown-toggle{border-bottom-left-radius:.357rem;border-bottom-right-radius:.357rem}.select-size-lg .vs__selected{font-size:1rem!important}[dir] .select-size-lg.vs--single.vs--open .vs__selected{margin-top:6px}.select-size-lg .vs__dropdown-toggle,.select-size-lg .vs__selected{font-size:1.25rem}[dir] .select-size-lg .vs__dropdown-toggle{padding:5px}[dir] .select-size-lg .vs__dropdown-toggle input{margin-top:0}.select-size-lg .vs__deselect svg{vertical-align:middle!important}[dir] .select-size-lg .vs__deselect svg{transform:scale(1)!important}[dir] .select-size-sm .vs__dropdown-toggle{padding-bottom:0;padding:1px}[dir] .select-size-sm.vs--single .vs__dropdown-toggle{padding:2px}.select-size-sm .vs__dropdown-toggle,.select-size-sm .vs__selected{font-size:.9rem}[dir] .select-size-sm .vs__actions{padding-top:2px;padding-bottom:2px}.select-size-sm .vs__deselect svg{vertical-align:middle!important}[dir] .select-size-sm .vs__search{margin-top:0}.select-size-sm.v-select .vs__selected{font-size:.75rem}[dir] .select-size-sm.v-select .vs__selected{padding:0 .3rem}[dir] .select-size-sm.v-select:not(.vs--single) .vs__selected{margin:4px 5px}[dir] .select-size-sm.v-select.vs--single .vs__selected{margin-top:1px}[dir] .select-size-sm.vs--single.vs--open .vs__selected{margin-top:4px}.dark-layout .vs__dropdown-toggle{color:#b4b7bd}[dir] .dark-layout .vs__dropdown-toggle{background:#283046;border-color:#404656}.dark-layout .vs__selected-options input{color:#b4b7bd}.dark-layout .vs__selected-options input::placeholder{color:#676d7d}.dark-layout .vs__actions svg{fill:#404656}[dir] .dark-layout .vs__dropdown-menu{background:#283046}.dark-layout .vs__dropdown-menu li{color:#b4b7bd}.dark-layout .v-select:not(.vs--single) .vs__selected{color:#0065af}[dir] .dark-layout .v-select:not(.vs--single) .vs__selected{background-color:rgba(0,101,175,.12)}.dark-layout .v-select.vs--single .vs__selected{color:#b4b7bd!important}.dark-layout .vs--disabled .vs__clear,.dark-layout .vs--disabled .vs__dropdown-toggle,.dark-layout .vs--disabled .vs__open-indicator,.dark-layout .vs--disabled .vs__search,.dark-layout .vs--disabled .vs__selected{opacity:.5}[dir] .dark-layout .vs--disabled .vs__clear,[dir] .dark-layout .vs--disabled .vs__dropdown-toggle,[dir] .dark-layout .vs--disabled .vs__open-indicator,[dir] .dark-layout .vs--disabled .vs__search,[dir] .dark-layout .vs--disabled .vs__selected{background-color:#283046}.wrapper{max-width:450px;width:100%}[dir] .wrapper{background:#fff;border-radius:16px;box-shadow:0 0 128px 0 rgba(0,0,0,.1),0 32px 64px -48px rgba(0,0,0,.5)}[dir] .form{padding:25px 30px}.form header{font-size:25px;font-weight:600}[dir] .form header{padding-bottom:10px;border-bottom:1px solid #e6e6e6}[dir] .form form{margin:20px 0}.form form .error-text{color:#721c24;display:none}[dir] .form form .error-text{padding:8px 10px;text-align:center;border-radius:5px;background:#f8d7da;border:1px solid #f5c6cb;margin-bottom:10px}.form form .name-details{display:flex}[dir=ltr] .form .name-details .field:first-child{margin-right:10px}[dir=ltr] .form .name-details .field:last-child,[dir=rtl] .form .name-details .field:first-child{margin-left:10px}[dir=rtl] .form .name-details .field:last-child{margin-right:10px}.form form .field{display:flex;flex-direction:column;position:relative}[dir] .form form .field{margin-bottom:10px}[dir] .form form .field label{margin-bottom:2px}.form form .input input{height:40px;width:100%;font-size:16px}[dir] .form form .input input{padding:0 10px;border-radius:5px;border:1px solid #ccc}.form form .field input{outline:none}.form form .image input{font-size:17px}.form form .button input{height:45px;color:#fff;font-size:17px}[dir] .form form .button input{border:none;background:#333;border-radius:5px;cursor:pointer;margin-top:13px}.form form .field i{position:absolute;top:70%;color:#ccc}[dir] .form form .field i{cursor:pointer;transform:translateY(-50%)}[dir=ltr] .form form .field i{right:15px}[dir=rtl] .form form .field i{left:15px}.form form .field i.active:before{color:#333;content:"\f070"}.form .link{font-size:17px}[dir] .form .link{text-align:center;margin:10px 0}.form .link a{color:#333}.form .link a:hover{text-decoration:underline}[dir] .users{padding:25px 30px}.users-list a,.users header{display:flex;align-items:center;justify-content:space-between}[dir] .users-list a,[dir] .users header{padding-bottom:20px;border-bottom:1px solid #e6e6e6}.wrapper img{object-fit:cover}[dir] .wrapper img{border-radius:50%}.users header img{height:50px;width:50px}:is(.users,.users-list) .content{display:flex;align-items:center}:is(.users,.users-list) .content .details{color:#000}[dir=ltr] :is(.users,[dir=ltr] .users-list) .content .details{margin-left:20px}[dir=rtl] :is(.users,[dir=rtl] .users-list) .content .details{margin-right:20px}:is(.users,.users-list) .details span{font-size:18px;font-weight:500}.users header .logout{display:block;color:#fff;outline:none;text-decoration:none;font-size:17px}[dir] .users header .logout{background:#333;border:none;padding:7px 15px;border-radius:5px}.users .search{display:flex;position:relative;align-items:center;justify-content:space-between}[dir] .users .search{margin:20px 0}.users .search .text{font-size:18px}.users .search input{position:absolute;height:42px;width:calc(100% - 50px);font-size:16px;outline:none;opacity:0;pointer-events:none;transition:all .2s ease}[dir] .users .search input{padding:0 13px;border:1px solid #e6e6e6}[dir=ltr] .users .search input{border-radius:5px 0 0 5px}[dir=rtl] .users .search input{border-radius:0 5px 5px 0}.users .search input.show{opacity:1;pointer-events:auto}.users .search button{position:relative;z-index:1;width:47px;height:42px;font-size:17px;color:#333;outline:none;transition:all .2s ease}[dir] .users .search button{cursor:pointer;border:none;background:#fff}[dir=ltr] .users .search button{border-radius:0 5px 5px 0}[dir=rtl] .users .search button{border-radius:5px 0 0 5px}.users .search button.active{color:#fff}[dir] .users .search button.active{background:#333}.search button.active i:before{content:"\f00d"}.users-list{max-height:350px;overflow-y:auto}:is(.users-list,.chat-box)::-webkit-scrollbar{width:0}[dir] .users-list a{padding-bottom:10px;margin-bottom:15px;border-bottom-color:#f1f1f1}[dir=ltr] .users-list a{padding-right:15px}[dir=rtl] .users-list a{padding-left:15px}[dir] .users-list a:last-child{margin-bottom:0;border-bottom:none}.users-list a img{height:40px;width:40px}.users-list a .details p{color:#67676a}.users-list a .status-dot{font-size:12px;color:#468669}[dir=ltr] .users-list a .status-dot{padding-left:10px}[dir=rtl] .users-list a .status-dot{padding-right:10px}.users-list a .status-dot.offline{color:#ccc}.chat-area header{display:flex;align-items:center}[dir] .chat-area header{padding:18px 30px}.chat-area header .back-icon{color:#333;font-size:18px}.chat-area header img{height:45px;width:45px}[dir] .chat-area header img{margin:0 15px}.chat-area header .details span{font-size:17px;font-weight:500}.chat-box{position:relative;min-height:300px;max-height:300px;overflow-y:auto}[dir] .chat-box{padding:10px 30px 20px 30px;background:#f7f7f7;box-shadow:inset 0 32px 32px -32px rgba(0,0,0,.05),inset 0 -32px 32px -32px rgba(0,0,0,.05)}.chat-box .text{position:absolute;top:45%;width:calc(100% - 50px)}[dir] .chat-box .text{text-align:center}[dir=ltr] .chat-box .text{left:50%;transform:translate(-50%,-50%)}[dir=rtl] .chat-box .text{right:50%;transform:translate(50%,-50%)}[dir] .chat-box .chat{margin:15px 0}.chat-box .chat p{word-wrap:break-word}[dir] .chat-box .chat p{padding:8px 16px;box-shadow:0 0 32px rgba(0,0,0,.08),0 16px 16px -16px rgba(0,0,0,.1)}.chat-box .outgoing{display:flex}.chat-box .outgoing .details{max-width:calc(100% - 130px)}[dir=ltr] .chat-box .outgoing .details{margin-left:auto}[dir=rtl] .chat-box .outgoing .details{margin-right:auto}.outgoing .details p{color:#fff}[dir] .outgoing .details p{background:#333}[dir=ltr] .outgoing .details p{border-radius:18px 18px 0 18px}[dir=rtl] .outgoing .details p{border-radius:18px 18px 18px 0}.chat-box .incoming{display:flex;align-items:flex-end}.chat-box .incoming img{height:35px;width:35px}.chat-box .incoming .details{max-width:calc(100% - 130px)}[dir=ltr] .chat-box .incoming .details{margin-right:auto;margin-left:10px}[dir=rtl] .chat-box .incoming .details{margin-left:auto;margin-right:10px}.incoming .details p{color:#333}[dir] .incoming .details p{background:#fff}[dir=ltr] .incoming .details p{border-radius:18px 18px 18px 0}[dir=rtl] .incoming .details p{border-radius:18px 18px 0 18px}.typing-area{display:flex;justify-content:space-between}[dir] .typing-area{padding:18px 30px}.typing-area input{height:45px;width:calc(100% - 58px);font-size:16px;outline:none}[dir] .typing-area input{padding:0 13px;border:1px solid #e6e6e6}[dir=ltr] .typing-area input{border-radius:5px 0 0 5px}[dir=rtl] .typing-area input{border-radius:0 5px 5px 0}.typing-area button{color:#fff;width:55px;outline:none;font-size:19px;opacity:.7;pointer-events:none;transition:all .3s ease}[dir] .typing-area button{border:none;background:#333;cursor:pointer}[dir=ltr] .typing-area button{border-radius:0 5px 5px 0}[dir=rtl] .typing-area button{border-radius:5px 0 0 5px}.typing-area button.active{opacity:1;pointer-events:auto}@media screen and (max-width:450px){[dir] .form,[dir] .users{padding:20px}[dir] .form header{text-align:center}.form form .name-details{flex-direction:column}[dir=ltr] .form .name-details .field:first-child{margin-right:0}[dir=ltr] .form .name-details .field:last-child,[dir=rtl] .form .name-details .field:first-child{margin-left:0}[dir=rtl] .form .name-details .field:last-child{margin-right:0}.users header img{height:45px;width:45px}.users header .logout{font-size:16px}[dir] .users header .logout{padding:6px 10px}[dir=ltr] :is(.users,[dir=ltr] .users-list) .content .details{margin-left:15px}[dir=rtl] :is(.users,[dir=rtl] .users-list) .content .details{margin-right:15px}[dir=ltr] .users-list a{padding-right:10px}[dir=rtl] .users-list a{padding-left:10px}[dir] .chat-area header{padding:15px 20px}.chat-box{min-height:400px}[dir=ltr] .chat-box{padding:10px 15px 15px 20px}[dir=rtl] .chat-box{padding:10px 20px 15px 15px}.chat-box .chat p{font-size:15px}.chat-box .outogoing .details{max-width:230px}.chat-box .incoming .details{max-width:265px}.incoming .details img{height:30px;width:30px}[dir] .chat-area form{padding:20px}.chat-area form input{height:40px;width:calc(100% - 48px)}.chat-area form button{width:45px}}