/* ===== MCW — base styles (colors via CSS vars applied by JS) ===== */
#mcw-btn{
    position:fixed;bottom:20px;z-index:9998;
    display:flex;align-items:center;gap:10px;
    background:var(--mcw-primary);color:white;
    padding:12px 20px;border-radius:50px;cursor:pointer;border:none;outline:none;
    box-shadow:0 4px 20px var(--mcw-primary-shadow);
    font-family:'Segoe UI',system-ui,sans-serif;font-size:14px;font-weight:700;
    transition:all .3s;user-select:none;
}
#mcw-btn:hover{transform:translateY(-3px);box-shadow:0 8px 28px var(--mcw-primary-shadow)}
#mcw-btn svg{width:22px;height:22px;flex-shrink:0}
.mcw-pulse{
    position:absolute;top:-5px;
    width:14px;height:14px;background:#25d366;border-radius:50%;border:2px solid white;
    animation:mcwPulse 2s infinite;
}
@keyframes mcwPulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.4);opacity:.7}}
@media (prefers-reduced-motion: reduce){
    .mcw-pulse,.mcw-dot{animation:none!important}
    #mcw-btn,#mcw-win,.mcw-opt,.mcw-submit,.mcw-restart-btn{transition:none!important}
    #mcw-btn:hover{transform:none!important}
    .mcw-row,.mcw-opts{animation:none!important}
}

#mcw-win{
    position:fixed;bottom:90px;
    width:360px;max-width:calc(100vw - 28px);
    height:580px;max-height:calc(100vh - 110px);
    background:white;border-radius:20px;
    box-shadow:0 16px 60px rgba(0,0,0,.18);
    z-index:9999;display:flex;flex-direction:column;overflow:hidden;
    font-family:'Segoe UI',system-ui,sans-serif;
    transform:scale(.85) translateY(30px);
    opacity:0;pointer-events:none;
    transition:transform .38s cubic-bezier(.34,1.56,.64,1),opacity .28s ease;
}
#mcw-win.mcw-open{transform:scale(1) translateY(0);opacity:1;pointer-events:all}

