.upload-icon {
    position: absolute;
    bottom: 10px;
    right: 10px;
    cursor: pointer;
    color: #007bff;
}

.profile-avatar img {
    position: relative;
    height: 110px;
    width: 110px;
    border-radius: 50%; /* 50% is commonly used and sufficient */
    overflow: hidden;
    object-fit: cover; /* Ensures the image fills the circle */
}

/* Ajoute " *" rouge au label si le conteneur contient un champ required */
.mb-3:has(input[required], select[required], textarea[required]) > label.form-label::after,
.form-group:has(input[required], select[required], textarea[required]) > label.form-label::after {
    content: " *";
    color: #dc3545; /* rouge bootstrap */
    font-weight: 600;
    margin-left: 2px;
}