.boosterchat.csttt_boosterchat .top-heading h2 {
font-size: 24px;
font-weight: 700;
}

.boosterchat.csttt_boosterchat.col-lg-9.yyy.cstm-test.yy.width80
.top-heading
p {
font-size: 17px;
font-weight: 400 !important;
}
.chat-area {
background: url("/wp-content/plugins/user-booster-link/views/chat-bg.png")
no-repeat;
background-size: cover;
height: 800px;
}
.chat-section {
border: 1px solid #e8e8ea;
border-radius: 8px;
margin-top: 30px;
}
form.chat-search {
position: relative;
}

form.chat-search input {
padding: 10px 10px;
border-radius: 4px !important;
border: 1px solid #efefef !important;
background: #f4f4f4;
width: 100%;
font-weight: 600;
font-family: "Open Sans";
}

form.chat-search svg {
position: absolute;
top: 50%;
right: 10px;
width: 15px;
transform: translateY(-50%);
}
.chat-top h4 {
color: #3b3b3b !important;
font-weight: 600;
font-family: "Open Sans";
font-size: 20px;
margin: 40px 0 20px;
}
form.chat-search input::placeholder {
color: #a2a2b2;
}
.p-0 {
padding: 0;
}
.chat-top {
padding: 0 20px 30px;
border-bottom: 2px solid #efefef;
}
.direct-msg {
padding: 50px 0 20px;
height: 620px;
overflow-y: auto;
}

.direct-msg h5 {
color: #a5a5b5;
font-weight: 500;
font-size: 14px;
text-transform: uppercase;
}
.direct-msg ul {
list-style: none;
padding: 0;
min-height: unset;
overflow-y: auto;
background-attachment: local, local, scroll, scroll;
--thumbBG: #0f0f0c;
max-height: 210px;
height: 210px;
}
.direct-msg ul::-webkit-scrollbar,
.chat-conversation-list::-webkit-scrollbar {
width: 2px;
opacity: 0;
}
.direct-msg ul::-webkit-scrollbar-thumb,
.chat-conversation-list::-webkit-scrollbar-thumb {
background-color: #e3e3e3;
border-radius: 6px;
}
.direct-msg ul:hover::-webkit-scrollbar,
.chat-conversation-list::-webkit-scrollbar {
opacity: 1;
}

.direct-msg ul li a i {
color: #a0a0a0;
font-size: 17px;
width: 38px;
height: 38px;
border-radius: 50%;
background: #f4f4f4;
text-align: center;
line-height: 38px;
border: 1px solid #fff;
}
.direct-msg ul li a img {
color: #a0a0a0;
font-size: 26px;
width: 40px;
height: 40px;
border-radius: 50%;
background: #f4f4f4;
text-align: center;
line-height: 40px;
/*border: 1px solid #fff;*/
object-fit:contain;
}
.direct-msg ul li a .default-img, .direct-msg ul li a>.default-img {
color: #fff;
font-size: 20px;
width: 40px;
height: 40px;
border-radius: 50%;
background: #00c0ff;
text-align: center;
line-height: 40px;
text-transform: uppercase;
padding: 0;
border: 1px solid #fff;
}
.direct-msg ul li a span:first-child {
padding: 0;
position: relative;
}
.direct-msg ul li a.online span:not(.conv-item):first-child:after,
.direct-msg ul li a.away span:not(.conv-item):first-child:after,
.direct-msg ul li a.offline span:not(.conv-item):first-child:after {
content: "";
position: absolute;
bottom: 0;
right: 0;
width: 10px;
height: 10px;
background: #02fc15;
border: 1px solid #fff;
border-radius: 50%;
}
.direct-msg ul li a.away span:not(.conv-item):first-child:after {
content: "";
background: #e37400;
}
.direct-msg ul li a.offline span:not(.conv-item):first-child:after {
content: "";
background: #616b65;
}
.direct-msg ul li a {
display: flex;
align-items: center;
}

.direct-msg ul li a span {
display: inline-block;
padding-left: 13px;
color: #000;
font-size: 14px;
}
.direct-msg ul li {
display: flex;
align-items: center;
justify-content: space-between;
border-left: 3px solid transparent;
}
.groups {
padding-top: 40px;
}
.direct-msg ul li:hover {
border-left: 3px solid #00c0ff;
background: #f4f4f4;
}

.unread-msg {
width: 20px !important;
height: 22px;
background: #00c0ff;
color: #fff !important;
text-align: center;
border-radius: 4px !important;
line-height: 20px !important;
}

.default-text {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}

.default-text i {
font-size: 50px;
width: 70px;
height: 70px;
background: #dedede;
text-align: center;
line-height: 69px;
border-radius: 50%;
color: #00c0ff;
}
body .menuswitch12.col-lg-9.yyy.cstm-test.yy.contacts.width80 .default-text p {
font-weight: 400 !important;
max-width: 600px;
text-align: center;
font-family: "Open Sans" !important;
color: #92929d !important;
font-family: "Roboto" !important;
font-size: 14px !important;
}
.default-text h5 {
font-size: 30px;
margin: 30px 0 20px;
font-weight: 700;
}
.boosterchat.csttt_boosterchat.width80
.chat-section
.chat-area
.default-text
p {
font-size: 16px;
font-weight: 400 !important;
}

