/* =========================================================
   Notation en étoiles (Articles + Projets)
========================================================= */

.ades-notes {
    margin-block-start: 32px;
    padding-block-start: 24px;
    border-block-start: 1px solid var(--color-bordure-claire);
}

.ades-notes__etoiles {
    display: inline-flex;
    flex-direction: row-reverse;
    gap: 4px;
}

.ades-notes__etoiles input {
    position: absolute;
    width: 0;
    height: 0;
    opacity: 0;
}

.ades-notes__etoiles label {
    cursor: pointer;
    font-size: 1.5rem;
    line-height: 1;
    color: var(--color-bordure-claire);
    transition: color 0.15s ease;
}

.ades-notes__etoiles input:disabled ~ label {
    cursor: default;
}

/* Remplissage : étoile survolée + toutes celles à sa droite
   (grâce à row-reverse, "à droite dans le DOM" = "à gauche à
   l'écran", ce qui donne le bon sens de remplissage visuel) */
.ades-notes__etoiles label:hover,
.ades-notes__etoiles label:hover ~ label,
.ades-notes__etoiles input:checked ~ label,
.ades-notes__etoiles input:checked ~ label ~ label {
    color: var(--color-secondaire);
}

.ades-notes__resume {
    margin-block-start: 8px;
    font-family: var(--font-body);
    font-size: 0.9rem;
    color: var(--color-noir);
    opacity: 0.75;
}

.ades-notes__merci {
    margin-block-start: 4px;
    font-family: var(--font-body);
    font-size: 0.85rem;
    color: var(--color-primaire-clair);
    font-weight: 600;
}