/* =========================================================
   ALVEREA K — PREMIUM WHATSAPP FLOAT V4
   ========================================================= */

#ak-whatsapp-float {
  --ak-wa-mauve: #81728E;
  --ak-wa-mauve-dark: #675A73;
  --ak-wa-gold: #C7A35D;
  --ak-wa-ivory: #FFFDFC;
  --ak-wa-ink: #2F2933;
  --ak-wa-green: #25D366;

  position: fixed !important;
  right: 18px !important;
  bottom: var(--ak-wa-bottom, 22px) !important;
  z-index: 2147482500 !important;

  display: inline-flex !important;
  align-items: center !important;
  gap: 11px !important;

  min-width: 58px !important;
  min-height: 58px !important;
  padding: 7px 16px 7px 7px !important;

  color: var(--ak-wa-ivory) !important;
  background:
    linear-gradient(
      135deg,
      var(--ak-wa-mauve-dark) 0%,
      var(--ak-wa-mauve) 100%
    ) !important;

  border:
    1px solid rgba(199, 163, 93, 0.48) !important;
  border-radius: 999px !important;

  box-shadow:
    0 10px 26px rgba(47, 41, 51, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.14) !important;

  font-family:
    Manrope,
    Cairo,
    Arial,
    sans-serif !important;

  text-decoration: none !important;

  transform: translateZ(0) !important;

  transition:
    bottom 0.22s ease,
    transform 0.18s ease,
    box-shadow 0.18s ease,
    opacity 0.18s ease !important;

  -webkit-tap-highlight-color: transparent !important;
}

#ak-whatsapp-float:hover {
  transform: translateY(-3px) !important;

  box-shadow:
    0 14px 32px rgba(47, 41, 51, 0.23),
    inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
}

#ak-whatsapp-float:focus-visible {
  outline:
    3px solid rgba(199, 163, 93, 0.42) !important;
  outline-offset: 4px !important;
}

#ak-whatsapp-float.ak-wa-hidden {
  opacity: 0 !important;
  pointer-events: none !important;
  transform:
    translateY(12px)
    scale(0.92) !important;
}

#ak-whatsapp-float.ak-wa-waiting {
  opacity: 0 !important;
  pointer-events: none !important;
  transform:
    translateY(10px)
    scale(0.94) !important;
}

.ak-wa-icon-wrap {
  position: relative !important;
  isolation: isolate !important;

  display: inline-flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;

  width: 44px !important;
  height: 44px !important;

  color: #FFFFFF !important;
  background: var(--ak-wa-green) !important;

  border:
    1px solid rgba(255, 255, 255, 0.92) !important;
  border-radius: 50% !important;

  box-shadow:
    0 5px 13px rgba(37, 211, 102, 0.18) !important;
}

.ak-wa-icon-wrap::before {
  content: "" !important;

  position: absolute !important;
  inset: -6px !important;
  z-index: 0 !important;

  border:
    2px solid rgba(199, 163, 93, 0.72) !important;
  border-radius: 50% !important;

  box-shadow:
    0 0 0 0 rgba(129, 114, 142, 0.28) !important;

  pointer-events: none !important;

  animation:
    akWhatsappPulseV3 3.6s ease-out infinite !important;
}

.ak-wa-icon {
  position: relative !important;
  z-index: 1 !important;

  display: block !important;

  width: 25px !important;
  height: 25px !important;

  fill: currentColor !important;
}

.ak-wa-copy {
  display: grid !important;
  gap: 2px !important;

  min-width: 0 !important;
}

.ak-wa-eyebrow {
  color:
    rgba(255, 255, 255, 0.68) !important;

  font-size: 9px !important;
  font-weight: 700 !important;
  line-height: 1.1 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

.ak-wa-title {
  color: #FFFFFF !important;

  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}

.ak-wa-dot {
  position: absolute !important;
  top: 4px !important;
  right: 7px !important;

  width: 7px !important;
  height: 7px !important;

  background: #A7F3C0 !important;

  border:
    2px solid var(--ak-wa-mauve) !important;
  border-radius: 50% !important;
}

@keyframes akWhatsappPulseV3 {
  0% {
    opacity: 0;
    transform: scale(0.88);
    box-shadow:
      0 0 0 0 rgba(129, 114, 142, 0.28);
  }

  14% {
    opacity: 0.78;
  }

  55% {
    opacity: 0;
    transform: scale(1.34);
    box-shadow:
      0 0 0 8px rgba(129, 114, 142, 0);
  }

  100% {
    opacity: 0;
    transform: scale(1.34);
    box-shadow:
      0 0 0 8px rgba(129, 114, 142, 0);
  }
}

/* Tablet and mobile: premium compact circle */
@media (max-width: 767px) {
  #ak-whatsapp-float {
    right: 12px !important;

    width: 50px !important;
    min-width: 50px !important;
    height: 50px !important;
    min-height: 50px !important;

    padding: 5px !important;

    border-radius: 50% !important;
  }

  .ak-wa-icon-wrap {
    width: 38px !important;
    height: 38px !important;
  }

  .ak-wa-copy,
  .ak-wa-dot {
    display: none !important;
  }
}

@media (max-width: 390px) {
  #ak-whatsapp-float {
    right: 10px !important;

    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
  }

  .ak-wa-icon-wrap {
    width: 36px !important;
    height: 36px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  #ak-whatsapp-float,
  .ak-wa-icon-wrap::before {
    animation: none !important;
    transition: none !important;
  }
}


@media (max-width: 767px) {
  .ak-wa-icon {
    width: 22px !important;
    height: 22px !important;
  }
}

/* V3: guaranteed clearance above the mobile bottom navigation */
@media (max-width: 767px) {
  #ak-whatsapp-float {
    bottom:
      max(
        var(--ak-wa-bottom, 100px),
        calc(96px + env(safe-area-inset-bottom, 0px))
      ) !important;
  }
}

/* V4: keep WhatsApp completely clear of the cart drawer */
body.ak-cart-drawer-open #ak-whatsapp-float {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;

  transform:
    translateY(12px)
    scale(0.92) !important;
}

/*
 * The JS now measures the real visible BUY NOW bar and writes
 * its exact clearance to --ak-wa-bottom.
 */
@media (max-width: 767px) {
  #ak-whatsapp-float {
    bottom:
      max(
        var(--ak-wa-bottom, 100px),
        calc(96px + env(safe-area-inset-bottom, 0px))
      ) !important;
  }
}
