.whatsapp-widget{
    --wa-brand:#25D366;
    --wa-shadow:0 8px 22px rgba(0,0,0,.18);
    --wa-radius:18px;
    position:fixed;
    right:20px;
    bottom:20px;
    z-index:9999;
    font-family:inherit;
}

.whatsapp-widget *{box-sizing:border-box;}

.whatsapp-widget__launcher{
    display:flex;
    align-items:center;
    gap:10px;
    direction:ltr;
    cursor:pointer;
    user-select:none;
}

.whatsapp-widget__launcher-text{
    background:#fff;
    color:#2b2b2b;
    padding:10px 14px;
    border-radius:999px;
    box-shadow:var(--wa-shadow);
    font-size:14px;
    line-height:1;
    white-space:nowrap;
}

.whatsapp-widget__launcher-btn{
    width:56px;
    height:56px;
    border-radius:50%;
    border:none;
    background:var(--wa-brand);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:var(--wa-shadow);
    cursor:pointer;
    padding:0;
}

.whatsapp-widget__launcher-btn i{font-size:26px;}

.whatsapp-widget__panel{
    position:absolute;
    right:0;
    bottom:72px;
    width:360px;
    max-width:90vw;
    height:520px;
    max-height:70vh;
    background:#fff;
    border-radius:var(--wa-radius);
    box-shadow:var(--wa-shadow);
    overflow:hidden;
    opacity:0;
    transform:translateY(10px);
    pointer-events:none;
    display:flex;
    flex-direction:column;
}

.whatsapp-widget[data-open="true"] .whatsapp-widget__panel{
    opacity:1;
    transform:translateY(0);
    pointer-events:auto;
}

.whatsapp-widget[data-open="true"] .whatsapp-widget__launcher-text{
    display:none;
}

.whatsapp-widget__header{
    background:var(--wa-brand);
    color:#fff;
    display:flex;
    align-items:center;
    gap:10px;
    padding:12px 12px;
}

.whatsapp-widget__header-close{
    width:34px;
    height:34px;
    border-radius:50%;
    border:none;
    background:rgba(255,255,255,.18);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
}

.whatsapp-widget__header-close i{font-size:16px;}

.whatsapp-widget__header-title{
    font-size:14px;
    font-weight:700;
    flex:1;
    line-height:1.2;
    text-align:right;
}

.whatsapp-widget__header-icon{
    width:34px;
    height:34px;
    border-radius:50%;
    background:rgba(255,255,255,.18);
    display:flex;
    align-items:center;
    justify-content:center;
}

.whatsapp-widget__header-icon i{font-size:18px;}

.whatsapp-widget__body{
    flex:1;
    background:#f0f0f0;
    background-image:
        radial-gradient(rgba(0,0,0,.04) 1px, transparent 1px);
    background-size:18px 18px;
    padding:14px;
    overflow:auto;
}

.whatsapp-widget__message{
    display:flex;
    flex-direction:column;
    gap:6px;
    align-items:flex-start;
}

.whatsapp-widget__sender{
    font-size:12px;
    font-weight:700;
    color:#1c7b4a;
    margin-left:auto;
}

.whatsapp-widget__bubble{
    background:#fff;
    border-radius:14px;
    padding:10px 12px;
    max-width:85%;
    box-shadow:0 2px 10px rgba(0,0,0,.08);
    margin-left:auto;
}

.whatsapp-widget__text{
    font-size:14px;
    color:#2b2b2b;
}

.whatsapp-widget__time{
    margin-top:6px;
    font-size:11px;
    color:#7a7a7a;
    text-align:left;
}

.whatsapp-widget__composer{
    background:#fff;
    padding:10px;
    display:flex;
    align-items:center;
    gap:10px;
    border-top:1px solid rgba(0,0,0,.06);
}

.whatsapp-widget__input{
    flex:1;
    height:42px;
    border-radius:999px;
    border:1px solid rgba(0,0,0,.12);
    padding:0 14px;
    outline:none;
    font-size:14px;
    direction:rtl;
}

.whatsapp-widget__input::placeholder{color:#9aa6b2;}

.whatsapp-widget__send{
    width:42px;
    height:42px;
    border-radius:50%;
    border:none;
    background:var(--wa-brand);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
}

.whatsapp-widget__send:disabled{
    background:#c9d6de;
    cursor:not-allowed;
}

.whatsapp-widget__send i{font-size:16px; transform:rotate(180deg);}

@media (max-width: 635px){
    .whatsapp-widget{right:14px; bottom:14px;}
    .whatsapp-widget__panel{width:min(420px, 92vw); height:min(560px, 74vh);}
    .whatsapp-widget__launcher{max-width:92vw;}
    .whatsapp-widget__launcher-btn{
        width: 40px;
        height: 40px;
    }
    .whatsapp-widget__launcher-text{
        font-size:11px;
        padding:5px 9px;
        max-width:62vw;
        white-space:normal;
        line-height:1.2;
        text-align:right;
    }
}