.list-head {
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 20px;
}
.list-head a.add-new i {
font-size: 12px;
color: #fff;
position: relative;
}
.add-new {
background: #00c0ff;
padding: 2px;
width: 20px;
height: 22px;
line-height: 17px !important;
text-align: center;
display: inline-block;
border-radius: 4px;
}
.list-head a.add-new i:hover {
opacity: 1;
}
/***chat-modal**/
.chat-section .modal {
position: fixed;
left: 0;
top: 0;
transform: scale(1.1) !important;
width: 100%;
height: 100%;
opacity: 0;
visibility: hidden;
transition: visibility 0s linear 0.25s, opacity 0.25s 0s, transform 0.25s;
z-index: 99999;
max-width: 100%;
background-color: rgba(0, 0, 0, 0.5);
}
.chat-section .modal-content {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: white;
padding: 10px 4px;
width: 500px;
border-radius: 10px;
border: 5px solid #00c0ff;
}
.chat-section .close-button {
width: 30px;
height: 30px;
line-height: 28px;
text-align: center;
cursor: pointer;
border-radius: 50%;
font-size: 30px;
margin-right: 12px;
color: #fff;
font-weight: 700;
background: #00c0ff;
position: absolute;
right: -7px;
top: 4px;
padding-left: 1px;
}
.chat-section .show-modal {
opacity: 1;
visibility: visible;
transform: scale(1);
transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;
}
.chat-section h2.modal-heading {
color: #3b3b3b !important;
font-weight: 600;
font-size: 26px;
margin: 20px 0 10px 12px !important;
text-align: center;
font-family: "Arvo";
}
.chat-section .modal-content h4 {
text-align: center;
font-size: 18px !important;
font-weight: 700 !important;
color: #363636;
margin-bottom: 20px;
margin-top: 0 !important;
}
.chat-section .modal form .invite input {
max-width: 130px;
background: #00c0ff !important;
color: #fff !important;
border: 1px solid #00c0ff !important;
}
.chat-section .modal form input,
.chat-section .modal form textarea,
.chat-section .modal form select {
width: 100%;
padding: 10px;
border-radius: 6px !important;
border: 3px solid #e0e0e0 !important;
background: #fff !important;
width: 100% !important;
font-weight: 600;
font-family: "Open Sans";
resize: none;
}
.chat-section .modal form select option:hover {
background: #cecece !important;
}
.direct-msg .checkbox-label h5 {
color: #3b3b3b;
}

.chat-section .modal form label {
font-size: 14px;
margin-top: 20px;
color: #333;
font-weight: 700;
font-family: "Open Sans";
}

.chat-section .modal form input::placeholder,
.modal form textarea::placeholder,
.modal form select::placeholder {
font-size: 12px;
font-weight: 400;
}
.chat-section .modal form input:focus,
.modal form textarea:focus,
.modal form select:focus {
outline: none;
}
.modal form.chat-search {
margin: 0 12px;
}
.chat-section .modal form .invite button {
max-width: 150px;
background: #00c0ff;
color: #fff;
border: 1px solid #00c0ff;
padding: 10px;
border-radius: 6px;
font-weight: 600;
font-family: "Open Sans";
width: 100%;
}

.chat-section .invite {
text-align: center;
margin: 20px 12px 10px;
}
.direct-msg .contact-search-list ul li {
padding: 0;
display: block;
}

.contact-list-title {
color: #00c0ff;
font-size: 14px;
font-weight: 500;
margin-bottom: 5px;
position: relative;
padding: 0 12px;
}
.direct-msg .contact-search-list ul li:hover {
background: none;
}

.direct-msg .contact-search-list ul li h5 {
padding: 5px 0;
color: #3b3b3b;
margin: 0;
padding: 5px 12px;
cursor: pointer;
}
.contact-search-list ul {
height: auto;
}
.contact-search-inner {
height: 200px;
overflow-y: auto;
}
.contact-search-inner::-webkit-scrollbar {
width: 2px;
}
.contact-search-inner::-webkit-scrollbar-thumb {
background-color: #e3e3e3;
border-radius: 6px;
}
.contact-search-list h3 {
color: #3b3b3b;
font-size: 14px;
font-weight: 600;
padding: 0 12px;
}
.contact-search-list {
padding-bottom: 10px;
}
.direct-msg .contact-search-list ul li.selected h5 {
background: rgb(0 192 255 / 10%);
}
.direct-msg .contact-search-list ul li h5:hover {
background: rgb(0 192 255 / 10%);
}
.contact-list-title:after {
content: "";
position: absolute;
width: 100%;
max-width: 92%;
margin-right: 0;
margin-left: auto;
height: 1px;
background: #e8e8ea;
top: 50%;
transform: translateY(-50%);
right: 13px;
}

.contact-search-list.select-contact {
border: 1px solid #ddd;
border-radius: 4px;
}

