/* Floating WhatsApp Multi-Widget with customization */
.waw-widget{
    position: fixed;
    z-index: 99999;
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
}
.waw-button{
    width: var(--waw-size, 60px);
    height: var(--waw-size, 60px);
    border-radius: 50%;
    border: none;
    cursor: pointer;
    display: grid;
    place-items: center;
    background: var(--waw-btn-bg, #25D366);
    box-shadow: 0 8px 20px rgba(0,0,0,.25);
    transition: transform .2s ease, box-shadow .2s ease;
}
.waw-button:hover{
    transform: translateY(-2px);
    box-shadow: 0 12px 24px rgba(0,0,0,.3);
}
.waw-icon{
    width: calc(var(--waw-size, 60px) * 0.47);
    height: calc(var(--waw-size, 60px) * 0.47);
    fill: var(--waw-icon-color, #fff);
}
.waw-custom-icon{
    width: calc(var(--waw-size, 60px) * 0.55);
    height: auto;
    filter: drop-shadow(0 0 0 rgba(0,0,0,0));
}

.waw-panel{
    position: absolute;
    min-width: 240px;
    max-width: 88vw;
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 12px 30px rgba(0,0,0,.18);
    padding: 12px;
    display: none;
}
body.waw-open .waw-panel{ display:block; }

/* Default: bottom-right -> panel above button, aligned right */
.waw-panel{ right: 0; bottom: calc(var(--waw-size,60px) + 10px); }

/* Variantes segun esquina */
.waw-panel.waw-left{ left: 0; right: auto; }
.waw-panel.waw-top{ top: calc(var(--waw-size,60px) + 10px); bottom: auto; }

.waw-title{
    font-size: 14px;
    font-weight: 600;
    color: #0b1b13;
    margin: 4px 8px 8px 8px;
}

.waw-options{
    display: grid;
    gap: 8px;
    padding: 0 4px 4px 4px;
}

.waw-option{
    text-decoration: none;
    display: block;
    padding: 10px 12px;
    border-radius: 10px;
    background: #f5f7f6;
    color: #0b1b13;
    font-weight: 600;
    transition: background .2s ease, transform .08s ease;
}
.waw-option:hover{
    background: #e6f7ee;
    transform: translateY(-1px);
}

/* Responsive sizes */
@media (max-width: 480px){
    .waw-panel{ min-width: 220px; }
}