/* Widget chatbot SideBiz v4.1 — shared asset. Inclus via <link> sur landing + pages services. */

/* Quand le chatbot est ouvert, on bloque le scroll du body (utile surtout mobile plein écran). */
body.chat-open { overflow: hidden; }

/* Ombre portée du panel chatbot. */
.chatbot-panel { box-shadow: 0 16px 48px rgba(0,0,0,0.20); }

/* Mobile : chatbot plein écran (100dvh = viewport dynamique, gère le clavier).
   Override la taille fixe desktop. font-size input ≥ 16px → empêche le zoom iOS. */
@media (max-width: 767px) {
  #chat-panel {
    inset: 0 !important;
    width: 100% !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    border-radius: 0 !important;
    border: none !important;
    bottom: 0 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
  }
  #chat-input { font-size: 16px !important; }
  /* Quand le chatbot est ouvert, masquer la sticky bar Appeler/Devis. */
  body.chat-open .mobile-sticky-bar { display: none !important; }
  /* Le bouton flottant 💬 disparaît aussi quand le chatbot est ouvert (sinon il chevauche le chat). */
  body.chat-open #chat-toggle { display: none !important; }
}

/* Bulles de messages. */
.msg-bot { background: #E4E0D8; color: #1A1C1E; border-radius: 14px 14px 14px 4px; padding: 10px 14px; max-width: 85%; align-self: flex-start; font-size: 15px; line-height: 1.5; }
.msg-user { background: #1A1C1E; color: #EDEAE3; border-radius: 14px 14px 4px 14px; padding: 10px 14px; max-width: 85%; align-self: flex-end; font-size: 15px; line-height: 1.5; }

/* Pills d'action rapide (boutons « Prendre RDV », « Demander un devis »…). */
.quick-pill { border: 1px solid #1A1C1E; color: #1A1C1E; background: #fff; border-radius: 999px; padding: 8px 14px; font-size: 14px; font-weight: 500; transition: background 0.2s ease, color 0.2s ease; }
.quick-pill:hover { background: #1A1C1E; color: #EDEAE3; }
.quick-pill.primary { background: #1A1C1E; color: #EDEAE3; }
.quick-pill.primary:hover { background: #C2410C; color: #fff; }

/* Animation d'apparition du panel. */
@keyframes slideUp { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.anim-slide-up { animation: slideUp 0.25s ease; }

/* Mobile sticky bar (Appeler + Assistant 24/7) — affichée sur < lg uniquement. */
.mobile-sticky-bar { box-shadow: 0 -8px 24px rgba(0,0,0,0.10); }