/* #PRODUIRE{fond=css/noter_annotation.css}
   md5:8d531b96335ff2d66dd712d6eada1b1e */
/* Style de base des boutons d'action de notation */
.notation-annotation {
    display: inline-flex;
    gap: 2px;

}

.notation-annotation form, 
.notation-annotation button {
    margin: 0;
    padding: 0;
    background: transparent;
    border: none;
    cursor: pointer;
}

/* La magie du remplissage partiel */
.star-fill {
    display: inline-block;
    /* On crée un dégradé de gauche à droite */
    /* --p est la variable que SPIP va envoyer (ex: 20%) */
    background: linear-gradient(to right, #FFD700 var(--p), #CCC var(--p));
    
    /* On découpe le fond pour qu'il n'apparaisse que dans l'étoile */
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    
    transition: transform 0.1s;
}

.star-fill:hover {
    transform: scale(1.2);
}