/* ===========================================================
   WNC chat widget — floating assistant
   =========================================================== */
.chat-launcher{
  position:fixed; bottom:24px; right:24px; z-index:200;
  height:52px; padding:0 20px 0 18px; border-radius:30px;
  background:var(--grey-btn); color:#fff; border:none; cursor:pointer;
  display:flex; align-items:center; gap:9px; justify-content:center;
  box-shadow:0 8px 24px -8px rgba(20,23,28,.35);
  transition:transform .15s ease, background .2s ease, padding .2s ease;
}
.chat-launcher:hover{ background:var(--grey-btn-dim); transform:translateY(-2px); }
.chat-launcher svg{ width:22px; height:22px; flex:none; }
.chat-launcher .chat-icon-close{ display:none; }
.chat-launcher.open .chat-icon-chat{ display:none; }
.chat-launcher.open .chat-icon-close{ display:block; }
.chat-launcher .chat-launcher-label{ font-family:var(--body); font-weight:600; font-size:.86rem; white-space:nowrap; }
.chat-launcher.open{ padding:0; width:52px; }
.chat-launcher.open .chat-launcher-label{ display:none; }
@media(max-width:480px){
  .chat-launcher .chat-launcher-label{ display:none; }
  .chat-launcher{ width:52px; height:52px; padding:0; border-radius:50%; }
}

.chat-panel{
  position:fixed; bottom:92px; right:24px; z-index:200;
  width:360px; max-width:calc(100vw - 32px);
  height:min(520px, calc(100vh - 140px));
  background:var(--paper); border:1px solid var(--line); border-radius:12px;
  box-shadow:0 20px 50px -16px rgba(20,23,28,.35);
  display:flex; flex-direction:column; overflow:hidden;
  opacity:0; transform:translateY(12px) scale(.98); pointer-events:none;
  transition:opacity .18s ease, transform .18s ease;
}
.chat-panel.open{ opacity:1; transform:translateY(0) scale(1); pointer-events:auto; }

.chat-header{
  background:var(--black); color:#fff; padding:16px 18px;
  display:flex; align-items:center; gap:10px;
}
.chat-header .dot{ width:8px; height:8px; border-radius:50%; background:var(--accent); flex:none; }
.chat-header .title{ font-family:var(--body); font-weight:700; font-size:.92rem; }
.chat-header .subtitle{ font-size:.74rem; color:rgba(255,255,255,.55); margin-top:1px; }

.chat-messages{
  flex:1; overflow-y:auto; padding:16px; display:flex; flex-direction:column; gap:12px;
  background:var(--white);
}
.chat-msg{ max-width:85%; font-size:.88rem; line-height:1.5; padding:10px 13px; border-radius:10px; }
.chat-msg.bot{ background:var(--paper); border:1px solid var(--line); color:var(--black); align-self:flex-start; border-bottom-left-radius:3px; }
.chat-msg.user{ background:var(--grey-btn); color:#fff; align-self:flex-end; border-bottom-right-radius:3px; }
.chat-msg.typing{ display:flex; gap:4px; align-items:center; padding:12px 14px; }
.chat-msg.typing span{ width:6px; height:6px; border-radius:50%; background:var(--muted); animation:chatTyping 1.2s ease-in-out infinite; }
.chat-msg.typing span:nth-child(2){ animation-delay:.15s; }
.chat-msg.typing span:nth-child(3){ animation-delay:.3s; }
@keyframes chatTyping{ 0%,60%,100%{ opacity:.3; transform:translateY(0);} 30%{ opacity:1; transform:translateY(-2px);} }

.chat-suggestions{ display:flex; flex-wrap:wrap; gap:6px; padding:0 16px 12px; background:var(--white); }
.chat-suggestion{
  font-size:.76rem; padding:6px 11px; border-radius:20px; border:1px solid var(--line);
  background:var(--paper); color:var(--black); cursor:pointer; transition:background .15s, border-color .15s;
}
.chat-suggestion:hover{ background:var(--grey-btn); color:#fff; border-color:var(--grey-btn); }

.chat-input-row{
  display:flex; gap:8px; padding:12px; border-top:1px solid var(--line); background:var(--paper);
}
.chat-input-row input{
  flex:1; border:1.3px solid var(--line); border-radius:20px; padding:9px 15px; font-size:.88rem;
  font-family:var(--body); background:var(--white); color:var(--black);
}
.chat-input-row input:focus{ outline:none; border-color:var(--accent); }
.chat-input-row button{
  flex:none; width:38px; height:38px; border-radius:50%; border:none; background:var(--grey-btn);
  color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center;
  transition:background .15s;
}
.chat-input-row button:hover{ background:var(--grey-btn-dim); }
.chat-input-row button:disabled{ opacity:.5; cursor:not-allowed; }
.chat-input-row button svg{ width:16px; height:16px; }

.chat-footnote{ font-size:.68rem; color:var(--muted); text-align:center; padding:6px 10px 10px; background:var(--paper); }

@media (max-width:480px){
  .chat-panel{ right:16px; bottom:84px; }
  .chat-launcher{ right:16px; bottom:16px; }
}