/* ───────── MITZTIANPC CHATBOT — dark theme ───────── */
.mpc-chatbot-container{
  --c-navy:#0A1628; --c-navy2:#0F2142; --c-deep:#0D3B7A;
  --c-cyan:#4FC3F7; --c-orange:#E65100; --c-orange-l:#FF6D00;
  --c-muted:#8FA3BC; --c-body:#C5D4E8; --c-line:rgba(255,255,255,.1);
  position:fixed;
  bottom:calc(20px + env(safe-area-inset-bottom,0px));
  right:20px;
  z-index:998;
  display:flex;          /* removes the inline line-box gap under the button */
  align-items:flex-end;
  font-family:'Manrope',system-ui,sans-serif;
}
.mpc-chatbot-container *{box-sizing:border-box}
.mpc-chatbot-container button:focus-visible,
.mpc-chatbot-container input:focus-visible{outline:3px solid var(--c-cyan);outline-offset:2px}

/* ── Toggle button (same layout as the Feedback button) ── */
.mpc-chatbot-toggle{
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;
  height:52px;min-width:128px;padding:0 20px;border-radius:26px;border:none;cursor:pointer;
  background:linear-gradient(135deg,var(--c-orange),var(--c-orange-l));color:#fff;
  font-family:'Manrope',system-ui,sans-serif;font-size:.85rem;font-weight:800;line-height:1;
  box-shadow:0 8px 24px rgba(230,81,0,.45);
  transition:transform .2s,box-shadow .2s;
}
.mpc-chatbot-toggle::after{content:'Chat'}
.mpc-chatbot-toggle.mpc-active::after{content:'Close'}
.mpc-chatbot-toggle:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(230,81,0,.6)}
.mpc-chatbot-toggle svg{width:16px;height:16px;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;transition:opacity .2s,transform .2s}
.mpc-chatbot-toggle .mpc-chat-icon-open{position:static;opacity:1;transform:rotate(0)}
.mpc-chatbot-toggle .mpc-chat-icon-close{position:absolute;left:20px;top:50%;margin-top:-8px;opacity:0;transform:rotate(90deg)}
.mpc-chatbot-toggle.mpc-active .mpc-chat-icon-open{opacity:0;transform:rotate(-90deg)}
.mpc-chatbot-toggle.mpc-active .mpc-chat-icon-close{opacity:1;transform:rotate(0)}

.mpc-chatbot-badge{
  position:absolute;top:-4px;right:-4px;min-width:22px;height:22px;border-radius:50%;
  background:var(--c-cyan);color:var(--c-navy);font-size:.72rem;font-weight:800;
  display:flex;align-items:center;justify-content:center;
  border:2px solid var(--c-navy);animation:mpc-badge-pulse 2s infinite;
}
.mpc-chatbot-badge.mpc-hidden{display:none}
@keyframes mpc-badge-pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}

/* ── Window ── */
.mpc-chatbot-window{
  position:absolute;bottom:64px;right:0;
  width:390px;max-width:calc(100vw - 32px);
  height:620px;max-height:calc(100vh - 120px);
  background:var(--c-navy);
  border:1px solid var(--c-line);
  border-radius:20px;
  box-shadow:0 24px 70px rgba(0,0,0,.55);
  display:none;flex-direction:column;overflow:hidden;
  animation:mpc-chat-slide-up .3s cubic-bezier(.22,.61,.36,1);
}
.mpc-chatbot-window.mpc-open{display:flex}
@keyframes mpc-chat-slide-up{from{opacity:0;transform:translateY(20px) scale(.96)}}

/* ── Header ── */
.mpc-chatbot-header{
  background:linear-gradient(135deg,var(--c-deep),var(--c-navy) 85%);
  padding:16px 18px;display:flex;align-items:center;justify-content:space-between;gap:10px;
  border-bottom:1px solid var(--c-line);flex-shrink:0;
}
.mpc-chatbot-header-info{display:flex;align-items:center;gap:12px;min-width:0}
.mpc-chatbot-avatar{
  width:42px;height:42px;border-radius:12px;flex-shrink:0;
  background:linear-gradient(135deg,var(--c-orange),var(--c-orange-l));
  display:flex;align-items:center;justify-content:center;
}
.mpc-chatbot-avatar svg{width:22px;height:22px;stroke:#fff}
.mpc-chatbot-header h3{
  font-family:'Unbounded',sans-serif;font-size:.92rem;font-weight:700;letter-spacing:-.02em;
  color:#fff;margin:0;
}
.mpc-chatbot-status{
  font-size:.78rem;color:var(--c-body);margin:3px 0 0;display:flex;align-items:center;gap:6px;
}
.mpc-status-dot{width:8px;height:8px;background:#34D399;border-radius:50%;animation:mpc-pulse-dot 2s infinite}
@keyframes mpc-pulse-dot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.7)}}
.mpc-chatbot-minimize{
  width:40px;height:40px;border-radius:10px;flex-shrink:0;
  background:rgba(255,255,255,.07);border:1px solid var(--c-line);color:var(--c-body);
  cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s,color .2s;
}
.mpc-chatbot-minimize:hover{background:rgba(255,255,255,.15);color:#fff}
.mpc-chatbot-minimize svg{width:18px;height:18px}

/* ── Messages ── */
.mpc-chatbot-messages{
  flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;
  padding:18px 16px;background:var(--c-navy2);
  display:flex;flex-direction:column;gap:14px;
}
.mpc-chatbot-messages::-webkit-scrollbar{width:6px}
.mpc-chatbot-messages::-webkit-scrollbar-track{background:transparent}
.mpc-chatbot-messages::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:3px}

