/* ===== ویجت چت‌بات هوشمند — طراحی جدید، سمت راست ===== */
.bot-fab{
  position:fixed;bottom:88px;right:22px;z-index:9998;
  width:60px;height:60px;border-radius:18px 18px 6px 18px;border:none;cursor:pointer;
  background:linear-gradient(135deg,#7c3aed 0%,#db2777 100%);color:#fff;font-size:26px;
  box-shadow:0 8px 24px rgba(124,58,237,.45);transition:transform .2s,border-radius .3s;
}
.bot-fab:hover{transform:scale(1.08) rotate(-4deg)}
.bot-fab .bot-fab-badge{
  position:absolute;top:-6px;left:-6px;background:#16a34a;color:#fff;
  font-size:11px;padding:2px 8px;border-radius:10px;font-weight:bold;
  box-shadow:0 2px 6px rgba(0,0,0,.25);
}
.bot-panel{
  position:fixed;bottom:158px;right:22px;z-index:9999;
  width:min(370px,calc(100vw - 36px));height:min(520px,calc(100vh - 200px));
  background:#fff;border-radius:20px;box-shadow:0 20px 60px rgba(15,23,42,.35);
  display:none;flex-direction:column;overflow:hidden;
  font-family:inherit;text-align:right;direction:rtl;
  border:1px solid rgba(124,58,237,.15);
}
.bot-panel.open{display:flex;animation:botPop .25s ease}
@keyframes botPop{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}

/* هدر گرادیانی با موج */
.bot-header{
  background:linear-gradient(135deg,#7c3aed 0%,#db2777 100%);color:#fff;
  padding:14px 16px 18px;display:flex;align-items:center;gap:10px;flex-shrink:0;
}
.bot-header::after{content:'';display:block;order:99}
.bot-header .bot-avatar{
  width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.2);
  display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0;
  animation:botPulse 2.4s ease infinite;
}
@keyframes botPulse{0%,100%{box-shadow:0 0 0 0 rgba(255,255,255,.35)}50%{box-shadow:0 0 0 8px rgba(255,255,255,0)}}
.bot-header b{display:block;font-size:14.5px}
.bot-header small{font-size:11px;opacity:.85}
.bot-header .bot-online{display:inline-block;width:8px;height:8px;border-radius:50%;background:#4ade80;margin-left:4px}
.bot-header .bot-close{
  margin-right:auto;background:rgba(255,255,255,.15);border:none;color:#fff;font-size:18px;
  cursor:pointer;line-height:1;padding:6px 10px;border-radius:10px;transition:background .2s;
}
.bot-header .bot-close:hover{background:rgba(255,255,255,.3)}

.bot-body{flex:1;overflow-y:auto;padding:16px 14px;background:#f8f7fc;display:flex;flex-direction:column;gap:10px}
.bot-body::-webkit-scrollbar{width:5px}
.bot-body::-webkit-scrollbar-thumb{background:#ddd6fe;border-radius:3px}

.bot-msg{max-width:86%;padding:10px 14px;border-radius:16px;font-size:13px;line-height:1.9;white-space:pre-line;word-break:break-word}
.bot-msg.user{align-self:flex-end;background:linear-gradient(135deg,#7c3aed,#9333ea);color:#fff;border-bottom-left-radius:4px;box-shadow:0 3px 10px rgba(124,58,237,.3)}
.bot-msg.bot{align-self:flex-start;background:#fff;color:#1f2937;border-bottom-right-radius:4px;border:1px solid #ede9fe;box-shadow:0 2px 8px rgba(0,0,0,.05)}
.bot-msg .bot-link{
  display:inline-flex;align-items:center;gap:4px;margin-top:8px;
  background:linear-gradient(135deg,#ede9fe,#fce7f3);color:#6d28d9;
  padding:5px 14px;border-radius:14px;font-size:12px;text-decoration:none;font-weight:bold;
}
.bot-msg .bot-link:hover{background:#7c3aed;color:#fff}

.bot-typing{
  align-self:flex-start;background:#fff;border:1px solid #ede9fe;border-radius:14px;
  padding:8px 14px;display:flex;gap:4px;
}
.bot-typing i{width:7px;height:7px;border-radius:50%;background:#a78bfa;animation:botDot 1.2s infinite}
.bot-typing i:nth-child(2){animation-delay:.2s}
.bot-typing i:nth-child(3){animation-delay:.4s}
@keyframes botDot{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-4px)}}

.bot-suggestions{display:flex;flex-wrap:wrap;gap:6px;padding:0 14px 10px;background:#f8f7fc;flex-shrink:0}
.bot-suggestions button{
  background:#fff;border:1.5px solid #ddd6fe;color:#6d28d9;border-radius:16px;
  padding:6px 14px;font-size:12px;cursor:pointer;font-family:inherit;transition:all .2s;
}
.bot-suggestions button:hover{background:#7c3aed;border-color:#7c3aed;color:#fff}

.bot-input{display:flex;gap:8px;padding:12px 12px;border-top:1px solid #f1eefe;background:#fff;flex-shrink:0}
.bot-input input{
  flex:1;border:1.5px solid #e5e7eb;border-radius:14px;padding:10px 14px;font-size:13px;
  font-family:inherit;outline:none;direction:rtl;transition:border-color .2s;
}
.bot-input input:focus{border-color:#a78bfa;box-shadow:0 0 0 3px rgba(167,139,250,.15)}
.bot-input button{
  background:linear-gradient(135deg,#7c3aed,#db2777);color:#fff;border:none;border-radius:14px;
  padding:0 18px;font-size:17px;cursor:pointer;font-family:inherit;transition:transform .15s;
}
.bot-input button:hover{transform:scale(1.05)}

/* ===== فرم مشخصات (نام + شماره تماس) قبل از شروع چت ===== */
.bot-lead{flex:1;overflow-y:auto;padding:22px 20px;background:#f8f7fc;display:flex;flex-direction:column;gap:14px}
.bot-lead .bot-lead-icon{text-align:center;font-size:44px}
.bot-lead h4{margin:0;text-align:center;font-size:15px;color:#1f2937}
.bot-lead p{margin:0;text-align:center;font-size:12px;color:#6b7280;line-height:1.9}
.bot-lead label{font-size:12px;font-weight:bold;color:#4b5563;display:block;margin-bottom:5px}
.bot-lead input{
  width:100%;box-sizing:border-box;border:1.5px solid #e5e7eb;border-radius:14px;
  padding:11px 14px;font-size:13.5px;font-family:inherit;outline:none;direction:rtl;background:#fff;
}
.bot-lead input:focus{border-color:#a78bfa;box-shadow:0 0 0 3px rgba(167,139,250,.15)}
.bot-lead .bot-lead-btn{
  width:100%;background:linear-gradient(135deg,#7c3aed,#db2777);color:#fff;border:none;
  border-radius:14px;padding:12px;font-size:14px;font-weight:bold;cursor:pointer;font-family:inherit;
}
.bot-lead .bot-lead-btn:hover{filter:brightness(1.08)}
.bot-lead .bot-lead-error{color:#dc2626;font-size:12px;text-align:center;display:none}
.bot-lead small{color:#9ca3af;font-size:10.5px;text-align:center;line-height:1.8}

@media (max-width:768px){
  .bot-panel{bottom:84px;right:12px;width:calc(100vw - 24px);height:calc(100vh - 130px);border-radius:16px}
  .bot-fab{bottom:14px;right:14px}
}