/* Chatbot « Une question ? » (src/static/js/chatbot.js) */
.cb-bouton { position: fixed; right: 14px; bottom: 86px; z-index: 40; display: flex; align-items: center; gap: 8px; padding: 12px 16px 12px 13px; border: 2px solid #fff; border-radius: 999px; background: #A83622; color: #fff; font: 800 15px/1 "Montserrat", "Montserrat Repli", sans-serif; box-shadow: 0 8px 24px rgba(0,0,0,.4); cursor: pointer; }
.cb-bouton svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.cb-bouton:focus-visible, .cb-panneau button:focus-visible, .cb-panneau input:focus-visible { outline: 3px solid #E8A613; outline-offset: 2px; }
.cb-ouvert .cb-bouton { display: none; }
.cb-panneau { position: fixed; left: 10px; right: 10px; bottom: 80px; z-index: 41; display: flex; flex-direction: column; max-height: min(72vh, 620px); background: #FBF3E4; color: #1A1412; border: 2px solid #1A1412; border-radius: 20px; overflow: hidden; box-shadow: 0 18px 48px rgba(0,0,0,.5); font-family: "Montserrat", "Montserrat Repli", sans-serif; }
.cb-panneau[hidden] { display: none; }
.cb-tete { display: flex; align-items: center; gap: 10px; padding: 10px 12px; background: #A83622; color: #fff; }
.cb-tete img { width: 36px; height: 36px; }
.cb-tete div { display: grid; line-height: 1.2; }
.cb-tete strong { font-size: 16px; }
.cb-tete span { font-size: 12px; color: #FFE3A3; font-weight: 600; }
.cb-fermer { margin-left: auto; width: 36px; height: 36px; border: 0; border-radius: 50%; background: rgba(0,0,0,.2); color: #fff; font-size: 24px; line-height: 1; cursor: pointer; }
.cb-fil { flex: 1; overflow-y: auto; padding: 14px 12px; display: flex; flex-direction: column; gap: 10px; }
.cb-bulle { max-width: 86%; padding: 10px 13px; border-radius: 16px; font-size: 15px; line-height: 1.45; }
.cb-bot { align-self: flex-start; background: #fff; border: 1px solid #E5D6BE; border-bottom-left-radius: 4px; }
.cb-moi { align-self: flex-end; background: #1A1412; color: #fff; border-bottom-right-radius: 4px; }
.cb-plus { display: inline-block; margin-top: 6px; color: #A83622; font-weight: 700; }
.cb-liens { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.cb-liens a { padding: 7px 12px; border-radius: 999px; background: #A83622; color: #fff; font-weight: 700; font-size: 13.5px; text-decoration: none; }
.cb-liens a + a { background: #1A1412; }
.cb-puces { display: flex; flex-wrap: wrap; gap: 6px; }
.cb-puce { padding: 7px 12px; border: 1.5px solid #A83622; border-radius: 999px; background: #fff; color: #A83622; font: 700 13.5px/1.2 "Montserrat", "Montserrat Repli", sans-serif; cursor: pointer; text-align: left; }
.cb-proches { margin: 2px 0 -4px; font-size: 12.5px; font-weight: 700; color: #6B5A50; }
.cb-form { display: flex; gap: 8px; padding: 10px; border-top: 1px solid #E5D6BE; background: #fff; }
.cb-form input { flex: 1; min-width: 0; padding: 11px 12px; border: 1.5px solid #CDBBA0; border-radius: 12px; font: 500 16px "Montserrat", "Montserrat Repli", sans-serif; color: #1A1412; background: #fff; }
.cb-form button { padding: 0 14px; border: 0; border-radius: 12px; background: #A83622; color: #fff; font: 800 14px "Montserrat", "Montserrat Repli", sans-serif; cursor: pointer; }
.cb-mention { margin: 0; padding: 6px 12px 9px; background: #fff; font-size: 11.5px; line-height: 1.35; color: #6B5A50; }
.cb-cache { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
@media (min-width: 1080px) {
  .cb-bouton { right: 24px; bottom: 24px; }
  .cb-panneau { left: auto; right: 24px; bottom: 24px; width: 390px; }
}
@media (prefers-reduced-motion: no-preference) { .cb-bulle { animation: cb-entre .25s ease-out; } @keyframes cb-entre { from { opacity: 0; transform: translateY(6px); } } }

/* Bouton du chatbot : le portrait de pirate validé par Rachida (msg 6214, posé sur l'accueil 72), en rond, en haut et
   en grand « qu'on la voit » (msg 6378, 6388) ; « Une question ? » dessous, talon noir bordé de jaune (palette du 06/10). */
.cb-bouton { flex-direction: column; gap: 0; padding: 0; border: 0; background: none; box-shadow: none; bottom: 84px; right: 10px; }
.cb-bouton > svg { display: none; }
.cb-perso { display: block; width: 104px; height: 104px; border-radius: 50%; background: #1A1412 url(/images/marque/chatbot-pirate.webp) center / cover no-repeat; border: 3px solid #E8A613; box-shadow: 0 14px 28px -10px rgba(0,0,0,.85); position: relative; z-index: 1; }
.cb-libelle { margin-top: -12px; position: relative; z-index: 2; padding: 8px 14px 7px; background: #000; color: #fff; border: 2px solid #E8A613; border-radius: 10px; box-shadow: 0 10px 20px -10px rgba(0,0,0,.9); font: 800 15px/1 "Montserrat", "Montserrat Repli", sans-serif; white-space: nowrap; }
.cb-bouton:hover .cb-libelle { color: #E8A613; }
@media (min-width: 900px) { .cb-bouton { right: 24px; bottom: 24px; } .cb-perso { width: 116px; height: 116px; } .cb-libelle { font-size: 16px; } }
@media (prefers-reduced-motion: no-preference) { .cb-perso { animation: cb-pense 3.2s ease-in-out infinite; transform-origin: 50% 90%; } @keyframes cb-pense { 0%, 100% { transform: rotate(-3deg); } 50% { transform: rotate(3deg); } } }
/* Téléphone : assez grand pour qu'on voie le visage ; tablette : taille intermédiaire */
@media (max-width: 599px) {
  .cb-bouton { right: 8px; bottom: 76px; }
  .cb-perso { width: 76px; height: 76px; border-width: 2px; }
  .cb-libelle { margin-top: -9px; padding: 5px 9px 4px; font-size: 12px; }
}
@media (min-width: 600px) and (max-width: 899px) {
  .cb-perso { width: 92px; height: 92px; }
  .cb-libelle { font-size: 13px; padding: 7px 11px 6px; }
}

/* Téléphone (msg 8470 : « la fenêtre est trop grande, on ne sait pas où la fermer, ça cache tout le texte ») :
   fenêtre plus basse, posée en bas de l'écran, bouton « Fermer » écrit en toutes lettres, questions proposées
   sur une seule ligne qui défile. Toucher la page autour ou le bouton retour du téléphone la ferme aussi (chatbot.js). */
.cb-fermer { display: flex; align-items: center; justify-content: center; gap: 6px; }
.cb-fermer-txt { display: none; }
@media (max-width: 599px) {
  body .cb-panneau { left: 8px; right: 8px; bottom: calc(8px + env(safe-area-inset-bottom, 0px)); max-height: min(56vh, 450px); max-height: min(56dvh, 450px); border-radius: 14px; }
  body .cb-tete { gap: 8px; padding: 7px 8px 7px 10px; }
  body .cb-tete img { width: 30px; height: 30px; }
  body .cb-tete strong { font-size: 15px; }
  body .cb-tete span { font-size: 11px; }
  body .cb-fermer { width: auto; height: 40px; padding: 0 14px 0 12px; border: 2px solid #fff; border-radius: 999px; background: #000; color: #fff; font: 800 14px/1 "Montserrat", "Montserrat Repli", sans-serif; }
  body .cb-fermer-txt { display: inline; }
  body .cb-fermer span[aria-hidden] { font-size: 22px; line-height: 1; margin-top: -2px; }
  body .cb-fil { padding: 10px 10px 8px; gap: 8px; }
  body .cb-bulle { max-width: 92%; padding: 8px 11px; font-size: 14px; line-height: 1.4; }
  body .cb-puces { flex-wrap: nowrap; overflow-x: auto; margin-right: -10px; padding: 0 10px 4px 0; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  body .cb-puces::-webkit-scrollbar { display: none; }
  body .cb-puce { flex: none; white-space: nowrap; padding: 7px 11px; font-size: 13px; }
  body .cb-form { padding: 8px; gap: 6px; }
  body .cb-form input { padding: 9px 10px; }
  body .cb-mention { padding: 3px 10px 7px; font-size: 10px; line-height: 1.3; }
  /* Le bandeau cookies (mesure.js, tout en bas) cachait la zone de saisie : il s'efface le temps de la discussion et revient à la fermeture. */
  body.cb-ouvert .dpc { display: none; }
}