.rating {
    direction: rtl; /* Make the highest number appear first */
    font-size: 2rem;
    text-align: left; /* ⬅ fix stars sticking to the right */
}

.rating input {
    display: none;
}

.rating label {
    color: #ccc;
    cursor: pointer;
}

.rating input:checked ~ label {
    color: #ffc107; /* Bootstrap's "warning" yellow */
}

.rating label:hover,
.rating label:hover ~ label {
    color: #ffc107;
}