/* Modesty WhatsApp Chatbot — front-end widget */
.modesty-wa{position:fixed;right:22px;bottom:22px;z-index:99990;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif}
.modesty-wa *{box-sizing:border-box}

/* Launcher button */
.modesty-wa__launcher{position:relative;width:62px;height:62px;border-radius:50%;border:0;cursor:pointer;background:#25D366;box-shadow:0 8px 24px rgba(37,211,102,.45);display:flex;align-items:center;justify-content:center;transition:transform .2s ease,box-shadow .2s ease}
.modesty-wa__launcher:hover{transform:scale(1.06);box-shadow:0 10px 30px rgba(37,211,102,.55)}
.modesty-wa__launcher::after{content:"";position:absolute;inset:0;border-radius:50%;background:#25D366;opacity:.55;z-index:-1;animation:mwa-pulse 2.4s ease-out infinite}
@keyframes mwa-pulse{0%{transform:scale(1);opacity:.55}70%{transform:scale(1.7);opacity:0}100%{opacity:0}}

/* Waving hand sits above the button, waves periodically */
.modesty-wa__wave{position:absolute;top:-14px;right:-6px;font-size:26px;transform-origin:70% 70%;animation:mwa-wave 2.6s ease-in-out infinite;pointer-events:none;filter:drop-shadow(0 2px 4px rgba(0,0,0,.2))}
@keyframes mwa-wave{0%,60%,100%{transform:rotate(0deg)}10%{transform:rotate(14deg)}20%{transform:rotate(-8deg)}30%{transform:rotate(14deg)}40%{transform:rotate(-4deg)}50%{transform:rotate(10deg)}}
.modesty-wa.is-open .modesty-wa__wave{display:none}
.modesty-wa.is-open .modesty-wa__launcher::after{display:none}

/* Auto welcome pop bubble */
.modesty-wa__pop{position:absolute;right:0;bottom:78px;width:260px;background:#fff;border-radius:16px;padding:16px 34px 16px 16px;box-shadow:0 12px 34px rgba(15,27,45,.18);animation:mwa-pop .4s ease}
.modesty-wa__pop::after{content:"";position:absolute;right:24px;bottom:-8px;width:16px;height:16px;background:#fff;transform:rotate(45deg);box-shadow:3px 3px 6px rgba(15,27,45,.06)}
.modesty-wa__pop-text{margin:0;font-size:.92rem;line-height:1.45;color:#0F1B2D}
.modesty-wa__pop-close{position:absolute;top:8px;right:10px;border:0;background:transparent;font-size:20px;line-height:1;color:#9aa3ad;cursor:pointer}
@keyframes mwa-pop{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

/* Chat panel */
.modesty-wa__panel{position:absolute;right:0;bottom:78px;width:340px;max-width:calc(100vw - 44px);background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 20px 50px rgba(15,27,45,.28);animation:mwa-pop .35s ease}
.modesty-wa__header{display:flex;align-items:center;gap:12px;padding:14px 16px;background:#075E54;color:#fff}
.modesty-wa__avatar{width:40px;height:40px;border-radius:50%;background:#128C7E;display:flex;align-items:center;justify-content:center;flex:none}
.modesty-wa__headtext{flex:1;line-height:1.2}
.modesty-wa__headtext strong{display:block;font-size:.98rem}
.modesty-wa__status{font-size:.76rem;opacity:.85;display:flex;align-items:center;gap:5px}
.modesty-wa__status::before{content:"";width:7px;height:7px;border-radius:50%;background:#4ce07a;display:inline-block}
.modesty-wa__close{border:0;background:transparent;color:#fff;font-size:24px;line-height:1;cursor:pointer;opacity:.85}
.modesty-wa__close:hover{opacity:1}

/* Body — chat scroll area on a WhatsApp-like background */
.modesty-wa__body{padding:16px;max-height:60vh;min-height:220px;overflow-y:auto;background:#ECE5DD}
.modesty-wa__bubble{background:#fff;border-radius:0 12px 12px 12px;padding:10px 13px;margin:0 0 10px;font-size:.9rem;line-height:1.45;color:#0F1B2D;box-shadow:0 1px 1px rgba(15,27,45,.08);max-width:86%;animation:mwa-bubble .3s ease}
.modesty-wa__bubble--sub{opacity:.9}
@keyframes mwa-bubble{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* Steps / options / inputs */
.modesty-wa__options{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 8px}
.modesty-wa__chip{border:1px solid #25D366;background:#fff;color:#075E54;border-radius:999px;padding:8px 14px;font-size:.85rem;cursor:pointer;transition:background .15s ease,color .15s ease}
.modesty-wa__chip:hover,.modesty-wa__chip.is-selected{background:#25D366;color:#fff}
.modesty-wa__field{margin:6px 0}
.modesty-wa__field input,.modesty-wa__field textarea{width:100%;border:1px solid #d7ddE2;border-radius:10px;padding:11px 13px;font-size:.9rem;font-family:inherit}
.modesty-wa__field textarea{resize:vertical;min-height:64px}
.modesty-wa__row{display:flex;gap:10px}
.modesty-wa__count{flex:1;background:#fff;border:1px solid #d7dde2;border-radius:10px;padding:8px;text-align:center}
.modesty-wa__count label{display:block;font-size:.72rem;color:#6B7280;margin-bottom:4px}
.modesty-wa__stepper{display:flex;align-items:center;justify-content:center;gap:10px}
.modesty-wa__stepper button{width:28px;height:28px;border-radius:8px;border:1px solid #d7dde2;background:#f6f7f8;font-size:16px;cursor:pointer;line-height:1}
.modesty-wa__stepper span{min-width:22px;font-weight:700}

.modesty-wa__actions{display:flex;gap:8px;margin-top:12px}
.modesty-wa__btn{flex:1;border:0;border-radius:10px;padding:12px;font-size:.9rem;font-weight:700;cursor:pointer}
.modesty-wa__btn--primary{background:#25D366;color:#fff}
.modesty-wa__btn--primary:hover{filter:brightness(1.05)}
.modesty-wa__btn--ghost{background:#fff;color:#6B7280;border:1px solid #d7dde2;flex:0 0 auto;padding:12px 16px}
.modesty-wa__btn[disabled]{opacity:.6;cursor:default}

.modesty-wa__footnote{text-align:center;font-size:.72rem;color:#8a929b;padding:8px}

/* Mobile */
@media(max-width:480px){
	.modesty-wa{right:16px;bottom:16px}
	.modesty-wa__panel{width:calc(100vw - 32px)}
}

/* Respect reduced motion */
@media(prefers-reduced-motion:reduce){
	.modesty-wa__wave,.modesty-wa__launcher::after{animation:none}
}