/* =========================================
   EN BABA - WhatsApp Orijinal Açılış Top Animasyonu
   Phone modal checkbox onayı + WhatsApp yönlendirme bekleme efekti
========================================= */
:root{
  --enb-wa-ball-url: url('/assets/img/stickers/enb-whatsapp-ball.png');
  --enb-wa-green: #25d366;
  --enb-wa-dark: #0f172a;
}

#waIntentBox{
  position: relative;
  overflow: visible;
}

#waIntentBox.is-enb-wa-approved{
  border-color: rgba(37, 211, 102, .55) !important;
  background: linear-gradient(180deg, #ecfdf5 0%, #f7fee7 100%) !important;
  box-shadow: 0 14px 34px rgba(22, 163, 74, .12);
}

.enb-wa-intent-sticker{
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
  margin-left: auto;
  margin-top: -5px;
  border-radius: 999px;
  background-image: var(--enb-wa-ball-url);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  filter: drop-shadow(0 10px 16px rgba(15, 23, 42, .2));
  opacity: 0;
  transform: translateY(8px) scale(.72) rotate(-14deg);
  pointer-events: none;
}

#waIntentBox.is-enb-wa-approved .enb-wa-intent-sticker{
  opacity: 1;
  animation: enbWaStickerPop 1.05s cubic-bezier(.16, 1, .3, 1) both,
             enbWaStickerIdle 1.45s ease-in-out 1.05s infinite;
}

.enb-wa-flyball{
  position: fixed;
  left: var(--enb-wa-x, 50vw);
  top: var(--enb-wa-y, 50vh);
  width: var(--enb-wa-size, 40px);
  height: var(--enb-wa-size, 40px);
  z-index: 2147483647;
  border-radius: 999px;
  background-image: var(--enb-wa-ball-url);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  pointer-events: none;
  opacity: 0;
  filter: drop-shadow(0 12px 18px rgba(15, 23, 42, .18));
  animation: enbWaFly var(--enb-wa-dur, 1080ms) cubic-bezier(.18, .89, .32, 1.28) var(--enb-wa-delay, 0ms) forwards;
}

.enb-wa-flyball.is-soft{
  filter: drop-shadow(0 7px 10px rgba(15, 23, 42, .16));
}

#enbWhatsappCenterBurst{
  position: fixed;
  inset: 0;
  z-index: 2147483645;
  display: none;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

#enbWhatsappCenterBurst.is-visible{
  display: flex;
}

.enb-wa-center-ball{
  width: clamp(92px, 24vw, 138px);
  height: clamp(92px, 24vw, 138px);
  border-radius: 999px;
  background-image: var(--enb-wa-ball-url);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  filter: drop-shadow(0 22px 34px rgba(15, 23, 42, .28));
  opacity: 0;
  transform: scale(.48) rotate(-18deg);
  animation: enbWaCenterBallPop 1.18s cubic-bezier(.16, 1, .3, 1) forwards;
}

#enbWhatsappLaunchOverlay{
  position: fixed;
  inset: 0;
  z-index: 2147483646;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 22px;
  background:
    radial-gradient(circle at 50% 38%, rgba(37, 211, 102, .24), transparent 36%),
    rgba(2, 6, 23, .72);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

#enbWhatsappLaunchOverlay.is-visible{
  display: flex;
}

.enb-wa-launch-card{
  width: min(92vw, 360px);
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 28px;
  padding: 26px 22px 24px;
  text-align: center;
  color: #fff;
  background: linear-gradient(180deg, rgba(15, 23, 42, .88), rgba(15, 23, 42, .72));
  box-shadow: 0 28px 80px rgba(0,0,0,.38);
  transform: translateY(8px) scale(.97);
  animation: enbWaLaunchCardIn .38s cubic-bezier(.16,1,.3,1) forwards;
}

.enb-wa-launch-scene{
  position: relative;
  width: 138px;
  height: 118px;
  margin: 0 auto 16px;
}

.enb-wa-launch-ball{
  position: absolute;
  left: 50%;
  top: 50%;
  width: 86px;
  height: 86px;
  margin: -43px 0 0 -43px;
  border-radius: 999px;
  background-image: var(--enb-wa-ball-url);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  filter: drop-shadow(0 18px 24px rgba(0,0,0,.25));
  animation: enbWaLaunchBall 1.05s cubic-bezier(.34,1.56,.64,1) infinite;
}

