/* =====================================================
   Admin PC – Bouton flottant WhatsApp (FAB)
   ===================================================== */

.adminpc-wa-fab {
  position: fixed;
  right: 18px;
  bottom: 130px;
  z-index: 9990;
  width: 58px;
  height: 58px;
  background: #25D366;
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  box-shadow: 0 8px 20px rgba(37, 211, 102, 0.45),
              0 2px 6px rgba(0, 0, 0, 0.15);
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease;
}

.adminpc-wa-fab:hover,
.adminpc-wa-fab:focus-visible {
  background: #128C7E;
  color: #fff;
  transform: scale(1.08) translateY(-2px);
  box-shadow: 0 12px 28px rgba(37, 211, 102, 0.55),
              0 4px 10px rgba(0, 0, 0, 0.18);
  outline: none;
}

.adminpc-wa-fab__icon {
  width: 30px;
  height: 30px;
  fill: currentColor;
}

/* Tooltip qui apparaît au survol (desktop) */
.adminpc-wa-fab__label {
  position: absolute;
  right: 70px;
  top: 50%;
  transform: translateY(-50%);
  background: #202020;
  color: #fff;
  padding: 8px 14px;
  border-radius: 999px;
  font-family: "Outfit", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: 13.5px;
  font-weight: 600;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
}

.adminpc-wa-fab__label::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -5px;
  width: 0;
  height: 0;
  transform: translateY(-50%);
  border-left: 6px solid #202020;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
}

.adminpc-wa-fab:hover .adminpc-wa-fab__label,
.adminpc-wa-fab:focus-visible .adminpc-wa-fab__label {
  opacity: 1;
  transform: translateY(-50%) translateX(-4px);
}

/* Pulse animation discrète pour attirer l'attention */
.adminpc-wa-fab::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: #25D366;
  z-index: -1;
  animation: adminpc-wa-pulse 2.5s ease-out infinite;
  pointer-events: none;
}

@keyframes adminpc-wa-pulse {
  0%   { transform: scale(1);   opacity: 0.5; }
  70%  { transform: scale(1.4); opacity: 0;   }
  100% { transform: scale(1.4); opacity: 0;   }
}

/* Mobile : un poil plus petit et un peu plus haut pour éviter le pouce */
@media (max-width: 600px) {
  .adminpc-wa-fab {
    width: 54px;
    height: 54px;
    right: 14px;
    bottom: 115px;
  }
  .adminpc-wa-fab__icon { width: 28px; height: 28px; }
  /* Le tooltip est moins utile sur mobile, on le cache */
  .adminpc-wa-fab__label { display: none; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .adminpc-wa-fab,
  .adminpc-wa-fab::before { transition: none !important; animation: none !important; }
  .adminpc-wa-fab:hover { transform: none; }
}

/* Eviter conflit avec le bouton "Gérer mes cookies" en bas à gauche : nos 2 boutons ne se croisent pas (un à droite, un à gauche) */

/* =====================================================
   reCAPTCHA v3 badge — déplacé à gauche pour ne pas se
   superposer au bouton WhatsApp flottant (à droite).
   Google requiert que le badge reste VISIBLE (ou alors
   d'afficher une note "Protégé par reCAPTCHA"), donc on
   le repositionne plutôt que de le masquer.
   ===================================================== */
.grecaptcha-badge {
  left: 14px !important;
  right: auto !important;
  bottom: 14px !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12) !important;
  z-index: 9989; /* juste en-dessous du WhatsApp FAB qui est à 9990 */
}

/* Sur très petit écran, on rétrécit le badge pour ne pas
   gêner la lecture du contenu */
@media (max-width: 480px) {
  .grecaptcha-badge {
    transform: scale(0.85);
    transform-origin: bottom left;
  }
}

/* =====================================================
   Empile le bouton "retour en haut" #progress AU-DESSUS
   du bouton WhatsApp (les deux à droite). Avant, ils se
   chevauchaient à bottom: ~20px et WhatsApp (z-index 9990)
   masquait #progress (z-index 800). On les sépare ici.
   ===================================================== */
#progress {
  bottom: 200px !important;   /* WhatsApp s'arrête à ~188px → +12px de marge */
  right: 22px !important;     /* aligné visuellement avec WhatsApp (right: 18px + petit offset car #progress est plus grand) */
  width: 50px !important;     /* on rétrécit un peu (était 70px) pour un visuel plus cohérent avec WhatsApp 58px */
  height: 50px !important;
  z-index: 9988 !important;   /* juste sous le badge reCAPTCHA */
}

@media (max-width: 600px) {
  #progress {
    bottom: 180px !important; /* WhatsApp mobile s'arrête à ~169px → +11px de marge */
    right: 18px !important;
    width: 46px !important;
    height: 46px !important;
  }
}