.mpc-chat-message{display:flex;gap:10px;animation:mpc-message-slide .3s ease-out}
@keyframes mpc-message-slide{from{opacity:0;transform:translateY(10px)}}
.mpc-chat-message.mpc-user{flex-direction:row-reverse}

.mpc-message-avatar{width:32px;height:32px;border-radius:10px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.mpc-chat-message.mpc-bot .mpc-message-avatar{background:rgba(79,195,247,.16)}
.mpc-chat-message.mpc-bot .mpc-message-avatar svg{stroke:var(--c-cyan)}
.mpc-chat-message.mpc-user .mpc-message-avatar{background:rgba(255,255,255,.1)}
.mpc-message-avatar svg{width:17px;height:17px;stroke:#fff}

.mpc-message-content{
  max-width:78%;min-width:0;
  background:rgba(255,255,255,.07);border:1px solid var(--c-line);
  padding:12px 14px;border-radius:4px 16px 16px 16px;
  overflow-wrap:anywhere;
}
.mpc-chat-message.mpc-user .mpc-message-content{
  background:linear-gradient(135deg,var(--c-orange),var(--c-orange-l));
  border-color:transparent;border-radius:16px 4px 16px 16px;color:#fff;
}
.mpc-message-content p{font-size:.92rem;line-height:1.6;margin:0;color:var(--c-body)}
.mpc-message-content strong{color:#fff}
.mpc-chat-message.mpc-user .mpc-message-content p{color:#fff}
.mpc-message-time{font-size:.72rem !important;color:var(--c-muted) !important;margin-top:6px !important}
.mpc-chat-message.mpc-user .mpc-message-time{color:rgba(255,255,255,.8) !important}

.mpc-help-list{list-style:none;padding:8px 0 0;margin:0;display:flex;flex-direction:column;gap:5px}
.mpc-help-list li{font-size:.9rem;color:var(--c-body);padding-left:22px;position:relative}
.mpc-help-list li::before{
  content:'';position:absolute;left:0;top:3px;width:14px;height:14px;border-radius:4px;
  background:var(--c-cyan) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%230A1628' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='2.5,6.5 5,9 9.5,3.5'/%3E%3C/svg%3E") center/10px no-repeat;
}

/* ── Quick actions ── */
.mpc-quick-actions{
  display:flex;flex-wrap:wrap;gap:8px;padding:14px;
  background:rgba(255,255,255,.04);border:1px solid var(--c-line);border-radius:16px;
  animation:mpc-message-slide .4s ease-out;
}
.mpc-quick-actions-label{width:100%;font-size:.82rem;font-weight:700;color:var(--c-muted);margin:0 0 4px}
.mpc-quick-btn{
  min-height:40px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);color:#fff;
  font-size:.85rem;font-weight:600;padding:8px 14px;border-radius:100px;cursor:pointer;
  transition:background .2s,border-color .2s,transform .2s;font-family:'Manrope',sans-serif;
}
.mpc-quick-btn:hover{background:var(--c-orange);border-color:var(--c-orange-l);transform:translateY(-1px)}

/* ── Typing indicator ── */
.mpc-typing-indicator{
  display:none;align-items:center;gap:10px;padding:0 16px 14px;
  background:var(--c-navy2);flex-shrink:0;animation:mpc-message-slide .3s ease-out;
}
.mpc-typing-indicator.mpc-show{display:flex}
.mpc-typing-indicator .mpc-message-avatar{background:rgba(79,195,247,.16)}
.mpc-typing-indicator .mpc-message-avatar svg{stroke:var(--c-cyan)}
.mpc-typing-dots{
  background:rgba(255,255,255,.07);border:1px solid var(--c-line);
  padding:13px 16px;border-radius:4px 16px 16px 16px;display:flex;gap:5px;
}
.mpc-typing-dots span{width:7px;height:7px;background:var(--c-cyan);border-radius:50%;animation:mpc-typing 1.4s infinite}
.mpc-typing-dots span:nth-child(2){animation-delay:.2s}
.mpc-typing-dots span:nth-child(3){animation-delay:.4s}
@keyframes mpc-typing{0%,60%,100%{transform:translateY(0);opacity:.6}30%{transform:translateY(-6px);opacity:1}}

/* ── Input ── */
.mpc-chatbot-input{
  display:flex;gap:10px;padding:12px 14px calc(12px + env(safe-area-inset-bottom,0px));
  background:var(--c-navy);border-top:1px solid var(--c-line);flex-shrink:0;
}
.mpc-chatbot-input input{
  flex:1;min-width:0;border:1px solid var(--c-line);border-radius:100px;padding:12px 18px;
  font-size:1rem;color:#fff;background:rgba(255,255,255,.07);outline:none;
  transition:border-color .2s,background .2s;font-family:'Manrope',sans-serif;
}
.mpc-chatbot-input input::placeholder{color:#6F84A0}
.mpc-chatbot-input input:focus{border-color:var(--c-cyan);background:rgba(255,255,255,.1)}
.mpc-chatbot-input button{
  width:46px;height:46px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(135deg,var(--c-orange),var(--c-orange-l));
  border:none;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:transform .2s,box-shadow .2s;
}
.mpc-chatbot-input button:hover{transform:scale(1.06);box-shadow:0 6px 16px rgba(230,81,0,.5)}
.mpc-chatbot-input button svg{width:19px;height:19px}

/* ── Action buttons ── */
.mpc-action-buttons{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.mpc-action-btn{
  min-height:44px;background:linear-gradient(135deg,var(--c-orange),var(--c-orange-l));
  color:#fff;border:none;padding:10px 16px;border-radius:10px;
  font-size:.88rem;font-weight:700;cursor:pointer;text-align:center;
  transition:transform .2s,box-shadow .2s;font-family:'Manrope',sans-serif;
}
.mpc-action-btn:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(230,81,0,.4)}
.mpc-action-btn.mpc-secondary{background:transparent;border:1px solid var(--c-cyan);color:var(--c-cyan)}
.mpc-action-btn.mpc-secondary:hover{background:var(--c-cyan);color:var(--c-navy);box-shadow:none}

/* ── Plan cards ── */
.mpc-plan-card{
  background:rgba(10,22,40,.6);border:1px solid var(--c-line);border-radius:12px;
  padding:14px;margin-top:8px;transition:border-color .2s;
}
.mpc-plan-card:first-child{margin-top:0}
.mpc-plan-card:hover{border-color:var(--c-orange-l)}
.mpc-plan-card-header{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px}
.mpc-plan-name{font-family:'Unbounded',sans-serif;font-size:.85rem;font-weight:700;letter-spacing:-.02em;color:#fff}
.mpc-plan-price{font-family:'Unbounded',sans-serif;font-size:1rem;font-weight:800;color:var(--c-orange-l);white-space:nowrap}
.mpc-plan-details{font-size:.85rem;color:var(--c-muted);line-height:1.6}
.mpc-plan-details strong{color:var(--c-body)}

/* ── Phones: round icon-only button (same as Feedback) ── */
@media (max-width:520px){
  .mpc-chatbot-toggle{width:52px;min-width:0;padding:0;gap:0;border-radius:50%;font-size:0}
  .mpc-chatbot-toggle::after{content:none !important}
  .mpc-chatbot-toggle svg{width:20px;height:20px}
  .mpc-chatbot-toggle .mpc-chat-icon-close{left:50%;margin-top:-10px;margin-left:-10px}
}

/* ── Phones: full-screen sheet ── */
@media (max-width:540px){
  .mpc-chatbot-container{right:14px;bottom:calc(14px + env(safe-area-inset-bottom,0px))}
  .mpc-chatbot-window{
    position:fixed;inset:0;width:100%;max-width:none;
    height:100vh;height:100dvh;max-height:none;border-radius:0;border:none;
  }
  .mpc-chatbot-header{padding-top:calc(14px + env(safe-area-inset-top,0px))}
  .mpc-message-content{max-width:86%}
  .mpc-quick-btn{flex:1 1 calc(50% - 8px);justify-content:center}
}

@media (prefers-reduced-motion:reduce){
  .mpc-chatbot-container *{animation-duration:.01ms !important;transition:none !important}
}