body {
    font-family: 'Roboto', sans-serif !important;

}

a{
    color: #007bff;
    text-decoration: none;
    font-weight:bold;
}

/* Container chính: Chiếm trọn chiều cao còn lại của trình duyệt */
.admin-chat-wrapper {
    display: flex;
    height: calc(100vh - 100px); /* Tự trừ đi chiều cao Header Admin của ông */
    background: #fff;
    margin: -15px; /* Để tràn sát lề AdminLTE nếu cần */
    overflow: hidden;
}

/* Khung chat chính: Chiếm hết chiều ngang còn lại */
.admin-chat-main {
    flex: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
}

/* Sidebar danh sách: Nằm bên phải cho giống app chuyên nghiệp */
.admin-chat-sidebar {
    width: 320px;
    border-left: 1px solid #eee;
    display: flex;
    flex-direction: column;
}

/* Vùng tin nhắn: Tự cuộn lên khi dài */
#admin-messages {
    flex: 1;
    overflow-y: auto;
    padding: 20px;
    display: flex;
    flex-direction: column;
    background: #f9f9f9;
}

/* Bong bóng chat: Không được dàn 100% ngang */
.msg-row {
    display: flex;
    margin-bottom: 5px;
    width: 100%;
}

    .msg-row.admin {
        justify-content: flex-end;
    }

    .msg-row.customer {
        justify-content: flex-start;
    }

.msg-bubble {
    max-width: 70%; /* Giới hạn chiều ngang bong bóng */
    padding: 8px 15px;
    border-radius: 18px;
    font-size: 14px;
}

.admin .msg-bubble {
    background: #0084ff;
    color: #fff;
    border-bottom-right-radius: 4px;
}

.customer .msg-bubble {
    background: #e4e6eb;
    color: #000;
    border-bottom-left-radius: 4px;
}

/* Ô nhập liệu */
.admin-chat-input-area {
    padding: 15px;
    border-top: 1px solid #eee;
    background: #fff;
}

.messenger-input-group {
    display: flex;
    background: #f0f2f5;
    border-radius: 20px;
    padding: 5px 15px;
}

    .messenger-input-group input {
        flex: 1;
        border: none;
        background: transparent;
        outline: none;
        padding: 5px;
    }

/* Avatar hình tròn */
.avatar-circle {
    width: 40px;
    height: 40px;
    background: #0084ff;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
}