/* ============================================================
   CPR — Botón flotante de WhatsApp
   Redondo, sticky, esquina inferior izquierda. Páginas donde
   aparece: ver cpr_paginas_whatsapp_flotante() en
   inc/components/cpr-whatsapp-flotante.php.
   Verde oficial de WhatsApp (#25D366) en vez de un token de marca:
   es una señal reconocible del canal, no parte del sistema visual.
   ============================================================ */

.cpr-whatsapp-flotante {
  position: fixed;
  right: var(--space-4);
  bottom: calc(var(--space-4) + env(safe-area-inset-bottom, 0px));
  z-index: 999;

  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;

  background: #25d366;
  color: var(--white);
  box-shadow: var(--shadow-lg);

  transition: transform var(--dur-base) var(--ease-standard),
              box-shadow var(--dur-base) var(--ease-standard);
}

.cpr-whatsapp-flotante:hover,
.cpr-whatsapp-flotante:focus-visible {
  transform: scale(1.08);
  color: var(--white);
}

.cpr-whatsapp-flotante:focus-visible {
  outline: none;
  box-shadow: var(--shadow-lg), var(--shadow-focus);
}

@media (max-width: 480px) {
  .cpr-whatsapp-flotante {
    width: 52px;
    height: 52px;
    right: var(--space-3);
    bottom: calc(var(--space-3) + env(safe-area-inset-bottom, 0px));
  }
}