.chat-section .modal form input.form-check-input {
width: 10px !important;
margin-left: 12px;
appearance: none;
background-color: #fafafa !important;
background-position: 50% !important;
background-repeat: no-repeat !important;
background-size: contain !important;
border: 1px solid rgba(0, 0, 0, 0.25) !important;
padding: 7px !important;
}
.chat-section .modal form .form-check-input:checked[type="checkbox"] {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3E%3C/svg%3E") !important;
}
.chat-section .modal form .form-check-input:checked {
background-color: #00c0ff !important;
border-color: #00c0ff !important;
}
.chat-section .modal .form-check label {
padding-left: 10px;
margin-top: 10px;
}
.chat-section .modal .form-check label h5 {
color: #3b3b3b;
margin: 0;
padding: 0;
}
.chat-section li.form-check {
display: flex !important;
align-items: center;
justify-content: flex-start;
}
.chat-section .input-wrapper {
margin: 0 12px;
}
/*custom checkbox*/
.checkbox-label {
display: block;
position: relative;
padding-left: 20px;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.checkbox-label input {
position: absolute;
opacity: 0;
cursor: pointer;
height: 0;
width: 0;
}
.checkmark {
position: absolute;
top: 50%;
left: 0;
background-color: #fafafa !important;
background-position: 50% !important;
background-repeat: no-repeat !important;
background-size: contain !important;
border: 1px solid #00c0ff !important;
padding: 0px !important;
border-radius: 4px;
transform: translateY(-50%);
width: 15px;
height: 15px;
}
.checkbox-label:hover input ~ .checkmark {
background-color: #ddd;
}
.checkbox-label input:checked ~ .checkmark {
background-color: #00c0ff !important;
border: 1px solid #00c0ff !important;
}
.checkbox-label:after {
content: "";
position: absolute;
display: none;
}
.checkbox-label input:checked ~ .checkmark:after {
display: block;
}
.checkbox-label input:checked ~ .checkmark:after {
content: "";
left: 4px;
position: absolute;
top: 1px;
width: 5px;
height: 10px;
border: solid white;
border-width: 0 2px 2px 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.chat-section .modal form label.checkbox-label {
margin: 2px 12px;
}
.direct-msg .contact-search-list ul li .checkbox-label h5 {
padding: 5px 0;
}

/****/

.yyy.cstm-test.yy.postcountclubs16 {
height: 1018px;
overflow-y: scroll;
background-attachment: local, local, scroll, scroll;
--thumbBG: rgb(15, 15, 12);
}
.yyy.cstm-test.yy.postcountclubs16::-webkit-scrollbar {
width: 2px;
}
.yyy.cstm-test.yy.postcountclubs16::-webkit-scrollbar-thumb {
background-color: #e3e3e3;
border-radius: 6px;
}

.chat-section .chat-conversation-list {
margin-bottom: 0;
margin-top: 20px;
padding: 0 15px 20px;
height: 630px;
overflow-y: auto;
}
.chat-section .chat-conversation-list > li {
display: flex;
}
.chat-section .conversation-list {
align-items: flex-end;
display: inline-flex;
margin-bottom: 24px;
max-width: 80%;
position: relative;
}
.chat-section .chat-avatar {
margin: 0 16px 0 0;
}
.chat-section .chat-avatar img {
border-radius: 50%;
height: 28px;
width: 28px;
}
.chat-section .conversation-list .ctext-wrap {
display: flex;
margin-bottom: 5px;
}
.chat-section .conversation-list .ctext-wrap-contents {
background-color: #fff;
border-radius: 3px;
box-shadow: 0 2px 4px rgba(15, 34, 58, 0.12);
padding: 8px 10px;
position: relative;
}
body
.chat-section
.chat-conversation-list
.conversation-list
.ctext-wrap
.ctext-wrap-contents
p {
margin-bottom: 0px !important;
}
.chat-section
.chat-conversation-list
.chat-list
.conversation-list
.conversation-name {
font-size: 14px;
font-weight: 600;
}
.chat-section .text-muted {
--bs-text-opacity: 1;
color: #797c8c !important;
}

.chat-section .chat-conversation-list .right {
justify-content: flex-end;
}
.chat-section .chat-conversation-list .right .conversation-list {
text-align: right;
}
.chat-section .chat-conversation-list .right .chat-avatar {
margin-left: 16px;
margin-right: 0;
order: 3;
}
.chat-section .chat-conversation-list .right .conversation-list .ctext-wrap {
justify-content: flex-end;
}
.chat-section
.chat-conversation-list
.right
.conversation-list
.ctext-wrap
.ctext-wrap-contents {
background-color: rgba(78, 172, 109, 0.23);
box-shadow: none;
order: 2;
text-align: right;
}

body .menuswitch12.col-lg-9.yyy.cstm-test.yy.contacts.width80 p {
margin-bottom: 0px !important;
}
.chat-section
.chat-conversation-list
.right
.conversation-list
.conversation-name
i {
font-size: 12px;
background: none;
width: 28px;
height: 17px;
line-height: 28px;
}
.chat-section .conversation-list .message-img {
border-radius: 0.2rem;
display: flex;
flex-wrap: wrap;
gap: 8px;
position: relative;
}
.chat-section .conversation-list .message-img .message-img-list {
position: relative;
}
.chat-section .conversation-list .message-img img {
height: 100px;
object-fit: cover;
width: 150px;
}

.chat-section .chat-conversation-list .wrapper {
display: flex;
}
.chat-section .chat-conversation-list .dropdown_c {
position: relative;
margin: 12px 20px 12px 0;
}

.chat-section .chat-conversation-list .selected span {
display: flex;
width: 200px;
border-radius: 5px;
color: #131313;
}

.chat-section .chat-conversation-list .selected span {
cursor: pointer;
display: flex;
padding: 10px 15px;
margin: 0;
}

.chat-section .chat-conversation-list .drop-content {
position: relative;
}

.chat-section .chat-conversation-list .drop-content ul {
position: absolute;
left: 0px;
top: 5px;
display: none;
list-style: none;
width: 200px;
background: #fff;
border-top: 0;
border-radius: 0 0 5px 5px;
padding-top: 4px;
margin: 0;
padding-left: 0;
margin-top: 12px;
z-index: 99;
}

.chat-section .chat-conversation-list .drop-content ul li span {
display: flex;
padding: 10px 15px;
text-decoration: none;
color: #131313;
}

.chat-section .chat-conversation-list .drop-content ul li span:hover {
background: rgba(98, 93, 93, 0.47);
color: #fff;
border-left: 5px solid rgba(0, 0, 0, 0.8);
}

.chat-section .chat-conversation-list i {
font-size: 18px;
width: 0;
height: 0;
background: 0 0;
text-align: center;
line-height: 0;
border-radius: 50%;
color: #83b092;
display: block;
margin-bottom: 10px;
}
.file_flex {
display: flex;
justify-content: space-between;
align-items: center;
}

.file_name {
text-align: left;
padding: 0 25px;
}
.file_icon {
padding-top: 13px;
}
.file_dwl {
padding: 13px 21px 0 0px;
}

/********************************/

.chat-input-section {
position: absolute;
bottom: 0;
background: #ffffff47;
width: 100%;
left: 0;
padding: 20px;
backdrop-filter: blur(11px);
}
.chat-input-section .form-main {
display: flex;
justify-content: space-between;
}
.chat-input-section .form-main .chat-input-section-left {
width: 60px;
margin-right: 10px;
display: flex;
}
.chat-input-section .form-main .chat-input-section-center {
width: calc(100% - 75px);
max-width: 100%;
}
.chat-input-section .form-main .chat-input-section-center #msg {
padding: 10px 15px;
border-radius: 37px !important;
border: 1px solid #ddd;
font-size: 14px;
}
.chat-input-section .form-main .chat-input-section-left {
align-items: center;
}
.chat-input-section {
border-top: 1px solid #ddd;
}
.chat-input-section .form-main .chat-input-section-center #msg {
min-height: 46px;
resize: none;
}
.chat-input-section .form-main .chat-input-section-center button {
width: 46px;
height: 46px;
border-radius: 50%;
border: 1px solid #00c0ff;
background: #00c0ff;
color: #fff;
transition: all 0.3s;
cursor: pointer;
font-size: 16px;
}

