/* MT Chat : charte Minucci Tech (contrat P08, charte §12).
   Bulle, shortcode et barre partagent cette feuille, scopée sous #mtchat-root.
   z-index : --mtchat-z (1000) en flottant, auto en intégré.
   Transitions : transform/opacity ; mouvement réduit traité en fin de fichier.
   Aucune police ou image distante, aucun @import. */


/* 1. Attribut `hidden` */

#mtchat-root [hidden],
#mtchat-root .mtchat-retry[hidden] {
  display: none;
}


/* 2. Racine, jetons et réinitialisation */

#mtchat-root {
  --mtchat-primary: #2766fe;
  --mtchat-on-primary: #ffffff;
  --mtchat-primary-strong: #153275;
  --mtchat-primary-strong: color-mix(in srgb, var(--mtchat-primary) 46%, #000000);
  --mtchat-primary-ink: #1f55d6;
  --mtchat-primary-ink: color-mix(in oklab, var(--mtchat-primary) 88%, #000000);
  --mtchat-primary-soft: #e8effe;
  --mtchat-primary-soft: color-mix(in srgb, var(--mtchat-primary) 10.5%, #ffffff);
  --mtchat-primary-line: #caddff;
  --mtchat-primary-line: color-mix(in oklab, var(--mtchat-primary) 24%, #ffffff);

  --mtchat-surface: #ffffff;
  --mtchat-surface-2: #f4f7fd;
  --mtchat-surface-3: #ffffff;
  --mtchat-heading: #000000;
  --mtchat-text: #333333;
  --mtchat-muted: #6b6b6b;
  --mtchat-faint: #8f8f8f;
  --mtchat-border: #e9edf6;
  --mtchat-border-strong: #d6deec;

  --mtchat-danger: #d92d20;
  --mtchat-danger-soft: #feecea;
  --mtchat-danger-ink: #8b1b12;
  --mtchat-online: #12a150;

  --mtchat-radius: 15px;
  --mtchat-radius-bubble: 15px;
  --mtchat-radius-field: 15px;
  --mtchat-radius-card: 15px;
  --mtchat-radius-button: 12px;
  --mtchat-radius-control: 10px;
  --mtchat-radius-chip: 999px;
  --mtchat-shadow: 0 24px 64px -16px rgba(22, 37, 92, 0.28), 0 2px 8px rgba(22, 37, 92, 0.08);
  --mtchat-shadow-bubble: 0 10px 28px -8px rgba(39, 102, 254, 0.55), 0 2px 6px rgba(22, 37, 92, 0.12);
  --mtchat-ring: 0 0 0 3px var(--mtchat-primary-soft);

  --mtchat-z: 1000;
  --mtchat-panel-w: 400px;
  --mtchat-panel-h: 620px;
  --mtchat-embed-h: 560px;
  --mtchat-embed-col: 720px;

  --mtchat-ease: cubic-bezier(0.16, 1, 0.3, 1);

  --mtchat-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 3h16a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H10l-5 4v-4H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z'/%3E%3C/svg%3E");
  --mtchat-icon-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 11.2h15.1l-5-5L14.2 5 21 12l-6.8 7-1.1-1.2 5-5H3z'/%3E%3C/svg%3E");
  --mtchat-icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.4 5 5 6.4l5.6 5.6L5 17.6 6.4 19l5.6-5.6 5.6 5.6 1.4-1.4-5.6-5.6L19 6.4 17.6 5 12 10.6z'/%3E%3C/svg%3E");
  --mtchat-icon-alert: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 1 21h22L12 2zm1 14h-2v2h2v-2zm0-8h-2v6h2V8z'/%3E%3C/svg%3E");
  --mtchat-icon-mark: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 966 831'%3E%3Cpath d='M0 0h237l249 248-119 119zM0 181l279 279v371H0zM733 0h233v831H689V453L487 655V246z'/%3E%3C/svg%3E");

  position: fixed;
  right: 0;
  bottom: 0;
  z-index: var(--mtchat-z, 1000);
  width: 0;
  height: 0;
  color: var(--mtchat-text);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.6;
  text-align: left;
}

/* Sélecteur universel scopé : il ne sort pas du wrapper. `min-width: 0` évite
   le débordement horizontal des conteneurs flex quand un visiteur colle une
   URL de 200 caractères. */
#mtchat-root,
#mtchat-root * {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  min-width: 0;
}

/* Reset explicite AVANT de styler : Elementor pose `background`, `border`,
   `padding`, `box-shadow`, sa pile de polices et souvent `text-transform` sur
   les éléments interactifs. Sans remise à plat, le bouton d'envoi hériterait
   du bouton du thème. */
#mtchat-root .mtchat-bubble,
#mtchat-root .mtchat-close,
#mtchat-root .mtchat-send,
#mtchat-root .mtchat-suggestion,
#mtchat-root .mtchat-input,
#mtchat-root .mtchat-field,
#mtchat-root .mtchat-citation-link,
#mtchat-root .mtchat-action,
#mtchat-root .mtchat-human,
#mtchat-root .mtchat-reset,
#mtchat-root .mtchat-privacy {
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  font: inherit;
  line-height: 1.4;
  color: inherit;
  text-align: left;
  text-decoration: none;
  text-transform: none;
  letter-spacing: normal;
  appearance: none;
  -webkit-tap-highlight-color: transparent;
}

/* Libellés réservés aux technologies d'assistance. */
#mtchat-root .mtchat-sr,
#mtchat-root.mtchat-bar .mtchat-title {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  white-space: nowrap;
}


/* 3. Bulle d'ouverture */

#mtchat-root .mtchat-bubble {
  position: fixed;
  right: 24px;
  bottom: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: var(--mtchat-radius-chip);
  background: var(--mtchat-primary, #2766fe);
  color: var(--mtchat-on-primary, #ffffff);
  box-shadow: var(--mtchat-shadow-bubble);
  cursor: pointer;
  transition: transform 180ms var(--mtchat-ease), opacity 180ms var(--mtchat-ease);
}

#mtchat-root .mtchat-bubble:hover {
  background: var(--mtchat-primary-strong);
  transform: scale(1.06);
}

