.post-rating {
    display: flex;
    align-items: center;
    gap: 3px;
    position: relative;
    margin: 5px 0;
}

.post-rating .star {
    font-size: 1.6em;
    color: #ccc  !important; /* Màu xám cho ngôi sao chưa được đánh giá */
    cursor: pointer;
    transition: color 0.3s ease;
}

.post-rating .star.full {
    color: #f5b301 !important; /* Màu vàng cho ngôi sao đầy */
}

.post-rating .star.half {
    background: linear-gradient(to right, #f5b301 0%, #ccc 50%);
    -webkit-background-clip: text;
    color: transparent  !important;
}

.post-rating .star.quarter {
    background: linear-gradient(to right, #f5b301 0%, #ccc 25%);
    -webkit-background-clip: text;
    color: transparent  !important;
}

.post-rating .star.three-quarter {
    background: linear-gradient(to right, #f5b301 0%, #ccc 75%);
    -webkit-background-clip: text;
    color: transparent  !important;
}

.post-rating .rating-info {
    display: flex;
    align-items: center;
    margin-top: 5px;
    gap: 2px;
    position: relative;
}

.post-rating .rating-notification {
    display: none;
    position: absolute;
    bottom: 120%; 
    right: 0;
    z-index: 102;
    background-color: #fff;
    border: 1px solid #ddd;
    padding: 8px 10px;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    min-width: 17em;
}