/* Localsewa v32.8.54 — booking chat viewport, scroll, and outgoing bubble polish */

.ls-booking-chat-overlay {
  align-items: center !important;
  padding: max(12px, env(safe-area-inset-top)) 12px max(12px, env(safe-area-inset-bottom)) !important;
}

.ls-booking-chat-panel {
  width: min(calc(100% - 8px), 34rem) !important;
  height: min(80dvh, 720px) !important;
  max-height: 80dvh !important;
  min-height: 0 !important;
  overflow: hidden !important;
  border-radius: 26px !important;
  display: flex !important;
  flex-direction: column !important;
}

.ls-booking-chat-header,
.ls-booking-chat-composer {
  flex: 0 0 auto !important;
  position: relative;
  z-index: 3;
}

.ls-booking-chat-timeline {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: auto !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior-y: contain !important;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  scrollbar-gutter: stable;
  scroll-behavior: smooth;
  position: relative;
  z-index: 1;
}

/* Current viewer's messages must always be visually distinct. */
.ls-chat-message--mine {
  background: #128447 !important;
  color: #ffffff !important;
  border-color: transparent !important;
  box-shadow: 0 5px 18px rgba(18, 132, 71, 0.18) !important;
}

.ls-chat-message--mine p:first-child {
  color: #ffffff !important;
}

.ls-chat-message--mine p:last-child {
  color: rgba(255, 255, 255, 0.72) !important;
}

.ls-chat-message--theirs {
  background: #ffffff !important;
  color: #263c31 !important;
}

/* Keep call-history cards fully inside the chat viewport. */
.ls-chat-call-event {
  max-width: calc(100% - 8px) !important;
  box-sizing: border-box;
}

@media (max-width: 639.98px) {
  .ls-booking-chat-overlay {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .ls-booking-chat-panel {
    width: 100% !important;
    height: 80dvh !important;
    max-height: 80dvh !important;
    border-radius: 24px !important;
  }

  .ls-booking-chat-timeline {
    padding-bottom: 14px !important;
  }
}

@media (max-height: 640px) {
  .ls-booking-chat-panel {
    height: 82dvh !important;
    max-height: 82dvh !important;
  }
}