/* ============================================================
   BRAINYMASTER — AI CHAT WIDGET ("Nova")
   Reuses design tokens from style.css (colors, fonts, radii).
   Load this file AFTER style.css.
   ============================================================ */

.bm-chat{position:fixed;right:22px;bottom:22px;z-index:999;font-family:var(--f-body);}

/* ---------- bubble ---------- */
.bm-chat-bubble{
  width:60px;height:60px;border-radius:50%;border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;position:relative;
  background:linear-gradient(135deg, var(--blue-600), var(--blue-700));
  box-shadow:0 14px 34px -10px rgba(0,156,222,0.55), 0 0 0 1px rgba(255,255,255,0.08) inset;
  transition:transform .18s ease, box-shadow .18s ease;
}
.bm-chat-bubble:hover{transform:translateY(-2px) scale(1.03);box-shadow:0 18px 40px -10px rgba(0,156,222,0.6);}
.bm-chat-bubble:focus-visible{outline:2px solid var(--cyan-300);outline-offset:3px;}
.bm-chat-bubble svg{width:26px;height:26px;color:#fff;position:absolute;transition:opacity .15s ease, transform .15s ease;}
.bm-chat-bubble .bm-icon-close{opacity:0;transform:rotate(-45deg) scale(0.7);}
.bm-chat-bubble .bm-icon-chat{opacity:1;transform:rotate(0) scale(1);}
.bm-chat.is-open .bm-chat-bubble .bm-icon-close{opacity:1;transform:rotate(0) scale(1);}
.bm-chat.is-open .bm-chat-bubble .bm-icon-chat{opacity:0;transform:rotate(45deg) scale(0.7);}
.bm-chat-dot{
  position:absolute;top:-2px;right:-2px;width:14px;height:14px;border-radius:50%;
  background:var(--green);border:2px solid #fff;
}
.bm-chat.is-open .bm-chat-dot{display:none;}

/* ---------- panel ---------- */
.bm-chat-panel{
  position:absolute;right:0;bottom:76px;width:380px;max-width:calc(100vw - 32px);
  height:min(600px, calc(100vh - 120px));
  background:#fff;border-radius:var(--radius-lg);
  box-shadow:0 30px 70px -20px rgba(6,10,19,0.35), 0 0 0 1px rgba(10,17,34,0.06);
  display:flex;flex-direction:column;overflow:hidden;
  opacity:0;transform:translateY(14px) scale(0.98);pointer-events:none;
  transition:opacity .2s ease, transform .2s ease;
}
.bm-chat.is-open .bm-chat-panel{opacity:1;transform:translateY(0) scale(1);pointer-events:auto;}

.bm-chat-header{
  background:linear-gradient(120deg, var(--ink-900) 0%, #0F2740 100%);
  padding:20px 20px 18px;display:flex;align-items:center;gap:12px;flex-shrink:0;position:relative;overflow:hidden;
}
.bm-chat-avatar{
  width:42px;height:42px;border-radius:12px;flex-shrink:0;
  background:linear-gradient(150deg, rgba(143,232,255,0.22), rgba(143,232,255,0.06));
  border:1px solid rgba(143,232,255,0.32);
  display:flex;align-items:center;justify-content:center;color:var(--cyan-300);
}
.bm-chat-avatar svg{width:22px;height:22px;}
.bm-chat-name{font-family:var(--f-display);font-weight:700;color:#fff;font-size:0.98rem;}
.bm-chat-status{font-family:var(--f-mono);font-size:0.7rem;color:var(--on-dark-muted);letter-spacing:0.02em;margin-top:2px;display:flex;align-items:center;gap:6px;}
.bm-chat-status .dot{width:6px;height:6px;border-radius:50%;background:var(--green);display:inline-block;}
.bm-chat-close{
  margin-inline-start:auto;background:none;border:none;color:var(--on-dark-muted);cursor:pointer;
  width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:8px;flex-shrink:0;
}
.bm-chat-close:hover{background:rgba(255,255,255,0.08);color:#fff;}
.bm-chat-close svg{width:18px;height:18px;}

.bm-chat-disclosure{
  font-family:var(--f-mono);font-size:0.66rem;color:var(--on-dark-muted);
  padding:0 20px 14px;letter-spacing:0.02em;
}

/* ---------- messages ---------- */
.bm-chat-messages{
  flex:1;overflow-y:auto;padding:18px 16px;display:flex;flex-direction:column;gap:14px;
  background:var(--paper-50);
}
.bm-msg{display:flex;gap:9px;max-width:88%;}
.bm-msg.bot{align-self:flex-start;}
.bm-msg.user{align-self:flex-end;flex-direction:row-reverse;}
.bm-msg-avatar{
  width:26px;height:26px;border-radius:8px;flex-shrink:0;display:flex;align-items:center;justify-content:center;
  background:var(--ink-900);color:var(--cyan-300);
}
.bm-msg-avatar svg{width:14px;height:14px;}
.bm-msg-bubble{
  padding:11px 14px;border-radius:14px;font-size:0.89rem;line-height:1.55;
}
.bm-msg.bot .bm-msg-bubble{background:#fff;border:1px solid var(--line);color:var(--ink);border-top-left-radius:4px;}
.bm-msg.user .bm-msg-bubble{background:var(--blue-600);color:#fff;border-top-right-radius:4px;}
.bm-msg-bubble a{color:inherit;text-decoration:underline;}
.bm-msg.bot .bm-msg-bubble a{color:var(--blue-700);}

.bm-typing{display:flex;gap:4px;align-items:center;padding:4px 2px;}
.bm-typing span{width:6px;height:6px;border-radius:50%;background:var(--slate-500);opacity:0.5;animation:bmTypingBounce 1.2s infinite ease-in-out;}
.bm-typing span:nth-child(2){animation-delay:0.15s;}
.bm-typing span:nth-child(3){animation-delay:0.3s;}
@keyframes bmTypingBounce{0%,60%,100%{transform:translateY(0);opacity:0.4;}30%{transform:translateY(-4px);opacity:1;}}

/* ---------- quick replies ---------- */
.bm-quick-replies{display:flex;flex-wrap:wrap;gap:8px;padding:2px 2px 4px;}
.bm-quick-reply{
  font-family:var(--f-body);font-size:0.78rem;font-weight:600;color:var(--blue-700);
  background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 13px;cursor:pointer;
  transition:border-color .15s, background .15s;
}
.bm-quick-reply:hover{border-color:var(--blue-600);background:var(--paper-100);}

/* ---------- inline lead capture ---------- */
.bm-lead-card{
  background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 14px 12px;
  align-self:flex-start;max-width:92%;
}
.bm-lead-card p{font-size:0.85rem;color:var(--slate-600);margin-bottom:10px;line-height:1.5;}
.bm-lead-row{display:flex;gap:8px;}
.bm-lead-row input{
  flex:1;padding:9px 11px;border-radius:9px;border:1px solid var(--line);
  font-size:0.85rem;font-family:var(--f-body);background:var(--paper-50);
}
.bm-lead-row input:focus{outline:none;border-color:var(--blue-600);background:#fff;}
.bm-lead-row button{
  background:var(--blue-600);color:#fff;border:none;border-radius:9px;padding:0 14px;
  font-size:0.82rem;font-weight:700;cursor:pointer;flex-shrink:0;
}
.bm-lead-row button:hover{background:var(--blue-700);}
.bm-lead-skip{
  display:inline-block;margin-top:9px;font-size:0.76rem;color:var(--slate-500);
  cursor:pointer;text-decoration:underline;background:none;border:none;padding:0;font-family:var(--f-body);
}
.bm-lead-skip:hover{color:var(--slate-600);}

/* ---------- input bar ---------- */
.bm-chat-inputbar{
  display:flex;align-items:center;gap:8px;padding:12px 12px;border-top:1px solid var(--line);
  background:#fff;flex-shrink:0;
}
.bm-chat-inputbar input{
  flex:1;border:1px solid var(--line);border-radius:999px;padding:11px 16px;
  font-size:0.89rem;font-family:var(--f-body);background:var(--paper-50);color:var(--ink);
}
.bm-chat-inputbar input:focus{outline:none;border-color:var(--blue-600);background:#fff;}
.bm-chat-inputbar button{
  width:38px;height:38px;border-radius:50%;border:none;background:var(--blue-600);color:#fff;
  display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:background .15s;
}
.bm-chat-inputbar button:hover{background:var(--blue-700);}
.bm-chat-inputbar button:disabled{background:var(--slate-500);cursor:not-allowed;}
.bm-chat-inputbar button svg{width:16px;height:16px;}

/* ---------- mobile ---------- */
@media (max-width:520px){
  .bm-chat{right:14px;bottom:14px;}
  .bm-chat-panel{
    position:fixed;right:10px;left:10px;bottom:86px;width:auto;max-width:none;
    height:min(72vh, 620px);
  }
}