:root{
  --nxl-bg:#0a0a0a;
  --nxl-panel:#0f0f0f;
  --nxl-border:#1f1f1f;
  --nxl-text:#ffffff;
  --nxl-sub:#9a9a9a;
  --nxl-white:#ffffff;
  --nxl-shadow:0 18px 40px rgba(0,0,0,.55);
}

/* Backdrop blur */
.nxl-backdrop{
  position:fixed; inset:0;
  background:rgba(255,255,255,.06);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  z-index:2147483645;
  display:none;
}

.nxl-widget{ --nxl-actions-h: 84px;
  position:fixed !important;
  bottom:90px;
  z-index:2147483647;
  width: min(420px, calc(100vw - 36px));
  border-radius:16px;
  background:var(--nxl-panel);
  color:var(--nxl-text);
  border:1px solid var(--nxl-border);
  box-shadow:var(--nxl-shadow);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial;
  overflow:hidden;
  display:flex; flex-direction:column;
  max-height: calc(100vh - 120px);
}
.nxl-widget.nxl-side-left{ left:18px; right:auto; }
.nxl-widget.nxl-side-right{ right:18px; left:auto; }

.nxl-floating-launcher{
  position:fixed !important;
  bottom:20px;
  width:56px; height:56px;
  background:#0f0f0f; color:#fff;
  border:1px solid var(--nxl-border); border-radius:50%;
  display:grid; place-items:center;
  font-size:20px; cursor:pointer;
  z-index:2147483646;
  box-shadow:0 8px 20px rgba(0,0,0,.5);
}
.nxl-pos-left{ left:20px !important; right:auto !important; }
.nxl-pos-right{ right:20px !important; left:auto !important; }

.nxl-launcher-icon .nxl-icon-svg{ display:block; width:22px; height:22px; }

/* Badge "1" */
.nxl-badge{
  position:absolute;
  top:-4px; right:-4px;
  min-width:20px; height:20px;
  display:grid; place-items:center;
  background:#e83b3b; color:#fff; font-weight:700;
  border-radius:999px; font-size:12px;
  border:2px solid #0f0f0f;
  padding:0 6px;
}

/* Optional teaser */
.nxl-teaser{
  position:fixed !important;
  bottom:28px;
  display:flex; align-items:center; gap:10px;
  background:var(--nxl-white); color:#111;
  border-radius:14px; padding:10px 12px 10px 10px;
  border:1px solid rgba(0,0,0,.06);
  box-shadow:0 12px 28px rgba(0,0,0,.18);
  z-index:2147483645;
}
.nxl-teaser.nxl-pos-left{ left:86px !important; right:auto !important; }
.nxl-teaser.nxl-pos-right{ right:86px !important; left:auto !important; }
.nxl-teaser.nxl-pos-left:after{
  content:''; position:absolute; left:-10px; bottom:12px; width:0; height:0;
  border-right:10px solid var(--nxl-white);
  border-top:10px solid transparent; border-bottom:10px solid transparent;
  filter:drop-shadow(-1px 0 0 rgba(0,0,0,.06));
}
.nxl-teaser.nxl-pos-right:after{
  content:''; position:absolute; right:-10px; bottom:12px; width:0; height:0;
  border-left:10px solid var(--nxl-white);
  border-top:10px solid transparent; border-bottom:10px solid transparent;
  filter:drop-shadow(1px 0 0 rgba(0,0,0,.06));
}
.nxl-avatar{ width:28px; height:28px; border-radius:50%; object-fit:cover; flex:0 0 auto; border:1px solid rgba(0,0,0,.08); box-shadow:0 2px 8px rgba(0,0,0,.12); }
.nxl-teaser-text{ font-size:14px; line-height:1.25; font-weight:500; white-space:pre-line; }
.nxl-teaser-close{ margin-left:8px; background:transparent; border:none; color:#888; font-size:14px; cursor:pointer; }

/* Chat UI */
.nxl-header{ display:flex; align-items:center; justify-content:space-between; padding:10px 12px; background:#0a0a0a; border-bottom:1px solid var(--nxl-border); flex-shrink:0; }
.nxl-title{ font-weight:600; font-size:14px; letter-spacing:.2px; }
.nxl-close{ background:transparent; border:none; color:#ccc; font-size:20px; cursor:pointer; }

.nxl-messages{
  flex:1 1 auto; overflow:auto; padding:12px;
  display:flex; flex-direction:column; gap:8px; background:var(--nxl-panel); min-height:160px;
}
.nxl-msg{ display:flex; width:100%; }
.nxl-user{ justify-content:flex-end; }
.nxl-bot{ justify-content:flex-start; }
.nxl-bubble{
  padding:10px 12px; border-radius:12px; max-width:85%; line-height:1.5; font-size:14px;
  background:transparent; color:var(--nxl-text); border:1px solid var(--nxl-border);
}
.nxl-user .nxl-bubble{ background:#141414; border-color:#242424; }
.nxl-bot .nxl-bubble{ background:transparent; border-color:#2a2a2a; }

.nxl-input-row{ display:flex; gap:8px; padding:10px; border-top:1px solid var(--nxl-border); flex-shrink:0; }
.nxl-input{ flex:1; background:#0c0c0c; border:1px solid #242424; border-radius:10px; padding:10px 12px; color:#fff; outline:none; }
.nxl-send{ min-width:44px; height:44px; display:grid; place-items:center; border-radius:10px; border:1px solid #2a2a2a; background:#111; color:#fff; cursor:pointer; }
.nxl-send:hover{ transform:translateY(-1px); }

.nxl-form{ padding:14px; display:block; border-top:1px solid var(--nxl-border); background:#0f0f0f; flex-shrink:0; margin:0 0 var(--nxl-actions-h, 84px) 0; }
.nxl-row{ display:flex; gap:12px; }
.nxl-col{ flex:1; }
.nxl-form label{ display:block; font-size:12px; color:#c9c9c9; margin:6px 0; }
.nxl-form input{ width:100%; border-radius:12px; border:1px solid #242424; background:#0c0c0c; color:#fff; padding:10px 12px; outline:none; }
.nxl-gdpr{ color:#9a9a9a; font-size:12px; margin:8px 0 14px; line-height:1.4; }

/* Actions bar (outside the form; never overlaps content) */
.nxl-actions{
  position:sticky; bottom:0;
  background:linear-gradient(180deg, rgba(15,15,15,0) 0%, rgba(15,15,15,1) 40%);
  padding:8px 12px 12px;
  display:flex; justify-content:center;
  border-top:1px solid var(--nxl-border);
}
.nxl-primary{
  display:inline-flex; align-items:center; justify-content:center;
  background:#0f0f0f; color:#fff; border:1px solid #2a2a2a;
  border-radius:10px; padding:10px 14px; cursor:pointer;
  min-width:160px; width:auto;
  box-shadow:0 6px 14px rgba(0,0,0,.35);
}
.nxl-primary:hover{ filter:brightness(1.1); }

@media (max-width:520px){ .nxl-row{ flex-direction:column; } }