.chat-input-section .form-main .chat-input-section-center button:hover {
background: #fffe00;
color: #000;
border-color: #fffe00;
}

.chat-input-section .form-main .chat-input-section-center {
display: flex;
justify-content: space-between;
}
.chat-input-section .form-main .chat-input-section-center #msg {
width: calc(100% - 22px) !important;
}
.emojiPickerIconWrap {
width: 100%;
}
.chat-input-section .form-main .chat-input-section-left span {
width: 27px;
height: 27px;
display: inline-flex;
justify-content: center;
align-items: center;
background: #0000000a;
margin: 2px;
border-radius: 50%;
cursor: pointer;
position: relative;
}
.chat-input-section .form-main .chat-input-section-left span input {
position: absolute;
width: 100%;
height: 100%;
opacity: 0;
cursor: pointer;
}
.col-lg-9.yyy.cstm-test.yy.width80 .ctext-wrap-contents p {
font-size: 16px !important;
font-weight: 400 !important;
margin-top: 0;
padding: 5px 10px;
}
.select-info {
padding: 5px 12px;
font-size: 12px;
line-height: 18px;
max-width: 340px;
}

.select-info span {
background: #33362f;
color: #fff;
border-radius: 4px;
}
.direct-msg ul li.selected {
border-left: 3px solid #00c0ff;
background: #f4f4f4;
}
.dm-sec-header {
border-bottom: 1px solid #ddd;
padding: 15px 0;
background: #f2f2f2;
}

.dm-sec-header .user {
    padding: 0 20px;
    display: flex;
    align-items: center;
}

.dm-sec-header .user span.name {
display: inline-block;
padding-left: 13px;
color: #000;
font-size: 16px;
text-transform: capitalize;
font-weight: 600;
}

.dm-sec-header .user .user-pic {
position: relative;
display: inline-block;
}

.dm-sec-header .user.online .user-pic:after {
content: "";
position: absolute;
bottom: 0px;
right: 1px;
width: 12px;
height: 12px;
background: #02fc15;
border: 1px solid #fff;
border-radius: 50%;
}

.dm-sec-header .user.offline .user-pic:after {
content: "";
position: absolute;
bottom: 0px;
right: 1px;
width: 12px;
height: 12px;
border: 1px solid #fff;
border-radius: 50%;
}
.dm-sec-header .user.online .user-pic:after {
content: "";
background: #02fc15;
}
.dm-sec-header .user.offline .user-pic:after {
content: "";
background: #616b65;
}

.emojiPickerIcon {
left: -75px;
width: 27px !important;
height: 27px !important;
display: inline-flex;
justify-content: center;
align-items: center;
margin: 2px;
border-radius: 50%;
cursor: pointer;
top: 8px !important;
}

.emojiPicker nav {
display: none;
}

.emojiPicker {
left: 35% !important;
transform: translateX(-50%);
}

