#mpwc-root, #mpwc-root * { box-sizing: border-box; }
#mpwc-root { --mpwc-green: #25d366; --mpwc-dark: #075e54; font-family: inherit; position: fixed; right: 22px; bottom: 22px; z-index: 999999; direction: rtl; }
#mpwc-root button, #mpwc-root textarea { font: inherit; }
#mpwc-root button { cursor: pointer; }
#mpwc-root .mpwc-fab { display: flex; align-items: center; justify-content: center; gap: 9px; min-height: 58px; padding: 0 18px; border: 0; border-radius: 999px; background: var(--mpwc-green); color: #fff; box-shadow: 0 6px 24px rgba(0,0,0,.2); transition: transform .2s ease, box-shadow .2s ease; }
#mpwc-root .mpwc-fab:hover { transform: translateY(-2px); box-shadow: 0 9px 28px rgba(0,0,0,.25); }
#mpwc-root svg { display: block; width: 28px; height: 28px; fill: currentColor; flex: 0 0 auto; }
#mpwc-root .mpwc-fab-label { font-size: 14px; font-weight: 700; white-space: nowrap; }
#mpwc-root .mpwc-panel { position: absolute; right: 0; bottom: 76px; width: 340px; max-width: calc(100vw - 32px); overflow: hidden; border-radius: 18px; background: #fff; box-shadow: 0 12px 45px rgba(0,0,0,.22); opacity: 0; visibility: hidden; transform: translateY(12px) scale(.98); transform-origin: bottom right; transition: opacity .2s ease, transform .2s ease, visibility .2s ease; color: #222; }
#mpwc-root .mpwc-panel.mpwc-open { opacity: 1; visibility: visible; transform: translateY(0) scale(1); }
#mpwc-root .mpwc-panel-header { display: flex; align-items: center; gap: 11px; padding: 17px; background: var(--mpwc-dark); color: #fff; }
#mpwc-root .mpwc-avatar { width: 43px; height: 43px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.16); }
#mpwc-root .mpwc-avatar svg { width: 27px; height: 27px; }
#mpwc-root .mpwc-header-copy { display: flex; flex-direction: column; gap: 4px; flex: 1; }
#mpwc-root .mpwc-header-copy strong { font-size: 16px; }
#mpwc-root .mpwc-header-copy span { font-size: 12px; opacity: .9; }
#mpwc-root .mpwc-header-copy i { display: inline-block; width: 7px; height: 7px; margin-left: 4px; border-radius: 50%; background: #67ef91; }
#mpwc-root .mpwc-close { width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: #fff; font-size: 27px; line-height: 1; }
#mpwc-root .mpwc-close:hover { background: rgba(255,255,255,.14); }
#mpwc-root .mpwc-panel-body { padding: 18px; }
#mpwc-root .mpwc-greeting { padding: 13px 14px; border-radius: 12px 12px 3px 12px; background: #f0f7f2; color: #26352b; font-size: 14px; line-height: 1.8; white-space: pre-line; overflow-wrap: anywhere; }
#mpwc-root .mpwc-message-label { display: block; margin: 16px 0 7px; font-size: 13px; font-weight: 700; }
#mpwc-root #mpwc-message { display: block; width: 100%; min-height: 78px; resize: vertical; padding: 10px 12px; border: 1px solid #d9e1dc; border-radius: 10px; background: #fff; color: #222; font-size: 14px; line-height: 1.6; outline: none; }
#mpwc-root #mpwc-message:focus { border-color: var(--mpwc-green); box-shadow: 0 0 0 3px rgba(37,211,102,.14); }
#mpwc-root .mpwc-start { display: flex; align-items: center; justify-content: center; gap: 9px; width: 100%; margin-top: 13px; padding: 12px 14px; border: 0; border-radius: 10px; background: var(--mpwc-green); color: #fff; font-weight: 700; font-size: 14px; }
#mpwc-root .mpwc-start:hover { background: #1fbd5b; }
#mpwc-root .mpwc-start svg { width: 22px; height: 22px; }
#mpwc-root .mpwc-note { display: block; margin-top: 10px; text-align: center; color: #78817b; font-size: 11px; }
#mpwc-root .mpwc-error { margin: 8px 0 0; color: #b42318; font-size: 12px; }
#mpwc-root [hidden] { display: none !important; }
@media (max-width: 480px) {
  #mpwc-root { right: 14px; bottom: 14px; }
  #mpwc-root .mpwc-fab { min-height: 54px; padding: 0 15px; }
  #mpwc-root .mpwc-panel { width: min(340px, calc(100vw - 28px)); bottom: 68px; }
  #mpwc-root .mpwc-panel-header { padding: 14px; }
  #mpwc-root .mpwc-panel-body { padding: 15px; }
}
@media (prefers-reduced-motion: reduce) { #mpwc-root * { transition: none !important; } }
