/* ============================================================
   MyPerfumes AI Chatbot — widget styles
   Purely additive: fixed-position overlay, touches no existing
   layout. Positioned bottom-RIGHT, stacked directly above the
   existing #backToTop button (bottom:24px;right:24px;44px tall —
   see config.php siteFooter()) so the two never collide, and
   clear of the motion layer's mobile sticky buy bar (full-width,
   bottom, on PDP <=768px).
   ============================================================ */
#mp-chat-launcher{position:fixed;right:24px;bottom:86px;width:58px;height:58px;border-radius:50%;
  background:var(--indigo,#3b2f87);color:#fff;border:none;cursor:pointer;z-index:9998;
  display:flex;align-items:center;justify-content:center;box-shadow:0 10px 30px rgba(29,29,55,.35);
  transition:transform .25s cubic-bezier(.16,1,.3,1),box-shadow .25s}
#mp-chat-launcher:hover{transform:translateY(-3px);box-shadow:0 14px 36px rgba(29,29,55,.45)}
#mp-chat-launcher svg{width:26px;height:26px}
#mp-chat-launcher .mp-chat-close-icon{display:none}
#mp-chat-launcher.open .mp-chat-bubble-icon{display:none}
#mp-chat-launcher.open .mp-chat-close-icon{display:block}
/* Online indicator — always on, not conditional on scroll: a small pulsing
   green dot in the standard "agent is available" convention. */
.mp-chat-online-dot{position:absolute;top:2px;right:2px;width:13px;height:13px;border-radius:50%;
  background:#2ecc71;border:2.5px solid #fff;box-shadow:0 0 0 0 rgba(46,204,113,.6);
  animation:mpChatOnlinePulse 2.4s ease-out infinite}
