/*
 * Chatbot Ad'on IA — habillage du widget public.
 *
 * Servi comme fichier, pas en ligne dans la page : voir la note de
 * `assets/chatbot.js`, la raison est la même.
 *
 * ── Les couleurs viennent de la charte du site ───────────────────────────
 *
 * Chaque jeton se lit de gauche à droite, du plus spécifique au plus général :
 *
 *     var(--adon-accent, var(--accent1, #008996))
 *          │                  │           └── repli, si le site n'a pas de charte
 *          │                  └── la variable de charte Ad'on : le cas normal
 *          └── surcharge propre au chatbot, si l'on veut l'en écarter
 *
 * Le chatbot suit donc la charte sans qu'on ait rien à recopier, et un site qui
 * veut un chatbot d'une autre couleur que son accent1 pose `--adon-accent` sans
 * toucher au plugin. Aucune couleur en dur ailleurs dans cette feuille.
 */
.adon-ai-chat,.adon-ai-scene{
		--adon-ai-accent:var(--adon-accent,var(--accent1,#008996));
		--adon-ai-accent-survol:var(--adon-accent-survol,var(--accent1hover,var(--accent1,#10b1c0)));
		--adon-ai-fond:var(--adon-fond,var(--blanc,#fff));
		--adon-ai-bulle:var(--adon-bulle,var(--clair,rgb(240,240,240)));
		--adon-ai-texte:var(--adon-texte,var(--fonce,#181B24));
		--adon-ai-attenue:var(--adon-attenue,var(--moyen,#666));
		/* Le bord n'a pas de variable de charte : c'est l'atténué très dilué,
		   ce qui le fait suivre la charte sans en inventer une septième. */
		--adon-ai-bord:var(--adon-bord,color-mix(in srgb,var(--adon-ai-attenue) 28%,transparent));
		--adon-ai-rayon:var(--adon-rayon,16px);
		--adon-ai-police:var(--adon-police,var(--fonttextes,inherit));
		--adon-ai-police-titres:var(--adon-police-titres,var(--fonttitres,var(--adon-ai-police)));
		font-family:var(--adon-ai-police);
	}
	.adon-ai-cache{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

	/* ── Accroche dans la page : rien d'autre qu'un champ ── */
	.adon-ai-chat{max-width:40rem;margin-inline:auto;color:var(--adon-ai-texte);font-size:1rem;line-height:1.55}
	.adon-ai-accroche{position:relative;display:flex;align-items:center}
	.adon-ai-accroche .adon-ai-loupe{position:absolute;left:1.15rem;width:20px;height:20px;
		color:var(--adon-ai-attenue);pointer-events:none}
	.adon-ai-accroche input{width:100%;padding:1.15rem 4.2rem 1.15rem 3.1rem;font:inherit;font-size:1.05rem;
		color:inherit;background:var(--adon-ai-fond);border:1px solid var(--adon-ai-bord);
		border-radius:999px;box-shadow:0 1px 2px rgba(0,0,0,.04);transition:box-shadow .18s,border-color .18s;
		-webkit-appearance:none;appearance:none}
	.adon-ai-accroche input::-webkit-search-cancel-button{display:none}
	.adon-ai-accroche input:hover{border-color:var(--adon-ai-attenue)}
	.adon-ai-accroche input:focus{outline:0;border-color:var(--adon-ai-accent);
		box-shadow:0 0 0 3px color-mix(in srgb,var(--adon-ai-accent) 18%,transparent)}
	.adon-ai-accroche button{position:absolute;right:.5rem;display:inline-flex;align-items:center;
		justify-content:center;width:2.7rem;height:2.7rem;color:#fff;background:var(--adon-ai-accent);
		border:0;border-radius:50%;cursor:pointer}
	.adon-ai-accroche button:hover,.adon-ai-form button:hover:not(:disabled){background:var(--adon-ai-accent-survol)}

	.adon-ai-amorces{display:flex;flex-wrap:wrap;justify-content:center;gap:.45rem;margin:.9rem 0 0}
	.adon-ai-amorce{background:none;border:1px solid var(--adon-ai-bord);border-radius:999px;
		padding:.4rem .9rem;font:inherit;font-size:.88rem;color:var(--adon-ai-attenue);cursor:pointer;line-height:1.3}
	.adon-ai-amorce:hover,.adon-ai-amorce:focus-visible{border-color:var(--adon-ai-accent);color:var(--adon-ai-accent)}

	/* ── Scène : le dialogue recouvre le site ── */
	.adon-ai-scene[hidden]{display:none}
	.adon-ai-scene{position:fixed;inset:0;z-index:100000;display:flex;flex-direction:column;
		background:var(--adon-ai-fond);color:var(--adon-ai-texte);font-size:1rem;line-height:1.6;
		animation:adon-ai-entree .22s ease-out}
	@keyframes adon-ai-entree{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
	@media (prefers-reduced-motion:reduce){.adon-ai-scene{animation:none}}

	.adon-ai-entete{flex:none;display:flex;align-items:center;justify-content:space-between;gap:1rem;
		padding:1rem 1.25rem;border-bottom:1px solid var(--adon-ai-bord)}
	.adon-ai-titre{margin:0;font-family:var(--adon-ai-police-titres);font-weight:600;font-size:1.05rem}
	.adon-ai-fermer{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem .9rem;font:inherit;
		font-size:.9rem;color:var(--adon-ai-attenue);background:none;border:1px solid var(--adon-ai-bord);
		border-radius:999px;cursor:pointer}
	.adon-ai-fermer:hover,.adon-ai-fermer:focus-visible{color:var(--adon-ai-texte);border-color:var(--adon-ai-attenue)}

	.adon-ai-fil{flex:1;min-height:0;overflow-y:auto;scroll-behavior:smooth;
		display:flex;flex-direction:column;gap:.85rem;
		width:100%;max-width:46rem;margin-inline:auto;padding:1.5rem 1.25rem}
	.adon-ai-msg{max-width:82%;padding:.8rem 1.05rem;border-radius:var(--adon-ai-rayon)}
	.adon-ai-msg p{margin:0 0 .6rem}
	.adon-ai-msg p:last-child{margin-bottom:0}
	.adon-ai-usager{align-self:flex-end;background:var(--adon-ai-accent);color:#fff;border-bottom-right-radius:5px}
	.adon-ai-agent{align-self:flex-start;background:var(--adon-ai-bulle);border-bottom-left-radius:5px}
	.adon-ai-erreur{background:color-mix(in srgb,#b3261e 8%,var(--adon-ai-fond));color:#8a1f24}

	.adon-ai-sources{list-style:none;margin:.75rem 0 0;padding:.7rem 0 0;
		border-top:1px solid color-mix(in srgb,var(--adon-ai-attenue) 25%,transparent)}
	/* Le complement passe a la ligne, toujours : cale sur la meme ligne, il
	   se lisait comme la fin du titre — « Consultation publique (Article du
	   5 novembre 2025) » — et sur un titre long il se retrouvait tantot
	   derriere, tantot dessous, d'une source a l'autre. */
	.adon-ai-sources li{margin:0 0 .6rem}
	.adon-ai-sources time,.adon-ai-sources .adon-ai-complement{display:block;margin-top:.1rem}
	.adon-ai-sources a{color:var(--adon-ai-accent);text-decoration:underline;text-underline-offset:2px}
	.adon-ai-sources time,.adon-ai-complement{font-size:.8rem;color:var(--adon-ai-attenue)}
	.adon-ai-source--product .adon-ai-complement{font-weight:600;color:var(--adon-ai-accent)}

	.adon-ai-patience{display:inline-flex;gap:.28rem;padding:.2rem 0}
	.adon-ai-patience i{width:.45rem;height:.45rem;border-radius:50%;background:var(--adon-ai-attenue);
		animation:adon-ai-pulse 1.2s infinite ease-in-out}
	.adon-ai-patience i:nth-child(2){animation-delay:.15s}
	.adon-ai-patience i:nth-child(3){animation-delay:.3s}
	@keyframes adon-ai-pulse{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
	@media (prefers-reduced-motion:reduce){.adon-ai-patience i{animation:none;opacity:.6}}

	.adon-ai-pied{flex:none;border-top:1px solid var(--adon-ai-bord);padding:1rem 1.25rem calc(1rem + env(safe-area-inset-bottom))}
	.adon-ai-form{display:flex;gap:.6rem;width:100%;max-width:46rem;margin-inline:auto}
	.adon-ai-form input{flex:1;min-width:0;padding:.9rem 1.1rem;font:inherit;color:inherit;
		background:var(--adon-ai-fond);border:1px solid var(--adon-ai-bord);border-radius:999px}
	.adon-ai-form input:focus{outline:0;border-color:var(--adon-ai-accent);
		box-shadow:0 0 0 3px color-mix(in srgb,var(--adon-ai-accent) 18%,transparent)}
	.adon-ai-form button{display:inline-flex;align-items:center;gap:.45rem;padding:.9rem 1.35rem;
		font:inherit;font-weight:600;color:#fff;background:var(--adon-ai-accent);
		border:0;border-radius:999px;cursor:pointer}
	.adon-ai-form button:disabled{opacity:.5;cursor:default}
	.adon-ai-form svg{flex:none}
	.adon-ai-recours{width:100%;max-width:46rem;margin:.75rem auto 0;font-size:.9rem;text-align:center}
	.adon-ai-recours a{color:var(--adon-ai-accent);text-decoration:underline;text-underline-offset:2px;margin-inline:.15rem}
	.adon-ai-mention{width:100%;max-width:46rem;margin:.5rem auto 0;font-size:.78rem;
		color:var(--adon-ai-attenue);line-height:1.45;text-align:center}
	/* `:not()` indispensable : sans lui cette règle, plus spécifique que
	   `.adon-ai-sources`, réindenterait la liste des sources et lui ferait
	   perdre l'espace au-dessus de son filet. */
	.adon-ai-msg ul:not(.adon-ai-sources){margin:.15rem 0 .5rem;padding-left:1.15rem}
	.adon-ai-msg li{margin:0 0 .3rem}

	@media (max-width:560px){
		.adon-ai-msg{max-width:92%}
		.adon-ai-envoyer{display:none}
		.adon-ai-form button{padding:.9rem 1.05rem}
		.adon-ai-fil{padding:1.1rem .9rem}
		.adon-ai-pied{padding-inline:.9rem}
	}

	/* ── Contraste élevé ──────────────────────────────────────────────────
	 *
	 * La version accessible du socle neutralise la charte : noir et blanc,
	 * liens soulignés, focus jaune épais. Le chatbot doit suivre, sinon il
	 * reste le seul îlot coloré d'une page passée en contraste élevé — et
	 * l'accent1 sur blanc ne tient pas les rapports exigés par le RGAA.
	 *
	 * On ne redéfinit que les jetons : tout le reste de la feuille en découle.
	 */
	body.contraste-eleve .adon-ai-chat,
	body.contraste-eleve .adon-ai-scene{
		--adon-ai-accent:#000;
		--adon-ai-accent-survol:#000;
		--adon-ai-fond:#fff;
		--adon-ai-bulle:#f2f2f2;
		--adon-ai-texte:#000;
		--adon-ai-attenue:#000;
		--adon-ai-bord:#000;
	}
	body.contraste-eleve .adon-ai-sources a,
	body.contraste-eleve .adon-ai-recours a{text-decoration:underline}
	body.contraste-eleve .adon-ai-chat :focus-visible,
	body.contraste-eleve .adon-ai-scene :focus-visible{outline:3px solid #ff0;outline-offset:2px}
	body.contraste-eleve .adon-ai-erreur{background:#fff;color:#000;border:2px solid #000}