.enb-wa-launch-orbit{
  position: absolute;
  inset: 0;
  border-radius: 999px;
  animation: enbWaOrbit 1.25s linear infinite;
}

.enb-wa-launch-orbit::before,
.enb-wa-launch-orbit::after{
  content: '';
  position: absolute;
  width: 26px;
  height: 26px;
  border-radius: 999px;
  background-image: var(--enb-wa-ball-url);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  filter: drop-shadow(0 8px 12px rgba(0,0,0,.2));
}

.enb-wa-launch-orbit::before{
  left: 9px;
  top: 44px;
}

.enb-wa-launch-orbit::after{
  right: 2px;
  top: 20px;
  width: 20px;
  height: 20px;
  opacity: .82;
}

.enb-wa-launch-title{
  margin: 0;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: -.02em;
}

.enb-wa-launch-copy{
  margin: 8px auto 0;
  max-width: 270px;
  color: rgba(255,255,255,.76);
  font-size: 13px;
  line-height: 1.55;
}

.enb-wa-launch-dots{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 16px;
}

.enb-wa-launch-dots span{
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: var(--enb-wa-green);
  box-shadow: 0 0 0 5px rgba(37, 211, 102, .12);
  animation: enbWaDot 1s ease-in-out infinite;
}

.enb-wa-launch-dots span:nth-child(2){ animation-delay: .14s; }
.enb-wa-launch-dots span:nth-child(3){ animation-delay: .28s; }

body.enb-wa-launching{
  overflow: hidden;
}

@keyframes enbWaCenterBallPop{
  0%{ opacity: 0; transform: scale(.45) rotate(-24deg); }
  18%{ opacity: 1; transform: scale(1.12) rotate(14deg); }
  42%{ opacity: 1; transform: scale(.96) rotate(-7deg); }
  72%{ opacity: 1; transform: scale(1.04) rotate(22deg); }
  100%{ opacity: 0; transform: scale(.76) rotate(62deg); }
}

@keyframes enbWaStickerPop{
  0%{ opacity: 0; transform: translateY(10px) scale(.55) rotate(-22deg); }
  55%{ opacity: 1; transform: translateY(-6px) scale(1.16) rotate(18deg); }
  78%{ transform: translateY(1px) scale(.96) rotate(-7deg); }
  100%{ opacity: 1; transform: translateY(0) scale(1) rotate(0deg); }
}

@keyframes enbWaStickerIdle{
  0%,100%{ transform: translateY(0) scale(1) rotate(0deg); }
  50%{ transform: translateY(-3px) scale(1.04) rotate(7deg); }
}

@keyframes enbWaFly{
  0%{
    opacity: 0;
    transform: translate(-50%, -50%) translate(0, 0) scale(.42) rotate(0deg);
  }
  12%{
    opacity: 1;
  }
  72%{
    opacity: 1;
    transform: translate(-50%, -50%) translate(var(--enb-wa-tx, 0), var(--enb-wa-ty, -90px)) scale(1.04) rotate(var(--enb-wa-rot, 220deg));
  }
  100%{
    opacity: 0;
    transform: translate(-50%, -50%) translate(calc(var(--enb-wa-tx, 0) * 1.08), calc(var(--enb-wa-ty, -90px) - 20px)) scale(.78) rotate(calc(var(--enb-wa-rot, 220deg) + 80deg));
  }
}

@keyframes enbWaLaunchCardIn{
  to{ transform: translateY(0) scale(1); }
}

@keyframes enbWaLaunchBall{
  0%,100%{ transform: translateY(0) scale(1) rotate(-7deg); }
  45%{ transform: translateY(-10px) scale(1.06) rotate(18deg); }
  72%{ transform: translateY(2px) scale(.98) rotate(34deg); }
}

@keyframes enbWaOrbit{
  to{ transform: rotate(360deg); }
}

@keyframes enbWaDot{
  0%,100%{ transform: translateY(0) scale(.78); opacity: .48; }
  50%{ transform: translateY(-4px) scale(1.05); opacity: 1; }
}

@media (prefers-reduced-motion: reduce){
  .enb-wa-intent-sticker,
  .enb-wa-flyball,
  .enb-wa-center-ball,
  .enb-wa-launch-card,
  .enb-wa-launch-ball,
  .enb-wa-launch-orbit,
  .enb-wa-launch-dots span{
    animation: none !important;
  }

  .enb-wa-intent-sticker{
    opacity: 1;
    transform: none;
  }
}