/* Fond de page */
body {
    margin: 0; padding: 0;
    font-family: 'Segoe UI', Arial, sans-serif;
    background: linear-gradient(180deg, #ffffff 0%, #f4f4f4 100%);
    display: flex; justify-content: center; align-items: center;
    min-height: 100vh;
}

.conteneur-principal { width: 100%; display: flex; justify-content: center; padding: 20px; }

/* Carte du formulaire */
.bloc-formulaire {
    background-color: #f0f0f0;
    width: 100%; max-width: 400px;
    padding: 40px 30px; border-radius: 60px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
    text-align: center;
}

.titre-page { color: #38b44a; font-size: 2.2rem; margin-bottom: 25px; }

/* Style des champs */
form input, form select {
    width: 100%; box-sizing: border-box;
    padding: 12px; margin-bottom: 18px;
    border: none; border-bottom: 2px solid #ff4d4d; /* Rouge */
    background: white; font-size: 1rem; text-align: center;
    outline: none; transition: 0.3s;
}

/* Interactivité : passage au Vert */
form input:not(:placeholder-shown),
form input:focus,
form select:valid {
    border-bottom: 2px solid #38b44a;
}

.lien-info { font-size: 0.95rem; color: #444; cursor: pointer; text-decoration: underline; margin: 15px 0; }
.lien-info:hover { color: #38b44a; }

.bouton-inscription {
    background-color: #38b44a; color: white;
    border: none; padding: 15px; border-radius: 20px;
    font-size: 1.1rem; font-weight: bold; cursor: pointer;
    width: 90%; margin-top: 10px;
}

.lien-connexion { display: block; margin-top: 20px; color: #38b44a; text-decoration: none; font-weight: bold; }

/* --- STYLE DE LA FENÊTRE D'INFOS (MODALE) --- */
.modale {
    display: none; position: fixed; z-index: 100;
    left: 0; top: 0; width: 100%; height: 100%;
    background-color: rgba(0,0,0,0.6); overflow-y: auto;
}

.contenu-modale {
    background-color: white; margin: 5% auto; padding: 30px;
    border-radius: 30px; width: 80%; max-width: 600px;
    text-align: left; position: relative;
}

.fermer {
    position: absolute; right: 20px; top: 15px;
    font-size: 28px; font-weight: bold; cursor: pointer; color: #888;
}

.contenu-modale h2 { color: #38b44a; border-bottom: 2px solid #38b44a; padding-bottom: 5px; }
.liste-simple { list-style: none; padding: 0; }
.liste-simple li { padding: 8px 0; border-bottom: 1px solid #eee; }
.grille-horaires p { margin: 10px 0; font-size: 0.9rem; border-left: 3px solid #ff4d4d; padding-left: 10px; }