/* ══════════════════════════════════════════════
   WIDGET CHAT VISITEUR — Voyance Guérison
══════════════════════════════════════════════ */

/* Bouton bulle */
.vg-chat-bubble {
  position:fixed; bottom:2rem; left:2rem; z-index:8000;
  width:58px; height:58px; border-radius:50%;
  background:linear-gradient(135deg,#7B2335,#C8A040);
  border:3px solid #EDD070;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; box-shadow:0 6px 24px rgba(123,35,53,.5);
  transition:transform .2s ease, box-shadow .2s;
  animation:chatPulse 2.5s infinite;
}
.vg-chat-bubble:hover { transform:scale(1.1); box-shadow:0 10px 32px rgba(200,160,64,.5); animation:none; }
.vg-chat-bubble .chat-icon { font-size:1.6rem; }
.vg-chat-badge {
  position:absolute; top:-3px; right:-3px;
  background:#e53935; color:#fff;
  width:20px; height:20px; border-radius:50%;
  font-size:.7rem; font-weight:700;
  display:flex; align-items:center; justify-content:center;
  display:none;
}
.vg-chat-badge.show { display:flex; }
@keyframes chatPulse {
  0%,100%{ box-shadow:0 6px 24px rgba(123,35,53,.5); }
  50%{ box-shadow:0 6px 32px rgba(200,160,64,.7); }
}

/* Fenêtre chat */
.vg-chat-window {
  position:fixed; bottom:6.5rem; left:2rem; z-index:8001;
  width:340px; max-height:520px;
  background:#FFFEF6; border-radius:16px;
  box-shadow:0 16px 60px rgba(26,8,8,.35);
  border:1px solid rgba(200,160,64,.3);
  display:flex; flex-direction:column;
  opacity:0; pointer-events:none;
  transform:translateY(20px) scale(.95);
  transition:opacity .3s ease, transform .3s ease;
  overflow:hidden;
}
.vg-chat-window.open {
  opacity:1; pointer-events:all;
  transform:translateY(0) scale(1);
}

/* Header chat */
.vg-chat-header {
  background:linear-gradient(135deg,#4E0F1C,#7B2335);
  color:#fff; padding:.9rem 1rem;
  display:flex; align-items:center; gap:.7rem;
  position:relative;
}
.vg-avatar {
  width:42px; height:42px; border-radius:50%;
  background:linear-gradient(135deg,#C8A040,#EDD070);
  display:flex; align-items:center; justify-content:center;
  font-size:1.4rem; flex-shrink:0;
  border:2px solid rgba(255,255,255,.3);
}
.vg-chat-name { font-weight:700; font-size:.9rem; font-family:'Cinzel',Georgia,serif; }
.vg-chat-status { font-size:.72rem; color:rgba(255,255,255,.8); display:flex; align-items:center; gap:.3rem; margin-top:.15rem; }
.status-dot { width:7px; height:7px; background:#4CAF50; border-radius:50%; animation:blink 2s infinite; }
@keyframes blink{ 0%,100%{opacity:1} 50%{opacity:.4} }
.vg-close { position:absolute; right:.8rem; top:.6rem; background:none; border:none; color:rgba(255,255,255,.6); font-size:1.3rem; cursor:pointer; line-height:1; }
.vg-close:hover { color:#fff; }

/* Mini services */
.vg-services {
  background:#FFF8EE; border-bottom:1px solid rgba(200,160,64,.2);
  padding:.7rem .8rem; overflow-x:auto;
  display:flex; gap:.5rem;
  scrollbar-width:thin; scrollbar-color:#C8A040 transparent;
}
.vg-service-chip {
  flex-shrink:0; background:#fff; border:1px solid rgba(200,160,64,.4);
  border-radius:20px; padding:.35rem .75rem;
  font-size:.74rem; cursor:pointer; white-space:nowrap;
  color:#4E0F1C; font-weight:600;
  transition:all .2s; display:flex; align-items:center; gap:.3rem;
}
.vg-service-chip:hover { background:#7B2335; color:#fff; border-color:#7B2335; }

/* Messages */
.vg-messages {
  flex:1; overflow-y:auto; padding:.8rem;
  display:flex; flex-direction:column; gap:.6rem;
  max-height:200px; min-height:120px;
}
.vg-msg { display:flex; flex-direction:column; }
.vg-msg-bubble {
  max-width:82%; padding:.55rem .8rem;
  border-radius:12px; font-size:.84rem; line-height:1.45;
}
.vg-msg.from-admin .vg-msg-bubble {
  background:#4E0F1C; color:#fff;
  border-radius:12px 12px 12px 2px;
  align-self:flex-start;
}
.vg-msg.from-visitor .vg-msg-bubble {
  background:#C8A040; color:#fff;
  border-radius:12px 12px 2px 12px;
  align-self:flex-end;
}
.vg-msg-time { font-size:.68rem; color:#8A7070; margin-top:.25rem; }
.vg-msg.from-admin .vg-msg-time { align-self:flex-start; }
.vg-msg.from-visitor .vg-msg-time { align-self:flex-end; }

/* Formulaire inscription (1er message) */
.vg-form-intro { padding:.8rem; border-top:1px solid rgba(200,160,64,.2); }
.vg-input {
  width:100%; padding:.55rem .85rem;
  border:2px solid #F5EBD5; border-radius:8px;
  font-size:.85rem; font-family:inherit;
  background:#fff; color:#1A0808;
  transition:border-color .2s; margin-bottom:.5rem;
}
.vg-input:focus { outline:none; border-color:#C8A040; }
.vg-send-row { display:flex; gap:.5rem; }
.vg-send-row .vg-input { margin-bottom:0; flex:1; }
.vg-btn-send {
  background:#7B2335; color:#fff; border:none;
  padding:.55rem .9rem; border-radius:8px;
  font-size:1rem; cursor:pointer; font-weight:700;
  transition:background .2s; flex-shrink:0;
}
.vg-btn-send:hover { background:#4E0F1C; }

/* Auto-popup promo */
.vg-popup-promo {
  position:fixed; bottom:6.5rem; left:2rem; z-index:7999;
  background:#fff; border-radius:12px; padding:1rem 1.2rem;
  box-shadow:0 8px 32px rgba(26,8,8,.2);
  border-left:4px solid #C8A040; max-width:240px;
  opacity:0; pointer-events:none;
  transform:translateX(-10px);
  transition:opacity .4s ease, transform .4s ease;
}
.vg-popup-promo.show { opacity:1; pointer-events:all; transform:translateX(0); }
.vg-popup-promo p { font-size:.84rem; color:#4E0F1C; font-weight:600; margin-bottom:.3rem; }
.vg-popup-promo .sub { font-size:.76rem; color:#8A7070; font-weight:400; }
.vg-popup-close { position:absolute; top:.3rem; right:.5rem; background:none; border:none; font-size:.9rem; color:#8A7070; cursor:pointer; }

@media(max-width:400px){
  .vg-chat-window { width:calc(100vw - 2rem); left:1rem; bottom:5.5rem; }
  .vg-chat-bubble { bottom:1rem; left:1rem; }
  .vg-popup-promo { left:1rem; max-width:calc(100vw - 4rem); }
}