/* Shared WhatsApp contact: one explicit click opens the prefilled conversation. */
#odyscab-whatsapp {
  position: fixed;
  right: max(22px, env(safe-area-inset-right));
  bottom: calc(22px + env(safe-area-inset-bottom, 0px));
  z-index: 99000;
  margin: 0;
  padding: 0;
  font: 600 13px/1.45 Arial, Helvetica, sans-serif;
}

#odyscab-whatsapp,
#odyscab-whatsapp * { box-sizing: border-box; }

#odyscab-whatsapp .oc-whatsapp-link {
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
  color: #fff;
  text-decoration: none;
  border-radius: 999px;
  outline-offset: 6px;
  -webkit-tap-highlight-color: transparent;
}

#odyscab-whatsapp .oc-whatsapp-icon {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 58px;
  width: 58px;
  height: 58px;
  color: #fff;
  background: #3ebc4e;
  border: 2px solid #fff;
  border-radius: 50%;
  box-shadow: 0 6px 22px rgba(10, 66, 36, .23);
  animation: oc-whatsapp-double-hop 8s ease-in-out infinite;
  transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}

#odyscab-whatsapp svg {
  position: relative;
  z-index: 1;
  display: block;
  width: 31px;
  height: 31px;
  animation: oc-whatsapp-ring 8s ease-in-out infinite;
}

#odyscab-whatsapp .oc-whatsapp-icon::before,
#odyscab-whatsapp .oc-whatsapp-icon::after {
  content: "";
  position: absolute;
  inset: -4px;
  z-index: -1;
  border: 2px solid #3ebc4e;
  border-radius: 50%;
  opacity: 0;
  pointer-events: none;
  animation: oc-whatsapp-wave-one 8s ease-out infinite;
}

#odyscab-whatsapp .oc-whatsapp-icon::after {
  animation-name: oc-whatsapp-wave-two;
}

/* Two jumps, then a ringing handset with two outward waves, then a rest. */
@keyframes oc-whatsapp-double-hop {
  0%, 8%, 16%, 100% { transform: translateY(0); }
  4% { transform: translateY(-11px); }
  12% { transform: translateY(-8px); }
}

@keyframes oc-whatsapp-ring {
  0%, 18%, 42%, 100% { transform: rotate(0); }
  21%, 27%, 33% { transform: rotate(-9deg); }
  24%, 30%, 36% { transform: rotate(9deg); }
  39% { transform: rotate(-4deg); }
}

@keyframes oc-whatsapp-wave-one {
  0%, 18% { opacity: 0; transform: scale(1); }
  20% { opacity: .65; transform: scale(1); }
  43%, 100% { opacity: 0; transform: scale(1.32); }
}

@keyframes oc-whatsapp-wave-two {
  0%, 26% { opacity: 0; transform: scale(1); }
  28% { opacity: .5; transform: scale(1); }
  51%, 100% { opacity: 0; transform: scale(1.32); }
}

#odyscab-whatsapp .oc-whatsapp-link:hover .oc-whatsapp-icon,
#odyscab-whatsapp .oc-whatsapp-link:focus-visible .oc-whatsapp-icon {
  background: #35a944;
  box-shadow: 0 8px 25px rgba(10, 66, 36, .28);
}

/* The link's target stays still; interaction stops all decoration immediately. */
#odyscab-whatsapp .oc-whatsapp-link:is(:hover, :focus-visible) .oc-whatsapp-icon,
#odyscab-whatsapp .oc-whatsapp-link:is(:hover, :focus-visible) svg {
  animation: none;
  transform: none;
}

#odyscab-whatsapp .oc-whatsapp-link:is(:hover, :focus-visible) .oc-whatsapp-icon::before,
#odyscab-whatsapp .oc-whatsapp-link:is(:hover, :focus-visible) .oc-whatsapp-icon::after {
  animation: none;
  opacity: 0;
  transform: none;
}

#odyscab-whatsapp .oc-whatsapp-link:focus-visible {
  outline: 3px solid #00616f;
}

/* Keep a compact contact target clear of the mobile reservation controls. */
@media (max-width: 740px) {
  #odyscab-whatsapp {
    right: max(14px, env(safe-area-inset-right));
    bottom: calc(96px + env(safe-area-inset-bottom, 0px));
  }
  #odyscab-whatsapp .oc-whatsapp-icon {
    flex-basis: 48px;
    width: 48px;
    height: 48px;
  }
  #odyscab-whatsapp svg { width: 27px; height: 27px; }
}

body:has(.odyscab-content-page.oc-booking-expanded) #odyscab-whatsapp,
.odyscab-content-page.oc-booking-expanded #odyscab-whatsapp {
  display: none;
}

body:has(#odyscab-shared-header.oc-motion-paused) #odyscab-whatsapp .oc-whatsapp-icon,
body:has(#odyscab-shared-header.oc-motion-paused) #odyscab-whatsapp svg,
#odyscab-whatsapp.oc-motion-paused .oc-whatsapp-icon,
#odyscab-whatsapp.oc-motion-paused svg {
  animation: none;
  transform: none;
  transition: none;
}

body:has(#odyscab-shared-header.oc-motion-paused) #odyscab-whatsapp .oc-whatsapp-icon::before,
body:has(#odyscab-shared-header.oc-motion-paused) #odyscab-whatsapp .oc-whatsapp-icon::after,
#odyscab-whatsapp.oc-motion-paused .oc-whatsapp-icon::before,
#odyscab-whatsapp.oc-motion-paused .oc-whatsapp-icon::after {
  animation: none;
  opacity: 0;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  #odyscab-whatsapp .oc-whatsapp-icon,
  #odyscab-whatsapp svg,
  #odyscab-whatsapp .oc-whatsapp-link:hover .oc-whatsapp-icon,
  #odyscab-whatsapp .oc-whatsapp-link:focus-visible .oc-whatsapp-icon {
    animation: none;
    transform: none;
    transition: none;
  }
  #odyscab-whatsapp .oc-whatsapp-icon::before,
  #odyscab-whatsapp .oc-whatsapp-icon::after {
    animation: none;
    opacity: 0;
    transform: none;
  }
}