#mtchat-root .mtchat-bubble-icon {
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: var(--mtchat-icon) center / contain no-repeat;
  mask: var(--mtchat-icon) center / contain no-repeat;
}


/* 4. Panneau et en-tête */

/* Ancré 96 px au-dessus du bas : 24 (marge) + 56 (bulle) + 16 (respiration).
   Le panneau ne recouvre donc jamais la bulle, qui reste visible et
   atteignable au clavier — H01 §8 lui rend le focus à la fermeture.
   `max-height` : 128 = 96 (dégagement de la bulle) + 32 (marge haute). */
#mtchat-root .mtchat-panel {
  position: fixed;
  right: 24px;
  bottom: 96px;
  flex-direction: column;
  width: var(--mtchat-panel-w, 400px);
  height: var(--mtchat-panel-h, 620px);
  max-height: calc(100vh - 128px);
  overflow: hidden;
  border: 1px solid var(--mtchat-border);
  border-radius: var(--mtchat-radius);
  background: var(--mtchat-surface);
  box-shadow: var(--mtchat-shadow);
  transform-origin: bottom right;
}

#mtchat-root .mtchat-panel:not([hidden]) {
  display: flex;
}

#mtchat-root .mtchat-header {
  display: flex;
  flex: none;
  align-items: center;
  gap: 12px;
  min-height: 64px;
  padding: 12px 12px 12px 16px;
  border-bottom: 1px solid var(--mtchat-border);
  background: var(--mtchat-surface);
}

#mtchat-root .mtchat-avatar {
  flex: none;
  width: 32px;
  height: 32px;
  border-radius: var(--mtchat-radius-chip);
  object-fit: cover;
}

/* Marque à défaut d'avatar : le M du site, en masque — aucune requête.
   Proportions du pictogramme d'origine (966 × 831). */
#mtchat-root .mtchat-mark {
  flex: none;
  width: 28px;
  height: 24px;
  background-color: var(--mtchat-heading);
  -webkit-mask: var(--mtchat-icon-mark) center / contain no-repeat;
  mask: var(--mtchat-icon-mark) center / contain no-repeat;
}

#mtchat-root .mtchat-heading {
  flex: 1 1 auto;
}

/* Titre de longueur libre : une ligne, ellipse au-delà. Le 800 serré est la
   signature des titres du site. */
#mtchat-root .mtchat-title {
  overflow: hidden;
  color: var(--mtchat-heading);
  font-size: 16px;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: -0.02em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Obligation d'information : la mention « assistant IA » tient lieu de
   sous-titre de statut. Elle est permanente et jamais escamotée (charte
   §12.1) ; le point vert qui la précède dit que la surface répond. Elle
   prend la forme de l'eyebrow des sections du site. */
#mtchat-root .mtchat-disclosure {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 3px;
  overflow: hidden;
  color: var(--mtchat-primary-ink);
  font-size: 10px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.1em;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

#mtchat-root .mtchat-disclosure::before {
  flex: none;
  width: 6px;
  height: 6px;
  border-radius: var(--mtchat-radius-chip);
  background: var(--mtchat-online);
  content: "";
}

/* Le libellé reste lu par les lecteurs d'écran, masqué par `font-size: 0` :
   affiché, il débordait du bouton. La croix est un masque. */
#mtchat-root .mtchat-close {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: var(--mtchat-radius-control);
  color: var(--mtchat-muted);
  font-size: 0;
  cursor: pointer;
  transition: opacity 180ms var(--mtchat-ease);
}

#mtchat-root .mtchat-close::after {
  width: 20px;
  height: 20px;
  background-color: currentColor;
  -webkit-mask: var(--mtchat-icon-close) center / contain no-repeat;
  mask: var(--mtchat-icon-close) center / contain no-repeat;
  content: "";
}

#mtchat-root .mtchat-close:hover {
  background: var(--mtchat-surface-2);
  color: var(--mtchat-heading);
}


/* 5. Journal des messages */

#mtchat-root .mtchat-log {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 20px;
  overflow: hidden auto;
  overscroll-behavior: contain;
  padding: 20px 16px 16px;
  scroll-behavior: smooth;
  /* La barre native de Windows, à flèches, pèserait plus que le texte. */
  scrollbar-color: var(--mtchat-border-strong) transparent;
  scrollbar-width: thin;
}

/* État vide : H01 rend le message d'accueil, mais un accueil vidé en
   réglages ferait remonter le composeur au milieu du panneau. Aucun texte
   n'est injecté ici — une chaîne posée en CSS échapperait à `__()`. */
#mtchat-root .mtchat-log:empty {
  min-height: 96px;
}

#mtchat-root .mtchat-msg {
  max-width: 100%;
}

/* Réponse : pas de fond, pas de bordure, une mesure de lecture plafonnée.
   62ch est la largeur au-delà de laquelle l'œil perd la ligne suivante. */
#mtchat-root .mtchat-msg-bot {
  align-self: stretch;
  max-width: 62ch;
  color: var(--mtchat-text);
}

/* Message du visiteur : bulle à l'angle rentrant tourné vers son auteur. */
#mtchat-root .mtchat-msg-user {
  align-self: flex-end;
  max-width: 85%;
  padding: 10px 14px;
  border-radius: var(--mtchat-radius-bubble) var(--mtchat-radius-bubble) 4px var(--mtchat-radius-bubble);
  background: var(--mtchat-primary-soft);
  color: var(--mtchat-heading);
  line-height: 1.5;
}

/* Un visiteur colle des URL de 200 caractères : elles se coupent au lieu
   d'élargir le panneau. */
#mtchat-root .mtchat-msg-text,
#mtchat-root .mtchat-citation-link,
#mtchat-root .mtchat-notice {
  overflow-wrap: anywhere;
  word-break: break-word;
}

#mtchat-root .mtchat-p + .mtchat-p {
  margin-top: 12px;
}

