/* WA Click Chat – front-end styles */
.wacc{--wacc-bg:#25a244;--wacc-fg:#fff;--wacc-size:56px;--wacc-x:20px;--wacc-y:20px;--wacc-z:99999;position:fixed;z-index:var(--wacc-z);font:15px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;box-sizing:border-box}
.wacc *,.wacc *::before,.wacc *::after{box-sizing:border-box}
.wacc.wacc-absolute{position:absolute}
.wacc.wacc-hidden{display:none!important}
.wacc.wacc-offline-hidden{display:none!important}

/* Positions */
.wacc-pos-bottom-right{right:var(--wacc-x);bottom:var(--wacc-y)}
.wacc-pos-bottom-left{left:var(--wacc-x);bottom:var(--wacc-y)}
.wacc-pos-top-right{right:var(--wacc-x);top:var(--wacc-y)}
.wacc-pos-top-left{left:var(--wacc-x);top:var(--wacc-y)}
.wacc-pos-middle-right{right:var(--wacc-x);top:50%;transform:translateY(-50%)}
.wacc-pos-middle-left{left:var(--wacc-x);top:50%;transform:translateY(-50%)}
.wacc-pos-bottom-center{left:50%;bottom:var(--wacc-y);transform:translateX(-50%)}

/* Button base */
.wacc-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:var(--wacc-size);min-width:var(--wacc-size);background:var(--wacc-bg);color:var(--wacc-fg)!important;text-decoration:none!important;cursor:pointer;border:0;box-shadow:0 6px 18px rgba(0,0,0,.22);transition:transform .2s ease,box-shadow .2s ease,filter .2s;-webkit-tap-highlight-color:transparent}
.wacc-btn:hover{filter:brightness(1.06);box-shadow:0 8px 22px rgba(0,0,0,.28)}
.wacc-btn:focus-visible{outline:3px solid rgba(255,255,255,.9);outline-offset:2px;box-shadow:0 0 0 5px var(--wacc-bg)}
.wacc-ico{display:inline-flex;width:calc(var(--wacc-size)*.55);height:calc(var(--wacc-size)*.55);color:var(--wacc-fg)}
.wacc-svg{width:100%;height:100%}
.wacc-txt{font-weight:600;white-space:nowrap}
.wacc-img{display:block;width:var(--wacc-size);height:var(--wacc-size);object-fit:cover;border-radius:inherit}

