.zem-floating-chat-root,
.zem-floating-chat {
  --zem-chat-primary: #00b7ff;
  --zem-chat-accent: #ff5a00;
  --zem-chat-deep: #0a1f3d;
  --zem-chat-bg: #07111f;
  position: fixed !important;
  right: 24px !important;
  bottom: 24px !important;
  left: auto !important;
  z-index: 2147483000 !important;
  overflow: visible !important;
  color: #fff;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.45;
  pointer-events: auto !important;
  isolation: isolate;
}

.zem-floating-chat-root *,
.zem-floating-chat * { box-sizing: border-box; }
.zem-floating-chat--bottom-left { right: auto !important; left: 24px !important; }

.zem-floating-chat-toggle,
.zem-floating-chat-launcher {
  position: relative !important;
  z-index: 2147483646 !important;
  display: flex !important;
  align-items: center;
  gap: 10px;
  min-width: 64px;
  min-height: 64px;
  margin: 0 !important;
  padding: 9px 18px 9px 9px;
  border: 2px solid rgba(255, 255, 255, .22) !important;
  border-radius: 999px !important;
  outline: none;
  background: #00b7ff !important;
  color: #fff !important;
  font: 700 14px/1 inherit;
  letter-spacing: .01em;
  cursor: pointer !important;
  pointer-events: auto !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  box-shadow: 0 18px 50px rgba(0, 183, 255, .35), 0 0 0 5px rgba(0, 183, 255, .1) !important;
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateZ(0);
  transition: transform .22s ease, box-shadow .22s ease, filter .22s ease;
}

.zem-floating-chat-toggle:hover,
.zem-floating-chat-toggle:focus-visible,
.zem-floating-chat-launcher:hover,
.zem-floating-chat-launcher:focus-visible {
  filter: brightness(1.08);
  transform: translateY(-2px) translateZ(0);
  box-shadow: 0 20px 54px rgba(0, 183, 255, .48), 0 0 28px rgba(0, 183, 255, .24) !important;
}

.zem-floating-chat-root.has-new-reply .zem-floating-chat-toggle,
.zem-floating-chat-root.has-unread-admin-reply .zem-floating-chat-toggle,
.zem-floating-chat.has-new-reply .zem-floating-chat-launcher {
  background: #ff5a00 !important;
  box-shadow: 0 0 0 8px rgba(255, 90, 0, .18), 0 18px 55px rgba(255, 90, 0, .45) !important;
  animation: zemChatPulseOrange 1.6s infinite;
}

@keyframes zemChatPulseOrange {
  0%, 100% { transform: translateZ(0) scale(1); filter: brightness(1); }
  50% { transform: translateZ(0) scale(1.045); filter: brightness(1.1); }
}

.zem-floating-chat-launcher-icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  flex: 0 0 44px;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 50%;
  background: #07111f;
}

