/* =============================================================================
   EquiQuiz -- CHATBOT : styles du composant, extraits de style_vitrine.css le
   2026-08-18.

   POURQUOI UN FICHIER A PART. La page d'inscription (`inscription.php`) est un
   tunnel AUTONOME : elle ne charge aucune feuille du site et porte ses propres
   styles en ligne. Elle n'avait donc pas le chatbot -- sur la page ou un
   visiteur bloque a le plus besoin d'aide.

   Lui servir style_vitrine.css n'etait pas une option : les deux definissent
   `.btn`, `.btn-o`, `.btn-p`, `.logo-m/-t/-s`, `.ic` et `.on`. Charger la
   feuille du site aurait restyle les boutons du tunnel de conversion, par des
   proprietes que les regles locales ne redefinissent pas toutes.

   Le bloc est donc DEPLACE ici, pas recopie : `footer.php` et `inscription.php`
   chargent le meme fichier. Les 3 keyframes (blip, msgIn, typ) partent avec lui
   -- verifie : elles n'ont aucun autre consommateur dans le depot.

   Les variables employees (--grad, --emerald, --sh-em, --r-pill...) sont
   definies par les DEUX contextes : le `:root` de style_vitrine.css et celui
   d'inscription.php, qui porte les memes noms. Le composant n'en declare aucune
   pour ne pas figer un theme.
   ============================================================================= */
/* ---------- CHATBOT (relie a l'assistance Equimondo) ---------- */
.chat-fab{position:fixed;bottom:calc(24px + env(safe-area-inset-bottom,0px));right:24px;z-index:300;width:62px;height:62px;border-radius:50%;background:var(--grad);color:#fff;display:grid;place-items:center;font-size:1.5rem;box-shadow:var(--sh-em);transition:transform .35s var(--ease-back)}
.chat-fab:hover{transform:scale(1.08) rotate(-6deg)}
.chat-fab .dot{position:absolute;top:4px;right:4px;width:13px;height:13px;border-radius:50%;background:var(--gold-light);border:2.5px solid #fff;animation:blip 2s ease-in-out infinite}
@keyframes blip{0%,100%{transform:scale(1)}50%{transform:scale(1.25)}}
.chat-panel{position:fixed;bottom:calc(98px + env(safe-area-inset-bottom,0px));right:24px;z-index:300;width:376px;max-width:calc(100vw - 32px);height:520px;max-height:calc(100vh - 140px);background:var(--white);border-radius:var(--r-xl);box-shadow:var(--sh-lg);border:1px solid rgba(11,33,25,.07);display:flex;flex-direction:column;overflow:hidden;opacity:0;visibility:hidden;transform:translateY(18px) scale(.96);transition:all .38s var(--ease)}
.chat-panel.open{opacity:1;visibility:visible;transform:none}
.chat-head{background:var(--grad);color:#fff;padding:18px 20px;display:flex;align-items:center;gap:12px}
.chat-head .av{width:40px;height:40px;border-radius:14px;background:rgba(255,255,255,.22);display:grid;place-items:center;font-size:1.2rem}
.chat-head b{font-size:.98rem;display:block;font-family:'Fraunces'}
.chat-head span{font-size:.75rem;color:#d1fae5;display:flex;align-items:center;gap:5px}
.chat-head .cl{margin-left:auto;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.18);display:grid;place-items:center;color:#fff;transition:transform .3s}
.chat-head .cl:hover{transform:rotate(90deg)}
.chat-body{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:12px;background:var(--cream)}
.msg{max-width:84%;padding:12px 15px;border-radius:18px;font-size:.88rem;line-height:1.55;animation:msgIn .4s var(--ease)}
@keyframes msgIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.msg.bot{background:var(--white);box-shadow:var(--sh-sm);border-bottom-left-radius:5px;align-self:flex-start}
.msg.me{background:var(--grad);color:#fff;border-bottom-right-radius:5px;align-self:flex-end}
.chat-sug{display:flex;flex-wrap:wrap;gap:7px;padding:0 18px 12px;background:var(--cream)}
.chat-sug button{padding:7px 13px;border-radius:var(--r-pill);background:var(--white);border:1.5px solid var(--sand-deep);font-size:.78rem;font-weight:600;color:var(--ink-soft);transition:all .28s var(--ease)}
.chat-sug button:hover{border-color:var(--emerald);color:var(--emerald-dark);transform:translateY(-2px)}
.chat-foot{padding:13px 15px;border-top:1px solid var(--sand);display:flex;gap:9px;align-items:center;background:var(--white)}
.chat-foot input{flex:1;border:1.5px solid var(--sand-deep);border-radius:var(--r-pill);padding:11px 16px;font-size:.87rem;min-width:0}
.chat-foot input:focus{outline:none;border-color:var(--emerald)}
.chat-send{width:40px;height:40px;border-radius:50%;background:var(--grad);color:#fff;display:grid;place-items:center;flex-shrink:0;transition:transform .3s}
.chat-send:hover{transform:scale(1.1)}
.chat-note{font-size:.68rem;color:var(--ink-mute);text-align:center;padding:0 15px 10px;background:var(--white)}
.dots span{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--ink-mute);margin-right:3px;animation:typ 1.2s infinite}
.dots span:nth-child(2){animation-delay:.18s}.dots span:nth-child(3){animation-delay:.36s}
@keyframes typ{0%,60%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-5px);opacity:1}}
@media(max-width:520px){.chat-panel{right:12px;left:12px;width:auto;bottom:calc(88px + env(safe-area-inset-bottom,0px))}.chat-fab{bottom:calc(16px + env(safe-area-inset-bottom,0px));right:16px;width:56px;height:56px}}
/* `.chat-sug` declare `display:flex`, qui BAT la regle `[hidden]` du navigateur :
   sans cette ligne les suggestions ne s'effacent pas a la premiere question.
   Elle vivait dans une regle partagee de style_vitrine.css (.theme-c, .pagin) ;
   elle suit le composant, sinon le chat sortirait casse partout ou cette
   feuille-la n'est pas chargee -- c'est-a-dire sur la page d'inscription.

   ELLE ETAIT PIEGEE DANS UNE MEDIA QUERY. Un `@media(max-width:400px){` vide et
   JAMAIS REFERME la precedait : la regle ne s'appliquait donc qu'en dessous de
   400px de large. Sur un ordinateur, les quatre pastilles restaient affichees
   toute la conversation et mangeaient la moitie du panneau. Rien ne le
   signalait -- une accolade manquante ne produit aucune erreur, le navigateur
   ferme le bloc en fin de fichier et passe a autre chose.
   La media query ne contenait plus que ce commentaire : elle est retiree. */
.chat-sug[hidden]{display:none}