:root{
    --wa-green:#25D366;
    --wa-dark:#075E54;
    --wa-text:#111827;
    --wa-bg:#ffffff;
    --wa-shadow:0 10px 30px rgba(0,0,0,.15);
    --radius:16px;
    --z:999999;
    --size:62px;
}
.wa-launcher{
    position:fixed; right:20px; bottom:80px; z-index:var(--z);
    width:var(--size); height:var(--size); border-radius:50%;
    display:grid; place-items:center; background:var(--wa-green);
    color:#fff; cursor:pointer; box-shadow:var(--wa-shadow);
    border:none; outline:none;
    transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.wa-launcher:hover{ transform:translateY(-2px); box-shadow:0 14px 34px rgba(0,0,0,.2); }
.wa-launcher:active{ transform:translateY(0); }
.wa-launcher svg{ width:28px; height:28px; fill:#fff; }

.wa-window{
    position:fixed; right:20px; bottom:calc(20px + var(--size) + 12px); z-index:var(--z);
    width:min(360px, 92vw);
    background:var(--wa-bg); color:var(--wa-text);
    border-radius:var(--radius); box-shadow:var(--wa-shadow);
    overflow:hidden; transform:translateY(16px); opacity:0; pointer-events:none;
    transition:transform .18s ease, opacity .18s ease;
}
.wa-window.open{ transform:none; opacity:1; pointer-events:auto; }
.wa-header{
    display:flex; align-items:center; gap:10px; padding:12px 14px; background:var(--wa-dark); color:#fff;
}
.wa-badge{
    width:34px; height:34px; min-width:34px; border-radius:50%; display:grid; place-items:center; background:#1DA851;
}
.wa-title{ font-weight:600; line-height:1.2; }
.wa-sub{ font-size:12px; opacity:.9; }
.wa-close{
    margin-left:auto; background:transparent; border:none; color:#fff; cursor:pointer; font-size:18px; line-height:1;
    opacity:.9;
}
.wa-body{ padding:10px 12px 12px; background:#f7f8f9; }
.wa-msg{
    background:#fff; border-radius:14px; padding:10px 12px; box-shadow:0 2px 8px rgba(0,0,0,.06);
    font-size:14px; max-width:85%;
}
.wa-row{ display:flex; gap:8px; margin-top:10px; }
.wa-input{
    flex:1; min-height:42px; max-height:120px; resize:none; border-radius:12px; border:1px solid #e5e7eb; padding:10px 12px;
    font:inherit; line-height:1.35; outline: none; background:#fff;
}
.wa-send{
    border:none; padding:0 14px; border-radius:12px; background:var(--wa-green); color:#fff; cursor:pointer; font-weight:600;
    display:flex; align-items:center; gap:8px;
}
.wa-send:disabled{ opacity:.6; cursor:not-allowed; }

@media (prefers-reduced-motion: reduce) {
    .wa-window, .wa-launcher{ transition:none !important; }
}