/* Célébration confinée au bandeau : aucun calque sur les liens ou le texte. */
#mtchat-root .mtchat-booked {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 80px;
  margin-bottom: 16px;
  padding: 16px;
  overflow: hidden;
  border-radius: var(--mtchat-radius-card);
  background: var(--mtchat-primary-soft);
  color: var(--mtchat-primary-strong);
}

#mtchat-root .mtchat-booked-title {
  min-width: 0;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

#mtchat-root .mtchat-booked-check {
  display: block;
  position: relative;
  flex: none;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #16803c;
}

#mtchat-root .mtchat-booked-check::after {
  content: '';
  position: absolute;
  left: 11px;
  top: 7px;
  width: 8px;
  height: 14px;
  border: solid #fff;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
}

#mtchat-root .mtchat-booked-celebrating .mtchat-booked-check {
  animation: mtchat-booked-pop 350ms var(--mtchat-ease) both;
}

#mtchat-root .mtchat-confetti {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

#mtchat-root .mtchat-confetti-piece {
  position: absolute;
  left: 50%;
  top: 55%;
  width: 6px;
  height: 10px;
  border-radius: 2px;
  background: var(--mtchat-primary);
  opacity: 0;
  animation: mtchat-confetti-flight 1500ms ease-out both;
}

#mtchat-root .mtchat-confetti-piece:nth-child(3n) {
  background: #16803c;
}

#mtchat-root .mtchat-confetti-piece:nth-child(3n + 1) {
  background: #e7ac35;
}

@keyframes mtchat-booked-pop {
  from { opacity: 0; transform: scale(0.65); }
  to { opacity: 1; transform: scale(1); }
}

@keyframes mtchat-confetti-flight {
  0% { opacity: 0; transform: translate(0, 16px) rotate(0deg) scale(0.5); }
  15% { opacity: 0.8; }
  45% { opacity: 0.8; transform: translate(var(--mtchat-confetti-x), var(--mtchat-confetti-y)) rotate(var(--mtchat-confetti-turn)); }
  100% { opacity: 0; transform: translate(var(--mtchat-confetti-x), 64px) rotate(var(--mtchat-confetti-turn)) scale(0.7); }
}

/* Frappe : trois points sous la place de la réponse à venir, dès l'envoi et
   avant le premier octet. Ils occupent la même gouttière que le texte, la
   réponse ne se décale donc pas en arrivant. */
#mtchat-root .mtchat-typing {
  align-items: center;
  align-self: flex-start;
  gap: 5px;
  height: 20px;
}

#mtchat-root .mtchat-typing:not([hidden]) {
  display: flex;
}

#mtchat-root .mtchat-dot {
  flex: none;
  width: 6px;
  height: 6px;
  border-radius: var(--mtchat-radius-chip);
  background: var(--mtchat-primary);
  animation: mtchat-dot 1200ms ease-in-out infinite;
}

#mtchat-root .mtchat-dot:nth-child(2) {
  animation-delay: 160ms;
}

#mtchat-root .mtchat-dot:nth-child(3) {
  animation-delay: 320ms;
}


/* 6. Citations et actions */

/* Lectures facultatives, secondaires par rapport à la réponse attendue. */
#mtchat-root .mtchat-reading {
  margin-top: 16px;
}

#mtchat-root .mtchat-reading-label {
  margin-bottom: 4px;
  color: var(--mtchat-muted);
  font-size: 12px;
  line-height: 1.5;
}

#mtchat-root .mtchat-citations {
  display: grid;
  gap: 4px;
  list-style: none;
}

#mtchat-root .mtchat-citation {
  margin: 0;
  padding: 0;
  list-style: none;
}

#mtchat-root .mtchat-citation-link {
  display: inline-block;
  max-width: 100%;
  padding: 4px 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  color: var(--mtchat-text);
  font: inherit;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

#mtchat-root .mtchat-citation-link:hover {
  color: var(--mtchat-primary-ink);
}

#mtchat-root .mtchat-citation-link:active {
  color: var(--mtchat-primary-strong);
}

#mtchat-root .mtchat-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
}

/* Traitement de base : action secondaire, en retrait. `handoff` et
   `contact_form` restent ainsi subordonnés à la prise de rendez-vous. */
#mtchat-root .mtchat-action {
  display: inline-flex;
  max-width: 100%;
  overflow-wrap: anywhere;
  align-items: center;
  min-height: 40px;
  padding: 0 16px;
  border: 1px solid var(--mtchat-border-strong);
  border-radius: var(--mtchat-radius-button);
  background: var(--mtchat-surface);
  color: var(--mtchat-heading);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
  cursor: pointer;
  transition: transform 180ms var(--mtchat-ease), opacity 180ms var(--mtchat-ease);
}

/* Action principale du panneau : la prise de rendez-vous est la conversion que
   tout le produit existe pour obtenir. Elle est seule à être remplie — une
   hiérarchie ne tient que si une seule action domine. C'est le CTA du site :
   bleu plein, flèche, survol #153275. Blanc sur #2766FE : 4,75:1 (AA). */
#mtchat-root .mtchat-action-rdv {
  flex: 0 1 auto;
  gap: 8px;
  justify-content: center;
  min-height: 44px;
  padding: 0 20px;
  max-width: 280px;
  border-color: transparent;
  background: var(--mtchat-primary);
  color: var(--mtchat-on-primary, #ffffff);
  font-size: 15px;
}

#mtchat-root .mtchat-action-rdv::after {
  flex: none;
  width: 16px;
  height: 16px;
  background-color: currentColor;
  -webkit-mask: var(--mtchat-icon-arrow) center / contain no-repeat;
  mask: var(--mtchat-icon-arrow) center / contain no-repeat;
  content: "";
}

/* Rappel en ligne (C4), sur sa propre ligne sous le lien humain. Champs à
   16 px comme le composeur : en dessous, iOS zoome à la saisie. */
#mtchat-root .mtchat-lead {
  display: grid;
  flex: 1 1 100%;
  gap: 8px;
  max-width: 320px;
}

#mtchat-root .mtchat-lead-l,
#mtchat-root .mtchat-lead-msg {
  display: grid;
  gap: 4px;
  color: var(--mtchat-muted);
  font-size: 12px;
  font-weight: 500;
}