.zem-floating-chat-launcher svg {
  width: 25px;
  height: 25px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.zem-floating-chat-launcher em,
.zem-chat-badge,
.zem-floating-chat-badge {
  position: absolute;
  top: -6px;
  right: -4px;
  display: grid;
  place-items: center;
  min-width: 24px;
  height: 24px;
  padding: 0 6px;
  border: 2px solid #07111f;
  border-radius: 99px;
  background: #ff5a00;
  color: #fff;
  font-size: 11px;
  font-style: normal;
}

.zem-floating-chat-panel {
  position: fixed !important;
  right: 24px !important;
  bottom: 104px !important;
  left: auto !important;
  z-index: 2147483645 !important;
  display: flex !important;
  flex-direction: column;
  width: min(420px, calc(100vw - 32px)) !important;
  max-width: calc(100vw - 32px) !important;
  max-height: min(720px, calc(100vh - 140px)) !important;
  overflow: hidden !important;
  border: 1px solid rgba(0, 183, 255, .48) !important;
  border-radius: 22px !important;
  background: linear-gradient(180deg, #091a30 0%, #07111f 100%) !important;
  color: #fff !important;
  box-shadow: 0 30px 90px rgba(0, 0, 0, .68), 0 0 40px rgba(0, 183, 255, .18) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateY(18px) scale(.96) translateZ(0) !important;
  transform-origin: bottom right;
  transition: opacity .22s ease, transform .22s ease, visibility .22s ease;
}

.zem-floating-chat--bottom-left .zem-floating-chat-panel {
  right: auto !important;
  left: 24px !important;
  transform-origin: bottom left;
}

.zem-floating-chat-root.is-open .zem-floating-chat-panel,
.zem-floating-chat.is-open .zem-floating-chat-panel,
.zem-floating-chat-panel.is-open {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateY(0) scale(1) translateZ(0) !important;
}

.zem-floating-chat-panel[hidden],
.zem-floating-chat [hidden]:not(.zem-floating-chat-panel) { display: none !important; }

.zem-floating-chat-header {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 72px;
  padding: 12px 13px;
  border-bottom: 1px solid rgba(229, 231, 235, .13);
  background: linear-gradient(110deg, #0a1f3d 0%, #07315d 72%, #132238 100%);
}

.zem-floating-chat-header > img {
  width: 48px;
  height: 48px;
  object-fit: contain;
  border: 1px solid rgba(0, 183, 255, .35);
  border-radius: 14px;
  background: #06101e;
}

.zem-floating-chat-header > div { flex: 1; min-width: 0; }
.zem-floating-chat-header strong { display: block; color: #fff; font-size: 16px; }
.zem-floating-chat-status { display: flex; align-items: center; gap: 6px; margin-top: 3px; color: #b9c7d8; font-size: 11px; }
.zem-floating-chat-status i { width: 7px; height: 7px; border-radius: 50%; background: #58d22e; box-shadow: 0 0 10px rgba(88, 210, 46, .8); }

.zem-floating-chat-header button {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, .14);
  border-radius: 9px;
  background: rgba(255, 255, 255, .06);
  color: #e5e7eb;
  font: 500 20px/1 inherit;
  cursor: pointer;
  pointer-events: auto;
  touch-action: manipulation;
}

.zem-floating-chat-header button:hover,
.zem-floating-chat-header button:focus-visible { border-color: rgba(0, 183, 255, .5); background: rgba(0, 183, 255, .16); }

.zem-floating-chat-body {
  flex: 1 1 auto;
  max-height: calc(min(720px, calc(100vh - 140px)) - 112px);
  overflow: auto;
  padding: 14px;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: #184675 #07111f;
}

.zem-floating-chat-welcome { padding: 0 0 12px; }
.zem-floating-chat-banner { position: relative; overflow: hidden; margin-bottom: 13px; border: 1px solid rgba(0, 183, 255, .62); border-radius: 15px; background: #0a1f3d; box-shadow: 0 10px 25px rgba(0, 0, 0, .3); }
.zem-floating-chat-banner > img { display: block; width: 100%; height: auto; aspect-ratio: 430/286; object-fit: contain; background: #07111f; }
.zem-floating-chat-banner-fallback { display: flex; align-items: center; justify-content: center; gap: 12px; min-height: 124px; padding: 20px; color: #fff; text-transform: uppercase; letter-spacing: .08em; }
.zem-floating-chat-banner-fallback img { width: 58px; height: 58px; object-fit: contain; }
.zem-floating-chat-welcome h2 { margin: 0 0 6px; color: #fff; font-size: 17px; }
.zem-floating-chat-welcome p { margin: 0; color: #bdcad9; font-size: 12.5px; line-height: 1.55; }

.zem-floating-chat-quote-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  margin-top: 12px;
  padding: 11px 14px;
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 11px;
  background: linear-gradient(90deg, #00b7ff 0%, #007bff 50%, #ff5a00 100%);
  color: #fff !important;
  text-decoration: none !important;
  font-size: 13px;
  font-weight: 800;
  pointer-events: auto;
  box-shadow: 0 9px 22px rgba(0, 123, 255, .28);
  transition: filter .2s ease, box-shadow .2s ease, transform .2s ease;
}

.zem-floating-chat-quote-button:hover { filter: brightness(1.12); box-shadow: 0 10px 28px rgba(0, 183, 255, .38); transform: translateY(-1px); }
.zem-floating-chat-thread { display: flex; flex-direction: column; gap: 9px; margin: 2px 0 12px; }
.zem-floating-chat-bubble { max-width: 85%; padding: 9px 11px; border: 1px solid rgba(229, 231, 235, .12); border-radius: 13px; background: #10263f; color: #e5e7eb; font-size: 12.5px; }
.zem-floating-chat-bubble.is-visitor { align-self: flex-end; border-color: rgba(0, 183, 255, .3); background: linear-gradient(135deg, #087bd0, #0059a9); }
.zem-floating-chat-bubble.is-representative { align-self: flex-start; }
.zem-floating-chat-bubble span { display: block; margin-top: 4px; color: #8da4ba; font-size: 9px; }
.zem-floating-chat-success-message { margin: 0 0 12px; padding: 12px; border: 1px solid rgba(61, 205, 75, .28); border-radius: 12px; background: rgba(27, 117, 51, .13); }
.zem-floating-chat-success-message strong { font-size: 13px; }
.zem-floating-chat-success-message p { margin: 5px 0 0; color: #c2d0de; font-size: 12px; }

.zem-floating-chat-form { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; padding-top: 12px; border-top: 1px solid rgba(229, 231, 235, .11); }
.zem-floating-chat-form label,
.zem-chat-field-label { color: #c7d2df; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; }
.zem-floating-chat-form label { display: grid; gap: 4px; }
.zem-floating-chat-form label span,
.zem-chat-field-label { padding-left: 2px; }
.zem-floating-chat-form input,
.zem-floating-chat-form select,
.zem-floating-chat-form textarea { width: 100%; min-height: 39px; margin: 0; padding: 8px 10px; border: 1px solid #28425d; border-radius: 9px; outline: none; background: #091827; color: #fff; font: 400 13px/1.35 inherit; box-shadow: none; pointer-events: auto; }
.zem-floating-chat-form input:focus,
.zem-floating-chat-form select:focus,
.zem-floating-chat-form textarea:focus { border-color: var(--zem-chat-primary); box-shadow: 0 0 0 3px rgba(0, 183, 255, .12); }
.zem-floating-chat-service-select,
.zem-floating-chat-message,
.zem-floating-chat-send,
.zem-floating-chat-form-status { grid-column: 1/-1; }
.zem-floating-chat-service-select {
  position: relative !important;
  z-index: 20 !important;
  display: grid !important;
  gap: 4px;
  pointer-events: auto !important;
}

.zem-chat-custom-select-trigger {
  position: relative;
  z-index: 21;
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100% !important;
  min-height: 52px !important;
  margin: 0 !important;
  padding: 0 14px 0 16px !important;
  border: 1px solid rgba(0, 183, 255, .35) !important;
  border-radius: 14px !important;
  background: #07111f !important;
  color: #ffffff !important;
  font: 700 14px/1.25 inherit !important;
  text-align: left !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  pointer-events: auto !important;
  cursor: pointer !important;
  touch-action: manipulation;
  box-shadow: none !important;
}

.zem-chat-custom-select-trigger svg {
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  fill: none;
  stroke: #00b7ff;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform .18s ease;
}

.zem-chat-custom-select-trigger:hover,
.zem-chat-custom-select-trigger:focus-visible,
.zem-chat-custom-select.is-open .zem-chat-custom-select-trigger {
  border-color: #00b7ff !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(0, 183, 255, .18) !important;
}

.zem-chat-custom-select.is-open .zem-chat-custom-select-trigger svg { transform: rotate(180deg); }

.zem-chat-custom-select-menu {
  position: absolute !important;
  z-index: 1000002 !important;
  top: calc(100% + 8px);
  right: 0;
  left: 0;
  display: grid;
  max-height: 240px;
  overflow: auto;
  padding: 6px;
  border: 1px solid rgba(0, 183, 255, .42);
  border-radius: 16px;
  background: #07111f !important;
  box-shadow: 0 18px 45px rgba(0, 0, 0, .55), 0 0 24px rgba(0, 183, 255, .12);
  scrollbar-width: thin;
  scrollbar-color: #1e6fa8 #07111f;
}

.zem-chat-custom-select-menu[hidden] { display: none !important; }

.zem-chat-custom-select-menu button {
  width: 100%;
  min-height: 42px;
  margin: 0;
  padding: 11px 12px;
  border: 0;
  border-radius: 10px;
  background: #07111f !important;
  color: #ffffff !important;
  font: 600 13px/1.3 inherit;
  text-align: left;
  cursor: pointer;
}

.zem-chat-custom-select-menu button:hover,
.zem-chat-custom-select-menu button:focus-visible,
.zem-chat-custom-select-menu button.is-selected {
  outline: none;
  background: linear-gradient(90deg, rgba(0, 183, 255, .24), rgba(255, 90, 0, .12)) !important;
  color: #ffffff !important;
}
.zem-floating-chat-message { position: relative; }
.zem-floating-chat-message textarea { min-height: 72px; resize: vertical; }
.zem-floating-chat-message small { position: absolute; right: 8px; bottom: 6px; color: #6f879e; font-size: 9px; }
.zem-floating-chat-honeypot { position: absolute !important; left: -99999px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }

.zem-floating-chat-send {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 56px;
  border: 0;
  border-radius: 16px;
  background: linear-gradient(90deg, #00b7ff 0%, #007bff 48%, #ff5a00 100%);
  color: #fff !important;
  font: 800 15px/1 inherit;
  cursor: pointer;
  pointer-events: auto;
  touch-action: manipulation;
  box-shadow: 0 16px 40px rgba(0, 183, 255, .25);
  transition: filter .2s ease, transform .2s ease, opacity .2s ease;
}

.zem-floating-chat-send:hover:not(:disabled),
.zem-floating-chat-send:focus-visible:not(:disabled) { filter: brightness(1.08); transform: translateY(-1px); }
.zem-floating-chat-send:disabled,
.zem-floating-chat-send.is-loading { opacity: .65; cursor: wait; transform: none; }
.zem-floating-chat-send.is-loading{opacity:1;background:linear-gradient(90deg,#ff8c1a,#ff5a00)!important}.zem-floating-chat-send.is-sent{background:linear-gradient(90deg,#22c55e,#15803d)!important;box-shadow:0 12px 34px rgba(34,197,94,.28)}.zem-floating-chat-send.is-error{background:linear-gradient(90deg,#ef4444,#991b1b)!important}
.zem-floating-chat-send svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.zem-floating-chat-form-status { min-height: 16px; margin: 0; color: #98acc0; font-size: 11px; text-align: center; }
.zem-floating-chat-form-status.is-error { color: #ff8a66; }
.zem-floating-chat-panel footer { padding: 8px 12px; border-top: 1px solid rgba(229, 231, 235, .1); color: #7890a7; font-size: 9.5px; text-align: center; }
.zem-floating-chat-panel footer span { margin-right: 4px; }
.zem-chat-sound-toggle{display:grid;place-items:center;width:38px;height:38px;margin-left:auto;padding:0;border:1px solid rgba(229,231,235,.24);border-radius:12px;background:rgba(255,255,255,.08);color:#fff;font-size:16px;line-height:1;cursor:pointer;pointer-events:auto;touch-action:manipulation;transition:all .2s ease}.zem-chat-sound-toggle:hover,.zem-chat-sound-toggle:focus-visible{border-color:rgba(0,183,255,.45);background:rgba(0,183,255,.18);outline:2px solid rgba(0,183,255,.2)}.zem-chat-sound-toggle.is-enabled{background:#00b7ff;color:#07111f;box-shadow:0 0 18px rgba(0,183,255,.35)}.zem-chat-sound-toggle .zem-chat-sound-off{display:none}.zem-chat-sound-toggle.is-muted{border-color:rgba(255,90,0,.35);background:rgba(255,90,0,.16);color:#fff;box-shadow:none}.zem-chat-sound-toggle.is-muted .zem-chat-sound-on{display:none}.zem-chat-sound-toggle.is-muted .zem-chat-sound-off{display:inline}.zem-floating-chat-root.has-sound-alert .zem-chat-sound-toggle{animation:zemSoundNotice .75s ease-in-out 2}@keyframes zemSoundNotice{50%{transform:scale(1.08);box-shadow:0 0 0 5px rgba(0,183,255,.14)}}
.zem-floating-chat-root.alerts-orange-disabled.has-new-reply .zem-floating-chat-launcher{background:linear-gradient(135deg,#00b7ff,#075ab7)!important;box-shadow:0 16px 40px rgba(0,183,255,.36)!important}
.zem-floating-chat.is-quote-selected .zem-floating-chat-quote-button { animation: zemQuotePulse 1.5s infinite; }

@keyframes zemQuotePulse {
  50% { box-shadow: 0 0 0 7px rgba(255, 90, 0, .12), 0 10px 28px rgba(0, 183, 255, .42); }
}

@media (max-width: 600px) {
  .zem-floating-chat-root,
  .zem-floating-chat,
  .zem-floating-chat--bottom-left {
    right: 18px !important;
    bottom: 18px !important;
    left: auto !important;
  }

  .zem-floating-chat--bottom-left { right: auto !important; left: 18px !important; }
  .zem-floating-chat-toggle,
  .zem-floating-chat-launcher { min-width: 62px; min-height: 62px; padding: 8px; }
  .zem-floating-chat-launcher > span:not(.zem-floating-chat-launcher-icon) { display: none; }

  .zem-floating-chat-panel,
  .zem-floating-chat--bottom-left .zem-floating-chat-panel {
    right: 12px !important;
    bottom: 92px !important;
    left: 12px !important;
    width: auto !important;
    max-width: none !important;
    max-height: calc(100dvh - 112px) !important;
    border-radius: 18px !important;
  }

  .zem-floating-chat-body { max-height: calc(100dvh - 205px); }
  .zem-floating-chat-banner > img { max-height: 190px; }
  .zem-floating-chat-form { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .zem-floating-chat-panel,
  .zem-floating-chat-launcher,
  .zem-floating-chat-quote-button { animation: none !important; transition: none !important; }
}
