/* Widget de chat — habillage « charte OA » (blanc, turquoise, jaune, Poppins),
   autonome pour fonctionner aussi sur la landing. Les variables --oa-* sont
   injectées par includes/charte.php (admin « Charte graphique ») ; les
   valeurs de repli sont les défauts de la charte. */

#oa-chat-bulle{
	position:fixed;right:22px;bottom:22px;z-index:99990;
	width:56px;height:56px;border-radius:50%;border:0;
	display:grid;place-items:center;
	background:var(--oa-turquoise,#17a1b8);color:#fff;line-height:1;cursor:pointer;
	box-shadow:0 10px 30px rgba(15,90,104,.35);transition:transform .2s;
}
/* déclinaison « o/a » du favicon de la charte (o jaune, a blanc) */
#oa-chat-bulle svg{height:32px;width:auto;display:block}
#oa-chat-bulle:hover{transform:scale(1.07)}

/* display:flex ci-dessous écraserait l'attribut hidden basculé par le JS :
   cette règle rend la main à hidden (panneau fermé par défaut). */
#oa-chat[hidden]{display:none}

#oa-chat{
	position:fixed;right:22px;bottom:90px;z-index:99991;
	width:min(360px,calc(100vw - 32px));height:min(520px,calc(100vh - 130px));
	display:flex;flex-direction:column;overflow:hidden;
	background:#fff;color:var(--oa-encre,#231f20);border:1px solid rgba(35,31,32,.14);border-radius:16px;
	box-shadow:0 24px 60px rgba(15,90,104,.30);
	font-family:var(--oa-texte,'Poppins','Segoe UI',sans-serif);font-size:14px;line-height:1.5;
}
.oa-chat-tete{
	display:flex;align-items:center;justify-content:space-between;gap:10px;
	padding:12px 16px;background:var(--oa-turquoise,#17a1b8);color:#fff;
}
.oa-chat-tete b{font-weight:600;letter-spacing:.02em}
.oa-chat-fermer{border:0;background:none;color:#fff;font-size:15px;cursor:pointer;opacity:.8}
.oa-chat-fermer:hover{opacity:1}

.oa-chat-fil{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px}
.oa-chat-msg{max-width:85%;padding:9px 13px;border-radius:14px;overflow-wrap:break-word}
.oa-chat-msg--bot{align-self:flex-start;background:#f4fafb;border:1px solid rgba(23,161,184,.18);border-bottom-left-radius:4px}
.oa-chat-msg--user{align-self:flex-end;background:var(--oa-jaune,#ffcd0d);color:var(--oa-encre,#231f20);border-bottom-right-radius:4px}
.oa-chat-msg a{color:var(--oa-turquoise,#17a1b8);text-decoration:underline}
.oa-chat-msg--user a{color:var(--oa-encre,#231f20)}
.oa-chat-attente{color:#878787;letter-spacing:3px}

.oa-chat-form{display:flex;gap:8px;padding:10px;border-top:1px solid rgba(35,31,32,.12);background:#fff}
.oa-chat-form input{
	flex:1;padding:10px 14px;border:1px solid rgba(35,31,32,.22);border-radius:999px;
	background:#fff;color:var(--oa-encre,#231f20);font:inherit;outline:none;
}
.oa-chat-form input:focus{border-color:var(--oa-turquoise,#17a1b8)}
.oa-chat-form button{
	width:42px;border:0;border-radius:50%;background:var(--oa-jaune,#ffcd0d);color:var(--oa-encre,#231f20);
	font-size:16px;cursor:pointer;transition:opacity .2s;
}
.oa-chat-form button:disabled{opacity:.5;cursor:default}

@media (max-width:480px){
	#oa-chat{right:16px;bottom:84px}
	#oa-chat-bulle{right:16px;bottom:16px}
}

/* --- micro-animations du widget --- */
@media (prefers-reduced-motion: no-preference){
/* la bulle respire doucement pour inviter au clic — transform seul
   (composé GPU), l'ombre reste fixe pour éviter les repaints */
#oa-chat-bulle{animation:oa-bulle-pouls 3.2s ease-in-out infinite;will-change:transform}
#oa-chat-bulle:hover{animation-play-state:paused}
@keyframes oa-bulle-pouls{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
/* le panneau s'ouvre en ressort depuis la bulle */
#oa-chat:not([hidden]){animation:oa-chat-pop .45s cubic-bezier(.34,1.56,.64,1);transform-origin:bottom right}
@keyframes oa-chat-pop{from{opacity:0;transform:translateY(18px) scale(.92)}to{opacity:1;transform:none}}
/* chaque message glisse en entrant */
.oa-chat-msg{animation:oa-msg-entre .3s ease both}
@keyframes oa-msg-entre{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
}

/* Formulaire « être recontacté » quand le bot n'a pas la réponse */
.oa-chat-transmettre{display:flex;flex-direction:column;gap:8px}
.oa-chat-transmettre-ligne{display:flex;gap:6px}
.oa-chat-transmettre input{flex:1;min-width:0;padding:8px 12px;border:1px solid rgba(35,31,32,.22);border-radius:999px;background:#fff;color:var(--oa-encre,#231f20);font:inherit;font-size:13px;outline:none}
.oa-chat-transmettre input:focus{border-color:var(--oa-turquoise,#17a1b8)}
.oa-chat-transmettre button{border:0;border-radius:999px;padding:8px 14px;background:var(--oa-turquoise,#17a1b8);color:#fff;font:inherit;font-size:13px;font-weight:600;cursor:pointer;white-space:nowrap}
.oa-chat-transmettre button:disabled{opacity:.5;cursor:default}