#mtchat-root .mtchat-field {
  min-height: 44px;
  padding: 8px 12px;
  border: 1px solid var(--mtchat-border-strong);
  border-radius: var(--mtchat-radius-control);
  background: var(--mtchat-surface);
  color: var(--mtchat-heading);
  font-size: 16px;
}

#mtchat-root .mtchat-lead .mtchat-action {
  justify-content: center;
}

/* Créneaux : l'heure se replie, jamais tronquée. */
#mtchat-root .mtchat-slots {
  display: flex;
  flex: 1 1 100%;
  flex-wrap: wrap;
  gap: 8px;
}

#mtchat-root .mtchat-slots .mtchat-suggestion {
  max-width: 100%;
  white-space: normal;
}

/* Modes : cartes tactiles, icônes décoratives et sélection visible. */
#mtchat-root .mtchat-modes {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 152px), 1fr));
  gap: 12px;
}

#mtchat-root .mtchat-modes .mtchat-mode {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  min-height: 80px;
  border: 1px solid var(--mtchat-primary-line);
  border-radius: 16px;
  background: var(--mtchat-surface);
  box-shadow: 0 4px 12px -8px rgba(22, 37, 92, 0.2);
  color: var(--mtchat-heading);
  font-size: 14px;
  font-weight: 600;
  text-align: left;
  overflow-wrap: anywhere;
}

#mtchat-root .mtchat-modes .mtchat-mode:hover,
#mtchat-root .mtchat-modes .mtchat-mode[aria-pressed="true"] {
  border-color: var(--mtchat-primary);
  background: var(--mtchat-primary-soft);
  box-shadow: inset 0 0 0 1px var(--mtchat-primary);
}

#mtchat-root .mtchat-mode[aria-pressed="true"]::after {
  content: "";
  flex: none;
  width: 8px;
  height: 12px;
  margin-left: auto;
  border: solid var(--mtchat-primary-ink);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

#mtchat-root .mtchat-modes .mtchat-mode:disabled {
  cursor: wait;
  transform: none;
}

#mtchat-root .mtchat-mode-icon {
  flex: none;
  width: 32px;
  height: 32px;
  background: center / contain no-repeat;
}

#mtchat-root .mtchat-mode-meet {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath fill='%23008132' d='m20 12 9-7v22l-9-7z'/%3E%3Cpath fill='%2300ac47' d='M9 22h12v5H9z'/%3E%3Cpath fill='%23ea4335' d='M3 10V7a2 2 0 0 1 2-2h4v5z'/%3E%3Cpath fill='%232685fc' d='M3 10h6v17H5a2 2 0 0 1-2-2z'/%3E%3Cpath fill='%23ffba00' d='M9 5h10a2 2 0 0 1 2 2v15H9v-5h7v-7H9z'/%3E%3C/svg%3E");
}

#mtchat-root .mtchat-mode-teams {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='26' cy='10' r='3' fill='%23505ac9'/%3E%3Cpath d='M22 15h9v7a4 4 0 0 1-8 0z' fill='%23505ac9'/%3E%3Ccircle cx='18' cy='8' r='5' fill='%237b83eb'/%3E%3Cpath d='M10 15h15v9a7 7 0 0 1-14 0z' fill='%237b83eb'/%3E%3Crect x='1' y='11' width='17' height='17' rx='3' fill='%23464eb8'/%3E%3Cpath d='M5 16h9v2h-3.5v7h-2v-7H5z' fill='white'/%3E%3C/svg%3E");
}

#mtchat-root .mtchat-mode-phone {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Crect width='32' height='32' rx='9' fill='%23e8effe'/%3E%3Cpath d='m11 7 3 6-3 2c1 3 3 5 6 6l2-3 6 3-1 4C14 27 5 18 7 8z' fill='none' stroke='%232451b5' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E");
}


/* 7. Suggestions, avis et consentement */

/* Pastilles alignées, qui défilent horizontalement au-delà de la largeur du
   panneau plutôt que de le faire grandir. `scrollbar-width: none` retire la
   barre sur le seul élément concerné : le geste tactile et la molette
   fonctionnent, seul l'ornement disparaît. */
#mtchat-root .mtchat-suggestions {
  flex: none;
  gap: 8px;
  overflow-x: auto;
  padding: 0 16px 12px;
  scrollbar-width: none;
}

#mtchat-root .mtchat-suggestions:not([hidden]) {
  display: flex;
}

#mtchat-root .mtchat-suggestion {
  flex: none;
  min-height: 36px;
  max-width: 260px;
  padding: 8px 14px;
  overflow: hidden;
  border: 1px solid var(--mtchat-primary-line);
  border-radius: var(--mtchat-radius-control);
  background: var(--mtchat-surface);
  color: var(--mtchat-primary-ink);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
  transition: transform 180ms var(--mtchat-ease), opacity 180ms var(--mtchat-ease);
}

#mtchat-root .mtchat-suggestion:hover {
  border-color: var(--mtchat-primary);
  background: var(--mtchat-primary-soft);
}

#mtchat-root .mtchat-action:hover {
  border-color: var(--mtchat-heading);
  background: var(--mtchat-surface);
}

/* L'action de rendez-vous porte les deux classes ; sans cette reprise, le
   survol la viderait de sa couleur. */
#mtchat-root .mtchat-action-rdv:hover {
  border-color: transparent;
  background: var(--mtchat-primary-strong);
}

#mtchat-root .mtchat-notice {
  flex: none;
  margin: 0 16px 12px;
  padding: 10px 12px;
  border: 1px solid var(--mtchat-border);
  border-radius: var(--mtchat-radius-control);
  background: var(--mtchat-surface-2);
  color: var(--mtchat-text);
  font-size: 13px;
  line-height: 1.45;
}

#mtchat-root .mtchat-notice:not([hidden]) {
  display: block;
}

/* #8b1b12 sur #feecea : 7,4:1. L'erreur ne repose jamais sur la seule
   couleur — le texte la nomme, et l'icône la signale à qui ne distingue pas
   les teintes. Un masque SVG et non un glyphe : un caractère posé en `content`
   est annoncé par plusieurs lecteurs d'écran, qui liraient le pictogramme
   avant la phrase. */
