/* Bulle « Un souci ? Dites-le » (17/10, maquette docs/maquettes/bulle-remarques/, validée par JB) — « bl- ».
   Grand écran : bouton dégradé violet-bleu en bas à droite, panneau au-dessus. Téléphone : bulle
   ronde compacte au bord droit, au-dessus des barres d'action du bas (jamais sur un bouton). */
.bl{--bl-violet:#7c3aed;--bl-bleu:#1d4ed8;--bl-gris:#64748b;--bl-ligne:#e2e8f0;--bl-vert:#15803d;--bl-vertf:#dcfce7;font-family:Inter,system-ui,sans-serif}
.bl-bouton{position:fixed;right:24px;bottom:24px;z-index:70;display:flex;align-items:center;gap:10px;background:linear-gradient(135deg,var(--bl-violet),var(--bl-bleu));color:#fff;border:0;border-radius:999px;padding:14px 20px;font:700 16px Inter,system-ui,sans-serif;box-shadow:0 10px 30px rgba(79,70,229,.35);cursor:pointer;transition:transform .12s}
.bl-bouton:hover{transform:translateY(-1px)}
.bl-pastille{background:#fff;color:var(--bl-violet);border-radius:999px;font-size:12px;padding:2px 8px}
.bl-accueil{position:fixed;right:24px;bottom:92px;z-index:70;width:320px;background:#fff;color:#0f172a;border-radius:14px;padding:16px;box-shadow:0 10px 30px rgba(15,23,42,.15);font-size:14px;line-height:1.45}
.bl-accueil b{display:block;font-size:16px;margin-bottom:6px}
.bl-accueil .bl-btn{margin-top:10px}
.bl-fond{position:fixed;inset:0;z-index:68;background:transparent}
.bl-panneau{position:fixed;right:24px;bottom:92px;z-index:71;width:380px;max-height:calc(100vh - 120px);overflow:auto;background:#fff;color:#0f172a;border-radius:16px;box-shadow:0 16px 40px rgba(15,23,42,.2);padding:18px}
.bl-panneau h3{margin:0 0 4px;font-size:18px}
.bl-panneau p{margin:0 0 12px;color:var(--bl-gris);font-size:13px}
.bl-types{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}
.bl-types button{border:2px solid var(--bl-ligne);background:#fff;color:#0f172a;border-radius:10px;padding:10px 6px;font:600 13px Inter,system-ui,sans-serif;cursor:pointer}
.bl-types button span{display:block;font-size:20px}
.bl-types button.on{border-color:var(--bl-violet);background:#f5f3ff}
.bl-texte{width:100%;height:90px;border:2px solid var(--bl-ligne);border-radius:10px;padding:10px;font:15px Inter,system-ui,sans-serif;resize:none;box-sizing:border-box;background:#fff;color:#0f172a}
.bl-texte:focus{outline:none;border-color:var(--bl-violet)}
.bl-auto{font-size:12px;color:var(--bl-gris);margin:8px 0 12px}
.bl-auto label{display:flex;gap:6px;align-items:center;color:#0f172a}
.bl-btn{border:1px solid var(--bl-ligne);background:#fff;color:#0f172a;border-radius:999px;padding:8px 14px;font:600 14px Inter,system-ui,sans-serif;cursor:pointer}
.bl-btn.pri{background:var(--bl-violet);color:#fff;border-color:var(--bl-violet)}
.bl-btn[disabled]{opacity:.6}
.bl-pied{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:12px}
.bl-pied a{font-size:13px;color:var(--bl-bleu)}
.bl-ko{color:#b91c1c!important;font-weight:600}
.bl-merci{text-align:center;padding:10px 0 0;font-size:14px}
.bl-merci .bl-ok{font-size:40px}
.bl-merci b{display:block;font-size:17px;margin:6px 0}
.bl-mes{margin-top:12px;border-top:1px solid var(--bl-ligne);padding-top:10px;font-size:13px;text-align:left}
.bl-mes div{display:flex;justify-content:space-between;gap:10px;padding:4px 0}
.bl-st{border-radius:999px;padding:1px 8px;font-size:11px;font-weight:700;background:#e2e8f0;white-space:nowrap}
.bl-st.c{background:#dbeafe;color:var(--bl-bleu)}.bl-st.v{background:var(--bl-vertf);color:var(--bl-vert)}
.bl-vide{color:var(--bl-gris);font-size:13px;margin:12px 0 0}
@media print{.bl{display:none}}
/* Téléphone : bulle ronde compacte, au-dessus des barres du bas ; panneau en feuille. */
@media (max-width:600px){
  .bl-bouton{right:10px;bottom:calc(150px + env(safe-area-inset-bottom));width:46px;height:46px;padding:0;justify-content:center;font-size:20px;box-shadow:0 6px 18px rgba(79,70,229,.35);opacity:.92}
  .bl-txt,.bl-pastille{display:none}
  .bl-accueil{left:12px;right:12px;width:auto;bottom:calc(206px + env(safe-area-inset-bottom))}
  .bl-fond{background:rgba(15,23,42,.35)}
  .bl-panneau{left:0;right:0;bottom:0;width:auto;max-height:88vh;border-radius:18px 18px 0 0;padding:16px 16px calc(16px + env(safe-area-inset-bottom))}
  .bl-types button{padding:9px 4px;font-size:12px}
}