.messages {
  display: grid !important;
  gap: 28px !important;
  row-gap: 28px !important;
}

.messages > .message {
  margin: 0 !important;
}

.messages > .message + .message {
  margin-top: 0 !important;
}

.messages::after {
  display: none !important;
  height: 0 !important;
}

.composer-wrap,
.welcome.started .composer-wrap {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: 100% !important;
  margin: 28px 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

/* La séparation visuelle entre le chat et l'annuaire est portée par
 * la section annuaire elle-même. Elle reste donc identique même lorsque
 * le composer est déplacé dynamiquement à la fin de la conversation. */
.homepage-welcome > .homepage-composer-wrap {
  margin: 28px 0 0 !important;
}

.homepage-welcome > .public-network {
  padding-top: 180px !important;
}

.conversation {
  padding-bottom: 80px;
}

#commonProblemSuggestions,
#deviceModelSuggestions {
  margin-top: 4px !important;
  margin-bottom: 0 !important;
}

/* Réponses rapides pour les questions binaires. */
.binary-quick-replies {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-self: start;
  margin-top: -14px;
}

.binary-quick-reply {
  appearance: none;
  min-width: 82px;
  padding: 10px 18px;
  border: 1px solid #168577;
  border-radius: 999px;
  background: #fff;
  color: #116c61;
  font: inherit;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.2;
  cursor: pointer;
  transition: background .16s ease, color .16s ease, transform .16s ease;
}

.binary-quick-reply:hover,
.binary-quick-reply:focus-visible {
  background: #168577;
  color: #fff;
  outline: none;
}

.binary-quick-reply:active {
  transform: translateY(1px);
}

.binary-quick-reply-other {
  border-color: #cbd7d3;
  color: #66736f;
}

.binary-quick-reply-other:hover,
.binary-quick-reply-other:focus-visible {
  border-color: #168577;
}

/* Marqueur réparateur FIXETEL : T blanc + pulsation douce. */
.nearby-pro-point-wrap {
  overflow: visible !important;
  background: transparent !important;
  border: 0 !important;
}

.nearby-pro-point {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  width: 24px !important;
  height: 24px !important;
  transform: translate(-50%, -50%) !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 50% !important;
  background: #168577 !important;
  border: 2px solid #fff !important;
  box-sizing: border-box !important;
  box-shadow: 0 3px 10px rgba(13, 81, 71, .28) !important;
  color: #fff !important;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  text-align: center !important;
  isolation: isolate !important;
}

.nearby-pro-point::before {
  content: "T" !important;
  position: relative !important;
  z-index: 2 !important;
  transform: translateY(-.25px) !important;
}

.nearby-pro-point::after {
  content: "" !important;
  position: absolute !important;
  inset: -2px !important;
  z-index: -1 !important;
  border-radius: 50% !important;
  background: rgba(22, 133, 119, .38) !important;
  animation: telephonia-heartbeat 1.8s ease-out infinite !important;
  pointer-events: none !important;
}

@keyframes telephonia-heartbeat {
  0% { transform: scale(.9); opacity: .72; }
  35% { transform: scale(1.5); opacity: .22; }
  58% { transform: scale(1.72); opacity: 0; }
  100% { transform: scale(1.72); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .nearby-pro-point::after {
    animation: none !important;
    opacity: .2 !important;
    transform: scale(1.28) !important;
  }
}

/* Carte compacte de reconnaissance téléphone */
.device-message-compact {
  width: min(100%, 620px) !important;
  max-width: 620px !important;
  justify-self: start !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.device-message-compact > .message-label {
  margin-bottom: 8px !important;
}

.device-card-compact {
  display: grid !important;
  grid-template-columns: 118px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 18px !important;
  width: 100% !important;
  padding: 18px !important;
  border: 1px solid #dfe8e4 !important;
  border-radius: 22px !important;
  background: #fff !important;
  box-shadow: 0 8px 28px rgba(21, 52, 47, .06) !important;
}

.device-card-visual {
  width: 118px !important;
  height: 136px !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  border-radius: 18px !important;
  background: #f6f8f7 !important;
}

.device-photo-compact {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
}

.device-photo-fallback {
  font-size: 44px !important;
  line-height: 1 !important;
}

.device-photo-fallback[hidden] {
  display: none !important;
}

.device-card-details-compact {
  min-width: 0 !important;
}

.device-card-details-compact .device-confirmation {
  margin: 0 0 5px !important;
  color: #167d70 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: .02em !important;
}

.device-card-details-compact h2 {
  margin: 0 !important;
  font-size: clamp(24px, 3vw, 34px) !important;
  line-height: 1.08 !important;
  letter-spacing: -.025em !important;
}

.device-quick-facts {
  margin: 12px 0 0 !important;
  color: #64716e !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}

@media (max-width: 760px) {
  .messages {
    gap: 22px !important;
    row-gap: 22px !important;
  }

  .composer-wrap,
  .welcome.started .composer-wrap {
    left: auto !important;
    margin-top: 22px !important;
    padding: 0 !important;
  }

  .homepage-welcome > .homepage-composer-wrap {
    margin: 22px 0 0 !important;
  }

  .homepage-welcome > .public-network {
    padding-top: 108px !important;
  }

  .conversation {
    padding-bottom: 52px;
  }

  .binary-quick-replies {
    gap: 8px;
    margin-top: -10px;
  }

  .binary-quick-reply {
    min-width: 72px;
    padding: 9px 14px;
    font-size: 14px;
  }

  .device-message-compact {
    width: 100% !important;
    max-width: none !important;
  }

  .device-card-compact {
    grid-template-columns: 84px minmax(0, 1fr) !important;
    gap: 14px !important;
    padding: 14px !important;
    border-radius: 18px !important;
  }

  .device-card-visual {
    width: 84px !important;
    height: 106px !important;
    border-radius: 14px !important;
  }

  .device-card-details-compact h2 {
    font-size: 24px !important;
  }

  .device-quick-facts {
    margin-top: 8px !important;
    font-size: 12px !important;
  }
}
