/* Conteneur de la barre de progression circulaire */
#progress-face.progress-circle-container {
    position: fixed;
    bottom: 10px;
    right: 10px;
    width: 55px; /* Adapter à la taille du cercle */
    height: 55px; /* Adapter à la taille du cercle */
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
}
#progress-face a {
    color: #d82119;
}

/* Conteneur du cercle */
#progress-face .progress-circle {
    position: relative;
    width: 55px; /* Correspond à la taille du cercle */
    height: 55px; /* Correspond à la taille du cercle */
}

/* Le cercle SVG de la barre de progression */
#progress-face svg {
    width: 100%;
    height: 100%;
    background: #d82119;
    border-radius: 50%;
}

/* Cercle de progression */
#progress-face .circle-progress {
    fill: none;
    stroke: #fff;
    stroke-width: 4;
    stroke-linecap: round;
    stroke-dasharray: 150.8; /* Calculé pour un rayon de 24px */
    stroke-dashoffset: 150.8;
    transition: stroke-dashoffset 0.3s;
}

/* Texte centré */
#progress-face .percentage {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 12px; /* Réduire un peu la taille de la police */
    font-weight: bold;
    color: #fff;
}

/* Icône et texte */
#progress-face span.percentage i {
    font-size: 18px; /* Réduire la taille de l'icône */
    color: #fff;
}