/* Orléah, l'aide du site : bouton flottant en bas à droite et fenêtre de questions. Discret : il n'apparaît jamais de lui-même. */
.aide-bouton {
  position: fixed; right: max(1rem, env(safe-area-inset-right)); bottom: max(1rem, env(safe-area-inset-bottom)); z-index: 40;
  display: inline-flex; align-items: center; gap: .45rem; padding: .55rem .95rem .55rem .7rem;
  font-family: var(--police); font-size: .95rem; font-weight: 600; text-decoration: none;
  color: var(--blanc); background: var(--bleu-profond); border: 1px solid var(--or-clair); border-radius: 2rem; box-shadow: var(--ombre); cursor: pointer;
}
.aide-bouton:hover, .aide-bouton:focus-visible { background: var(--bleu-marie); color: var(--blanc); }
.aide-bouton__avatar { width: 2rem; height: 2rem; border-radius: 50%; object-fit: cover; border: 1px solid var(--or-clair); background: var(--blanc); margin: -.2rem 0 -.2rem -.25rem; }
.aide-invite { position: fixed; right: max(1rem, env(safe-area-inset-right)); bottom: calc(max(1rem, env(safe-area-inset-bottom)) + 3.2rem); z-index: 40; max-width: 15rem;
  margin: 0; padding: .45rem .7rem; font-size: .88rem; line-height: 1.35; text-align: left; color: var(--texte); background: var(--blanc); border: 1px solid var(--filet); border-radius: .7rem .7rem .15rem .7rem;
  box-shadow: var(--ombre); opacity: 0; transform: translateY(.3rem); pointer-events: none; transition: opacity .25s, transform .25s; }
.aide-bouton:hover + .aide-invite, .aide-bouton:focus-visible + .aide-invite, .aide-invite--montree { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .aide-invite { transition: none; } }
.aide-bouton__signe { display: inline-grid; place-items: center; width: 1.45rem; height: 1.45rem; border-radius: 50%; background: var(--or-clair); color: var(--nuit); font-weight: 700; font-size: .95rem; }
.pied { padding-bottom: 4rem; }                              /* le bouton ne recouvre pas la dernière ligne du pied de page */

.aide { width: min(24rem, 100vw - 1.5rem); max-height: min(36rem, 100dvh - 2rem); margin: auto 1rem 1rem auto; padding: 0; border: 1px solid var(--filet); border-radius: .9rem;
  background: var(--blanc); color: var(--texte); box-shadow: 0 1rem 2.6rem rgba(14, 35, 80, .28); overflow: hidden; }
