/* Плавающая кнопка «Написать в мессенджер» — см. messengers.js.
   На кнопке по очереди значки Telegram и Max, в открытом виде — крестик.
   z-index ниже попапов форм и баннера cookie (2999) и мобильного меню (3002):
   кнопка не должна перекрывать то, что человек уже открыл. */
.amsg {
  /* --amsg-lift — высота плашки «Имеются противопоказания», закреплённой
     внизу: предупреждение обязано быть видно, кнопка встаёт над ним. */
  position: fixed; right: 16px; bottom: calc(var(--amsg-lift, 0px) + 16px); z-index: 990;
  display: flex; flex-direction: column; align-items: flex-end; gap: 12px;
  font-family: inherit;
}
.amsg__fab {
  position: relative; overflow: hidden;
  width: 56px; height: 56px; border: 0; border-radius: 50%; padding: 0; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  background: #2AABEE; color: #fff;
  box-shadow: 0 6px 20px rgba(0, 0, 0, .18);
  transition: transform .15s ease, box-shadow .15s ease, background-color .2s ease;
}
.amsg__fab:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0, 0, 0, .22); }
.amsg__fab:focus-visible { outline: 3px solid rgba(42, 171, 238, .45); outline-offset: 3px; }

/* Значки Telegram и Max на кнопке по очереди: по 3 с каждый, смена —
   плавное растворение. Telegram лежит снизу всегда, Max поверх него
   проявляется и гаснет: так края кнопки в середине смены не просвечивают. */
.amsg__swap, .amsg__swap-item { position: absolute; inset: 0; }
.amsg__swap { transition: opacity .2s ease; }
.amsg__swap-item:nth-child(2) { opacity: 0; animation: amsg-swap 6s ease-in-out infinite; }
.amsg__swap svg { width: 100%; height: 100%; display: block; }
@keyframes amsg-swap {
  0%, 40%  { opacity: 0; }
  50%, 90% { opacity: 1; }
  100%     { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .amsg__swap-item:nth-child(2) { animation: none; }
}

.amsg__ico-close { position: relative; width: 22px; height: 22px; opacity: 0; transition: opacity .2s ease; }
.amsg--open .amsg__fab { background: #333; }
.amsg--open .amsg__swap { opacity: 0; }
.amsg--open .amsg__swap-item { animation-play-state: paused; }
.amsg--open .amsg__ico-close { opacity: 1; }

.amsg__panel {
  width: 260px; max-width: calc(100vw - 32px); box-sizing: border-box;
  padding: 18px 16px 12px; border-radius: 12px; background: #fff; color: #333;
  box-shadow: 0 10px 40px rgba(0, 0, 0, .18);
}
.amsg__panel[hidden] { display: none; }
.amsg__title { font-size: 17px; font-weight: 700; line-height: 1.3; }
.amsg__text { margin: 4px 0 10px; font-size: 14px; line-height: 1.4; color: #777; }
.amsg__link {
  display: flex; align-items: center; gap: 12px;
  margin: 0 -8px; padding: 10px 8px; border-radius: 8px;
  font-size: 16px; font-weight: 600; color: #333 !important; text-decoration: none !important;
}
.amsg__link:hover, .amsg__link:focus-visible { background: #f4f4f4; }
.amsg__icon { width: 36px; height: 36px; flex: none; overflow: hidden; }
.amsg__icon--telegram { border-radius: 50%; }
.amsg__icon--max { border-radius: 28%; }
.amsg__icon svg { width: 100%; height: 100%; display: block; }

@media (min-width: 992px) {
  .amsg { right: 24px; bottom: calc(var(--amsg-lift, 0px) + 24px); }
  .amsg__fab { width: 60px; height: 60px; }
}
@media print { .amsg { display: none; } }