#mtchat-root .mtchat-notice-error {
  position: relative;
  padding-left: 36px;
  border-color: rgba(217, 45, 32, 0.24);
  background: var(--mtchat-danger-soft);
  color: var(--mtchat-danger-ink);
}

#mtchat-root .mtchat-notice-error::before {
  position: absolute;
  top: 11px;
  left: 12px;
  width: 16px;
  height: 16px;
  background-color: var(--mtchat-danger);
  -webkit-mask: var(--mtchat-icon-alert) center / contain no-repeat;
  mask: var(--mtchat-icon-alert) center / contain no-repeat;
  content: "";
}

/* Mention d'une ligne, en petit : l'envoi vaut accord. Contraste AA, pas le
   gris pâle du site. */
#mtchat-root .mtchat-consent {
  flex: none;
  margin: 0 16px 8px;
  color: var(--mtchat-muted);
  font-size: 11px;
  line-height: 1.45;
}

#mtchat-root .mtchat-privacy {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}


/* 8. Composeur et pied */

/* Le composeur est une **carte** posée sur le panneau, pas une barre collée au
   bas : c'est ce qui le désigne comme l'endroit où l'on écrit. */
#mtchat-root .mtchat-composer {
  display: flex;
  flex: none;
  align-items: flex-end;
  gap: 8px;
  margin: 0 16px;
  padding: 7px 7px 7px 14px;
  border: 1px solid var(--mtchat-border-strong);
  border-radius: var(--mtchat-radius-field);
  background: var(--mtchat-surface-3);
  transition: opacity 180ms var(--mtchat-ease);
}

/* La hauteur est pilotée par H01 (`syncInput()`), qui l'ajuste au contenu de 1
   à 5 lignes. La valeur écrite ici est celle d'une ligne : c'est ce que voit
   le visiteur pendant les quelques millisecondes où le script différé n'a pas
   encore tourné, et c'est ce qui reste si le JS échoue. */
#mtchat-root .mtchat-input {
  flex: 1 1 auto;
  height: 36px;
  max-height: 124px;
  padding: 6px 0;
  overflow-y: auto;
  background: none;
  color: var(--mtchat-heading);
  font-size: 16px;
  line-height: 1.5;
  resize: none;
  scrollbar-color: var(--mtchat-border-strong) transparent;
  scrollbar-width: thin;
}

#mtchat-root .mtchat-input::placeholder {
  color: var(--mtchat-faint);
  opacity: 1;
}

#mtchat-root .mtchat-input:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

/* Pot de miel : masqué à l'humain sans `display: none`, que certains robots
   savent détecter. Sorti du cadre par un panneau en `overflow: hidden`. */
#mtchat-root .mtchat-hp {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  opacity: 0;
}

/* 36 px, rayon de la carte moins son rembourrage : arrondis concentriques.
   Libellé lu par les lecteurs d'écran, masqué par `font-size: 0`. */
#mtchat-root .mtchat-send {
  display: flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: var(--mtchat-radius-control);
  background: var(--mtchat-primary, #2766fe);
  color: var(--mtchat-on-primary, #ffffff);
  font-size: 0;
  cursor: pointer;
  transition: transform 180ms var(--mtchat-ease), opacity 180ms var(--mtchat-ease);
}

#mtchat-root .mtchat-send::after {
  width: 18px;
  height: 18px;
  background-color: currentColor;
  -webkit-mask: var(--mtchat-icon-arrow) center / contain no-repeat;
  mask: var(--mtchat-icon-arrow) center / contain no-repeat;
  content: "";
}

/* Requête en vol ou blocage (H01 §2). */
#mtchat-root .mtchat-send:disabled {
  opacity: 0.4;
  cursor: not-allowed;
  transform: none;
}

#mtchat-root .mtchat-footer {
  flex: none;
  padding: 8px 16px 12px;
  text-align: center;
}

#mtchat-root .mtchat-human,
#mtchat-root .mtchat-reset:not([hidden]) {
  display: inline-block;
  padding: 4px 8px;
  border-radius: 8px;
  color: var(--mtchat-primary-ink);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}

/* « Nouvelle conversation » : secondaire, en gris. */
#mtchat-root .mtchat-reset:not([hidden]) {
  margin-left: 8px;
  color: var(--mtchat-muted);
}

#mtchat-root .mtchat-human:hover,
#mtchat-root .mtchat-reset:hover {
  color: var(--mtchat-primary-strong);
}


/* 9. Survol, appui, focus */

#mtchat-root .mtchat-send:hover {
  background: var(--mtchat-primary-strong);
}

#mtchat-root .mtchat-suggestion:hover,
#mtchat-root .mtchat-action:hover {
  transform: translateY(-1px);
}

/* L'opacité porte l'accusé de réception, la mise à l'échelle l'accompagne :
   sous `prefers-reduced-motion`, la première survit à la seconde. */
#mtchat-root .mtchat-bubble:active,
#mtchat-root .mtchat-send:active,
#mtchat-root .mtchat-action:active,
#mtchat-root .mtchat-suggestion:active,
#mtchat-root .mtchat-close:active {
  opacity: 0.75;
  transform: scale(0.97);
}

/* Anneau extérieur pour ce qui repose sur la surface claire. On ne supprime
   jamais l'anneau natif : on le remplace. */
#mtchat-root .mtchat-log:focus-visible,
#mtchat-root .mtchat-suggestion:focus-visible,
#mtchat-root .mtchat-citation-link:focus-visible,
#mtchat-root .mtchat-privacy:focus-visible,
#mtchat-root .mtchat-reset:focus-visible,
#mtchat-root .mtchat-action:focus-visible,
#mtchat-root .mtchat-field:focus-visible,
#mtchat-root .mtchat-close:focus-visible,
#mtchat-root .mtchat-human:focus-visible {
  outline: 2px solid var(--mtchat-primary);
  outline-offset: 2px;
}

/* Le journal est collé aux bords du panneau : son anneau rentre à l'intérieur
   plutôt que d'être rogné par `overflow: hidden`. */