.aide[open] { display: flex; flex-direction: column; }
.aide::backdrop { background: rgba(14, 35, 80, .28); }
.aide__tete { display: flex; align-items: center; gap: .6rem; padding: .7rem .9rem; background: var(--bleu-profond); color: var(--blanc); }
.aide__nom { margin: 0; font-family: var(--titre); font-style: italic; font-weight: 600; font-size: 1.45rem; line-height: 1.1; color: var(--blanc); }
.aide__role { margin: 0; font-size: .8rem; opacity: .9; }
.aide__fermer { margin-left: auto; font: inherit; font-size: .9rem; padding: .3rem .6rem; color: var(--blanc); background: transparent; border: 1px solid rgba(255, 255, 255, .6); border-radius: .4rem; cursor: pointer; }
.aide__fil { flex: 1 1 auto; overflow-y: auto; padding: .8rem .9rem .4rem; display: flex; flex-direction: column; gap: .5rem; min-height: 12rem; background: var(--lin-clair); }
.aide__bulle { margin: 0; padding: .55rem .75rem; border-radius: .8rem; max-width: 92%; font-size: .95rem; line-height: 1.45; text-align: left; }
.aide__bulle--aide { align-self: flex-start; background: var(--blanc); border: 1px solid var(--filet-bleu); border-bottom-left-radius: .2rem; }
.aide__bulle--suite { align-self: flex-start; padding: .1rem .75rem .2rem; font-family: var(--titre); font-style: italic; font-size: 1.08rem; color: var(--or-texte); }
.aide-page__suite { font-family: var(--titre); font-style: italic; font-size: 1.1rem; color: var(--or-texte); }
.aide__bulle--visiteur { align-self: flex-end; background: var(--bleu-marie); color: var(--blanc); border-bottom-right-radius: .2rem; }
.aide__choix, .aide__liens { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .35rem; }
.aide__choix--questions { flex-direction: column; align-items: flex-start; }
.aide__puce { font: inherit; font-size: .9rem; text-align: left; padding: .35rem .7rem; color: var(--bleu-profond); background: var(--blanc); border: 1px solid var(--bleu-marie); border-radius: 1rem; cursor: pointer; }
.aide__puce:hover, .aide__puce:focus-visible { background: var(--bleu-marie); color: var(--blanc); }
.aide__choix--suite .aide__puce { border-style: dashed; }
.aide__choix--ouinon .aide__puce { min-width: 4.5rem; text-align: center; font-weight: 600; }
.aide__relais { display: flex; flex-direction: column; gap: .3rem; padding: .7rem; background: var(--blanc); border: 1px solid var(--filet-bleu); border-radius: .8rem; }
.aide__relais label { font-size: .86rem; font-weight: 600; color: var(--bleu-profond); margin-top: .25rem; text-align: left; }
.aide__relais input, .aide__relais textarea { font: inherit; font-size: .95rem; padding: .4rem .55rem; border: 1px solid var(--filet-bleu); border-radius: .45rem; width: 100%; box-sizing: border-box; }
.aide__relais button { align-self: flex-end; margin-top: .4rem; font: inherit; font-size: .9rem; font-weight: 600; padding: .45rem .9rem; color: var(--blanc); background: var(--bleu-marie); border: 0; border-radius: .5rem; cursor: pointer; }
.aide__erreur { margin: .2rem 0 0; font-size: .86rem; font-weight: 600; color: #8a1f1f; text-align: left; }
.aide__resume { margin: 0; padding: .6rem .75rem; background: var(--blanc); border: 1px solid var(--filet); border-radius: .8rem; font-size: .92rem; text-align: left; }
.aide__resume dt { font-size: .78rem; font-weight: 600; color: var(--or-texte); margin-top: .35rem; }
.aide__resume dt:first-child { margin-top: 0; }
.aide__resume dd { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.aide__liens a.aide__envoi { background: var(--bleu-marie); color: var(--blanc); }
.aide__liens a { display: inline-block; font-size: .92rem; font-weight: 600; padding: .3rem .7rem; border-radius: .4rem; background: var(--lin); color: var(--bleu-profond); }
.aide__saisie { display: flex; gap: .4rem; padding: .6rem .7rem; border-top: 1px solid var(--filet-bleu); background: var(--blanc); }
.aide__saisie input { flex: 1 1 auto; min-width: 0; font: inherit; font-size: .95rem; padding: .45rem .6rem; border: 1px solid var(--filet-bleu); border-radius: .5rem; }
.aide__saisie button { font: inherit; font-size: .9rem; font-weight: 600; padding: .45rem .8rem; color: var(--blanc); background: var(--bleu-marie); border: 0; border-radius: .5rem; cursor: pointer; }
.aide__note { margin: 0; padding: .35rem .9rem .6rem; font-size: .76rem; color: var(--texte-doux); background: var(--blanc); text-align: left; }

.aide-page details { border-bottom: 1px solid var(--filet-bleu); padding: .7rem 0; }
.aide-page summary { cursor: pointer; font-weight: 600; color: var(--bleu-profond); }
.aide-page details p { margin: .5rem 0 .3rem; text-align: left; }
@media (max-width: 30rem) { .aide { margin: auto .75rem .75rem; width: auto; } .aide-bouton { font-size: .9rem; } }
@media print { .aide-bouton, .aide, .aide-invite { display: none !important; } }