/* [ABC-4-223] Assistant d'IA du site : icône flottante en bas à droite de chaque page et fenêtre de conversation, aux
 * couleurs de RIF (sarcelle et ambre). Contrastes : blanc sur #0b5a61 = 8,0:1 ; #13262b sur blanc = 15,9:1.
 * Sans JavaScript l'icône est masquée : le module ajoute .assistant-pret en s'installant. */
.assistant { display: none; position: fixed; right: 1rem; bottom: 1rem; z-index: 1040; flex-direction: column; align-items: flex-end; gap: .75rem; font-family: inherit; color: var(--encre, #13262b); }
/* Le bandeau cookies occupe aussi le bas à droite à la première visite : l'icône (et la fenêtre) se placent au-dessus tant qu'il est affiché (hauteur mesurée : 251 px, de 1280 à 375 px). */
body:has(#bandeau-cookies .cc-window:not(.cc-invisible)) .assistant { bottom: 18rem; }
body:has(#bandeau-cookies .cc-window:not(.cc-invisible)) .assistant-fenetre { max-height: max(12rem, calc(100vh - 23rem)); }

.assistant.assistant-pret { display: flex; }
.assistant-bouton { width: 3.5rem; height: 3.5rem; border: 0; border-radius: 50%; background: var(--sarcelle, #0b5a61); color: #fff; box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .3); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.assistant-bouton:hover { background: var(--sarcelle-fonce, #063a3f); }
/* [ABC-4-236] Focus visible ≥ 3:1 (WCAG 1.4.11) contre le fond qui l'entoure : encre #13262b sur le blanc de la page et de la fenêtre (15,9:1) ; ambre #ffbf47 sur le sarcelle de l'en-tête (5,3:1). L'ancien contour ambre sur blanc ne faisait que 1,6:1. */
.assistant-bouton:focus-visible, .assistant-envoyer:focus-visible, .assistant-champ:focus-visible, .assistant-carte a:focus-visible { outline: 3px solid #13262b; outline-offset: 2px; }
.assistant-geste:focus-visible { outline: 3px solid #ffbf47; outline-offset: 2px; }
.assistant .ico { width: 1.6rem; height: 1.6rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

.assistant-fenetre { width: min(24rem, calc(100vw - 2rem)); max-height: min(34rem, calc(100vh - 6rem)); display: flex; flex-direction: column; background: #fff; border: 1px solid var(--rif-trait, #dfe5ec); border-radius: var(--rif-rayon-petit, 10px); box-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .25); overflow: hidden; }
.assistant-fenetre[hidden] { display: none; }
.assistant-entete { display: flex; align-items: center; gap: .25rem; padding: .5rem .5rem .5rem 1rem; background: var(--sarcelle, #0b5a61); color: #fff; }
.assistant-titre { flex: 1; margin: 0; font-size: 1rem; font-weight: 700; color: inherit; }
.assistant-geste { width: 2.75rem; height: 2.75rem; border: 0; border-radius: 50%; background: transparent; color: #fff; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.assistant-geste:hover { background: rgba(255, 255, 255, .2); }
.assistant-geste .ico { width: 1.25rem; height: 1.25rem; }
.assistant-fenetre.est-reduite .assistant-corps { display: none; }

.assistant-corps { display: flex; flex-direction: column; gap: .5rem; padding: 1rem; overflow-y: auto; min-height: 0; }
.assistant-intro { margin: 0; font-size: .9rem; color: var(--rif-doux, #52647a); }
.assistant-formulaire { display: flex; flex-direction: column; gap: .5rem; }
.assistant-etiquette { font-weight: 700; font-size: .9rem; }
.assistant-champ { width: 100%; height: 4.5rem; min-height: 3rem; max-height: 10rem; resize: vertical; padding: .5rem; font: inherit; border: 1px solid #52647a; border-radius: 6px; }
.assistant-envoyer { align-self: flex-end; min-height: 2.75rem; padding: .5rem 1.25rem; border: 0; border-radius: 6px; background: var(--sarcelle, #0b5a61); color: #fff; font-weight: 700; cursor: pointer; }
.assistant-envoyer:hover { background: var(--sarcelle-fonce, #063a3f); }
.assistant-etat { margin: 0; min-height: 1.25rem; font-size: .9rem; color: #7a1f1f; }
.assistant-fil { display: flex; flex-direction: column; gap: 1.25rem; }
/* [B-R-127] Un échange = deux bulles distinctes : la réponse de l'assistant à gauche (sarcelle pâle), la question de l'usager à droite (sarcelle plein, texte blanc 8,0:1). */
.assistant-carte { display: flex; flex-direction: column; gap: .5rem; }
.assistant-message { max-width: 88%; padding: .6rem .75rem; border-radius: 12px; overflow-wrap: anywhere; }
.assistant-message--assistant { align-self: flex-start; background: var(--sarcelle-pale, #e5f1f1); border: 1px solid #b9d6d8; border-bottom-left-radius: 3px; }
.assistant-message--usager { align-self: flex-end; background: var(--sarcelle, #0b5a61); color: #fff; border-bottom-right-radius: 3px; }
.assistant-meta { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .25rem .75rem; margin: 0 0 .35rem; font-size: .8rem; }
.assistant-auteur { font-weight: 700; }
.assistant-heure { white-space: nowrap; opacity: .85; }
.assistant-message--assistant .assistant-meta { color: var(--rif-doux, #3d4f63); }
.assistant-carte .disclaimer-ia { margin: 0 0 .35rem; font-size: .85rem; }
.assistant-texte { margin: 0 0 .5rem; white-space: pre-line; }
.assistant-sources-titre { margin: .25rem 0 .15rem; padding-top: .5rem; border-top: 1px solid #b9d6d8; font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; }
.assistant-sources { margin: 0; padding-left: 1.25rem; font-size: .9rem; }
.assistant-sources a { color: var(--sarcelle-fonce, #063a3f); text-decoration: underline; }
.assistant-question { margin: 0; white-space: pre-line; }

/* Téléphone : la fenêtre prend la largeur de l'écran, sans masquer l'en-tête de la page ; le pied de page reste atteignable (marge basse). */
@media (max-width: 575.98px) {
    .assistant { right: .5rem; bottom: .5rem; }
    .assistant-fenetre { width: calc(100vw - 1rem); max-height: calc(100vh - 5rem); }
}
@media (prefers-reduced-motion: no-preference) {
    .assistant-bouton { transition: background-color .15s ease-in-out; }
}
@media print { .assistant { display: none; } }