/* Livechat v2 — CSS v19. = v18 + contrato `body.lc-cta-up`: cuando una página
 * muestra un CTA flotante inferior (barra de compra rápida del PDP, "Configurar
 * pedido" de sublimación), la burbuja y sus globos se LEVANTAN para no taparlo
 * (pantallazos de Diego 2026-07-22). Cada página con CTA flotante togglea la
 * clase en el MISMO observer que muestra/oculta su barra. */
@import url('/styles/livechat-v18.css');

.lc-bubble {
  transition: transform 200ms cubic-bezier(0.32, 0.72, 0, 1),
              box-shadow 200ms cubic-bezier(0.32, 0.72, 0, 1),
              bottom 260ms cubic-bezier(0.22, 1, 0.36, 1);
}

/* Escritorio: la barra del PDP vive centrada abajo (bottom 24, alto ~66). */
body.lc-cta-up .lc-bubble { bottom: calc(104px + env(safe-area-inset-bottom, 0px)); }
body.lc-cta-up .lc-toast-stack,
body.lc-cta-up #lc-strip-slot,
body.lc-cta-up #lc-eye-slot { bottom: calc(176px + env(safe-area-inset-bottom, 0px)); }

@media (max-width: 767px) {
  /* Móvil: nav inferior (56) + CTA flotante (bottom ~80 + alto ~70) → la
     burbuja sube por encima de ambos. */
  body.lc-cta-up .lc-bubble { bottom: calc(max(env(safe-area-inset-bottom, 0px), 12px) + 160px); }
  body.lc-cta-up .lc-toast-stack,
  body.lc-cta-up #lc-strip-slot,
  body.lc-cta-up #lc-eye-slot { bottom: calc(max(env(safe-area-inset-bottom, 0px), 12px) + 230px); }
}