/* 1 – circle icon */
.wacc-style-1 .wacc-btn{width:var(--wacc-size);height:var(--wacc-size);border-radius:50%}
.wacc-style-1 .wacc-txt{display:none}
/* 2 – pill */
.wacc-style-2 .wacc-btn{border-radius:999px;padding:0 20px 0 14px}
/* 3 – rounded rectangle with icon chip */
.wacc-style-3 .wacc-btn{border-radius:14px;padding:6px 18px 6px 6px}
.wacc-style-3 .wacc-ico{background:rgba(255,255,255,.2);border-radius:10px;width:calc(var(--wacc-size) - 12px);height:calc(var(--wacc-size) - 12px);padding:8px}
/* 4 – expands on hover */
.wacc-style-4 .wacc-btn{border-radius:999px;padding:0;width:var(--wacc-size);overflow:hidden;justify-content:flex-start;transition:width .3s ease,padding .3s ease,box-shadow .2s}
.wacc-style-4 .wacc-ico{flex:none;margin-left:calc((var(--wacc-size) - var(--wacc-size)*.55)/2)}
.wacc-style-4 .wacc-txt{opacity:0;transition:opacity .2s;padding-right:20px}
.wacc-style-4 .wacc-btn:hover,.wacc-style-4 .wacc-btn:focus-visible{width:240px}
.wacc-style-4 .wacc-btn:hover .wacc-txt,.wacc-style-4 .wacc-btn:focus-visible .wacc-txt{opacity:1}
/* 5 – text only */
.wacc-style-5 .wacc-ico{display:none}
.wacc-style-5 .wacc-btn{border-radius:8px;padding:0 24px}
/* 6 – outline pill */
.wacc-style-6 .wacc-btn{background:#fff;color:var(--wacc-bg)!important;border:2px solid var(--wacc-bg);border-radius:999px;padding:0 20px 0 14px}
.wacc-style-6 .wacc-ico{color:var(--wacc-bg)}
.wacc-style-6 .wacc-svg path:last-child{fill:#fff}
/* 7 – square icon */
.wacc-style-7 .wacc-btn{width:var(--wacc-size);height:var(--wacc-size);border-radius:4px}
.wacc-style-7 .wacc-txt{display:none}
/* 8 – gradient pill */
.wacc-style-8 .wacc-btn{background:linear-gradient(135deg,var(--wacc-bg),color-mix(in srgb,var(--wacc-bg) 55%,#000));border-radius:999px;padding:0 22px 0 14px}
/* 9 – full-width bar */
.wacc-style-9{left:0!important;right:0!important;bottom:0!important;top:auto!important;transform:none!important}
.wacc-style-9 .wacc-btn{display:flex;width:100%;border-radius:0;box-shadow:0 -2px 10px rgba(0,0,0,.18)}
/* 10 – edge tab */
.wacc-style-10.wacc-pos-bottom-right,.wacc-style-10.wacc-pos-middle-right,.wacc-style-10.wacc-pos-top-right{right:0}
.wacc-style-10.wacc-pos-bottom-left,.wacc-style-10.wacc-pos-middle-left,.wacc-style-10.wacc-pos-top-left{left:0}
.wacc-style-10 .wacc-btn{border-radius:10px 10px 0 0;padding:0 18px;min-height:42px;transform-origin:center}
.wacc-style-10.wacc-pos-bottom-right .wacc-btn,.wacc-style-10.wacc-pos-middle-right .wacc-btn,.wacc-style-10.wacc-pos-top-right .wacc-btn{transform:rotate(-90deg) translate(0,-100%);transform-origin:right bottom;border-radius:10px 10px 0 0}
.wacc-style-10 .wacc-ico{width:22px;height:22px}
/* 11 – custom image */
.wacc-style-11 .wacc-btn{background:transparent;box-shadow:none;border-radius:50%;padding:0}
.wacc-style-11 .wacc-txt{display:none}
.wacc-style-11 .wacc-btn:hover{box-shadow:none}

/* Badge */
.wacc-badge{position:absolute;top:-4px;right:-4px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:var(--wacc-badge-bg,#e5383b);color:var(--wacc-badge-fg,#fff);font:700 11px/20px sans-serif;text-align:center;box-shadow:0 0 0 2px #fff}
.wacc-badge[hidden]{display:none}

/* Status dot */
.wacc.wacc-is-online .wacc-btn::after,.wacc.wacc-is-offline .wacc-btn::after{content:"";position:absolute;left:2px;bottom:2px;width:12px;height:12px;border-radius:50%;box-shadow:0 0 0 2px #fff;background:#2ecc71}
.wacc.wacc-is-offline .wacc-btn::after{background:#9aa0a6}
.wacc-style-5.wacc-is-online .wacc-btn::after,.wacc-style-5.wacc-is-offline .wacc-btn::after,.wacc-style-9.wacc-is-online .wacc-btn::after,.wacc-style-9.wacc-is-offline .wacc-btn::after,.wacc-style-10.wacc-is-online .wacc-btn::after,.wacc-style-10.wacc-is-offline .wacc-btn::after{display:none}

/* Button animations */
@keyframes wacc-pulse{0%{box-shadow:0 0 0 0 rgba(37,162,68,.55),0 6px 18px rgba(0,0,0,.22)}70%{box-shadow:0 0 0 16px rgba(37,162,68,0),0 6px 18px rgba(0,0,0,.22)}100%{box-shadow:0 0 0 0 rgba(37,162,68,0),0 6px 18px rgba(0,0,0,.22)}}
@keyframes wacc-bounce{0%,20%,50%,80%,100%{transform:translateY(0)}40%{transform:translateY(-12px)}60%{transform:translateY(-6px)}}
@keyframes wacc-shake{0%,100%{transform:translateX(0)}15%,45%,75%{transform:translateX(-5px)}30%,60%,90%{transform:translateX(5px)}}
@keyframes wacc-wobble{0%,100%{transform:rotate(0)}20%{transform:rotate(-8deg)}40%{transform:rotate(7deg)}60%{transform:rotate(-4deg)}80%{transform:rotate(3deg)}}
@keyframes wacc-ring{0%,100%{transform:rotate(0)}5%,15%,25%{transform:rotate(14deg)}10%,20%,30%{transform:rotate(-14deg)}35%{transform:rotate(0)}}
.wacc-anim-pulse .wacc-btn{animation:wacc-pulse 2.2s infinite}
.wacc-anim-bounce .wacc-btn{animation:wacc-bounce 2.4s infinite}
.wacc-anim-shake .wacc-btn{animation:wacc-shake 3s infinite}
.wacc-anim-wobble .wacc-btn{animation:wacc-wobble 3s infinite}
.wacc-anim-ring .wacc-ico{animation:wacc-ring 3s infinite;transform-origin:50% 50%}
.wacc .wacc-btn:hover,.wacc.wacc-open .wacc-btn{animation-play-state:paused}

/* Entry effects (applied once when shown) */
@keyframes wacc-fx-fade{from{opacity:0}to{opacity:1}}
@keyframes wacc-fx-up{from{opacity:0;margin-bottom:-40px}to{opacity:1;margin-bottom:0}}
@keyframes wacc-fx-side{from{opacity:0;margin-left:60px}to{opacity:1;margin-left:0}}
@keyframes wacc-fx-zoom{from{opacity:0;scale:.3}to{opacity:1;scale:1}}
@keyframes wacc-fx-bounce{0%{opacity:0;scale:.3}50%{opacity:1;scale:1.12}70%{scale:.94}100%{scale:1}}
.wacc-shown.wacc-fx-fade{animation:wacc-fx-fade .6s both}
.wacc-shown.wacc-fx-slide-up{animation:wacc-fx-up .6s both}
.wacc-shown.wacc-fx-slide-side{animation:wacc-fx-side .6s both}
.wacc-shown.wacc-fx-zoom{animation:wacc-fx-zoom .5s both}
.wacc-shown.wacc-fx-bounce-in{animation:wacc-fx-bounce .8s both}

/* Greeting dialog */
.wacc-dialog-wrap{position:absolute;bottom:calc(100% + 12px);right:0;display:none}
.wacc-pos-bottom-left .wacc-dialog-wrap,.wacc-pos-top-left .wacc-dialog-wrap,.wacc-pos-middle-left .wacc-dialog-wrap{right:auto;left:0}
.wacc-pos-top-right .wacc-dialog-wrap,.wacc-pos-top-left .wacc-dialog-wrap{bottom:auto;top:calc(100% + 12px)}
.wacc-pos-bottom-center .wacc-dialog-wrap{right:auto;left:50%;transform:translateX(-50%)}
.wacc-style-9 .wacc-dialog-wrap{right:12px;bottom:calc(100% + 8px)}
.wacc.wacc-open .wacc-dialog-wrap{display:block}
.wacc-dialog{width:320px;max-width:calc(100vw - 32px);max-height:calc(100vh - 140px);display:flex;flex-direction:column;background:#fff;color:#1d2327;border-radius:14px;overflow:hidden;box-shadow:0 14px 44px rgba(0,0,0,.28);animation:wacc-dlg .22s ease-out}
@keyframes wacc-dlg{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
.wacc-size-s .wacc-dialog{width:280px}
.wacc-size-l .wacc-dialog{width:400px}
.wacc-dlg-head{display:flex;align-items:center;gap:10px;padding:14px 16px;background:var(--wacc-head-bg,var(--wacc-bg));color:var(--wacc-head-fg,#fff)}
.wacc-dlg-head img{width:40px;height:40px;border-radius:50%;object-fit:cover;flex:none;background:#fff}
.wacc-dlg-title{flex:1;font-weight:700;font-size:16px;line-height:1.25}
.wacc-dlg-status{display:block;font-weight:400;font-size:12px;opacity:.92}
.wacc-dlg-status::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;background:#2ecc71;vertical-align:baseline}
.wacc-dlg-status.is-off::before{background:#cfd2d6}
.wacc-dlg-close{flex:none;appearance:none;background:transparent;border:0;color:inherit;font-size:22px;line-height:1;cursor:pointer;padding:4px 6px;border-radius:6px}
.wacc-dlg-close:hover{background:rgba(255,255,255,.2)}
.wacc-dlg-close:focus-visible{outline:2px solid currentColor}
.wacc-dlg-body{padding:16px;overflow:auto;background:#f0f2f5}
.wacc-bubble{background:#fff;border-radius:0 12px 12px 12px;padding:10px 14px;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.wacc-bubble p{margin:0 0 .6em}.wacc-bubble p:last-child{margin:0}
.wacc-rich{background:#fff;border-radius:10px;padding:12px 14px}
.wacc-rich img{max-width:100%;height:auto}
.wacc-dlg-foot{padding:10px 16px 14px;background:#fff;border-top:1px solid #e6e8eb}
.wacc-note{margin:0 0 10px;font-size:12px;color:#646970;text-align:center}
.wacc-cta{display:block;width:100%;appearance:none;border:0;border-radius:999px;background:var(--wacc-bg);color:var(--wacc-fg);font:600 15px/1 inherit;padding:13px 16px;text-align:center;cursor:pointer;text-decoration:none}
.wacc-cta:hover{filter:brightness(1.07)}
.wacc-cta:focus-visible{outline:3px solid #1d2327;outline-offset:2px}
.wacc-cta[disabled]{opacity:.55;cursor:not-allowed}
.wacc-share{display:block;margin-top:10px;text-align:center;font-size:12px;color:#50575e!important}

/* Modal position */
.wacc-modal-on .wacc-dialog-wrap{position:fixed;inset:0;display:flex!important;align-items:center;justify-content:center;background:rgba(0,0,0,.45);transform:none;left:0;right:0;top:0;bottom:0}
.wacc:not(.wacc-open) .wacc-dialog-wrap{display:none!important}

/* Agents */
.wacc-agents{display:flex;flex-direction:column;gap:8px;margin:0;padding:0;list-style:none}
.wacc-agent{display:flex;align-items:center;gap:12px;width:100%;appearance:none;text-align:left;background:#fff;border:1px solid #e0e3e7;border-radius:12px;padding:10px 12px;cursor:pointer;color:inherit;font:inherit;text-decoration:none!important}
.wacc-agent:hover{border-color:var(--wacc-bg);box-shadow:0 2px 8px rgba(0,0,0,.08)}
.wacc-agent:focus-visible{outline:3px solid var(--wacc-bg)}
.wacc-agent[aria-disabled="true"]{opacity:.6;cursor:not-allowed;background:#f6f7f7}
.wacc-agent-av{width:44px;height:44px;border-radius:50%;flex:none;background:#dcdfe3 center/cover;display:flex;align-items:center;justify-content:center;font-weight:700;color:#50575e;position:relative}
.wacc-agent-av::after{content:"";position:absolute;right:0;bottom:0;width:11px;height:11px;border-radius:50%;background:#2ecc71;box-shadow:0 0 0 2px #fff}
.wacc-agent.is-off .wacc-agent-av::after{background:#9aa0a6}
.wacc-agent-name{display:block;font-weight:700}
.wacc-agent-role,.wacc-agent-next{display:block;font-size:12px;color:#646970}

/* Form */
.wacc-form{display:flex;flex-direction:column;gap:10px}
.wacc-field label{display:block;font-size:12px;font-weight:600;margin-bottom:3px;color:#3c434a}
.wacc-field input[type=text],.wacc-field input[type=email],.wacc-field input[type=tel],.wacc-field textarea,.wacc-field select{width:100%;padding:9px 11px;border:1px solid #c3c4c7;border-radius:8px;background:#fff;color:#1d2327;font:inherit;font-size:14px}
.wacc-field textarea{min-height:76px;resize:vertical}
.wacc-field input:focus,.wacc-field textarea:focus,.wacc-field select:focus{outline:2px solid var(--wacc-bg);outline-offset:0;border-color:transparent}
.wacc-field .wacc-chk{display:flex;gap:8px;align-items:center;font-weight:400}
.wacc-err{display:none;color:#b32d2e;font-size:12px;margin-top:3px}
.wacc-field.has-err .wacc-err{display:block}
.wacc-field.has-err input,.wacc-field.has-err textarea,.wacc-field.has-err select{border-color:#b32d2e}

@media (max-width:600px){
	.wacc-dialog{width:calc(100vw - 24px)}
	.wacc-style-4 .wacc-btn:hover{width:var(--wacc-size)}
	.wacc-style-4 .wacc-btn:hover .wacc-txt{opacity:0}
}
@media (prefers-reduced-motion:reduce){
	.wacc *,.wacc{animation:none!important;transition:none!important}
}
