/* BazaHost chat widget (standalone) */
.bz-chat {
  --lime: #665cff;
  --lime-dark: #7d74ff;
  --lime-soft: rgba(102, 92, 255, 0.18);
  --ink: #ffffff;
  --bg: #0a0a0a;
  --bg-soft: #161616;
  --surface: #0f0f0f;
  --text: #f5f5f5;
  --secondary: #9a9a9a;
  --border: #262626;
  --border-strong: #3a3a3a;
  --glass-border: rgba(255, 255, 255, 0.13);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.4), 0 24px 64px rgba(0, 0, 0, 0.45);
  --font-body: 'Inter', system-ui, sans-serif;
  --font-display: 'Inter', system-ui, sans-serif;

  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 1200;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 14px;
  font-family: var(--font-body);
  color: var(--text);
}

.bz-chat button {
  border: none;
  background: none;
  cursor: pointer;
  font: inherit;
  padding: 0;
}

.bz-chat__fab {
  position: relative;
  width: 58px;
  height: 58px;
  border-radius: 18px;
  background: linear-gradient(180deg, #7d74ff 0%, #665cff 100%) !important;
  color: var(--ink);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 18px rgba(102, 92, 255, 0.32), 0 2px 6px rgba(0, 0, 0, 0.3);
  transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}

.bz-chat__fab:hover {
  background: linear-gradient(180deg, #8b83ff 0%, #7d74ff 100%) !important;
  transform: translateY(-2px);
}

.bz-chat__fab [data-fab-icon] {
  display: flex;
}

.bz-chat__badge {
  position: absolute;
  top: -5px;
  right: -5px;
  min-width: 20px;
  height: 20px;
  padding: 0 5px;
  border-radius: 999px;
  background: #e5484d;
  color: #fff;
  font-size: 11.5px;
  font-weight: 800;
  display: none;
  align-items: center;
  justify-content: center;
}

.bz-chat__badge--show { display: flex; }

.bz-chat__panel {
  width: 384px;
  max-width: calc(100vw - 44px);
  height: 620px;
  max-height: calc(100vh - 130px);
  display: none;
  flex-direction: column;
  border-radius: 22px;
  border: 1px solid var(--glass-border);
  background: var(--surface);
  box-shadow: var(--shadow-lg);
  overflow: hidden;
  animation: bz-chat-in 0.22s cubic-bezier(0.22, 1, 0.36, 1);
}

.bz-chat[data-open] .bz-chat__panel { display: flex; }

@keyframes bz-chat-in {
  from { opacity: 0; transform: translateY(14px) scale(0.97); }
  to { opacity: 1; transform: none; }
}

.bz-chat__head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--border);
}

.bz-chat__head-text {
  display: flex;
  flex-direction: column;
  min-width: 0;
  flex: 1;
  gap: 1px;
}

.bz-chat__head-text strong {
  font-family: var(--font-display);
  font-size: 15.5px;
  letter-spacing: -0.01em;
}

.bz-chat__head-text span {
  font-size: 12.5px;
  color: var(--secondary);
  font-weight: 600;
}

.bz-chat__close {
  color: var(--secondary);
  padding: 7px !important;
  border-radius: 11px;
  transition: color 0.15s, background 0.15s;
  display: flex;
}

.bz-chat__close:hover {
  color: var(--text);
  background: var(--border);
}

.bz-chat__list {
  flex: 1;
  overflow-y: auto;
  padding: 18px 16px 10px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  scroll-behavior: smooth;
}

.bz-chat__row {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.bz-chat__row--you { align-items: flex-end; }
.bz-chat__row--staff { align-items: flex-start; }

.bz-chat__msg {
  max-width: 84%;
  padding: 10px 14px;
  border-radius: 17px;
  font-size: 14px;
  line-height: 1.55;
  white-space: pre-wrap;
  word-break: break-word;
}

.bz-chat__msg--you {
  background: var(--lime);
  color: var(--ink);
  border-bottom-right-radius: 6px;
  font-weight: 600;
}

.bz-chat__msg--staff {
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-bottom-left-radius: 6px;
}

.bz-chat__meta {
  font-size: 11.5px;
  color: var(--secondary);
  font-weight: 600;
  padding-left: 4px;
}

.bz-chat__error {
  font-size: 12.5px;
  color: #e5484d;
  font-weight: 600;
  padding: 0 18px 4px;
  margin: 0;
}

.bz-chat__foot {
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding: 10px 14px 14px;
}

.bz-chat__email {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 13px;
  border: 1.5px solid var(--border-strong);
  border-radius: 13px;
  background: var(--bg);
  color: var(--secondary);
  transition: border-color 0.15s;
}

.bz-chat__email[hidden] { display: none; }

.bz-chat__email:focus-within { border-color: var(--lime-dark); }

.bz-chat__email input {
  flex: 1;
  border: none;
  background: none;
  padding: 10px 0;
  font: inherit;
  font-size: 13.5px;
  color: var(--text);
  outline: none;
  min-width: 0;
}

.bz-chat__composer {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  margin: 0;
  padding: 9px 9px 9px 15px;
  border: 1.5px solid var(--border-strong);
  border-radius: 17px;
  background: var(--bg);
  transition: border-color 0.15s, box-shadow 0.15s;
}

.bz-chat__composer:focus-within {
  border-color: var(--lime-dark);
  box-shadow: 0 0 0 3px var(--lime-soft);
}

.bz-chat__composer textarea {
  flex: 1;
  border: none;
  background: none;
  font: inherit;
  font-size: 14px;
  color: var(--text);
  outline: none;
  resize: none;
  padding: 8px 0;
  max-height: 96px;
  line-height: 1.45;
  min-width: 0;
}

.bz-chat__composer button {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: var(--lime) !important;
  color: var(--ink);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background 0.15s, transform 0.15s, opacity 0.15s;
}

.bz-chat__composer button:hover {
  background: var(--lime-dark) !important;
  transform: scale(1.05);
}

.bz-chat__composer button:disabled {
  opacity: 0.4;
  cursor: default;
  transform: none;
}

@media (max-width: 520px) {
  .bz-chat { right: 14px; bottom: 14px; }
  .bz-chat__panel { width: calc(100vw - 28px); height: min(620px, calc(100dvh - 110px)); }
}