/* =========================================================================
   UCJ — Assistant du commerce jurançonnais
   Charte graphique de mars 2026. Styles préfixés, aucun risque de collision
   avec le thème ou Elementor.
   ========================================================================= */

#ucj-chat-root{
  --ucj-rose:#C80F78;
  --ucj-rose-fonce:#9d0c5e;
  --ucj-rose-pale:#EBC4D9;
  --ucj-jaune-pale:#EEECB5;
  --ucj-ardoise:#525667;
  --ucj-gris:#DDD7DA;
  --ucj-encre:#2e3140;
  --ucj-titre:'Poppins','Segoe UI',system-ui,sans-serif;
  --ucj-texte:'Inter',system-ui,-apple-system,sans-serif;
}

/* --- Bulle d'ouverture --------------------------------------------------- */
.ucj-bulle{
  position:fixed;right:20px;bottom:20px;z-index:99998;
  display:flex;align-items:center;gap:.55rem;
  padding:.8rem 1.25rem;border:0;border-radius:999px;cursor:pointer;
  background:var(--ucj-rose);color:#fff;
  font-family:var(--ucj-titre);font-weight:600;font-size:.95rem;
  box-shadow:0 8px 28px rgba(200,15,120,.35);
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.ucj-bulle:hover{transform:translateY(-2px);background:var(--ucj-rose-fonce);box-shadow:0 12px 34px rgba(200,15,120,.42)}
.ucj-bulle:focus-visible{outline:3px solid var(--ucj-jaune-pale);outline-offset:3px}
.ucj-bulle svg{width:20px;height:20px;flex:0 0 auto}
.ucj-bulle[hidden]{display:none}

/* --- Panneau ------------------------------------------------------------- */
.ucj-panneau{
  position:fixed;right:20px;bottom:20px;z-index:99999;
  width:min(400px, calc(100vw - 40px));
  height:min(620px, calc(100vh - 40px));
  display:flex;flex-direction:column;overflow:hidden;
  background:#fff;border:1px solid var(--ucj-gris);border-radius:18px;
  box-shadow:0 12px 50px rgba(46,49,64,.26);
  font-family:var(--ucj-texte);color:var(--ucj-encre);
  animation:ucj-apparait .22s ease-out;
}
@keyframes ucj-apparait{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.ucj-panneau[hidden]{display:none}

.ucj-entete{
  display:flex;align-items:center;gap:.8rem;padding:1rem 1.15rem;
  background:linear-gradient(135deg,var(--ucj-rose) 0%,#a80d64 100%);color:#fff;
}
.ucj-entete__pastille{
  width:38px;height:38px;flex:0 0 auto;border-radius:50%;
  background:rgba(255,255,255,.18);display:grid;place-items:center;
}
.ucj-entete__pastille svg{width:20px;height:20px}
.ucj-entete h2{margin:0;font-family:var(--ucj-titre);font-size:1rem;font-weight:600;line-height:1.2;color:#fff}
.ucj-entete p{margin:.1rem 0 0;font-size:.78rem;opacity:.9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ucj-entete h2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ucj-fermer:hover{opacity:1;background:rgba(255,255,255,.14)}

.ucj-fil{
  flex:1;overflow-y:auto;padding:1.15rem;display:flex;flex-direction:column;gap:.85rem;
  background:#fbf9fa;scroll-behavior:smooth;
}
.ucj-msg{max-width:88%;padding:.75rem 1rem;border-radius:14px;font-size:.92rem;line-height:1.55;white-space:pre-wrap;word-wrap:break-word}
.ucj-msg a{color:var(--ucj-rose);text-decoration:underline;text-underline-offset:2px}
.ucj-msg a[href^="tel:"]{white-space:nowrap}
.ucj-msg--bot{align-self:flex-start;background:#fff;border:1px solid var(--ucj-gris);border-bottom-left-radius:4px}
.ucj-msg--moi{align-self:flex-end;background:var(--ucj-rose);color:#fff;border-bottom-right-radius:4px}
.ucj-msg--moi a{color:#fff}

.ucj-points{display:flex;gap:5px;padding:.9rem 1rem}
.ucj-points span{width:7px;height:7px;border-radius:50%;background:var(--ucj-rose-pale);animation:ucj-rebond 1.3s infinite}
.ucj-points span:nth-child(2){animation-delay:.18s}
.ucj-points span:nth-child(3){animation-delay:.36s}
@keyframes ucj-rebond{0%,60%,100%{transform:translateY(0);opacity:.55}30%{transform:translateY(-5px);opacity:1}}

.ucj-suggestions{display:flex;flex-wrap:wrap;gap:.45rem;padding:0 1.15rem .85rem}
.ucj-suggestions button{
  font-family:var(--ucj-texte);font-size:.82rem;padding:.42rem .8rem;cursor:pointer;
  background:#fff;color:var(--ucj-rose);border:1px solid var(--ucj-rose-pale);border-radius:999px;
  transition:.15s;
}
.ucj-suggestions button:hover{background:var(--ucj-rose);color:#fff;border-color:var(--ucj-rose)}
.ucj-suggestions[hidden]{display:none}

.ucj-saisie{display:flex;gap:.5rem;padding:.85rem;border-top:1px solid var(--ucj-gris);background:#fff}
.ucj-saisie textarea{
  flex:1;resize:none;font:inherit;font-size:.92rem;padding:.65rem .85rem;max-height:110px;
  border:1px solid var(--ucj-gris);border-radius:12px;background:#fbf9fa;color:var(--ucj-encre);
}
.ucj-saisie textarea:focus{outline:none;border-color:var(--ucj-rose);background:#fff;box-shadow:0 0 0 3px rgba(200,15,120,.13)}
.ucj-saisie button{
  flex:0 0 auto;width:42px;height:42px;border:0;border-radius:12px;cursor:pointer;
  background:var(--ucj-rose);color:#fff;display:grid;place-items:center;transition:.15s;
}
.ucj-saisie button:hover:not(:disabled){background:var(--ucj-rose-fonce)}
.ucj-saisie button:disabled{opacity:.45;cursor:not-allowed}
.ucj-saisie button svg{width:19px;height:19px}

.ucj-mention{padding:0 1.15rem .8rem;font-size:.72rem;color:var(--ucj-ardoise);text-align:center;background:#fff}

@media (max-width:480px){
  .ucj-panneau{right:0;bottom:0;width:100vw;height:100dvh;border-radius:0;border:0}
  .ucj-bulle{right:14px;bottom:14px;padding:.75rem 1.05rem;font-size:.9rem}
}
@media (prefers-reduced-motion:reduce){
  .ucj-panneau,.ucj-bulle,.ucj-points span{animation:none;transition:none}
}

/* --- Ajouts v1.1 : voix, position, écoute -------------------------------- */

.ucj-cache{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.ucj-entete__txt{min-width:0}
.ucj-entete__actions{margin-left:auto;display:flex;align-items:center;gap:.15rem;flex:0 0 auto}
.ucj-icone{
  background:none;border:0;color:#fff;cursor:pointer;opacity:.85;
  width:32px;height:32px;display:grid;place-items:center;border-radius:8px;padding:0;
  font-size:1.4rem;line-height:1;transition:.15s;
}
.ucj-icone svg{width:18px;height:18px}
.ucj-icone:hover{opacity:1;background:rgba(255,255,255,.16)}
.ucj-icone:focus-visible{outline:2px solid #fff;outline-offset:1px}
.ucj-icone--actif{opacity:1;background:rgba(255,255,255,.26)}
.ucj-fermer{font-size:1.5rem}

/* Bandeau d'écoute */
.ucj-ecoute{
  display:flex;align-items:center;gap:.6rem;
  padding:.6rem 1.15rem;background:var(--ucj-jaune-pale);color:#5f5e0a;
  font-size:.85rem;font-family:var(--ucj-titre);font-weight:600;
  border-top:1px solid rgba(212,210,18,.5);
}
.ucj-ecoute[hidden]{display:none}
.ucj-onde{display:inline-flex;align-items:flex-end;gap:3px;height:18px}
.ucj-onde i{
  display:block;width:3px;height:6px;border-radius:2px;background:var(--ucj-rose);
  animation:ucj-onde 1s ease-in-out infinite;
}
.ucj-onde i:nth-child(2){animation-delay:.12s}
.ucj-onde i:nth-child(3){animation-delay:.24s}
.ucj-onde i:nth-child(4){animation-delay:.36s}
.ucj-onde i:nth-child(5){animation-delay:.48s}
@keyframes ucj-onde{0%,100%{height:5px;opacity:.5}50%{height:17px;opacity:1}}

/* Bouton micro */
.ucj-saisie .ucj-micro{
  flex:0 0 auto;width:42px;height:42px;border-radius:12px;cursor:pointer;
  background:#fff;color:var(--ucj-rose);border:1px solid var(--ucj-gris);
  display:grid;place-items:center;transition:.15s;
}
.ucj-saisie .ucj-micro svg{width:19px;height:19px}
.ucj-saisie .ucj-micro:hover{border-color:var(--ucj-rose);background:#fdf4f9}
.ucj-saisie .ucj-micro--actif{
  background:var(--ucj-rose);color:#fff;border-color:var(--ucj-rose);
  animation:ucj-pulse 1.4s ease-in-out infinite;
}
@keyframes ucj-pulse{
  0%,100%{box-shadow:0 0 0 0 rgba(200,15,120,.45)}
  50%{box-shadow:0 0 0 7px rgba(200,15,120,0)}
}

/* Message de service dans le fil */
.ucj-info{
  align-self:center;margin:.1rem 0;padding:.4rem .8rem;max-width:92%;
  font-size:.78rem;color:var(--ucj-ardoise);background:#f1eef0;
  border-radius:999px;text-align:center;
}

@media (prefers-reduced-motion:reduce){
  .ucj-onde i,.ucj-micro--actif{animation:none}
}