.mcw-header{background:var(--mcw-primary);padding:14px 16px;display:flex;align-items:center;gap:12px;flex-shrink:0}
.mcw-hdr-av{width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.2);border:2px solid rgba(255,255,255,.4);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}
.mcw-hdr-title{color:white;font-weight:800;font-size:15px;margin:0;line-height:1.2}
.mcw-hdr-sub{color:rgba(255,255,255,.85);font-size:12px;margin-top:3px;display:flex;align-items:center;gap:5px}
.mcw-online{width:7px;height:7px;background:#25d366;border-radius:50%;display:inline-block;flex-shrink:0}
.mcw-close{background:rgba(255,255,255,.18);border:none;color:white;width:30px;height:30px;border-radius:50%;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:.2s;flex-shrink:0;margin-left:auto}
.mcw-close:hover{background:rgba(255,255,255,.32)}

/* Form */
#mcw-form-wrap{flex:1;overflow-y:auto;padding:20px;background:linear-gradient(160deg,var(--mcw-primary-a08),white 60%)}
#mcw-form-wrap::-webkit-scrollbar{width:4px}
#mcw-form-wrap::-webkit-scrollbar-thumb{background:#ddd;border-radius:2px}
.mcw-form-ttl{font-size:15px;font-weight:800;color:#1a1a2e;margin-bottom:18px}
.mcw-field{margin-bottom:14px}
.mcw-lbl{display:block;font-size:12px;font-weight:700;color:#555;margin-bottom:5px;letter-spacing:.3px}
.mcw-inp{width:100%;padding:10px 13px;border:1.5px solid #e5e7eb;border-radius:10px;font-size:13px;font-family:inherit;outline:none;transition:.2s;box-sizing:border-box;background:white}
.mcw-inp:focus{border-color:var(--mcw-primary);box-shadow:0 0 0 3px var(--mcw-primary-a15)}
.mcw-inp::placeholder{color:#bbb}
textarea.mcw-inp{resize:vertical;min-height:70px}
.mcw-inp.err{border-color:#e74c3c;box-shadow:0 0 0 3px rgba(231,76,60,.12)}
.mcw-submit{width:100%;padding:12px;margin-top:6px;background:var(--mcw-primary);color:white;border:none;border-radius:12px;font-size:14px;font-weight:800;cursor:pointer;transition:all .2s;font-family:inherit;box-shadow:0 3px 12px var(--mcw-primary-shadow)}
.mcw-submit:hover{background:var(--mcw-primary-dark);transform:translateY(-1px)}
.mcw-submit:disabled{opacity:.6;cursor:not-allowed;transform:none}
.mcw-privacy{font-size:11px;line-height:1.5;color:#666;margin-top:4px;margin-bottom:2px}
.mcw-privacy a{color:var(--mcw-primary);font-weight:600;text-decoration:underline}
.mcw-privacy p{margin:.4em 0}
#mcw-form-err{display:none;margin-top:12px;padding:10px 12px;border-radius:10px;font-size:12px;font-weight:600;line-height:1.45;color:#721c24;background:#f8d7da;border:1px solid #f5c6cb}
#mcw-form-err:not(:empty){display:block}
.mcw-hp-wrap{position:absolute!important;clip:rect(1px,1px,1px,1px)!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;border:0!important;overflow:hidden!important;white-space:nowrap!important}
.mcw-recaptcha-wrap{margin:12px 0 4px;transform:scale(.9);transform-origin:left top;min-height:78px}

/* Chat */
#mcw-body{flex:1;overflow-y:auto;padding:16px;background:#f0f2f5;display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth}
#mcw-body::-webkit-scrollbar{width:4px}
#mcw-body::-webkit-scrollbar-thumb{background:#d0d0d0;border-radius:2px}

.mcw-row{display:flex;gap:8px;animation:mcwFUp .3s ease}
@keyframes mcwFUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.mcw-row.user{flex-direction:row-reverse}
.mcw-av{width:32px;height:32px;border-radius:50%;background:var(--mcw-primary);display:flex;align-items:center;justify-content:center;font-size:15px;flex-shrink:0;overflow:hidden;align-self:flex-end}
.mcw-bubble{max-width:75%;padding:10px 14px;border-radius:18px;font-size:13px;line-height:1.55;word-break:break-word}
.mcw-bubble.bot{background:white;color:#222;border-radius:18px 18px 18px 4px;box-shadow:0 1px 4px rgba(0,0,0,.1)}
.mcw-bubble.bot a{color:var(--mcw-primary);font-weight:700;text-decoration:underline}
.mcw-bubble.bot a:hover{color:var(--mcw-primary-dark)}
.mcw-bubble.user{background:var(--mcw-primary);color:white;border-radius:18px 18px 4px 18px}
.mcw-bubble.typing{display:flex;gap:5px;align-items:center;padding:12px 16px}
.mcw-dot{width:8px;height:8px;background:#bbb;border-radius:50%;animation:mcwDot 1.3s infinite}
.mcw-dot:nth-child(2){animation-delay:.2s}.mcw-dot:nth-child(3){animation-delay:.4s}
@keyframes mcwDot{0%,80%,100%{transform:scale(.7);opacity:.5}40%{transform:scale(1);opacity:1}}

.mcw-opts{display:flex;flex-direction:column;gap:7px;padding:4px 0 4px 40px;animation:mcwFUp .35s ease}
.mcw-opt{background:white;border:2px solid var(--mcw-primary);color:var(--mcw-primary);padding:9px 16px;border-radius:24px;cursor:pointer;font-size:13px;font-weight:700;text-align:left;transition:all .2s;font-family:inherit;width:100%}
.mcw-opt:hover{background:var(--mcw-primary);color:white;transform:translateX(4px)}
.mcw-opt:disabled{opacity:.5;cursor:not-allowed;transform:none}

.mcw-restart-wrap{display:flex;justify-content:center;padding:6px 0}
.mcw-restart-btn{background:none;border:1.5px solid #ddd;color:#999;padding:6px 18px;border-radius:20px;cursor:pointer;font-size:12px;transition:.2s;font-family:inherit}
.mcw-restart-btn:hover{border-color:var(--mcw-primary);color:var(--mcw-primary)}

.mcw-footer-bar{padding:8px 16px;text-align:center;font-size:11px;color:#bbb;background:white;border-top:1px solid #f0f0f0;flex-shrink:0}
.mcw-footer-bar a{color:var(--mcw-primary);text-decoration:none;font-weight:700}

@media(max-width:400px){
    #mcw-win{width:calc(100vw - 16px);left:8px!important;right:8px!important;bottom:80px;border-radius:16px}
    #mcw-btn{padding:11px 16px;font-size:13px}
}
