/* =============================================
   NOTE : Ce fichier à pour but de devenir le CSS générale pour toutes les pages de connexion
   ============================================= */


/* =============================================
   STRUCTURE DU CHAMP MOT DE PASSE + ICÔNE ŒIL
   ============================================= */

/* Conteneur alignant horizontalement l'input et le bouton œil */
.motdepasse-toggle-group {
    display: flex;
    align-items: stretch;
}

/* Bloc contenant l'icône œil à droite du champ */
.motdepasse-toggle-group .input-group-append {
    display: flex;
    align-items: center;
    padding: 0 8px;
    border-left: none; 
}

/* Bouton contenant le picto SVG */
.toggle-password {
    background: none !important;
    border: none !important;
    padding: 0;
    display: flex;
    justify-content: center;
    align-content: center;
    cursor: pointer;
}

/* Style de l'icône SVG */
.toggle-password svg {
    width: 18px;
    height: 18px;
    fill: #333; 
}

/* Opacité réduite quand le champ est visible (état actif) */
.toggle-password.active svg {
    opacity: 0.4;
}

/* =============================================
   STRUCTURE .....
   ============================================= */