.ctext-wrap-contents img {
max-width: 250px;
width: 100%;
}
/**1-09-2023**/
.direct-msg ul li a {
display: flex;
padding: 5px 20px;
width: 100%;
justify-content: space-between;
}
.direct-msg ul li a span.unread-msg {
padding: 0;
}
span.user-pic .default-img, span.user-pic img {
color: #fff;
font-size: 20px;
width: 40px;
height: 40px;
border-radius: 50%;
background: #00c0ff;
text-align: center;
line-height: 40px;
text-transform: uppercase;
padding: 0;
border: 1px solid #fff;
display: inline-block;
} /* Loader container styles */
.loader-container {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(255, 255, 255, 0.8);
z-index: 99999999;
margin: 0 !important;
} /* Loader animation styles */
.loader {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
border: 4px solid #f3f3f3;
border-top: 4px solid #3498db;
border-radius: 50%;
width: 40px;
height: 40px;
animation: spin 1s linear infinite;
}
.chat-avatar .default-img {
color: #fff;
font-size: 20px;
width: 32px;
height: 32px;
border-radius: 50%;
background: #00c0ff;
text-align: center;
line-height: 30px;
text-transform: uppercase;
padding: 0;
border: 1px solid #fff;
display: inline-block;
position:relative;
top:3px;
}
/* Loader animation keyframes */
@keyframes spin {
0% {
transform: translate(-50%, -50%) rotate(0deg);
}
100% {
transform: translate(-50%, -50%) rotate(360deg);
}
}
.boosterchat a.js-link span {
font-family:'Open Sans';
font-weight:700!important;
font-size:12px;
color:#00c0ff;
}
.col-lg-9.yyy.cstm-test.yy.width80 .ctext-wrap-contents .file_name p {
font-size: 14px !important;
}
.direct-msg ul li a span.conv-item {
display: flex;
align-items: center;
width: calc(100% - 30px)!important;
}
/**/
.chatlisticon a img {
width: 20px;
margin-right: 7px;
margin-left: 5px;
object-fit: cover;
margin-bottom: 4px;
}
.chatlisticon a img.chathoverto {
display: none;
}
.chatlisticon a:before {
display: none;
}
.chatlisticon:hover a img.chathoverto{
display:inline-block;
}
.chatlisticon:hover a img.iconsimgchat{
display:none;
}
.emojiPickerIconWrap .black {
background: url(https://img.freepik.com/free-vector/happy-emoji_53876-25513.jpg?size=626&ext=jpg&ga=GA1.1.1875991463.1689059686&semt=ais) !important;
background-repeat: no-repeat !important;
background-size: cover !important;
}
div#loader1{
position:fixed;
}
.heading_with_select select:focus-visible {
outline: 0;
}
.col-lg-9.yyy.cstm-test.yy.width80 .top-heading h2 {
font-weight: 700;
font-size: 24px;
}

.col-lg-9.yyy.cstm-test.yy.width80 .top-heading p {
font-size: 17px !important;
font-weight: 400 !important;
letter-spacing: .1px;
color: #92929d;
margin: 4px 0;
font-family: 'Roboto';
}
span.user-pic img {
background-color: transparent;
width: 45px;
height: 45px;
object-fit: cover;
}
.direct-msg ul li a span.conv-item span:first-child {
width: 38px;
height: 38px;
border-radius: 50%;
/*border: 2px solid #fff;*/
line-height:34px;
}

.direct-msg ul li a span.conv-item span:last-child {
width: calc(100% - 55px) !important;
}

.direct-msg ul li a span.conv-item span:first-child img {
width: 100%;
height: 100%;
border-radius: 50%;
object-position: top;
object-fit: contain;
}

.direct-msg ul li a > span:last-child {
padding: 2px;
line-height: 1;
font-size: 11px;
border-radius: 10px;
margin-left: 5px;
width: 25px;
}
.team-chat .checkmark {
width: 25px;
height: 25px;
}

.chat-section .modal form.team-chat label.checkbox-label {
padding-left: 35px;
}

