.dm-container{
    margin-bottom: 10px;
    min-height: 200px;
}
.dm-input input{
    margin-left: 0px;
    padding-left: 0px;
    width: calc( 100% - 120px );
    height: 30px;
    padding: 0 5px;
	margin-right: 10px;
}


.dm-window{
    width: 100%;
}

.dm-log{
    max-height: 30vh;
    max-height: 250px;
    overflow-y: auto;
}

.dm-log span:first-of-type{
    font-weight: bold;
}
.dm-log .chat{
    padding: 3px;
    margin: 5px 0;
    border-radius: 5px;
    width: 93%;
    margin-left: 3%;
    background: #efeffb;
    position: relative;
	user-select: initial;
	font-size: .9rem;
}
.dm-log .reply-icon{
    display: none;
}
.dm-log .admin-edit-chat{
    display: none;
}

.dm-window h4{
    position: absolute;
    top: 10px;
    margin-top: 0;
}

.dm-window h4 span:first-of-type{
    color: grey;
}

.dm-box .modal-content{
	width: 800px;
    /* max-width: calc( 100vw - 500px ); */
    max-width: 600px;
	user-select: none;
}
.dm-box .hovering{
    display: none;
}

.dm-container .chat-toggle{
    display: none;
}

.message-icon{
    display: none;
    width: 20px;
    position: absolute;
    top: 0;
    right: 10px;
}

.member-icon.has-message .message-icon,
.user-icon.has-message .message-icon{
    display: initial;
}
.member-hei{
	font-size: .8rem;
}


#chat-expl{
    font-size: .9rem;
    line-height: 8px;
    margin-bottom: 20px;
    background: rgba(0, 0, 0, .1);
    border-radius: 5px;
    position: relative;
    padding: 5px;
}
.connectspace #chat-expl{
    padding: 5px 20px;
}

.user-icon-expl .active-indicator,
.user-icon .active-indicator{
    position: absolute;
    width: 10px;
    height: 10px;
    background: orange;
    top: 2px;
    right: 0px;
    z-index: 9;
    border-radius: 20px;
}

.member-icon-expl.member-active .active-indicator,
.member-icon.user-active .active-indicator{
    background: #46ec46;
}
.member-icon-expl .active-indicator,
.member-icon .active-indicator{
    position: absolute;
    width: 10px;
    height: 10px;
    background: orange;
    top: 2px;
    right: 4px;
    z-index: 9;
    border-radius: 20px;
}
.user-icon-expl.long-idle .active-indicator,
.member-icon-expl.long-idle .active-indicator,
.user-icon.long-idle .active-indicator,
.member-icon.long-idle .active-indicator,
.member-icon.recently-visited .active-indicator,
.user-icon.recently-visited .active-indicator{
	background: var(--chat-idle);
}
.member-icon.long-idle,
.user-icon.long-idle{
	/* opacity: .7; */
}
.member-icon.long-idle .user-name,
.user-icon.long-idle .user-name{
	/* color: var(--chat-idle) !important; */
}

#everywhere-list .minimize{
	position: absolute;
	top: 0px;
	right: 0px;
	font-weight: bold;
	font-size: 2rem;
	/* border: 1px solid; */
	padding: 5px;
	line-height: 1rem;
	cursor: pointer;
	color: rgb(20, 20, 20);
}
#everywhere-list .minimize:hover{
	color: grey;
}
#everywhere-list.collapsed .member-icon{
	display: none;
}

.dm-popup{
    top: 0;
    position: fixed;
    display: none;
    background: white;
	color: var(--text-grey);
    border: 1px solid grey;
    padding: 10px;
    pointer-events: none;
    z-index: 99;
}

.stat-key{
    font-weight: bold;
}

.user-icon,
.user-icon-expl{
    transition: .5s;
    cursor: pointer;
    display: block;
    padding: 3px;
    margin: 5px 0px;
    position: relative;
}

.user-icon-expl.user-active .active-indicator,
.user-icon.user-active .active-indicator{
    background: #46ec46;
}
.user-icon-expl .active-indicator,
.user-icon .active-indicator{
    position: absolute;
    width: 10px;
    height: 10px;
    background: orange;
    top: 2px;
    right: 0px;
    z-index: 9;
    border-radius: 20px;
}

/* .recently-visited{
	opacity: .7;
} */

#unread-icon{
	position: absolute;
	top: -10px;
	right: 15%;
	width: 40px;
	animation: pulse infinite 2s;
	display: none;
}
.unread-messages #unread-icon{
	display: inline-block;
}


.unread-icon{
	display: none;
	max-width: 22px;
	position: absolute;
	top: 3px;
	right: 10%;
}
.has-unread .unread-icon{
	display: inline-block;
}


@media screen and (max-width: 800px){
	.dm-input input{
	    font-size: 16px;
	}	

    .dm-box	.modal-content{
	    max-width: 95vw;
        padding: 10px;
    }
    .dm-log{
        margin-top: 35px;
		max-height: 80vh;
    }
	.dm-window h4{
		left: 30px;
	}

}