/* Кнопка месенджерів і попап-підказка (ТЗ 14.10.2026, задача A).
 * z-index 900: над шапкою (50), під модалкою консультації (1000). */
.ave-chat { position: fixed; left: 24px; bottom: 24px; z-index: 900; font-family: 'Open Sans', sans-serif; }
.ave-chat [hidden] { display: none !important; }

.ave-chat__btn {
  width: 48px; height: 48px; border-radius: 50%; border: 0; padding: 0; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  background: #1f2839; color: #fff; box-shadow: 0 0 0 2px #b69d74, 0 6px 18px rgba(15, 20, 30, .28); /* золота обвідка: кнопку видно і на темному першому екрані */
  transition: transform .15s ease, box-shadow .15s ease;
}
.ave-chat__btn:hover { transform: translateY(-1px); box-shadow: 0 0 0 2px #b69d74, 0 8px 22px rgba(15, 20, 30, .34); }
.ave-chat__btn--wa, .ave-chat__btn--wa:hover { box-shadow: 0 6px 18px rgba(15, 20, 30, .28); }
.ave-chat__btn--wa { background: #25d366; }
.ave-chat__btn svg { width: 24px; height: 24px; display: block; }
.ave-chat__btn--wa svg { width: 26px; height: 26px; }

.ave-chat a:focus-visible, .ave-chat button:focus-visible { outline: 2px solid #b69d74; outline-offset: 3px; }

/* Меню над кнопкою, по її лівому краю */
.ave-chat__menu {
  position: absolute; left: 0; bottom: 60px; min-width: 200px;
  background: #fff; border: 1px solid #e3e3e3; border-radius: 10px; padding: 8px;
  box-shadow: 0 12px 32px rgba(15, 20, 30, .18);
}
.ave-chat__menu-head { display: flex; justify-content: flex-end; }
.ave-chat__x {
  width: 28px; height: 28px; border-radius: 50%; border: 0; background: transparent; cursor: pointer;
  color: #6b7280; font-size: 20px; line-height: 1; display: flex; align-items: center; justify-content: center;
}
.ave-chat__x:hover { background: #f4f4f4; color: #1f2839; }
.ave-chat__item {
  display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 8px;
  color: #1f2839; text-decoration: none; font-size: 15px; font-weight: 600;
}
.ave-chat__item:hover { background: #f4f4f4; }
.ave-chat__item svg { width: 24px; height: 24px; flex-shrink: 0; }

/* Попап: над кнопкою, проміжок 12 px, ширина до 280 px */
.ave-chat__hint {
  position: absolute; left: 0; bottom: 60px; width: max-content; max-width: min(280px, calc(100vw - 32px));
  background: #fff; border: 1px solid rgba(182, 157, 116, .55); border-radius: 10px;
  box-shadow: 0 12px 32px rgba(15, 20, 30, .18);
  animation: ave-chat-in .25s ease-out;
}
.ave-chat__hint-text {
  display: block; width: 100%; text-align: left; background: transparent; border: 0; cursor: pointer;
  padding: 14px 40px 14px 16px; color: #1f2839; text-decoration: none; font: inherit; font-size: 14px; line-height: 1.5;
}
.ave-chat__hint-text strong { display: block; font-weight: 700; margin-bottom: 4px; }
.ave-chat__hint .ave-chat__x { position: absolute; top: 6px; right: 6px; }
/* Запасне положення: праворуч від кнопки, по її низу — коли над кнопкою стоїть кнопка чи посилання сторінки */
.ave-chat__hint--side { left: 60px; bottom: 0; max-width: min(280px, calc(100vw - 92px)); }

@keyframes ave-chat-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .ave-chat__hint { animation: none; } .ave-chat__btn { transition: none; } }

/* Коли відкрита модалка консультації, віджет ховаємо */
body:has([data-consult-modal]:not(.is-hidden)) .ave-chat { display: none; }

@media (max-width: 767px) {
  .ave-chat { left: 16px; bottom: 16px; }
  /* щоб «Політика конфіденційності» й останній рядок футера не ховались під кнопкою */
  body > footer, footer { padding-bottom: 80px; }
}
