.rating-wrapper {
    align-self: center;
    display: inline-flex;
    direction: rtl !important;
    padding: 1.5rem 2.5rem;
}

    .rating-wrapper label {
        color: #E1E6F6;
        cursor: pointer;
        display: inline-flex;
        font-size: 1rem;
        padding: 0.1rem 0.3rem;
        transition: color 0.5s;
    }

    .rating-wrapper svg {
        -webkit-text-fill-color: transparent;
        -webkit-filter: drop-shadow 4px 1px 6px #c6ceed;
        filter: drop-shadow(5px 1px 3px #c6ceed);
    }

    .rating-wrapper input {
        height: 100%;
        width: 100%;
    }

    .rating-wrapper input {
        display: none;
    }

        .rating-wrapper label:hover,
        .rating-wrapper label:hover ~ label,
        .rating-wrapper input:checked ~ label {
            color: #f1b756;
        }

            .rating-wrapper label:hover,
            .rating-wrapper label:hover ~ label,
            .rating-wrapper input:checked ~ label {
                color: #f1b756;
            }