#mtchat-root .mtchat-log:focus-visible {
  outline-offset: -2px;
}

/* Le champ n'a pas d'anneau propre : c'est la **carte** qui s'allume, comme un
   champ de formulaire de la charte §9.9. L'anneau natif du textarea est retiré
   et remplacé au niveau du parent, sans quoi deux anneaux concentriques se
   superposeraient. */
#mtchat-root .mtchat-input:focus-visible {
  outline: none;
}

#mtchat-root .mtchat-composer:focus-within {
  border-color: var(--mtchat-primary);
  box-shadow: var(--mtchat-ring);
}

/* Anneau intérieur dans la couleur de contraste garantie pour ce qui est
   rempli en `--mtchat-primary` : un anneau primaire y serait invisible. */
#mtchat-root .mtchat-bubble:focus-visible,
#mtchat-root .mtchat-send:focus-visible,
#mtchat-root .mtchat-action-rdv:focus-visible {
  outline: 2px solid var(--mtchat-on-primary, #ffffff);
  outline-offset: -4px;
}


/* 10. Classes d'état posées sur `#mtchat-root` (§3.1) */

/* Les deux variants sont déclarés explicitement, y compris celui qui coïncide
   avec les règles de base : une classe de position qui ne fait rien est une
   classe qu'on casse sans s'en apercevoir le jour où la base change. */
#mtchat-root.mtchat-pos-bottom-right .mtchat-bubble,
#mtchat-root.mtchat-pos-bottom-right .mtchat-panel {
  right: 24px;
  left: auto;
}

#mtchat-root.mtchat-pos-bottom-left .mtchat-bubble,
#mtchat-root.mtchat-pos-bottom-left .mtchat-panel {
  right: auto;
  left: 24px;
}

#mtchat-root.mtchat-pos-bottom-left .mtchat-panel {
  transform-origin: bottom left;
}

/* Champ vide : le bouton d'envoi s'atténue sans être désactivé. Il reste dans
   l'ordre de tabulation, et l'activer affiche « Écrivez un message avant de
   l'envoyer » — un bouton `disabled` ne dirait rien et sortirait du clavier. */
#mtchat-root.mtchat-is-empty .mtchat-send {
  opacity: 0.4;
  cursor: not-allowed;
}

/* Requête en vol : le composeur s'efface, les points de frappe prennent le
   relais. H01 pose aussi `disabled` ; la règle vaut ceinture et bretelles. */
#mtchat-root.mtchat-is-sending .mtchat-composer,
#mtchat-root.mtchat-is-sending .mtchat-slots {
  opacity: 0.6;
}

#mtchat-root.mtchat-is-sending .mtchat-send {
  opacity: 0.4;
  pointer-events: none;
}

/* Plafond de budget ou refus définitif : le composeur ne sert plus, la porte
   de sortie humaine devient l'action principale de l'écran. */
#mtchat-root.mtchat-is-blocked .mtchat-composer,
#mtchat-root.mtchat-is-blocked .mtchat-consent,
#mtchat-root.mtchat-is-blocked .mtchat-slots {
  opacity: 0.45;
  pointer-events: none;
}

#mtchat-root.mtchat-is-blocked .mtchat-footer {
  padding: 12px 16px 16px;
}

#mtchat-root.mtchat-is-blocked .mtchat-human {
  display: block;
  padding: 12px 16px;
  border-radius: var(--mtchat-radius-button);
  background: var(--mtchat-primary);
  color: var(--mtchat-on-primary, #ffffff);
  font-size: 15px;
  font-weight: 500;
  text-decoration: none;
}

#mtchat-root.mtchat-is-blocked .mtchat-human:hover {
  background: var(--mtchat-primary-strong);
}


/* 11. Mode intégré */

#mtchat-root.mtchat-embed {
  position: static;
  z-index: auto;
  width: auto;
  height: auto;
}

#mtchat-root.mtchat-embed .mtchat-panel {
  position: static;
  width: 100%;
  height: var(--mtchat-embed-h, 560px);
  max-height: 80vh;
  box-shadow: none;
}

/* Le panneau intégré n'a pas de bulle d'où naître : il ne joue pas
   l'animation de continuité spatiale. Il apparaît avec la page. */
#mtchat-root.mtchat-embed.mtchat-is-open .mtchat-panel {
  animation: none;
}

/* LA COLONNE DE CONVERSATION
   Le panneau prend sa colonne de page, le contenu une colonne centrée de
   720 px : au-delà, une réponse devient illisible. La gouttière est
   **calculée** — `margin: auto` sur l'axe transversal d'un flex annulerait
   l'étirement, et le composeur se réduirait à son bouton. Elle sert de
   rembourrage aux uns, de marge aux autres ; l'en-tête garde son fond. */
#mtchat-root.mtchat-embed {
  --mtchat-embed-pad: 20px;
  --mtchat-embed-gut: max(
    var(--mtchat-embed-pad),
    calc((100% - var(--mtchat-embed-col, 720px)) / 2)
  );
}

#mtchat-root.mtchat-embed .mtchat-header,
#mtchat-root.mtchat-embed .mtchat-log,
#mtchat-root.mtchat-embed .mtchat-suggestions,
#mtchat-root.mtchat-embed .mtchat-footer {
  padding-right: var(--mtchat-embed-gut);
  padding-left: var(--mtchat-embed-gut);
}

#mtchat-root.mtchat-embed .mtchat-notice,
#mtchat-root.mtchat-embed .mtchat-consent,
#mtchat-root.mtchat-embed .mtchat-composer {
  margin-right: var(--mtchat-embed-gut);
  margin-left: var(--mtchat-embed-gut);
}

#mtchat-root.mtchat-embed .mtchat-header {
  padding-top: 14px;
  padding-bottom: 14px;
}

/* Plus de place que dans la bulle : le journal respire. */
#mtchat-root.mtchat-embed .mtchat-log {
  padding-top: 24px;
  padding-bottom: 24px;
}

#mtchat-root.mtchat-embed .mtchat-notice,
#mtchat-root.mtchat-embed .mtchat-consent {
  margin-bottom: 12px;
}


