.live-chat-fab {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 40;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px 10px 10px;
  border: 0;
  border-radius: 999px;
  background: linear-gradient(135deg, #18694f, #0f4a38);
  color: white;
  box-shadow: 0 12px 40px rgba(15, 74, 56, .45);
  cursor: pointer;
  transition: transform .2s, box-shadow .2s;
}
.live-chat-fab:hover { transform: translateY(-2px); box-shadow: 0 16px 48px rgba(15, 74, 56, .5); }
.live-chat-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--sun, #f1b83b);
  color: #1a1a1a;
  font-weight: 900;
  display: grid;
  place-items: center;
  font-size: 18px;
}
.live-chat-avatar.lg { width: 44px; height: 44px; font-size: 20px; }
.live-chat-fab-text { text-align: left; line-height: 1.2; }
.live-chat-fab-text strong { display: block; font-size: 14px; }
.live-chat-fab-text small { font-size: 11px; opacity: .85; font-weight: 600; }

.live-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #22c55e;
  border: 2px solid white;
  box-shadow: 0 0 0 0 rgba(34, 197, 94, .6);
  animation: livePulse 2s infinite;
  flex-shrink: 0;
}
.live-dot.sm { width: 8px; height: 8px; border-width: 1.5px; display: inline-block; vertical-align: middle; margin-right: 4px; }
.live-chat-fab .live-dot { position: absolute; top: 6px; right: 6px; }
.live-chat-fab { position: fixed; padding-right: 20px; }

@keyframes livePulse {
  0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, .55); }
  70% { box-shadow: 0 0 0 10px rgba(34, 197, 94, 0); }
  100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); }
}

.live-chat-panel {
  position: fixed;
  right: 18px;
  bottom: 88px;
  width: min(380px, calc(100vw - 24px));
  max-height: min(560px, calc(100svh - 120px));
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 24px 80px rgba(0,0,0,.2);
  z-index: 45;
  display: none;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #e5ebe7;
}
.live-chat-panel.open { display: flex; }

.live-chat-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  background: linear-gradient(135deg, #18694f, #145c46);
  color: white;
}
.live-chat-header-info { display: flex; align-items: center; gap: 12px; }
.live-chat-header strong { display: block; font-size: 16px; }
.live-status { font-size: 11px; opacity: .9; font-weight: 600; }
.live-chat-close {
  border: 0;
  background: rgba(255,255,255,.15);
  color: white;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  font-size: 22px;
  cursor: pointer;
}

.live-chat-body {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  background: #f4f7f5;
  min-height: 200px;
}
.live-chat-bubble {
  max-width: 88%;
  padding: 10px 14px;
  border-radius: 14px;
  font-size: 14px;
  line-height: 1.5;
}
.live-chat-bubble.them {
  align-self: flex-start;
  background: white;
  border: 1px solid #e5ebe7;
  border-bottom-left-radius: 4px;
}
.live-chat-bubble.me {
  align-self: flex-end;
  background: #18694f;
  color: white;
  border-bottom-right-radius: 4px;
}
.live-chat-bubble.typing { opacity: .6; font-style: italic; }

.live-chat-compose {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  padding: 12px;
  border-top: 1px solid #e5ebe7;
  background: white;
}
.live-chat-compose input {
  border: 1px solid #dde5e0;
  border-radius: 999px;
  padding: 12px 16px;
  min-height: auto;
}
.live-chat-compose button {
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: #18694f;
  color: white;
  cursor: pointer;
  display: grid;
  place-items: center;
}

@media (max-width: 840px) {
  .live-chat-fab { bottom: 72px; right: 12px; }
  .live-chat-panel { bottom: 130px; right: 12px; }
  .live-chat-fab-text { display: none; }
}
