/*.lesson-chat-container {*/
/*    border: 1px solid #ddd;*/
/*    border-radius: 8px;*/
/*    padding: 20px;*/
/*    margin-top: 30px;*/
/*}*/

/*.chat-messages {*/
/*    height: 300px;*/
/*    overflow-y: auto;*/
/*    margin-bottom: 20px;*/
/*    padding: 10px;*/
/*    border: 1px solid #eee;*/
/*    border-radius: 4px;*/
/*}*/

/*.message {*/
/*    margin-bottom: 15px;*/
/*    padding: 10px;*/
/*    border-radius: 4px;*/
/*}*/

/*.message.current-user {*/
/*    background-color: #e3f2fd;*/
/*    margin-left: 20%;*/
/*}*/

/*.message.other-user {*/
/*    background-color: #f5f5f5;*/
/*    margin-right: 20%;*/
/*}*/

/*.message p {*/
/*    margin: 5px 0;*/
/*}*/

/*.message small {*/
/*    color: #666;*/
/*    font-size: 0.8em;*/
/*}*/

/*.chat-form textarea {*/
/*    resize: vertical;*/
/*    min-height: 60px;*/
/*}*/





.lesson-chat-container {
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 20px;
    margin-top: 30px;
}

.chat-messages {
    height: 300px;
    overflow-y: auto;
    margin-bottom: 20px;
    padding: 10px;
    border: 1px solid #eee;
    border-radius: 4px;
    display: flex;
    flex-direction: column;
}

.message {
    margin-bottom: 15px;
    padding: 10px;
    border-radius: 4px;
    max-width: 80%;
}

.message.current-user {
    background-color: #e3f2fd;
    align-self: flex-end;
}

.message.other-user {
    background-color: #f5f5f5;
    align-self: flex-start;
}

.message p {
    margin: 5px 0;
}

.message small {
    color: #666;
    font-size: 0.8em;
}

.chat-form textarea {
    resize: vertical;
    min-height: 60px;
}
.message-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}

.teacher-badge {
    font-size: 1.2em;
    color: #4a6baf;
    background: #e8f0fe;
    border-radius: 50%;
    padding: 2px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
}
/* Add to your existing styles */
.user-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    object-fit: cover;
    margin-right: 8px;
}

.message-header {
    display: flex;
    align-items: center;
    margin-bottom: 5px;
}

/* Adjust existing styles if needed */
.message.current-user .message-header {
    justify-content: flex-end;
}

.message.other-user .message-header {
    justify-content: flex-start;
}