/* Mobile Plan Advisor */
.mpa-wrap{max-width:680px;margin:0 auto;font-family:inherit}
.mpa-chat{min-height:300px;max-height:460px;overflow-y:auto;display:flex;flex-direction:column;gap:10px;padding:0 0 1rem;margin-bottom:12px}
.mpa-bubble{max-width:82%;padding:10px 14px;border-radius:12px;font-size:14px;line-height:1.6}
.mpa-bubble.bot{background:#f4f4f0;color:#1a1a1a;align-self:flex-start;border:1px solid #e0e0d8}
.mpa-bubble.user{background:#dbeafe;color:#1e40af;align-self:flex-end}
.mpa-typing{display:flex;gap:4px;align-items:center;padding:10px 14px;background:#f4f4f0;border:1px solid #e0e0d8;border-radius:12px;align-self:flex-start;width:fit-content}
.mpa-typing span{width:6px;height:6px;border-radius:50%;background:#aaa;animation:mpa-blink 1.2s infinite}
.mpa-typing span:nth-child(2){animation-delay:.2s}
.mpa-typing span:nth-child(3){animation-delay:.4s}
@keyframes mpa-blink{0%,80%,100%{opacity:.3}40%{opacity:1}}
.mpa-opts{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.mpa-opt{font-size:13px;padding:6px 14px;border:1px solid #d1d5db;border-radius:8px;background:#fff;color:#1a1a1a;cursor:pointer;transition:background .15s}
.mpa-opt:hover{background:#f4f4f0}
.mpa-opt.sel{border-color:#3b82f6;background:#dbeafe;color:#1e40af}
.mpa-confirm{font-size:13px;margin-top:8px;padding:6px 16px;border:1px solid #d1d5db;border-radius:8px;background:#fff;color:#1a1a1a;cursor:pointer}
.mpa-confirm:hover{background:#f4f4f0}
.mpa-input-row{display:flex;gap:8px;border-top:1px solid #e5e7eb;padding-top:12px}
.mpa-text{flex:1;padding:8px 12px;font-size:14px;border:1px solid #d1d5db;border-radius:8px;background:#fff;color:#1a1a1a}
.mpa-text:focus{outline:none;border-color:#93c5fd}
.mpa-btn{padding:8px 16px;font-size:14px;border:1px solid #d1d5db;border-radius:8px;background:#fff;color:#1a1a1a;cursor:pointer}
.mpa-btn:hover{background:#f4f4f0}
.mpa-btn:disabled,.mpa-text:disabled{opacity:.5;cursor:default}
/* Plan cards */
.mpa-plan{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:1rem 1.25rem;margin-top:8px}
.mpa-plan.top{border:2px solid #3b82f6}
.mpa-top-badge{display:inline-block;font-size:11px;background:#dbeafe;color:#1d4ed8;padding:2px 8px;border-radius:6px;margin-bottom:6px}
.mpa-plan-name{font-size:15px;font-weight:600;color:#111}
.mpa-carrier{font-size:12px;color:#6b7280;margin-bottom:2px}
.mpa-price{font-size:22px;font-weight:700;color:#111;margin:4px 0}
.mpa-price span{font-size:13px;font-weight:400;color:#6b7280}
.mpa-data{font-size:13px;color:#6b7280}
.mpa-badges{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
.mpa-badge{font-size:11px;padding:3px 8px;border-radius:6px;background:#f3f4f6;color:#6b7280;border:1px solid #e5e7eb}
.mpa-badge.good{background:#d1fae5;color:#065f46}
.mpa-special{font-size:12px;color:#6b7280;margin-top:4px}
.mpa-ai-note{font-size:13px;color:#374151;background:#f9fafb;border-left:3px solid #3b82f6;padding:8px 12px;border-radius:0 8px 8px 0;margin-top:10px;line-height:1.6}
.mpa-relaxed{font-size:12px;color:#92400e;background:#fef3c7;border-radius:6px;padding:6px 10px;margin-top:4px}
.mpa-disclaimer{font-size:11px;color:#9ca3af;margin-top:12px;padding:8px 12px;border-left:2px solid #e5e7eb;line-height:1.5}
/* Dark mode */
@media (prefers-color-scheme:dark){
  .mpa-bubble.bot{background:#1e1e1e;color:#e5e5e5;border-color:#333}
  .mpa-opt,.mpa-confirm,.mpa-btn,.mpa-text{background:#1e1e1e;color:#e5e5e5;border-color:#444}
  .mpa-plan{background:#1e1e1e;border-color:#333;color:#e5e5e5}
  .mpa-plan-name{color:#f3f4f6}
  .mpa-price{color:#f3f4f6}
  .mpa-ai-note{background:#111;color:#d1d5db}
  .mpa-text:focus{border-color:#3b82f6}
}

/* Free-text hint and updated option layout */
.mpa-opts-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:6px}
.mpa-free-hint{font-size:11px;color:#9ca3af;margin-top:4px;font-style:italic}

/* AI recommendation blocks */
.mpa-ai-rec{margin:-4px 0 12px;padding:8px 12px;background:var(--mpa-rec-bg,#f0f7ff);border-left:3px solid #3b82f6;border-radius:0 0 8px 8px;font-size:13px;line-height:1.6}
.mpa-ai-why{color:#1e40af;margin-bottom:2px}
.mpa-ai-highlight{color:#065f46}
@media(prefers-color-scheme:dark){.mpa-ai-rec{background:#0f172a;border-color:#3b82f6}.mpa-ai-why{color:#93c5fd}.mpa-ai-highlight{color:#6ee7b7}}
.mpa-ai-expert{color:#6b7280;margin-top:4px;font-style:italic}
@media(prefers-color-scheme:dark){.mpa-ai-expert{color:#9ca3af}}

/* ── Floating widget ───────────────────────────── */
#mpa-float-btn {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 99998;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 20px;
  background: #1d4ed8;
  color: #fff;
  border-radius: 50px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  box-shadow: 0 4px 20px rgba(29,78,216,.45);
  transition: transform .2s, box-shadow .2s;
  user-select: none;
}
#mpa-float-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 28px rgba(29,78,216,.55); }
#mpa-float-btn svg { flex-shrink: 0; }

#mpa-float-popup {
  position: fixed;
  bottom: 90px;
  right: 24px;
  z-index: 99999;
  width: 400px;
  max-width: calc(100vw - 32px);
  max-height: 80vh;
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 8px 48px rgba(0,0,0,.18);
  display: none;
  flex-direction: column;
  overflow: hidden;
  transition: opacity .2s, transform .2s;
  opacity: 0;
  transform: translateY(12px) scale(.97);
}
#mpa-float-popup.mpa-open {
  display: flex;
  opacity: 1;
  transform: translateY(0) scale(1);
}

#mpa-float-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  background: #1d4ed8;
  color: #fff;
  flex-shrink: 0;
}
#mpa-float-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 600;
}
#mpa-float-close {
  background: none;
  border: none;
  color: #fff;
  font-size: 22px;
  cursor: pointer;
  line-height: 1;
  padding: 0 4px;
  opacity: .8;
  transition: opacity .15s;
}
#mpa-float-close:hover { opacity: 1; }

#mpa-float-body {
  overflow-y: auto;
  padding: 12px 16px 16px;
  flex: 1;
}
#mpa-float-body .mpa-wrap { max-width: 100%; }
#mpa-float-body .mpa-chat { max-height: 300px; }

/* Mobile */
@media (max-width: 480px) {
  #mpa-float-btn span { display: none; }
  #mpa-float-btn { padding: 14px; border-radius: 50%; }
  #mpa-float-popup {
    bottom: 0;
    right: 0;
    left: 0;
    width: 100%;
    max-width: 100%;
    max-height: 90vh;
    border-radius: 20px 20px 0 0;
    bottom: 0;
  }
}
@media (prefers-color-scheme: dark) {
  #mpa-float-popup { background: #111; }
  #mpa-float-body .mpa-bubble.bot { background: #1e1e1e; color: #e5e5e5; }
}

/* ── Promo tooltip ─────────────────────────────── */
#mpa-promo {
  position: fixed;
  bottom: 90px;
  right: 24px;
  z-index: 99997;
  background: #fff;
  color: #1a1a1a;
  font-size: 13px;
  font-weight: 500;
  padding: 10px 14px 10px 16px;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0,0,0,.14);
  display: flex;
  align-items: center;
  gap: 6px;
  max-width: 260px;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity .3s, transform .3s;
  pointer-events: none;
  border-left: 3px solid #1d4ed8;
}
#mpa-promo.mpa-promo-show {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.mpa-promo-arrow { color: #1d4ed8; font-weight: 700; }
.mpa-promo-close {
  background: none;
  border: none;
  color: #9ca3af;
  font-size: 16px;
  cursor: pointer;
  padding: 0 0 0 4px;
  line-height: 1;
  flex-shrink: 0;
}
.mpa-promo-close:hover { color: #1a1a1a; }
@media (max-width: 480px) {
  #mpa-promo { right: 16px; bottom: 82px; max-width: calc(100vw - 32px); }
}

/* Profile change note */
.mpa-change-note{font-size:13px;color:#1d4ed8;background:#eff6ff;border-radius:8px;padding:7px 12px;margin-bottom:8px;border-left:3px solid #1d4ed8}