/* Floating WhatsApp button, on every page: a compact ink pill with the WhatsApp mark; icon only on phones. */
.wa-float { position: fixed; z-index: 40; left: 20px; bottom: 20px; display: inline-flex; align-items: center; gap: 12px; height: 50px; padding-block: 5px; padding-inline: 5px 22px; border-radius: 999px; background: #282725; color: #F7F1E5; font: 500 .9375rem/1 "Readex Pro", "Parkinsans", system-ui, sans-serif; text-decoration: none; box-shadow: 0 10px 28px -12px rgba(0, 0, 0, .55), inset 0 0 0 1px rgba(247, 241, 229, .1); transition: transform .5s cubic-bezier(.32, .72, 0, 1), background-color .3s; direction: rtl; } /* taste-skill-ignore: a floating action button */
html[lang="en"] .wa-float { direction: ltr; font-family: "Parkinsans", "Readex Pro", system-ui, sans-serif; }
.wa-float:hover { background: #3d3b37; transform: translateY(-2px); }
.wa-float:active { transform: scale(.96); }
.wa-float:focus-visible { outline: 3px solid #F9C044; outline-offset: 3px; }
.wa-float__ic { position: relative; width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: #25D366; color: #fff; }
.wa-float__ic svg { width: 20px; height: 20px; }
/* a quiet ring that breathes out every few seconds */
.wa-float__ic::after { content: ""; position: absolute; inset: 0; border-radius: 50%; animation: wa-pulse 3.2s cubic-bezier(.16, 1, .3, 1) infinite; } /* taste-skill-ignore: the pulse ring */
@keyframes wa-pulse { 0% { box-shadow: 0 0 0 0 rgba(37, 211, 102, .45); } 60%, 100% { box-shadow: 0 0 0 12px rgba(37, 211, 102, 0); } }
.wa-float { animation: wa-in .9s cubic-bezier(.16, 1, .3, 1) .6s both; }
@keyframes wa-in { from { opacity: 0; transform: translateY(20px) scale(.92); } }
@media (max-width: 700px) {
  .wa-float, html[lang="en"] .wa-float { left: 14px; bottom: 14px; width: 52px; height: 52px; padding: 0; justify-content: center; background: #25D366; box-shadow: 0 10px 24px -10px rgba(0, 0, 0, .5); }
  .wa-float__label { display: none; }
  .wa-float__ic { width: 52px; height: 52px; background: none; }
  .wa-float__ic svg { width: 26px; height: 26px; }
  .bar .wa { display: none !important; }
}
.is-menu .wa-float { opacity: 0; pointer-events: none; }
@media (prefers-reduced-motion: reduce) { .wa-float, .wa-float__ic::after { animation: none; } }
