/* Standalone landing pages do not load the site styles or Tailwind. */
#bierheld-landing-whatsapp,
#bierheld-landing-whatsapp * {
  all: initial;
  box-sizing: border-box;
  color: #0b2614;
  direction: ltr;
  font: 800 14px/20px ui-sans-serif, system-ui, sans-serif;
}

#bierheld-landing-whatsapp {
  bottom: 20px;
  display: block;
  pointer-events: none;
  position: fixed;
  right: 20px;
  z-index: 9999;
}

#bierheld-landing-whatsapp .bierheld-whatsapp-button {
  align-items: center;
  background: #25d366;
  border-radius: 999px;
  box-shadow: 0 22px 44px rgba(20, 20, 20, 0.24);
  cursor: pointer;
  display: flex;
  gap: 12px;
  min-height: 56px;
  padding: 12px 20px;
  pointer-events: auto;
  position: relative;
  text-decoration: none;
  transition: background-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
  width: fit-content;
}

#bierheld-landing-whatsapp .bierheld-whatsapp-button:hover {
  background: #2ee271;
}

#bierheld-landing-whatsapp .bierheld-whatsapp-button:focus-visible {
  outline: 2px solid #25d366;
  outline-offset: 3px;
}

#bierheld-landing-whatsapp .bierheld-whatsapp-button * {
  cursor: inherit;
}

#bierheld-landing-whatsapp .bierheld-whatsapp-button__icon {
  align-items: center;
  background: #0b2614;
  border-radius: 999px;
  display: flex;
  flex: 0 0 auto;
  height: 32px;
  justify-content: center;
  width: 32px;
}

#bierheld-landing-whatsapp .bierheld-whatsapp-button__image {
  display: block;
  height: 20px;
  width: 20px;
}

@media (min-width: 640px) {
  #bierheld-landing-whatsapp {
    bottom: 24px;
    right: 24px;
  }
}