/* ═══════════════════════════════════════
   ELF CHAT WIDGET — Officina dei Sogni
   ═══════════════════════════════════════ */

.elf-chat-widget {
  position: fixed;
  bottom: 96px;
  right: 28px;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
  pointer-events: none; /* lascia passare i click sotto, tranne sui figli */
}
.elf-chat-widget > * { pointer-events: auto; }

/* ── Pulsante ── */
.elf-chat-btn {
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  position: relative;
  width: 72px;
  display: flex;
  flex-direction: column;
  align-items: center;
  outline: none;
}
.elf-chat-btn:focus-visible {
  outline: 3px solid #6adf60;
  outline-offset: 6px;
  border-radius: 50%;
}

/* ── Alone magico — giallo/verde brillante ── */
.elf-chat-btn::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 110px;
  height: 110px;
  transform: translate(-50%, -58%);
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(240, 255, 60,  0.75) 0%,
    rgba(160, 255, 40,  0.55) 28%,
    rgba(100, 240, 80,  0.30) 52%,
    rgba(255, 230, 0,   0.10) 70%,
    transparent 85%
  );
  filter: blur(2px);
  animation: elfHaloPulse 2.4s ease-in-out infinite;
  pointer-events: none;
  z-index: 0;
}
@keyframes elfHaloPulse {
  0%, 100% { transform: translate(-50%, -58%) scale(1);    opacity: 0.80; }
  50%       { transform: translate(-50%, -58%) scale(1.45); opacity: 1;    }
}

/* ── Layer luciole posteriori ── */
.elf-sparks-back,
.elf-sparks-front {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.elf-sparks-back  { z-index: 1; }
.elf-img          { position: relative; z-index: 2; }
.elf-sparks-front { z-index: 3; }

/* Singola lucciola */
.elf-spark {
  position: absolute;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: radial-gradient(circle, #e8ff60 0%, #60ff80 55%, transparent 100%);
  opacity: 0;
  animation: sparkFly var(--dur, 2s) ease-in-out infinite;
  animation-delay: var(--delay, 0s);
  left: var(--x, 50%);
  top:  var(--y, 50%);
}
@keyframes sparkFly {
  0%   { opacity: 0;   transform: scale(0.4) translate(0, 0); }
  25%  { opacity: 1;   transform: scale(1.4) translate(var(--dx,  4px), var(--dy, -6px)); }
  60%  { opacity: 0.6; transform: scale(1.0) translate(var(--dx2, 2px), var(--dy2,-12px)); }
  100% { opacity: 0;   transform: scale(0.3) translate(var(--dx3, 0px), var(--dy3,-18px)); }
}

/* ── Immagine elfo ── */
.elf-img {
  width: 72px;
  height: auto;
  animation: elfFloat 3s ease-in-out infinite,
             elfGlowAnim 2.6s ease-in-out infinite;
  display: block;
}
@keyframes elfFloat {
  0%, 100% { transform: translateY(0); }
  50%       { transform: translateY(-8px); }
}
@keyframes elfGlowAnim {
  0%, 100% {
    filter:
      drop-shadow(0 0 5px rgba(140,255,80,.55))
      drop-shadow(0 0 12px rgba(180,255,60,.30))
      drop-shadow(0 3px 7px rgba(10,77,74,.30));
  }
  50% {
    filter:
      drop-shadow(0 0 10px rgba(140,255,80,.90))
      drop-shadow(0 0 24px rgba(200,255,80,.55))
      drop-shadow(0 5px 12px rgba(10,77,74,.45));
  }
}

.elf-chat-btn:hover .elf-img {
  filter:
    drop-shadow(0 0 14px rgba(160,255,80,1))
    drop-shadow(0 0 30px rgba(200,255,80,.8))
    drop-shadow(0 6px 14px rgba(10,77,74,.5));
}

/* ── Nuvoletta CTA ── */
.elf-bubble {
  margin-top: -4px;
  background: #6B131D;
  color: #fff;
  border-radius: 14px 14px 14px 3px;
  padding: 5px 11px;
  font-size: 11px;
  font-family: 'Inter', sans-serif;
  font-weight: 700;
  letter-spacing: .02em;
  white-space: nowrap;
  box-shadow: 0 2px 10px rgba(107,19,29,.4);
  animation: bubblePop 2.6s ease-in-out infinite;
}
@keyframes bubblePop {
  0%, 100% { transform: scale(1); }
  50%       { transform: scale(1.06); }
}

/* ── Popup ── */
.elf-chat-popup {
  background: #fff;
  border-radius: 14px;
  padding: 18px 20px 16px;
  box-shadow: 0 6px 32px rgba(38,26,17,.18);
  width: 260px;
  position: relative;
}
.elf-chat-popup.elf-hidden { display: none !important; }
.elf-chat-popup:not(.elf-hidden) { animation: popupIn .22s ease-out; }

@keyframes popupIn {
  from { opacity: 0; transform: translateY(8px) scale(.96); }
  to   { opacity: 1; transform: translateY(0)  scale(1);    }
}

.elf-popup-close {
  position: absolute;
  top: 10px; right: 12px;
  background: none; border: none;
  font-size: 18px; line-height: 1;
  cursor: pointer; color: #6B5B4E;
  padding: 2px 5px; border-radius: 4px;
}
.elf-popup-close:hover { background: #F2EBE0; }

.elf-popup-title {
  font-family: 'Playfair Display', Georgia, serif;
  font-size: 1rem; font-weight: 600;
  color: #0A4D4A;
  margin: 0 0 12px;
  padding-right: 22px;
  line-height: 1.4;
}

.elf-popup-link {
  display: flex; align-items: center; gap: 8px;
  background: #0A4D4A; color: #fff;
  text-decoration: none;
  padding: 10px 14px; border-radius: 6px;
  font-size: .8125rem; font-weight: 600;
  font-family: 'Inter', sans-serif;
  transition: background .18s;
  word-break: break-all;
}
.elf-popup-link:hover { background: #083d3b; color: #fff; }

/* ── Mobile ── */
@media (max-width: 480px) {
  .elf-chat-widget { bottom: 72px; right: 16px; }
  .elf-chat-btn    { width: 60px; }
  .elf-img         { width: 60px; }
  .elf-chat-popup  { width: 240px; }
}