.chat-section .modal form.team-chat label.checkbox-label h5 {
font-weight: 400;
font-size: 12px;
text-transform: initial;
}
.chat-section
.modal
form.team-chat
.checkbox-label
input:checked
~ .checkmark:after {
content: "";
left: 32%;
position: absolute;
top: 45%;
width: 6px;
height: 12px;
border: solid white;
border-width: 0 2px 2px 0;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg) translate(-50%, -50%);
}
.col-lg-9.yyy.cstm-test.yy.width80 .modal-note p {
font-family: "Open Sans";
text-align: center;
font-size: 14px;
padding: 10px 20px 0;
color: #c2c2c7;
font-weight: 400!important;
}
.chat-section .team-chat .invite {
margin-top: 50px;
}
.chat-section .modal form.team-chat  .invite input {
max-width: unset;
background: #00c0ff !important;
color: #fff !important;
border: 1px solid #00c0ff !important;
width: auto !important;
padding: 10px 20px;
}
.chat-section .modal form.team-chat select {
margin-top: 5px;
appearance: none;
border-width: 1px !important;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAPCAYAAAD6Ud/mAAAABHNCSVQICAgIfAhkiAAAAF96VFh0UmF3IHByb2ZpbGUgdHlwZSBBUFAxAAAImeNKT81LLcpMVigoyk/LzEnlUgADYxMuE0sTS6NEAwMDCwMIMDQwMDYEkkZAtjlUKNEABZiYm6UBoblZspkpiM8FAE+6FWgbLdiMAAAB5UlEQVQ4ja2TsW7TYBSFz7GV4paiSPQRsrB4sOLNLE1SARMsKRWM9u8WBh4C0RdgoGpssyB4ANiQCoExKLayRGnII3RhRJj/sjiSCUlKo5z1/vf/dO65l2EY3tJau4ZhfOh0Oj+wZoVheBvAhSEiL0i+0Vo/b7fbm+uE+L7/SETea61fGgA+Abgg+axarR6HYVhZByQIgockT0TEIvnRTNP0m+M43wHskWyIyFatVjsbDoeyKkQptU8yAVAhqaIoOjUBIMuykeM4Y5J3SDYsy9r2PO9Lr9f7vYoTABFJioiK4/gdAJjTBwXsnGQDQCvP8y3btr8OBoP8Ck4OSJ4AMEg+mUL+ApVgEwBNki3TNC3Xdbv9fl//rxMAGySPoih6W66bsw1Zlo3q9fpERPZINgFcd1338zJYEXwM4BrJYBYyFwQAaZqOHMcZA7hLcldEtj3P687LrICciogpIkF5XJeCSs7GAHZJtvI8v2HbdrecmVLqAMCr4p+nSZL84+RSUMnZpFiQpmEYm9PVV0rti0hEcoPkURzHCyEAwGXFqXzff0AyJrkjIscARoWTyqJMVgIBQBAE9wG8JnkTwE8Av7TWh0mSzM1kVktHV1aapufFUd8TEYPk4aLg1yLf99tKqcdX7fsD3Hra2EmrHnYAAAAASUVORK5CYII=) !important;
background-repeat: no-repeat !important;
background-size: 16px !important;
background-position: 97% 16px !important;
}

