/* =====================================================
   CUSTOM OVERRIDES (load AFTER elegant.css)
   - WhatsApp Floating Button (Gold Premium)
   ===================================================== */

/* WhatsApp flotante DORADO PREMIUM */
.wa-float{
  position: fixed !important;

  left: 50% !important;
  right: auto !important;
  bottom: 20px !important;
  top: auto !important;

  transform: translateX(-50%) !important;

  width: 62px;
  height: 62px;
  border-radius: 999px;

  background: linear-gradient(145deg, #e6c86a, #b88912);
  color: #0b0b0b;

  display: flex;
  align-items: center;
  justify-content: center;

  box-shadow:
    0 14px 30px rgba(0,0,0,0.35),
    inset 0 1px 0 rgba(255,255,255,0.35);

  border: 1px solid rgba(255,255,255,0.22);
  z-index: 9999;
  text-decoration: none;

  transition: transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
.wa-float:hover{
  transform: translateX(-50%) translateY(-2px) scale(1.06) !important;
  filter: brightness(1.03);
}
  box-shadow:
    0 18px 38px rgba(0,0,0,.45),
    0 0 0 6px rgba(201,162,39,.14),
    inset 0 1px 0 rgba(255,255,255,.35);
}

.wa-icon{
  width: 32px;
  height: 32px;
  color: #0b0b0b;
}

.wa-tooltip{
  position: absolute;
  right: 78px;
  bottom: 50%;
  transform: translateY(50%);
  background: rgba(10,10,10,.88);
  color: rgba(255,255,255,.92);
  padding: 10px 12px;
  border-radius: 12px;
  font-size: 13px;
  letter-spacing: .2px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
  border: 1px solid rgba(201,162,39,.35);
  box-shadow: 0 10px 24px rgba(0,0,0,.35);
}

.wa-tooltip::after{
  content:"";
  position: absolute;
  right: -7px;
  top: 50%;
  transform: translateY(-50%);
  border-width: 7px 0 7px 7px;
  border-style: solid;
  border-color: transparent transparent transparent rgba(10,10,10,.88);
}

.wa-float:hover .wa-tooltip{
  opacity: 1;
  transform: translateY(50%) translateX(-2px);
}

/* Efecto pulse dorado */
.wa-float::before{
  content:"";
  position: absolute;
  inset: -6px;
  border-radius: 999px;
  background: radial-gradient(circle, rgba(201,162,39,.35), transparent 60%);
  opacity: .65;
  animation: waPulse 1.8s infinite;
  z-index: -1;
}

@keyframes waPulse{
  0%   { transform: scale(.92); opacity: .55; }
  70%  { transform: scale(1.22); opacity: .12; }
  100% { transform: scale(1.22); opacity: 0; }
}

/* Móvil */
@media (max-width: 576px){
  .wa-float{
    right: 14px;
    bottom: 14px;
    width: 56px;
    height: 56px;
  }
  .wa-tooltip{
    right: 68px;
    font-size: 12px;
    padding: 9px 10px;
  }
}