/* Mipo / Progress chatbot widget — RTL */
:root{
  --mipo-purple:#595183;
  --mipo-purple-dark:#42396b;
  --mipo-orange:#fa9033;
  --mipo-bg:#f4f3f7;
  --mipo-bot-bubble:#ffffff;
  --mipo-user-bubble:#595183;
  --mipo-text:#2b2740;
  --mipo-radius:18px;
  --mipo-shadow:0 12px 38px rgba(40,32,80,.28);
}

/* ---------- launcher (sits above the WhatsApp FAB) ---------- */
#mipo-chat-launcher{
  position:fixed;
  bottom:75px;            /* WhatsApp button: 50px tall at bottom:15px -> this stacks above with a 10px gap */
  right:15px;             /* aligned with the WhatsApp button's right:15px */
  width:50px;height:50px; /* same size as the WhatsApp button (s2_img_size:50px) */
  border:none;border-radius:50%;
  background:var(--mipo-purple);
  color:#fff;cursor:pointer;
  box-shadow:var(--mipo-shadow);
  z-index:99999990;
  display:flex;align-items:center;justify-content:center;
  transition:transform .18s ease, background .18s ease;
  padding:0;
}
#mipo-chat-launcher:hover{transform:scale(1.07);background:var(--mipo-purple-dark);}
#mipo-chat-launcher svg{width:26px;height:26px;display:block;}
#mipo-chat-launcher .mipo-badge{
  position:absolute;top:-3px;left:-3px;
  width:16px;height:16px;border-radius:50%;
  background:var(--mipo-orange);border:2px solid #fff;
}
#mipo-chat-launcher.mipo-hidden{display:none;}

/* ---------- panel ---------- */
#mipo-chat-panel{
  position:fixed;
  bottom:24px;right:20px;
  width:380px;max-width:calc(100vw - 32px);
  height:600px;max-height:calc(100vh - 48px);
  background:var(--mipo-bg);
  border-radius:20px;
  box-shadow:var(--mipo-shadow);
  z-index:100000000;
  display:none;flex-direction:column;
  overflow:hidden;
  direction:rtl;
  font-family:inherit;
  animation:mipo-pop .22s ease;
}
#mipo-chat-panel.mipo-open{display:flex;}
@keyframes mipo-pop{from{opacity:0;transform:translateY(16px) scale(.98);}to{opacity:1;transform:none;}}

.mipo-header{
  background:var(--mipo-purple);
  color:#fff;
  padding:14px 16px;
  display:flex;align-items:center;gap:10px;
  flex:0 0 auto;
}
.mipo-header .mipo-avatar{
  width:38px;height:38px;border-radius:50%;
  background:rgba(255,255,255,.18);
  display:flex;align-items:center;justify-content:center;flex:0 0 auto;
}
.mipo-header .mipo-avatar svg{width:22px;height:22px;}
.mipo-header .mipo-titles{flex:1 1 auto;line-height:1.2;}
.mipo-header .mipo-title{font-weight:700;font-size:15px;}
.mipo-header .mipo-subtitle{font-size:12px;opacity:.85;margin-top:2px;}
.mipo-header .mipo-close{
  background:none;border:none;color:#fff;cursor:pointer;
  font-size:24px;line-height:1;padding:4px 8px;border-radius:8px;
}
.mipo-header .mipo-close:hover{background:rgba(255,255,255,.15);}

/* ---------- messages ---------- */
.mipo-messages{
  flex:1 1 auto;overflow-y:auto;
  padding:16px 14px;
  display:flex;flex-direction:column;gap:10px;
}
.mipo-msg{
  max-width:82%;
  padding:10px 13px;border-radius:var(--mipo-radius);
  font-size:14.5px;line-height:1.5;
  white-space:pre-wrap;word-wrap:break-word;
}
.mipo-msg.bot{
  align-self:flex-start;
  background:var(--mipo-bot-bubble);color:var(--mipo-text);
  border-bottom-right-radius:6px;
  box-shadow:0 2px 6px rgba(40,32,80,.07);
}
.mipo-msg.user{
  align-self:flex-end;
  background:var(--mipo-user-bubble);color:#fff;
  border-bottom-left-radius:6px;
}
.mipo-msg.bot a{color:var(--mipo-purple);font-weight:600;text-decoration:underline;word-break:break-word;}
.mipo-typing{align-self:flex-start;display:flex;gap:4px;padding:12px 14px;background:var(--mipo-bot-bubble);border-radius:var(--mipo-radius);border-bottom-right-radius:6px;box-shadow:0 2px 6px rgba(40,32,80,.07);}
.mipo-typing span{width:7px;height:7px;border-radius:50%;background:#b7b2c9;animation:mipo-blink 1.2s infinite ease-in-out;}
.mipo-typing span:nth-child(2){animation-delay:.2s;}
.mipo-typing span:nth-child(3){animation-delay:.4s;}
@keyframes mipo-blink{0%,80%,100%{opacity:.3;transform:translateY(0);}40%{opacity:1;transform:translateY(-3px);}}

/* ---------- input ---------- */
.mipo-input{
  flex:0 0 auto;
  display:flex;align-items:flex-end;gap:8px;
  padding:10px;background:#fff;border-top:1px solid #e7e5ee;
}
.mipo-input textarea{
  flex:1 1 auto;resize:none;border:1px solid #ddd9e6;border-radius:14px;
  padding:10px 12px;font-size:14.5px;font-family:inherit;
  max-height:120px;line-height:1.4;outline:none;direction:rtl;
}
.mipo-input textarea:focus{border-color:var(--mipo-purple);}
.mipo-input .mipo-send{
  flex:0 0 auto;width:42px;height:42px;border:none;border-radius:50%;
  background:var(--mipo-orange);color:#fff;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:filter .15s;
}
.mipo-input .mipo-send:hover{filter:brightness(1.06);}
.mipo-input .mipo-send:disabled{opacity:.5;cursor:default;}
.mipo-input .mipo-send svg{width:20px;height:20px;transform:scaleX(-1);}

.mipo-foot{font-size:10.5px;color:#9b96ad;text-align:center;padding:4px 0 8px;background:#fff;}

/* ---------- mobile ---------- */
@media (max-width:600px){
  #mipo-chat-panel{
    inset:0;
    width:100%;max-width:100%;height:100%;max-height:100%;
    border-radius:0;
  }
  /* mobile WhatsApp button: 50px at bottom:10px / right:10px -> stack above, same size, aligned */
  #mipo-chat-launcher{bottom:70px;right:10px;width:50px;height:50px;}
}