/* =============================================================================
   ECOVIAL360 — livechat.css
   Ajustes visuales del widget de MyLiveChat para que encaje
   con el diseño del sitio.

   NOTA: El interior del chat (iframe) no se puede modificar desde aquí.
   Los colores del header y del chat se configuran en:
   mylivechat.com → Settings → Chat Widget → Appearance
   ============================================================================= */

/* ── Reposicionar el botón flotante ─────────────────────────────────────────
   Por defecto MyLiveChat coloca el botón en la esquina inferior derecha.
   Ajustamos la posición para que no tape el aviso de cookies.
   --------------------------------------------------------------------------- */
#hcc-widget-container,
#hlc_btn,
.hlc_btn,
[id^="hcc-"] iframe,
[class^="hcc-"] {
    bottom: 5rem !important; /* sube el botón para no tapar el banner de cookies */
    right: 1.5rem !important;
    z-index: 9990 !important; /* por debajo del banner de cookies (z-index: 9999) */
}

/* ── Cuando el banner de cookies ya no está, bajar el botón ─────────────────
   Una vez el usuario acepta las cookies, el botón vuelve a su posición normal */
body.cc-accepted #hcc-widget-container,
body.cc-accepted #hlc_btn,
body.cc-accepted .hlc_btn {
    bottom: 1.5rem !important;
}

/* ── En móvil: ajustar posición ─────────────────────────────────────────── */
@media (max-width: 600px) {
    #hcc-widget-container,
    #hlc_btn,
    .hlc_btn,
    [id^="hcc-"] iframe {
        bottom: 4.5rem !important;
        right: 1rem !important;
    }
}