.direct-msg ul li a img.pm-img {width:20px;background:none;margin-left: 5px;}
 .chat-input-section .form-main .chat-input-section-center button.disabled {
pointer-events:none;
position:relative;
opacity:0.5;
}
.emojiPicker nav {display:none;}
.emojiPicker .shortcode{display: none;}
.emojiPicker {height: auto !important;}
.emojiPicker .sections {height:230px !important;}
p.no-msg {text-align:center;font-size:20px !important;color:#3b3b3b !important;position: relative;}
.chat-input-section .form-main .chat-input-section-center button.disabled {
pointer-events: none;
position: relative;
opacity: 0.5;
} 
.notice-popup-chat {
position: absolute;
top: 0;
background: rgb(255 255 255 / 80%);
padding: 150px 50px 100px;
}
.notice-popup-chat h3 {
font-size: 30px;
font-weight: 700;
margin-bottom: 20px;
color: #000;
}
.teamchats.width80 .chat-section .direct-msg .notice-popup-chat p {
font-size: 16px !important;
font-weight: 400 !important;
margin-bottom: 15px;
}
.notice-popup-chat a.btn {
background: #00c0ff;
color: #fff !important;
width: 170px !important;
margin: auto;
display: block;
font-size: 13px !important;
margin-top: 25px;
}
.heading_with_select select {
padding: 10px 20px;
border-radius: 6px !important;
border: 1px solid #ccc !important;
font-size: 16px;
background: #fff !important;
margin-left: 15px;
}
.heading_with_select {
display: flex;
margin-bottom: 15px;
}
.joinchat-img {
text-align: center;
}
.joinchat-img {
position: relative;
left: 40%;
transform: translateX(-50%);
}
.heading_with_select select {
width: 100%;
max-width: 600px;
}
.notice-popup-chat:after {
content: "";
position: absolute;
top: 11px;
left: 40%;
background: url("https://staging3.booostr.co/wp-content/plugins/user-booster-link/assets/images/arrow-icon.png");
width: 58px;
height: 150px;
background-repeat: no-repeat;
background-size: contain;
transform: translateX(-50%);
}
.col-lg-9.yyy.cstm-test.yy.width80 .default-text p {
font-size: 16px !important;
font-weight: 400!important;
}
.contact-item img.pm-img {
width: 15px;
margin-left: 5px;
vertical-align: middle;
}
.group_info_trigger {
font-size: 11px;
cursor: pointer;
border: solid 1px #d6d6d6;
border-radius: 8px;
padding: 10px;
margin-left: 15px;
}

.dm-sec-header .user i {
font-size: 35px;
}

.info_icon_inner {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
background-color: #fff;
padding: 30px 10px;
width: 500px;
border-radius: 10px;
border: 5px solid #00c0ff;

}
.info_icon {position: fixed;left: 0;top: 0;transform: scale(1.1) !important;width: 100%;height: 100%;transition: visibility 0s linear .25s,opacity .25s 0s,transform .25s;z-index: 99999;max-width: 100%;background-color: rgba(0,0,0,.5);opacity:0; visibility:hidden;}
span.close-icon {
width: 30px;
height: 30px;
line-height: 28px;
text-align: center;
cursor: pointer;
border-radius: 50%;
font-size: 30px;
margin-right: 12px;
color: #fff;
font-weight: 700;
background: #00c0ff;
position: absolute;
right: -7px;
top: 4px;
padding-left: 1px;
}
.dm-sec-header {
display: flex;
justify-content: space-between;
align-items: center;
}


.info_icon_inner .user span.name {
font-size: 13px;
padding-left: 5px;
}

.info_icon_inner .user span.user-pic img {
width: 30px;
height: 30px;
}
.dm-sec-header .info_icon_inner .user .user-pic:after {
width: 9px;
height: 9px;
}

.info_icon_inner span.user-pic .default-img, .info_icon_inner span.user-pic img {
width: 30px;
height: 30px;
font-size: 13px;
line-height: 30px;
}

.dm-sec-header .info_icon_inner .user {
margin-bottom: 10px;
}

.info_icon_inner img.pm-img {
width: 15px;
margin-left: 5px;
}

.group_header_right {
display: flex;
flex-wrap:wrap;
}

.group_header_right .group_members {
display: flex;
flex-wrap:wrap;
}

.group_header_right .group_members .user {
padding: 0px;
margin: 0 2px;
}

.group_header_right .group_members .user span.user-pic img {
width: 30px;
height: 30px;
}

.group_header_right .group_members .user span.default-img {
width: 30px;
height: 30px;
line-height: 30px;
font-size: 14px;
}

.group_header_right .group_members .user .user-pic:after {
width: 9px;
height: 9px;
}

.direct-msg ul.direct-conversation li a>span:last-child {margin-left:0;}

.chat-input-section .form-main .chat-input-section-center i.emoji-picker-icon.emoji-picker.fa.fa-smile-o {
width: 27px;
height: 27px;
display: inline-flex;
justify-content: center;
align-items: center;
background: #0000000a;
margin: 2px;
border-radius: 50%;
cursor: pointer;
position: absolute;
left: 19px;
top: 28px;
}
.chat-input-section .form-main .chat-input-section-center .emoji-menu {
left: 26px;
right: auto;
margin-right: auto;
/* top: -100%; */
bottom: 71px;
width: 100%;
max-width: 300px;
overflow-x: hidden;
}
.chat-input-section .form-main .chat-input-section-center {
max-width: 100%;
}
.chat-input-section .form-main .chat-input-section-center button {
margin-left: 15px;
}

.chat-input-section .form-main .chat-input-section-center {
align-items: center;
}
.emoji-wysiwyg-editor {
width: 100%;
}
.emoji-wysiwyg-editor:focus {
outline: 0;
box-shadow: none;
}
.emoji-wysiwyg-editor {
padding: 12px 15px !important;
border-radius: 37px !important;
border: 1px solid #ddd !important;
font-size: 16px;
overflow: hidden !important;
min-height: unset !important;
height: auto !important;
line-height: normal !important;
background: #fff;
max-height: unset!important;
}
.chat-input-section{
background:#f2f2f2;
}
.chat-input-section-center .emoji-picker-icon {
font-size: 20px;
}

/*======2024-02-01======*/
.ctext-wrap-contents {
    position: relative;
}
.ctext-wrap-contents i.message-menu-icon {
	color: #00c0ff;
    position: absolute;
    right: -15px;
    top: 5px;
    opacity: 0;
    transition: opacity .2s ease-in-out;
    padding: 5px 5px 5px 10px;
    cursor: pointer;
}
.chat-list.right .ctext-wrap-contents i.message-menu-icon {
    right: initial;
    left: -15px;
    padding: 5px 10px 5px 5px;
}
.ctext-wrap-contents:hover i.message-menu-icon{
    opacity: 1;
}

.custom_modal.minecustompop-ra-bu .cstm_modal_inner {
    padding: 60px;
    background: #fff;
    border-radius: 11px;
    border: 5px solid #00c0ff;
    text-align: center;
    box-shadow: 0px 0px 23px #0000000d;
    height: auto;
}

.custom_modal.minecustompop-ra-bu .cstm_modal_inner .custm_body h2 {
    font-family: 'Arvo';
    font-weight: 700;
    color: #00c0ff;
    font-size: 50px;
    text-align: center;
    margin-bottom: 40px;
}

.custom_modal.minecustompop-ra-bu .cstm_modal_inner .custm_body {
    display: block;
}

.custom_modal.minecustompop-ra-bu .cstm_modal_inner .custm_body p {
    color: #3d3d3d;
    font-size: 23px;
    line-height: normal;
    text-align: center;
    max-width: 561px !important;
    font-weight: 500;
    margin-left: auto;
    margin-right: auto;
}

.custom_modal.minecustompop-ra-bu .cstm_modal_inner .pfmodalclose1 {
    width: 35px;
    height: 35px;
    right: 6px;
    top: 6px;
    border: 0;
}

.custom_modal.minecustompop-ra-bu .cstm_modal_inner .pfmodalclose1 img {
    width: 16px;
    filter: drop-shadow(0px 0px 1px #fff);
}

.report-abuse-btns button{
    margin: 10px;
    border: none;
    padding: 10px 20px;
}

.report-abuse-btns .close-minecustompop{
    border-radius: 6px;
    background-color: #f0f0f0;
    font-size: 16px;
    font-weight: 600;
}

.pfuaformsidebar ul.pf-sidebar-menu li.blockusersicon a:before{
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAADcSURBVHgBrZLRDYIwEIbvCuHZDWQER/DdaOQVQpQJdANlAnECTAjvJsb4ygg6gWygz4SCV55KrRiMX9K0d7m/d70egkKSnMaGYWzquh6TmdMKPW9yUONQNuL4YltWdX8LQu647uwo+5hsmGa5Bi3mSvW0hIwZQ52MyrY7hVXFb6An6xSWZRkhYi77ECFnrAhVIYKGND0vRVfFJUVRREHgPOFfoJRlRBkWdJxr4q6c873vT7OWkESi3RF8Z0vD0LwXP316B4GYJGZZ9Q760QwDUpkP2gfQD5v9IGp4AUpBRcfKK+H1AAAAAElFTkSuQmCC)no-repeat;
    background-size: contain;
}
.pfuaformsidebar ul.pf-sidebar-menu li.blockusersicon:hover a:before{
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAFoTx1HAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoV2luZG93cykiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NEQwNTdCOEM2QTNCMTFFQzhGRDVGOUZBRkUxNkMxQjgiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NEQwNTdCOEQ2QTNCMTFFQzhGRDVGOUZBRkUxNkMxQjgiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo0RDA1N0I4QTZBM0IxMUVDOEZENUY5RkFGRTE2QzFCOCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo0RDA1N0I4QjZBM0IxMUVDOEZENUY5RkFGRTE2QzFCOCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Phzk9+YAAAECSURBVHjaYvz//z8D40GGBEYo4z5AADEwHPjvAOIwMTAwzAdiBoAAgkn9B3H+2zMwMgKVvAeyBRigACCAGEAqgIL/YfrggAmozwBIPwDSDiB9/2EyAAEENhXMgJoMMx2sDU1gIRALwnUCjVEA0vcZMEEiQACBnQJ1zn4gvg/jw50GtG8CkHIAYgUgez/cqVD6A5JxD1B8CDU2AYgbkI2FBVA/UF0AVP0FoMsDYa79j8WlYK8xMeAAQNPkAQIMHkJQAVx+DgSatAEl0NEU9OOwBEOcCSM0kYMAESSOGM79j92PBAEL1G/5QGoCEeobgH5thAXreqTwJgaA4sQQZ3wQAAoA93aCHXwZSqwAAAAASUVORK5CYII=)no-repeat;
}

.chat-section .dm-section .user {
    position: relative;
}
.dm-section .user .chat-user-block-icon {
    position: absolute;
    font-size: 18px;
    left: 5px;
    top: 5px;
    display: none;
    cursor: pointer;
}
.user:hover .chat-user-block-icon{
    display: initial;
}

/* 2023-02-05 */

.teamchats .user span{
	cursor: pointer;
}

.minecustompop-ra-bu span.user-pic .default-img {
    width: 80px;
    height: 80px;
    line-height: 80px;
    font-size: 30px;
}

.minecustompop-ra-bu span.user-pic img {
    width: 80px;
    height: 80px;
}

.minecustompop-ra-bu .user-info-wrap {
    margin: 20px 0;
}

.minecustompop-ra-bu .cstm_modal_inner .custm_body p.name {
    color: #000;
    font-weight: bold;
}

.minecustompop-ra-bu .cstm_modal_inner .custm_body p.online-status {
    font-size: 17px;
}

.minecustompop-ra-bu .cstm_modal_inner .custm_body p.email {
    font-size: 20px;
}

.minecustompop-ra-bu .cstm_modal_inner .custm_body p.block-status {
    font-size: 20px;
    color: green;
}

.minecustompop-ra-bu .cstm_modal_inner .custm_body p.block-status.blocked {
	color: red;
}

.user-block-toggle-wrap {
    display: flex;
    justify-content: center;
}

.block-toggle-label-wrap {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

span.block-toggle-label {
    font-size: 16px;
}

.col-lg-9.cst-main.yyy.cstm-test.yy.blockuserlist table.table.boosterAlert-table.block-user-table.cst-tabl {
    margin-top: 0;
}

.block-user-list-button {
    display: flex;
    justify-content: end;
    margin-bottom: 20px
}

.block-user-list-button a {
    padding: 9px 12px;
    border-radius: 6px !important;
    border: 1px solid #00c0ff !important;
    font-size: 14px !important;
    background: #fff !important;
    color: #00c0ff;
    text-transform: none;
    font-weight: 700 !important;
    text-align: center;
    letter-spacing: 0 !important;
    display: inline-block;
    margin: 0;
}

.chat-message-btns-wrap {
    position: fixed;
    background-color: #fff;
    border-radius: 3px;
    box-shadow: 0 2px 4px rgba(15,34,58,.12);
    padding: 10px 20px;
    top: 100px;
    left: 500px;
}
.chat-message-btns-wrap p{
    margin: 0 0 5px 0;
    cursor: pointer;
}

/* 2024-02-06 */
.blockuserlist .back-link a:hover{
	color: #09f;
}

/* 2024-02-07 */
.empty-block-user-list {
    max-width: 654px;
    text-align: center;
    background: #f4f4f4;
    padding: 50px 70px;
    margin: 9rem auto 0;
    border-radius: 10px
}
.empty-block-user-list h3 {
    color: #00c0ff;
    font-family: 'Arvo', sans-serif;
    font-weight: bold;
    font-size: 3rem;
    margin-bottom: 30px;
    line-height: 1.2;
}
.empty-block-user-list p {
    font-size: 15px;
    margin-bottom: 40px;
    font-weight: 600;
}