/* Bouton flottant spécifique */ #helpButton { position: fixed; bottom: 25px; right: 25px; width: 55px; height: 55px; background-color: #004a99; /* Bleu Inter Santé */ color: white; border: none; border-radius: 50%; font-size: 26px; font-weight: bold; cursor: pointer; box-shadow: 0 5px 15px rgba(0,0,0,0.3); z-index: 9999; /* Toujours au dessus */ transition: transform 0.2s; } #helpButton:hover { transform: scale(1.1); } /* Container du modal isolé */ #helpModal.help-modal-container { display: none; position: fixed; z-index: 10000; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.6); /* Fond assombri */ backdrop-filter: blur(3px); } /* Fenêtre de contenu isolée */ #helpModal .help-modal-content { background-color: #ffffff; margin: 12% auto; padding: 30px; border-radius: 15px; width: 450px; position: relative; box-shadow: 0 15px 40px rgba(0,0,0,0.5); font-family: Arial, sans-serif; } /* Éléments internes préfixés */ #helpModal .help-close-button { position: absolute; top: 15px; right: 20px; font-size: 30px; cursor: pointer; color: #888; } #helpModal .help-title { color: #004a99; margin-top: 0; font-size: 22px; } #helpModal .help-grid { display: flex; gap: 20px; margin-top: 25px; } #helpModal .help-card { flex: 1; text-decoration: none; color: #333; padding: 20px; border: 2px solid #f0f0f0; border-radius: 10px; text-align: center; transition: all 0.3s; } #helpModal .help-card:hover { border-color: #004a99; background-color: #f9fcff; } #helpModal .help-icon { font-size: 35px; display: block; margin-bottom: 10px; } #helpModal .help-card-title { display: block; font-size: 14px; margin-bottom: 5px; } #helpModal .help-card-info { color: #666; font-size: 11px; } #helpModal .help-modal-footer { margin-top: 25px; padding-top: 15px; border-top: 1px solid #eee; text-align: center; font-size: 12px; color: #999; }