#mp-chat-launcher.open .mp-chat-online-dot{display:none}
@keyframes mpChatOnlinePulse{0%{box-shadow:0 0 0 0 rgba(46,204,113,.55)}70%{box-shadow:0 0 0 7px rgba(46,204,113,0)}100%{box-shadow:0 0 0 0 rgba(46,204,113,0)}}
@media(max-width:768px){#mp-chat-launcher{right:16px;bottom:84px;width:52px;height:52px}}

#mp-chat-window{position:fixed;right:24px;bottom:156px;width:380px;max-width:calc(100vw - 32px);
  height:min(600px,calc(100vh - 200px));background:#fff;border-radius:14px;z-index:9999;
  box-shadow:0 24px 70px rgba(29,29,55,.28);display:none;flex-direction:column;overflow:hidden;
  font-family:'Outfit',system-ui,sans-serif;border:1px solid var(--border,#eaeaf1)}
#mp-chat-window.open{display:flex}
@media(max-width:768px){#mp-chat-window{left:16px;right:16px;bottom:146px;width:auto;height:min(65vh,560px)}}

.mp-chat-head{background:var(--indigo,#3b2f87);color:#fff;padding:16px 18px;display:flex;
  align-items:center;justify-content:space-between;flex-shrink:0}
.mp-chat-head-title{font-size:15px;font-weight:600}
.mp-chat-head-sub{font-size:11.5px;opacity:.75;margin-top:2px}
.mp-chat-head-close{background:none;border:none;color:#fff;opacity:.8;cursor:pointer;padding:4px}
.mp-chat-head-close:hover{opacity:1}

.mp-chat-body{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;background:var(--bg2,#f6f6fa)}
.mp-msg{max-width:86%;padding:10px 14px;border-radius:12px;font-size:13.5px;line-height:1.55;white-space:pre-wrap}
.mp-msg.user{align-self:flex-end;background:var(--indigo,#3b2f87);color:#fff;border-bottom-right-radius:3px}
.mp-msg.bot{align-self:flex-start;background:#fff;color:var(--text,#1d1d29);border:1px solid var(--border,#eaeaf1);border-bottom-left-radius:3px}
.mp-msg.error{align-self:flex-start;background:rgba(225,57,44,.08);border:1px solid rgba(225,57,44,.25);color:var(--red,#e1392c)}

.mp-typing{align-self:flex-start;display:flex;gap:4px;padding:12px 14px;background:#fff;border:1px solid var(--border,#eaeaf1);border-radius:12px;border-bottom-left-radius:3px}
.mp-typing span{width:6px;height:6px;border-radius:50%;background:#9a9aa6;animation:mpChatDot 1.3s infinite ease-in-out}
.mp-typing span:nth-child(2){animation-delay:.15s}.mp-typing span:nth-child(3){animation-delay:.3s}
@keyframes mpChatDot{0%,60%,100%{opacity:.3;transform:scale(.8)}30%{opacity:1;transform:scale(1)}}

.mp-quick{display:flex;flex-wrap:wrap;gap:8px;padding:0 16px 12px;flex-shrink:0}
.mp-quick-btn{font-size:12px;padding:7px 13px;border-radius:20px;border:1px solid var(--border,#eaeaf1);
  background:#fff;color:var(--indigo,#3b2f87);cursor:pointer;transition:all .2s;font-family:inherit}
.mp-quick-btn:hover{background:var(--indigo,#3b2f87);color:#fff;border-color:var(--indigo,#3b2f87)}

.mp-chat-input-row{display:flex;gap:8px;padding:12px 14px;border-top:1px solid var(--border,#eaeaf1);flex-shrink:0;background:#fff}
.mp-chat-input{flex:1;border:1px solid var(--border,#eaeaf1);border-radius:20px;padding:10px 16px;font-size:13.5px;
  outline:none;font-family:inherit;background:var(--bg2,#f6f6fa);color:var(--text,#1d1d29)}
.mp-chat-input:focus{border-color:var(--indigo,#3b2f87)}
.mp-chat-send{width:38px;height:38px;border-radius:50%;border:none;background:var(--indigo,#3b2f87);color:#fff;
  cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:background .2s}
.mp-chat-send:hover{background:var(--indigo-d,#2a2064)}
.mp-chat-send:disabled{opacity:.5;cursor:not-allowed}

/* Cards: product / order / tracking */
.mp-card{align-self:flex-start;max-width:92%;background:#fff;border:1px solid var(--border,#eaeaf1);
  border-radius:10px;padding:12px;font-size:12.5px;width:100%}
.mp-card-product{display:flex;gap:10px}
.mp-card-product img{width:56px;height:56px;object-fit:contain;border-radius:6px;background:var(--bg2,#f6f6fa);flex-shrink:0}
.mp-card-product .info{flex:1;min-width:0}
.mp-card-product .brand{font-size:10.5px;text-transform:uppercase;letter-spacing:.5px;color:var(--indigo,#3b2f87);font-weight:600}
.mp-card-product .title{font-size:12.5px;color:var(--text,#1d1d29);margin:2px 0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mp-card-product .price{font-weight:700;color:var(--red,#e1392c)}
.mp-card-product .msrp{text-decoration:line-through;color:#9a9aa6;font-weight:400;margin-left:4px;font-size:11px}
.mp-card-list{display:flex;flex-direction:column;gap:10px;width:100%}
.mp-card-order-row{display:flex;justify-content:space-between;font-size:12px;padding:4px 0;border-bottom:1px solid var(--border,#eaeaf1)}
.mp-card-order-row:last-child{border-bottom:none}
.mp-card-order-row .lbl{color:#6c6c7a}
.mp-card-order-row .val{font-weight:600;color:var(--text,#1d1d29)}
.mp-card-btn{display:inline-block;margin-top:8px;padding:7px 14px;border-radius:6px;background:var(--indigo,#3b2f87);
  color:#fff!important;font-size:11.5px;font-weight:600;text-decoration:none;text-align:center;margin-right:6px}
.mp-card-btn.secondary{background:#fff;color:var(--indigo,#3b2f87)!important;border:1px solid var(--indigo,#3b2f87)}
.mp-card-status{display:inline-block;padding:3px 10px;border-radius:10px;font-size:10.5px;text-transform:uppercase;
  font-weight:700;letter-spacing:.3px}
.mp-card-status.shipped,.mp-card-status.processing{background:rgba(52,152,219,.12);color:#3498db}
.mp-card-status.delivered,.mp-card-status.confirmed,.mp-card-status.paid{background:rgba(29,138,78,.12);color:#1d8a4e}
.mp-card-status.pending{background:rgba(246,197,24,.18);color:#a8850a}
.mp-card-status.cancelled,.mp-card-status.failed{background:rgba(225,57,44,.1);color:#e1392c}

.mp-login-prompt{align-self:flex-start;max-width:86%}
.mp-login-btn{display:inline-block;margin-top:6px;padding:8px 16px;border-radius:6px;background:var(--indigo,#3b2f87);
  color:#fff!important;font-size:12.5px;font-weight:600;text-decoration:none}