/* 11 bis. Barre */

#mtchat-root.mtchat-bar:not(.mtchat-is-unfolded) .mtchat-log,
#mtchat-root.mtchat-bar:not(.mtchat-is-unfolded) .mtchat-footer {
  display: none;
}

/* Largeur du conteneur du site, `min(100%, 1140px)`, centrée : alignée sur le
   héros. Posée dans un conteneur qui s'ajuste à son contenu (Elementor), une
   largeur `auto` suivrait le texte — étroite au repos, pleine page dépliée. */
#mtchat-root.mtchat-bar {
  --mtchat-embed-pad: 32px;
  --mtchat-embed-col: 100%;
  width: 1140px;
  max-width: 100%;
  margin: 0 auto;
}

#mtchat-root.mtchat-bar .mtchat-panel {
  height: auto;
  max-height: none;
  padding: 28px 0;
  border: 0;
  background: var(--mtchat-primary-soft);
}

#mtchat-root.mtchat-bar .mtchat-header {
  min-height: 0;
  padding-top: 0;
  padding-bottom: 12px;
  border: 0;
  background: none;
}

#mtchat-root.mtchat-bar .mtchat-mark,
#mtchat-root.mtchat-bar .mtchat-avatar {
  display: none;
}

#mtchat-root.mtchat-bar .mtchat-disclosure {
  margin: 0;
  font-size: 12px;
  letter-spacing: 0.16em;
  white-space: normal;
}

#mtchat-root.mtchat-bar .mtchat-log {
  flex: none;
  max-height: var(--mtchat-embed-h, 560px);
  padding-top: 0;
  padding-bottom: 0;
}

/* L'écart avant le champ (20 + 4 px) naît du dernier message : un journal
   encore vide, case de consentement affichée, ne décale pas le champ. */
#mtchat-root.mtchat-bar .mtchat-log::after {
  content: "";
  flex: none;
  height: 4px;
}

/* Pleine largeur : la question devient un intertitre, la réponse un
   paragraphe, un filet sépare les échanges. */
#mtchat-root.mtchat-bar .mtchat-msg-bot {
  max-width: 720px;
  font-size: 16px;
  line-height: 1.65;
}

#mtchat-root.mtchat-bar .mtchat-msg-user {
  align-self: stretch;
  max-width: 720px;
  padding: 16px 0 0;
  border-top: 1px solid var(--mtchat-primary-line);
  border-radius: 0;
  background: none;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -0.01em;
}

#mtchat-root.mtchat-bar .mtchat-composer {
  align-items: center;
  min-height: 64px;
  padding: 8px 8px 8px 20px;
  border-color: var(--mtchat-primary-line);
  box-shadow: 0 8px 24px -12px rgba(22, 37, 92, 0.2);
}

#mtchat-root.mtchat-bar .mtchat-composer:focus-within {
  border-color: var(--mtchat-primary);
  box-shadow: 0 0 0 4px rgba(39, 102, 254, 0.18);
}

#mtchat-root.mtchat-bar .mtchat-input {
  font-size: 18px;
}

/* Le bouton d'envoi devient le CTA du site : libellé visible, flèche. */
#mtchat-root.mtchat-bar .mtchat-send {
  gap: 10px;
  width: auto;
  height: 48px;
  padding: 0 22px;
  border-radius: var(--mtchat-radius-button);
  font-size: 16px;
  font-weight: 500;
}

#mtchat-root.mtchat-bar .mtchat-notice {
  margin-top: 12px;
  margin-bottom: 0;
}

#mtchat-root.mtchat-bar .mtchat-consent {
  margin-top: 10px;
  margin-bottom: 0;
}

/* Deux liens sur une ligne, sans le retrait du bouton centré de la bulle. */
#mtchat-root.mtchat-bar .mtchat-reset:not([hidden]) {
  margin-left: 12px;
}

#mtchat-root.mtchat-bar .mtchat-footer {
  padding-top: 8px;
  padding-bottom: 0;
  text-align: left;
}

#mtchat-root.mtchat-bar .mtchat-human {
  padding-left: 0;
}


/* 12. Animations */

/* Continuité spatiale : le panneau naît du coin de la bulle. Une `animation`
   et non une `transition`, car l'élément passe de `display: none` à
   `display: flex` — une transition ne s'y déclencherait pas de façon fiable. */
