/* ═══ AI Chat Widget — Navin Auto ═══ */
.nai-fab {
  position:fixed; bottom:28px; right:28px; z-index:9990;
  width:60px; height:60px; border-radius:50%;
  background:linear-gradient(135deg,#00d4ff,#0066ff);
  border:none; cursor:pointer; color:#fff; font-size:28px;
  box-shadow:0 4px 24px rgba(0,212,255,0.4);
  transition:transform .3s,box-shadow .3s;
  display:flex;align-items:center;justify-content:center;
}
.nai-fab:hover { transform:scale(1.1); box-shadow:0 6px 32px rgba(0,212,255,0.6); }
.nai-fab .nai-badge {
  position:absolute;top:-2px;right:-2px;width:18px;height:18px;
  background:#ff3d57;border-radius:50%;font-size:11px;font-weight:700;
  display:flex;align-items:center;justify-content:center;
  animation:nai-pulse 2s infinite;
}
@keyframes nai-pulse { 0%,100%{transform:scale(1)} 50%{transform:scale(1.2)} }

.nai-panel {
  position:fixed; bottom:100px; right:28px; z-index:9991;
  width:380px; max-width:calc(100vw - 24px);
  max-height:min(560px,calc(100vh - 140px));
  background:rgba(13,17,23,0.97); backdrop-filter:blur(20px);
  border:1px solid rgba(0,212,255,0.2); border-radius:16px;
  display:flex; flex-direction:column;
  box-shadow:0 16px 48px rgba(0,0,0,0.5),0 0 40px rgba(0,212,255,0.1);
  transform:translateY(20px) scale(0.95); opacity:0;
  pointer-events:none; transition:all .3s ease;
}
.nai-panel.open { transform:translateY(0) scale(1); opacity:1; pointer-events:all; }

.nai-head {
  display:flex;align-items:center;gap:10px;padding:14px 16px;
  border-bottom:1px solid rgba(0,212,255,0.12);
}
.nai-avatar {
  width:38px;height:38px;border-radius:50%;
  background:linear-gradient(135deg,#00d4ff,#0066ff);
  display:flex;align-items:center;justify-content:center;font-size:18px;
  box-shadow:0 0 12px rgba(0,212,255,0.4);flex-shrink:0;
}
.nai-head-info { flex:1; }
.nai-head-title { color:#e8edf5;font-weight:600;font-size:14px; }
.nai-head-sub { color:#8fa3b8;font-size:11px; }
.nai-close { background:none;border:none;color:#8fa3b8;font-size:20px;cursor:pointer;padding:4px 8px; }
.nai-close:hover { color:#ff3d57; }

.nai-msgs {
  flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;
  min-height:200px;scroll-behavior:smooth;
}
.nai-msg { max-width:85%;padding:10px 14px;border-radius:12px;font-size:13px;line-height:1.6;animation:nai-slide .3s ease; }
@keyframes nai-slide { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:translateY(0)} }
.nai-msg.bot { align-self:flex-start;background:rgba(0,212,255,0.08);border:1px solid rgba(0,212,255,0.15);color:#e8edf5; }
.nai-msg.user { align-self:flex-end;background:linear-gradient(135deg,#0066ff,#0099bb);color:#fff; }
.nai-msg b { color:#00d4ff; }
.nai-msg a { color:#00d4ff; text-decoration:underline; }

.nai-typing { align-self:flex-start;display:flex;gap:4px;padding:12px 16px; }
.nai-typing span { width:6px;height:6px;border-radius:50%;background:#00d4ff;animation:nai-dot .8s infinite; }
.nai-typing span:nth-child(2) { animation-delay:.15s; }
.nai-typing span:nth-child(3) { animation-delay:.3s; }
@keyframes nai-dot { 0%,80%,100%{transform:translateY(0);opacity:.4} 40%{transform:translateY(-6px);opacity:1} }

.nai-quick { display:flex;gap:6px;flex-wrap:wrap;padding:8px 14px;border-top:1px solid rgba(0,212,255,0.08); }
.nai-quick button {
  padding:6px 12px;border-radius:14px;font-size:12px;cursor:pointer;
  background:rgba(0,212,255,0.08);border:1px solid rgba(0,212,255,0.2);color:#00d4ff;
  transition:all .2s;white-space:nowrap;
}
.nai-quick button:hover { background:rgba(0,212,255,0.18);border-color:rgba(0,212,255,0.4); }

.nai-input-wrap {
  display:flex;gap:8px;padding:12px;border-top:1px solid rgba(0,212,255,0.12);
}
.nai-input {
  flex:1;padding:10px 14px;border-radius:10px;border:1px solid rgba(0,212,255,0.2);
  background:rgba(255,255,255,0.04);color:#e8edf5;font-size:13px;outline:none;
  font-family:'Inter',sans-serif;
}
.nai-input:focus { border-color:rgba(0,212,255,0.5); }
.nai-input::placeholder { color:#4a6070; }
.nai-send {
  width:40px;height:40px;border-radius:10px;border:none;cursor:pointer;
  background:linear-gradient(135deg,#00d4ff,#0066ff);color:#fff;font-size:16px;
  display:flex;align-items:center;justify-content:center;transition:transform .2s;
}
.nai-send:hover { transform:scale(1.08); }
.nai-send:disabled { opacity:0.5;cursor:default;transform:none; }

/* ═══ Inline hero section ═══ */
.nai-hero-widget {
  background:rgba(0,212,255,0.06);border:1px solid rgba(0,212,255,0.15);
  border-radius:12px;padding:16px;cursor:pointer;transition:all .3s;
  display:flex;align-items:center;gap:12px;
}
.nai-hero-widget:hover { background:rgba(0,212,255,0.12);border-color:rgba(0,212,255,0.3);transform:translateY(-2px); }
.nai-hero-widget .nai-avatar { width:42px;height:42px;font-size:20px; }

@media (max-width:600px) {
  .nai-panel { right:0;bottom:0;width:100%;max-width:100%;max-height:100vh;border-radius:16px 16px 0 0; }
  .nai-fab { bottom:16px;right:16px;width:52px;height:52px;font-size:24px; }
}
