a {text-decoration: none;}

ul {list-style: none;}

.emphase {
    text-decoration: #ffed00  underline;
    text-decoration-thickness: 4px;
}
  

.eventTextFull {
    background-color:black;
    color:white;
     display: inline'
}


.eventText {
    background-color:lightgreen;
    color:black;
     display: inline'
}


        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        /* Définition de la taille de la page */
        html, body {
            height: 100%;
            font-family: Arial, sans-serif;
        }


        body {
            display: flex;
            flex-direction: column;
            min-height: 100vh;
            margin: 0;
            /* padding-bottom: 20px; /* Hauteur du footer */
        }
        .content {
            flex: 1;
            margin-top: 56px; /* Height of the navbar */
            margin-bottom: 20px; /* Height of the footer */
            overflow-y: auto;
        }
        nav {
            position: fixed;
            top: 0;
            width: 100%;
            z-index: 1030;
        }


        /* Fixe le footer en bas de la page */
        footer {
            
            bottom: 0;
            width: 100%;
            z-index: 1020;
        }

        /* Conteneur principal qui occupe toute la hauteur de la page */
        .container {
            display: flex;
            flex: 1; /* Permet à la container de prendre tout l'espace restant */
            overflow-y: auto; /* Permet le défilement si le contenu déborde */

        }

        .container-center-large {
            width: 100%; /* Équivalent à container-fluid */
            margin-top: 1.5rem !important; /* Équivalent à mt-4 (valeur par défaut Bootstrap v5) - utilisez la valeur qui vous convient */
            margin-left: auto !important;  /* Équivalent à mx-auto */
            margin-right: auto !important; /* Équivalent à mx-auto */
            background: lightgreen; padding: 2px 6px;
            flex: 1; /* Permet à la container de prendre tout l'espace restant */
            overflow-y: auto; /* Permet le défilement si le contenu déborde */
        }

        .example-wrapper { 
            width: 100%; /* Équivalent à container-fluid */
            margin-top: 1.5rem !important; /* Équivalent à mt-4 (valeur par défaut Bootstrap v5) - utilisez la valeur qui vous convient */
            margin-left: auto !important;  /* Équivalent à mx-auto */
            margin-right: auto !important; /* Équivalent à mx-auto */
            background: lightgreen; padding: 2px 6px;
            flex: 1; /* Permet à la container de prendre tout l'espace restant */
            overflow-y: auto; /* Permet le défilement si le contenu déborde */
        }



        /* Ajoute un fond rouge pâle aux champs de formulaire invalides */
        .form-control.is-invalid {
            background-color: #f8d7da; /* Couleur de fond rouge pâle (similaire à l'alerte danger de Bootstrap) */
            /* Vous pouvez ajuster la couleur si vous préférez un rouge différent, par exemple : */
            /* background-color: rgba(255, 0, 0, 0.1); /* Un rouge semi-transparent */
        }

        /* Optionnel : S'assurer que d'autres types d'input invalides ont aussi le fond */
        input[type="text"].is-invalid,
        input[type="email"].is-invalid,
        input[type="password"].is-invalid,
        textarea.is-invalid {
            background-color: #f8d7da; /* Assurez-vous que cette règle est assez spécifique si nécessaire */
        }

        /* Pour les selects invalides si vous en avez */
        select.is-invalid {
            background-color: #f8d7da;
        }

        /* Ajoute un fond rouge pâle aux checkboxes invalides (peut ne pas être très visible) */
        input[type="checkbox"].is-invalid {
            background-color: #f8d7da;
        }

        /* Style le label associé à une checkbox invalide */
        /* Ciblage plus spécifique : le label avec la classe .form-check-label */
        /* qui suit un input de type checkbox avec la classe .is-invalid */
        input[type="checkbox"].is-invalid + label.form-check-label {
            color: #dc3545; /* Couleur de texte rouge (similaire à l'alerte danger de Bootstrap) */
            font-weight: bold;
        }