/**
 * Nxr_Whatsapp — botón flotante de contacto por WhatsApp (front).
 *
 * Excepción documentada a la Regla nº 2 (paleta común, sin colores de marca):
 * el verde #25d366 es la marca de WhatsApp, no la del cliente, y su
 * reconocibilidad es lo que hace funcionar el botón (ver spec). Si el admin
 * configura NXR_WA_COLOR, se inyecta --nxr-wa-bg en el style del <a> (patrón
 * nxr_advice) y gana sobre este fallback.
 */
.nxr-whatsapp__btn {
    position: fixed;
    right: 20px;
    bottom: 20px;
    /* 99999 (no 1050): 1050 cae en el rango que Bootstrap reserva para sus
       propios modales/overlays, y el botón debe quedar siempre por encima
       (patrón nxr_popups). */
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    /* El fallback #25d366 debe coincidir con Nxr_Whatsapp::DEFAULT_COLOR. */
    background: var(--nxr-wa-bg, #25d366);
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
    text-decoration: none;
    line-height: 0;
}

.nxr-whatsapp__btn svg {
    width: 30px;
    height: 30px;
}

.nxr-whatsapp__btn:hover,
.nxr-whatsapp__btn:focus-visible {
    color: #ffffff;
    filter: brightness(1.06);
}

.nxr-whatsapp__btn:focus-visible {
    outline: 2px solid #ffffff;
    outline-offset: 2px;
    /* Compone con la sombra base en vez de sustituirla, o el botón "pierde"
       su elevación normal mientras tiene el foco. */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25), 0 0 0 4px rgba(0, 0, 0, 0.35);
}

.nxr-whatsapp--left {
    right: auto;
    left: 20px;
}

.nxr-whatsapp__notice {
    position: absolute;
    bottom: calc(100% + 10px);
    right: 0;
    max-width: 220px;
    width: max-content;
    padding: 8px 12px;
    border-radius: var(--nxr-radius, 8px);
    /* El aviso es del sitio, no de WhatsApp: cuelga de los tokens del tema y
       sólo cae al gris de Bootstrap si el módulo se monta sin `nxr_theme`. */
    background: var(--nxr-surface, #ffffff);
    color: var(--nxr-ink, #1f2937);
    font-size: 13px;
    line-height: 1.35;
    text-align: left;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
    white-space: normal;
}

.nxr-whatsapp--left .nxr-whatsapp__notice {
    right: auto;
    left: 0;
}

@media (max-width: 767px) {
    .nxr-whatsapp__btn {
        right: 12px;
        bottom: 12px;
    }

    .nxr-whatsapp--left {
        right: auto;
        left: 12px;
    }

    .nxr-whatsapp__notice {
        max-width: 60vw;
    }
}

@media print {
    .nxr-whatsapp__btn {
        display: none;
    }
}