/* Tổng quan BuddyPress */
.buddypress {
    font-family: 'Arial', sans-serif;
    background-color: #f9f9f9; /* Màu nền tổng thể */
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* Đổ bóng nhẹ */
}

/* Tiêu đề phần */
#bp-activity h2,
#groups-dir h2,
#members-dir h2 {
    color: #0077B3; /* Màu tiêu đề */
    font-size: 24px; /* Kích thước chữ */
    border-bottom: 2px solid #0077B3; /* Đường dưới tiêu đề */
    padding-bottom: 10px; /* Khoảng cách dưới tiêu đề */
    margin-bottom: 20px; /* Khoảng cách dưới tiêu đề */
}

/* Hồ sơ người dùng */
.item-avatar {
    border-radius: 50%; /* Hình tròn cho ảnh đại diện */
    overflow: hidden;
    border: 2px solid #0077B3; /* Đường viền ảnh đại diện */
    width: 100px; /* Đặt kích thước cụ thể */
    height: 100px; /* Đặt kích thước cụ thể */
}

.profile-header {
    background-color: #0077B3; /* Màu nền cho phần hồ sơ */
    color: #fff; /* Màu chữ */
    padding: 15px;
    border-radius: 8px;
    text-align: center; /* Căn giữa nội dung */
}

/* Các nhóm */
.group-avatar {
    border-radius: 8px; /* Bo góc cho ảnh nhóm */
    margin-bottom: 15px; /* Khoảng cách dưới ảnh nhóm */
}

.group-name {
    font-weight: bold; /* Đậm chữ tên nhóm */
    font-size: 18px; /* Kích thước chữ */
    color: #333; /* Màu chữ */
}

/* Bảng hoạt động */
.activity-list {
    list-style: none; /* Bỏ dấu đầu dòng */
    padding: 0; /* Bỏ khoảng cách */
}

.activity-list li {
    background: #fff; /* Màu nền của mỗi mục hoạt động */
    margin-bottom: 10px; /* Khoảng cách giữa các mục */
    padding: 15px; /* Khoảng cách bên trong */
    border-radius: 8px; /* Bo góc cho mục */
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1); /* Đổ bóng cho mục */
    transition: background-color 0.3s; /* Hiệu ứng chuyển màu nền */
}

.activity-list li:hover {
    background: #f1f1f1; /* Màu nền khi di chuột qua */
}

/* Nút */
.button {
    background-color: #0077B3; /* Màu nền cho nút */
    color: #fff; /* Màu chữ nút */
    padding: 10px 20px; /* Khoảng cách bên trong */
    border: none; /* Bỏ đường viền */
    border-radius: 5px; /* Bo góc cho nút */
    cursor: pointer; /* Con trỏ khi di chuột qua nút */
    transition: background-color 0.3s; /* Hiệu ứng chuyển màu nền */
}

.button:hover {
    background-color: #005f8b; /* Màu nền khi di chuột qua nút */
}

/* Thông báo lỗi và thông báo thành công */
.notice {
    padding: 15px;
    border-radius: 5px;
    margin-bottom: 20px;
}

.notice.error {
    background-color: #ffdddd; /* Màu nền cho thông báo lỗi */
    color: #d8000c; /* Màu chữ cho thông báo lỗi */
}

.notice.success {
    background-color: #ddffdd; /* Màu nền cho thông báo thành công */
    color: #4caf50; /* Màu chữ cho thông báo thành công */
}

/* Phần bình luận */
#comments {
    background-color: #f1f1f1; /* Màu nền cho phần bình luận */
    padding: 20px;
    border-radius: 8px;
}

.comment {
    margin-bottom: 10px; /* Khoảng cách giữa các bình luận */
    padding: 15px;
    background: #fff; /* Màu nền cho bình luận */
    border-radius: 8px; /* Bo góc cho bình luận */
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1); /* Đổ bóng cho bình luận */
}

/* Các liên kết */
a {
    color: #0077B3; /* Màu liên kết */
    text-decoration: none; /* Bỏ gạch chân */
}

a:hover {
    text-decoration: underline; /* Gạch chân khi di chuột qua */
}

/* Phân trang */
.pagination {
    display: flex; /* Sử dụng flexbox */
    justify-content: center; /* Căn giữa */
    margin: 20px 0; /* Khoảng cách trên/dưới */
}

.pagination a {
    margin: 0 5px; /* Khoảng cách giữa các liên kết phân trang */
    padding: 10px 15px; /* Khoảng cách bên trong */
    background: #0077B3; /* Màu nền cho liên kết phân trang */
    color: white; /* Màu chữ cho liên kết phân trang */
    border-radius: 5px; /* Bo góc cho liên kết phân trang */
    transition: background 0.3s; /* Hiệu ứng chuyển màu nền */
}

.pagination a:hover {
    background: #005f8b; /* Màu nền khi di chuột qua liên kết phân trang */
}


.bp-screen-reader-text {
    height: auto !important;
    overflow: inherit;
    width: auto !important;
}

form#notifications-bulk-management {
    display: block !important;
}

div#friendship-button-1 {
    margin-top: 10px !important;
}

.buddypress {

    padding: 0 !important;
}


.xoo-aff-radio {
    display: flex;
    align-items: center;
    justify-content: space-around;
}