.rating-stars {
   
    align-items: center;
    gap: 6px;
    font-size: 18px;
    line-height: 1;
    color: #f5b301; /* couleur étoiles pleines */
    user-select: none;
}

.rating-stars span {
    display: inline-block;
}

.rating-stars .num {
    font-size: 13px;
    color: #777;
    margin-left: 4px;
}





.rating-box{background:#fff;padding:2%;box-shadow:0 1px 1px rgba(0,0,0,.1)}
.rating-value{color:#ffbd4b;font-weight:bold}

.star{font-size:22px;color:#e9ecef}
.star.active{color:#ffbd4b}

.progress{height:8px;background:#eee;border-radius:5px;margin-bottom:10px}
.progress-bar{height:100%;background:#ffbd4b;border-radius:5px}

.review-box{padding:2%;max-width:450px;margin-bottom:20px;background:#fff}
.review-header{}
.avatar{    width: 60px;
    border-radius: 50%;
    height: 60px;
    max-width: 100%;
}
.review-stars{}
.review-stars .note{margin-left:8px;font-weight:bold}
.review-text{margin-top:10px}

.review-form{max-width:500px}
.review-form input,
.review-form textarea{width:100%;margin-bottom:10px}

/* étoiles cliquables */
.rating-input {
    display: flex;
    font-size: 34px;
}

.rating-input input {
    display: none;
}

.rating-input label {
    cursor: pointer;
    color: #727375;
    border-radius: 4px;
    padding: 2px 6px;
    margin-right: 4px;
    line-height: 1;
    transition: color .2s, border .2s;
}

.rating-input label.active {
    color: #ffbd4b;
    border-color: #ffbd4b;
}

