/* Stark Talent — Assistant recrutement (composant isolé).
   Feuille dédiée : styles.css n'est pas modifié. On réutilise seulement ses
   jetons (--purple, --ink, --line, --heading) déjà définis sur :root.
   Tout est préfixé .stb- pour éviter toute collision avec l'existant. */

.stb{position:fixed;right:22px;bottom:22px;z-index:60;
  font-family:Inter,Arial,Helvetica,sans-serif;color:var(--ink)}

/* ---------------------------------------------------- Lanceur (état fermé) */
.stb-launcher{position:relative;display:block;width:62px;height:62px;padding:0;border:0;
  border-radius:50%;cursor:pointer;background:none;
  box-shadow:0 12px 30px rgba(70,32,190,.34),0 2px 6px rgba(5,13,40,.2);
  transition:transform .28s cubic-bezier(.2,.8,.3,1),box-shadow .28s ease}
.stb-launcher:hover{transform:translateY(-3px) scale(1.04);
  box-shadow:0 18px 38px rgba(70,32,190,.42),0 3px 8px rgba(5,13,40,.22)}
.stb-launcher:active{transform:translateY(-1px) scale(1.01)}
.stb-launcher:focus-visible{outline:3px solid #b29cff;outline-offset:3px}
.stb-launcher .stb-wolf{width:100%;height:100%;display:block;object-fit:contain;
  border-radius:50%;user-select:none}

/* L'indicateur de disponibilité vert fait partie de l'image de la mascotte :
   l'ancienne pastille CSS a été retirée pour ne pas en afficher deux. */

/* Infobulle « Besoin d'aide ? » */
.stb-tip{position:absolute;right:calc(100% + 12px);top:50%;transform:translateY(-50%) translateX(6px);
  white-space:nowrap;background:#0a1230;color:#fff;font:700 12px Inter,Arial,sans-serif;
  padding:8px 12px;border-radius:9px;box-shadow:0 10px 24px rgba(5,13,40,.24);
  opacity:0;pointer-events:none;transition:opacity .2s ease,transform .24s ease}
.stb-tip::after{content:"";position:absolute;left:100%;top:50%;margin-top:-5px;
  border:5px solid transparent;border-left-color:#0a1230}
.stb-launcher:hover .stb-tip,.stb-launcher:focus-visible .stb-tip{opacity:1;transform:translateY(-50%) translateX(0)}

/* Loup : animation d'attente très sobre (transform seul, compositée GPU). */
.stb-launcher .stb-wolf{animation:stbBreathe 5.4s ease-in-out infinite;transform-origin:50% 60%}
@keyframes stbBreathe{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}

/* ------------------------------------------------------ Fenêtre (ouverte) */
.stb-panel{position:absolute;right:0;bottom:calc(100% + 14px);width:352px;max-width:calc(100vw - 32px);
  background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden;
  box-shadow:0 26px 64px rgba(10,18,48,.22),0 4px 12px rgba(10,18,48,.08);
  display:flex;flex-direction:column;max-height:min(560px,calc(100vh - 130px));
  opacity:0;transform:translateY(10px) scale(.985);pointer-events:none;
  transition:opacity .22s ease,transform .26s cubic-bezier(.2,.8,.3,1)}
.stb.is-open .stb-panel{opacity:1;transform:none;pointer-events:auto}
.stb.is-open .stb-launcher{transform:scale(.94)}
.stb.is-open .stb-tip{display:none}

.stb-head{display:flex;align-items:center;gap:11px;padding:14px 15px;color:#fff;
  background:linear-gradient(120deg,#07112e,#141f52 62%,#2c1877 130%)}
.stb-head-ic{width:38px;height:38px;flex:none;border-radius:50%;display:grid;place-items:center;
  background:none}
.stb-head-ic .stb-wolf{width:100%;height:100%;display:block;object-fit:contain;border-radius:50%}
.stb-head-txt{min-width:0}
.stb-head strong{display:block;font:800 14px var(--heading);letter-spacing:.1px}
.stb-head span{display:block;font-size:11.5px;color:#b9aeea;margin-top:1px}
.stb-close{margin-left:auto;width:30px;height:30px;flex:none;border:0;border-radius:9px;cursor:pointer;
  background:rgba(255,255,255,.1);color:#fff;display:grid;place-items:center;transition:background .2s ease}
.stb-close:hover{background:rgba(255,255,255,.2)}
.stb-close:focus-visible{outline:2px solid #b29cff;outline-offset:2px}
.stb-close svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round}

/* Fil de discussion */
.stb-log{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:16px 15px 6px;
  background:#f7f8fc;display:flex;flex-direction:column;gap:10px}
.stb-msg{max-width:86%;font-size:13px;line-height:1.6;padding:10px 13px;border-radius:14px;
  word-break:break-word}
.stb-msg-bot{align-self:flex-start;background:#fff;border:1px solid var(--line);
  border-bottom-left-radius:5px;box-shadow:0 4px 12px rgba(10,18,48,.05)}
.stb-msg-user{align-self:flex-end;background:linear-gradient(135deg,#8055ff,#5c2cdb);color:#fff;
  border-bottom-right-radius:5px}

/* Boutons d'action rapide */
.stb-quick{display:flex;flex-wrap:wrap;gap:7px;padding:10px 15px 6px;background:#f7f8fc}
.stb-quick:empty{display:none}
.stb-chip{font:700 12px Inter,Arial,sans-serif;color:var(--purple);background:#fff;cursor:pointer;
  border:1px solid #ddd4ff;border-radius:20px;padding:8px 13px;
  transition:background .18s ease,border-color .18s ease,color .18s ease}
.stb-chip:hover{background:var(--purple);border-color:var(--purple);color:#fff}
.stb-chip:focus-visible{outline:2px solid #b29cff;outline-offset:2px}

/* Saisie libre */
.stb-form{display:flex;gap:8px;align-items:center;padding:11px 13px;border-top:1px solid var(--line);
  background:#fff}
.stb-input{flex:1;min-width:0;width:auto;margin:0;font:inherit;font-size:13px;
  border:1px solid #dfe1ef;border-radius:10px;padding:10px 12px;background:#fff;color:var(--ink)}
.stb-input:focus{outline:2px solid #b9a6ff;outline-offset:1px;border-color:#b9a6ff}
.stb-input:disabled{background:#f2f3f8;color:#9aa0b5;cursor:not-allowed}
.stb-send{width:38px;height:38px;flex:none;border:0;border-radius:10px;cursor:pointer;color:#fff;
  background:linear-gradient(135deg,#8055ff,#5c2cdb);display:grid;place-items:center;
  transition:filter .2s ease,transform .2s ease}
.stb-send:hover:not(:disabled){filter:brightness(1.08);transform:translateY(-1px)}
.stb-send:disabled{opacity:.42;cursor:not-allowed}
.stb-send:focus-visible{outline:3px solid #b29cff;outline-offset:2px}
.stb-send svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.2;
  stroke-linecap:round;stroke-linejoin:round}

.stb-foot{padding:0 14px 11px;background:#fff;font-size:10.5px;line-height:1.5;color:#8a90a6;
  text-align:center}

/* Lecteurs d'écran */
.stb-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ------------------------------------------------------------ Responsive */
@media(max-width:520px){
  .stb{right:14px;bottom:calc(64px + env(safe-area-inset-bottom,0px));left:14px;pointer-events:none}
  .stb-launcher{margin-left:auto;pointer-events:auto;width:56px;height:56px}
  .stb-panel{left:0;right:0;width:auto;max-width:100%;pointer-events:none;
    max-height:min(74vh,calc(100vh - 170px - env(safe-area-inset-bottom,0px)));
    max-height:min(74svh,calc(100svh - 170px - env(safe-area-inset-bottom,0px)))}
  .stb.is-open .stb-panel{pointer-events:auto}
  .stb-tip{display:none}
  .stb-msg{max-width:90%}
}

/* Mouvement réduit : plus aucune animation d'attente. */
@media(prefers-reduced-motion:reduce){
  .stb-launcher .stb-wolf{animation:none}
  .stb-panel,.stb-launcher,.stb-tip{transition:none}
}
