#ch24d{display: flex;flex-direction: column;padding-bottom: 100px;position: relative;}
#chat-box {width: 400px;margin: auto;font-family: sans-serif;}
.message-header img{width: 70px;height: 70px;border-radius: 70px;}
.AllMessages{direction: rtl;display: flex;flex-direction: column;}
.AllMessages .conversation-item a {display: flex;align-items: center;gap: 15px;}
.conversation-avatar img{width: 75px;border: 1px solid var(--color-04);border-radius: 100%;padding: 10px;height: 75px;}
h4.conversation-name{font-size: 17px;margin-bottom: 0;font-weight: 600;color: #444;font-family: inherit;}
.hiddenChats{display: none !important}
#chat-notification-count{display: none;position: absolute;top: -5px;right: -5px;background: #f00;color: white;border-radius: 50%;padding: 2px 6px;font-size: 12px;width: 18px;height: 18px;line-height: 1.2;}
.read{background: #fff;}
.unread{background: var(--color-02);}
.message-item{display: flex;gap: 10px;  align-items: center;}
.message-name{font-size: 15px;font-weight: 600;}
.message-time{margin: 0;font-size: 12px;}
.conversation-item{padding: 15px;}
.conversation-item img{width: 80px;height: 80px;border-radius: 100%}
#back-button,#sendMessageContainer {display: none;}
#messages div {margin: 5px;padding: 8px 12px;border-radius: 10px;max-width: 70%;}
.no-message{text-align: center;direction: rtl;}
.sent img.message-avatar, .sent .message-name{display: none}
.message-input-wrapper{margin: 20px auto;}
#send-message-btn{border-radius: 37px;font-family: inherit;font-size: 15px;background: var(--color-10);}
#message-input{border-radius: 20px;text-align: right;direction: rtl;font-family: inherit;background: #ececec;}
#ch24d > span{position: absolute;right: 20px;top: 10px;border: none;padding: 6px;border-radius: 20px;background: var(--color-07);width: 40px;height: 40px;text-align: center;font-weight: 600;color: #fff;align-items: center;justify-content: center;}
.sent {text-align: right;text-align: -moz-right;margin-left: auto;display: flex;justify-content: end;flex-direction: row-reverse;}
.received {text-align: left;text-align: -moz-left;display: flex;justify-content: start;flex-direction: row;}
.received .message-text{background: var(--color-05);color: #fff;}
.message-date{font-size: 12px;font-weight: 600;color: var(--accent);}
#message-container{background:#fff;padding: 12px;display: flex;flex-direction: column;gap: 15px;}
.message-text{width: fit-content;padding: 10px 12px 10px 10px;background: #ddd;border-radius: 13px;}