#mbwcta-widget {
  position: fixed;
  z-index: 999999;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  opacity: 0;
  transition: opacity .35s ease, transform .35s ease;
}
#mbwcta-widget.bottom-right { right: 24px; bottom: 24px; }
#mbwcta-widget.bottom-left { left: 24px; bottom: 24px; }
#mbwcta-widget.is-trigger-hidden { visibility: hidden; pointer-events: none; }
#mbwcta-widget.is-visible { opacity: 1; visibility: visible; pointer-events: auto; }
#mbwcta-widget.mbwcta-entry-slide-up:not(.is-visible) { transform: translateY(36px); }
#mbwcta-widget.mbwcta-entry-scale-in:not(.is-visible) { transform: scale(.72); }
#mbwcta-widget button {
  box-sizing: border-box;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-style: normal;
  text-transform: none;
  letter-spacing: normal;
  -webkit-appearance: none;
  appearance: none;
}

.mbwcta-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  max-width: calc(100vw - 48px);
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: var(--mbwcta-text, #fff);
  background: var(--mbwcta-primary, #25d366);
  box-shadow: 0 4px 16px rgba(0,0,0,.22);
  cursor: pointer;
  overflow: hidden;
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  transition: width .25s ease, padding .25s ease, border-radius .25s ease, transform .2s ease, box-shadow .2s ease;
}
.mbwcta-btn.rounded-square { border-radius: 14px; }
.mbwcta-btn.has-label { width: auto; padding: 0 22px; border-radius: 999px; gap: 10px; }
.mbwcta-btn:hover { transform: scale(1.05); box-shadow: 0 6px 24px rgba(0,0,0,.28); }
.mbwcta-btn:focus-visible,
.mbwcta-dialog-close:focus-visible,
.mbwcta-dialog-btn:focus-visible,
.mbwcta-inline-btn:focus-visible { outline: 3px solid #2271b1; outline-offset: 3px; }
.mbwcta-btn.pulse { animation: mbwcta-pulse 2s infinite; }
.mbwcta-btn.bounce { animation: mbwcta-bounce .65s alternate infinite; }
.mbwcta-icon { width: 28px; height: 28px; flex: 0 0 28px; }
.mbwcta-label {
  margin: 0;
  max-width: min(520px, calc(100vw - 130px));
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font: inherit;
  text-transform: none;
  letter-spacing: normal;
  opacity: 1;
  transition: max-width .25s ease, margin .25s ease, opacity .18s ease;
}
#mbwcta-widget.is-open .mbwcta-btn.has-label { width: 60px; padding: 0; border-radius: 50%; gap: 0; }
#mbwcta-widget.is-open .mbwcta-label { max-width: 0; margin-left: 0; opacity: 0; }

.mbwcta-dialog {
  position: absolute;
  bottom: 76px;
  width: min(var(--mbwcta-dialog-width, 480px), calc(100vw - 48px));
  max-height: 78vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 10px 44px rgba(0,0,0,.24);
  opacity: 1;
  transform: translateY(0) scale(1);
  transform-origin: bottom;
  transition: opacity .2s ease, transform .2s ease;
}
.bottom-right .mbwcta-dialog { right: 0; }
.bottom-left .mbwcta-dialog { left: 0; }
.mbwcta-dialog.hidden { opacity: 0; transform: translateY(8px) scale(.96); pointer-events: none; visibility: hidden; }
.mbwcta-dialog-header { display: flex; align-items: center; gap: 10px; padding: 14px 16px; }
.mbwcta-avatar-wrap { position: relative; flex: 0 0 auto; }
.mbwcta-avatar { display: block; width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.mbwcta-online-dot { position: absolute; right: 0; bottom: 0; width: 12px; height: 12px; border: 2px solid #fff; border-radius: 50%; background: #25d366; }
.mbwcta-agent-copy { min-width: 0; }
.mbwcta-name { font-size: 16px; font-weight: 700; line-height: 1.25; }
.mbwcta-agent-role { font-size: 13px; opacity: .78; }
.mbwcta-status, .mbwcta-offline { display: flex; align-items: center; gap: 6px; margin-top: 2px; font-size: 12px; opacity: .82; }
.mbwcta-status-dot { width: 7px; height: 7px; border-radius: 50%; background: #25d366; }
.mbwcta-dialog-close { margin-left: auto; padding: 4px 8px; border: 0; color: inherit; background: transparent; font-size: 28px; line-height: 1; cursor: pointer; }
.mbwcta-dialog-body { flex: 1 1 auto; overflow-y: auto; padding: 16px; color: #3c434a; }
.mbwcta-dialog-bubble { max-width: 88%; padding: 12px 14px; border-radius: 12px 12px 12px 3px; background: rgba(255,255,255,.78); font-size: 14px; line-height: 1.45; }
.mbwcta-dialog-timestamp { margin: 5px 0 12px; color: #757575; font-size: 11px; }
.mbwcta-typing { display: flex; gap: 4px; width: fit-content; padding: 8px 12px; border-radius: 12px; background: rgba(255,255,255,.65); }
.mbwcta-typing span { width: 7px; height: 7px; border-radius: 50%; background: #8c8f94; animation: mbwcta-typing 1.2s infinite ease-in-out; }
.mbwcta-typing span:nth-child(2) { animation-delay: .15s; }
.mbwcta-typing span:nth-child(3) { animation-delay: .3s; }
.mbwcta-dialog-footer { padding: 12px 16px 16px; border-top: 1px solid #e2e4e7; }
.mbwcta-dialog-btn,
.mbwcta-inline-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  box-sizing: border-box;
  border-radius: 9px;
  color: var(--mbwcta-text, #fff);
  background: var(--mbwcta-primary, #25d366);
  font-weight: 700;
  text-decoration: none;
}
.mbwcta-dialog-btn { width: 100%; padding: 13px 18px; }
.mbwcta-inline-btn { padding: 12px 22px; }
.mbwcta-dialog-btn:hover,
.mbwcta-inline-btn:hover { color: var(--mbwcta-text, #fff); filter: brightness(1.06); }
.mbwcta-btn-icon { width: 20px; height: 20px; flex: 0 0 20px; }

.mbwcta-lead-form { margin-top: 14px; }
.mbwcta-lead-form > label:not(.mbwcta-consent) { display: block; margin-bottom: 10px; font-size: 12px; font-weight: 600; }
.mbwcta-lead-input { width: 100%; box-sizing: border-box; margin-top: 4px; padding: 10px 12px; border: 1px solid #c3c4c7; border-radius: 7px; background: #fff; }
.mbwcta-consent { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; line-height: 1.4; }
.mbwcta-consent input { margin-top: 3px; }
.mbwcta-honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; opacity: 0 !important; }
.mbwcta-form-error { min-height: 18px; margin-top: 8px; color: #b32d2e; font-size: 12px; }
.mbwcta-dialog-overlay { position: fixed; inset: 0; z-index: -1; background: rgba(0,0,0,.42); opacity: 0; visibility: hidden; transition: opacity .2s ease; }
.mbwcta-dialog-overlay.visible { opacity: 1; visibility: visible; }
.mbwcta-dialog-overlay.hidden { pointer-events: none; }

@keyframes mbwcta-pulse {
  0% { box-shadow: 0 0 0 0 rgba(37,211,102,.5); }
  70% { box-shadow: 0 0 0 13px rgba(37,211,102,0); }
  100% { box-shadow: 0 0 0 0 rgba(37,211,102,0); }
}
@keyframes mbwcta-bounce { from { transform: translateY(0); } to { transform: translateY(-4px); } }
@keyframes mbwcta-typing { 0%,80%,100% { transform: scale(.6); opacity: .4; } 40% { transform: scale(1); opacity: 1; } }


/* Button style presets */
.mbwcta-btn.pill { width: auto; padding: 12px 24px; border-radius: 50px; gap: 8px; }
.mbwcta-btn.square { border-radius: 12px; width: 52px; height: 52px; }
.mbwcta-btn.ghost { background: transparent !important; border: 2px solid currentColor; box-shadow: none; }
.mbwcta-btn.ghost:hover { background: rgba(255,255,255,.1); box-shadow: none; }
.mbwcta-btn.bubble { background: linear-gradient(135deg, #25D366 0%, #128C7E 100%) !important; box-shadow: 0 4px 20px rgba(37,211,102,.4); }

@media (max-width: 480px) {
  #mbwcta-widget.bottom-right { right: 16px; bottom: 16px; }
  #mbwcta-widget.bottom-left { left: 16px; bottom: 16px; }
  .mbwcta-btn { width: 52px; height: 52px; max-width: calc(100vw - 32px); font-size: 14px; }
  .mbwcta-btn.has-label { padding: 0 16px; }
  #mbwcta-widget.is-open .mbwcta-btn.has-label { width: 52px; }
  .mbwcta-icon { width: 24px; height: 24px; flex-basis: 24px; }
  .mbwcta-label { max-width: calc(100vw - 104px); font-size: 14px; }
  .mbwcta-dialog { bottom: 66px; width: min(var(--mbwcta-mobile-width, 360px), calc(100vw - 32px)); }
  .mbwcta-mobile-fullscreen { position: fixed; inset: 0; width: 100vw; max-height: 100vh; height: 100dvh; border-radius: 0; }
  .mbwcta-mobile-fullscreen.hidden { transform: translateY(16px); }
  body.mbwcta-dialog-open { overflow: hidden; }
}

@media (prefers-reduced-motion: reduce) {
  #mbwcta-widget,
  .mbwcta-btn,
  .mbwcta-label,
  .mbwcta-dialog,
  .mbwcta-dialog-overlay { transition: none !important; animation: none !important; }
}