@keyframes mtchat-panel-in {
  from {
    opacity: 0;
    transform: translateY(12px) scale(0.98);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

/* Sous 768 px le panneau occupe tout l'écran : une mise à l'échelle y lirait
   comme un défaut, il monte comme une feuille. */
@keyframes mtchat-sheet-in {
  from {
    opacity: 0;
    transform: translateY(24px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes mtchat-msg-in {
  from {
    opacity: 0;
    transform: translateY(6px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes mtchat-dot {
  0%,
  60%,
  100% {
    opacity: 0.35;
    transform: translateY(0);
  }

  30% {
    opacity: 1;
    transform: translateY(-3px);
  }
}

#mtchat-root.mtchat-is-open .mtchat-panel {
  animation: mtchat-panel-in 240ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

/* Seul le dernier message s'anime : le seul qui soit neuf, et cela évite de
   rejouer trente animations à la réouverture — le passage de `display: none`
   à `display: flex` relance sinon toutes les animations des descendants. */
#mtchat-root .mtchat-msg:last-of-type {
  animation: mtchat-msg-in 240ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

/* Flux : ni la bulle provisoire ni sa version finale ne rejouent l'entrée, et
   le texte brut garde ses sauts de ligne en attendant ses paragraphes. */
#mtchat-root .mtchat-msg.mtchat-live {
  animation: none;
}

#mtchat-root .mtchat-live .mtchat-msg-text {
  white-space: pre-wrap;
}


/* 13. Adaptatif */

@media (max-width: 767px) {
  /* `inset: 0` puis `height: 100dvh` : `100%` sert de repli aux navigateurs
     sans unité dynamique, `100dvh` empêche le panneau de passer sous la barre
     d'adresse mobile. La surcontrainte haut/bas/hauteur est volontaire, la
     hauteur l'emporte. */
  #mtchat-root .mtchat-panel {
    inset: 0;
    width: 100%;
    height: 100%;
    height: 100dvh;
    max-height: none;
    border: 0;
    border-radius: 0;
    transform-origin: center bottom;
  }

  /* Les variants de position pèsent 1-2-0 : il faut les contrer
     explicitement, sinon le panneau plein écran resterait décalé de 24 px. */
  #mtchat-root.mtchat-pos-bottom-right .mtchat-panel,
  #mtchat-root.mtchat-pos-bottom-left .mtchat-panel {
    right: 0;
    left: 0;
    transform-origin: center bottom;
  }

  #mtchat-root.mtchat-is-open .mtchat-panel {
    animation: mtchat-sheet-in 240ms cubic-bezier(0.16, 1, 0.3, 1) both;
  }

  /* Cible tactile de 44 px pour la fermeture (charte §12.9). */
  #mtchat-root .mtchat-close {
    width: 44px;
    height: 44px;
  }

  #mtchat-root .mtchat-bubble {
    right: 16px;
    bottom: 16px;
  }

  #mtchat-root.mtchat-pos-bottom-right .mtchat-bubble {
    right: 16px;
    left: auto;
  }

  #mtchat-root.mtchat-pos-bottom-left .mtchat-bubble {
    right: auto;
    left: 16px;
  }

  #mtchat-root .mtchat-msg-user {
    max-width: 92%;
  }

  /* Le chat intégré reste un bloc de la page. Il rétrécit ses gouttières et sa
     hauteur, il ne se détache pas. `70dvh` plutôt qu'une hauteur fixe : sur un
     téléphone, un bloc de 560 px condamnerait le reste de la page. */
  #mtchat-root.mtchat-embed .mtchat-panel {
    inset: auto;
    height: var(--mtchat-embed-h, 560px);
    max-height: 70dvh;
    border: 1px solid var(--mtchat-border);
    border-radius: var(--mtchat-radius);
  }

  /* Une seule valeur à changer : la gouttière de la §11 en dérive, et les six
     blocs de la colonne se resserrent ensemble. Les resserrer un par un
     laisserait tôt ou tard le composeur désaligné du texte qu'il continue. */
  #mtchat-root.mtchat-embed {
    --mtchat-embed-pad: 16px;
  }

  #mtchat-root.mtchat-embed .mtchat-log {
    padding-top: 16px;
    padding-bottom: 16px;
  }

  /* Barre : mêmes reprises que la §11 bis, à l'échelle du téléphone. Le CTA
     n'y garde que sa flèche, le champ a besoin de la largeur. */
  #mtchat-root.mtchat-bar {
    --mtchat-embed-pad: 20px;
  }

  #mtchat-root.mtchat-bar .mtchat-panel {
    height: auto;
    max-height: none;
    padding: 24px 0;
    border: 0;
  }

  #mtchat-root.mtchat-bar .mtchat-log {
    padding-top: 0;
  }

  #mtchat-root.mtchat-bar .mtchat-disclosure {
    font-size: 11px;
    letter-spacing: 0.1em;
  }

  #mtchat-root.mtchat-bar .mtchat-msg-user {
    font-size: 17px;
  }

  #mtchat-root.mtchat-bar .mtchat-composer {
    padding-left: 16px;
  }

  /* Deux lignes d'emblée : une invite passe à la ligne, et le champ ne
     change pas de hauteur d'une invite ou d'une frappe à l'autre. */
  #mtchat-root.mtchat-bar .mtchat-input {
    min-height: 66px;
  }

  #mtchat-root.mtchat-bar .mtchat-send {
    width: 44px;
    height: 44px;
    padding: 0;
    font-size: 0;
  }
}


/* Fermeture temporaire : le message et la commande de réouverture restent visibles. */
#mtchat-root.mtchat-is-maintenance .mtchat-log,
#mtchat-root.mtchat-is-maintenance .mtchat-composer,
#mtchat-root.mtchat-is-maintenance .mtchat-consent,
#mtchat-root.mtchat-is-maintenance .mtchat-suggestions:not([hidden]),
#mtchat-root.mtchat-is-maintenance .mtchat-human,
#mtchat-root.mtchat-is-maintenance .mtchat-reset:not([hidden]),
#mtchat-root.mtchat-is-maintenance .mtchat-live-banner {
  display: none;
}

#mtchat-root.mtchat-is-maintenance .mtchat-notice {
  max-height: 50vh;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

/* 14. Pas de mode sombre */

#mtchat-root .mtchat-panel,
#mtchat-root .mtchat-bubble {
  color-scheme: light;
}


/* 15. Mouvement réduit */

@media (prefers-reduced-motion: reduce) {
  #mtchat-root .mtchat-confetti {
    display: none;
  }

  #mtchat-root .mtchat-booked-celebrating .mtchat-booked-check,
  #mtchat-root .mtchat-confetti-piece {
    animation: none;
  }

  #mtchat-root .mtchat-log {
    scroll-behavior: auto;
  }

  #mtchat-root .mtchat-bubble,
  #mtchat-root .mtchat-bubble:hover,
  #mtchat-root .mtchat-bubble:active,
  #mtchat-root.mtchat-is-open .mtchat-panel,
  #mtchat-root .mtchat-msg:last-of-type,
  #mtchat-root .mtchat-dot,
  #mtchat-root .mtchat-suggestion,
  #mtchat-root .mtchat-suggestion:hover,
  #mtchat-root .mtchat-suggestion:active,
  #mtchat-root .mtchat-citation-link,
  #mtchat-root .mtchat-citation-link:hover,
  #mtchat-root .mtchat-send,
  #mtchat-root .mtchat-send:active,
  #mtchat-root .mtchat-close,
  #mtchat-root .mtchat-close:active,
  #mtchat-root .mtchat-composer,
  #mtchat-root .mtchat-action,
  #mtchat-root .mtchat-action:hover,
  #mtchat-root .mtchat-action:active {
    transition: none;
    animation: none;
    transform: none;
  }
}