/* ============================================================
   Le Gardien du Feu — widget flottant universel
   Présent sur toutes les pages membres. Objectif n°1 :
   la BARRE DE CHAT n'est JAMAIS cachée ni coupée
   (desktop, tablette, mobile portrait, mobile paysage, clavier).
   Préfixe « gw- » pour ne rien casser ailleurs.
   ============================================================ */

:root {
  --gw-accent: var(--gardien-primary, var(--cyan-neon, #3da9fc));
  --gw-accent-2: var(--gardien-secondary, var(--cyan-soft, #6fc3ff));
  --gw-halo: var(--gardien-halo, rgba(61, 169, 252, 0.45));
  --gw-panel-bg: #0b1626;
  --gw-panel-bg-2: #0a1322;
  --gw-border: rgba(120, 180, 255, 0.22);
  --gw-ink: #eaf2ff;
  --gw-ink-soft: rgba(234, 242, 255, 0.66);
  --gw-bot-bubble: rgba(20, 36, 60, 0.92);
  --gw-user-bubble: linear-gradient(135deg, #1f6dab, #2e86c7);
  /* hauteur de la nav basse mobile à dépasser (≈78px) */
  --gw-bottomnav: 78px;
  --gw-safe: env(safe-area-inset-bottom, 0px);
}

/* ===== Lanceur (bulle flottante) ===== */
.gw-launcher {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 1000;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 9px 15px 9px 9px;
  border: 1px solid var(--gw-border);
  border-radius: 999px;
  background: linear-gradient(135deg, var(--gw-panel-bg), var(--gw-panel-bg-2));
  color: var(--gw-ink);
  font: 600 13.5px/1 'Inter', system-ui, sans-serif;
  cursor: pointer;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.45), 0 0 0 4px var(--gw-halo);
  transition: transform .16s ease, filter .16s ease, box-shadow .16s ease;
  max-width: calc(100vw - 36px);
}
.gw-launcher:hover { transform: translateY(-2px); filter: brightness(1.07); }
.gw-launcher:focus-visible { outline: 3px solid var(--gw-accent-2); outline-offset: 2px; }
.gw-launcher-orb {
  width: 38px; height: 38px; border-radius: 50%;
  overflow: hidden; display: grid; place-items: center; flex-shrink: 0;
  background: radial-gradient(circle at 50% 32%, rgba(255,210,120,0.60), rgba(255,142,66,0.50) 36%, rgba(228,78,96,0.45) 66%, rgba(42,20,54,0.78) 100%);
  box-shadow: 0 0 14px rgba(245,197,66,0.55), inset 0 0 0 1.3px rgba(245,197,66,0.50);
}
.gw-launcher-orb video, .gw-launcher-orb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gw-launcher-orb video { mix-blend-mode: screen; }
.gw-launcher-txt { display: flex; flex-direction: column; line-height: 1.15; white-space: nowrap; }
.gw-launcher-txt b { font-weight: 700; font-size: 13px; }
.gw-launcher-txt small { font-size: 10.5px; color: var(--gw-ink-soft); font-weight: 500; }
.gw-launcher-dot {
  width: 8px; height: 8px; border-radius: 50%; background: #4ad26a;
  box-shadow: 0 0 8px #4ad26a; flex-shrink: 0; margin-left: 2px;
}
body.gw-open .gw-launcher { opacity: 0; pointer-events: none; transform: scale(.8); }
/* (06/07) Menu « Plus » mobile ouvert -> on masque la bulle Gardien pour ne pas cacher les items du menu. */
body.plus-open .gw-launcher { opacity: 0; pointer-events: none; transform: scale(.8); }

/* ===== Voile (mobile uniquement, pour fermer en tapant à côté) ===== */
.gw-scrim {
  position: fixed; inset: 0; z-index: 999;
  background: rgba(2, 6, 14, 0.42);
  opacity: 0; pointer-events: none; transition: opacity .2s ease;
}
body.gw-open .gw-scrim { opacity: 1; }

/* ===== Panneau de chat ===== */
.gw-panel {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 1001;
  width: min(380px, calc(100vw - 36px));
  height: min(78dvh, 600px);
  max-height: calc(100dvh - 28px);
  display: flex;
  flex-direction: column;
  background: linear-gradient(180deg, var(--gw-panel-bg), var(--gw-panel-bg-2));
  border: 1px solid var(--gw-border);
  border-radius: 18px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(0, 0, 0, 0.3);
  overflow: hidden;            /* le scroll est INTERNE à .gw-conv */
  transform: translateY(14px) scale(.98);
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease;
  box-sizing: border-box;
}
body.gw-open .gw-panel { opacity: 1; transform: none; pointer-events: auto; }

/* En-tête : avatar + nom + statut + fermer (hauteur fixe) */
.gw-head {
  flex: 0 0 auto;
  display: flex; align-items: center; gap: 11px;
  padding: 12px 12px 11px 14px;
  border-bottom: 1px solid var(--gw-border);
  background: linear-gradient(135deg, rgba(61, 169, 252, 0.12), transparent);
}
.gw-head-orb {
  width: 40px; height: 40px; border-radius: 50%; overflow: hidden; display: grid; place-items: center; flex-shrink: 0;
  box-shadow: 0 0 16px rgba(245,197,66,0.55), inset 0 0 0 1.3px rgba(245,197,66,0.50);
  background: radial-gradient(circle at 50% 32%, rgba(255,210,120,0.60), rgba(255,142,66,0.50) 36%, rgba(228,78,96,0.45) 66%, rgba(42,20,54,0.78) 100%);
}
.gw-head-orb video, .gw-head-orb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gw-head-orb video { mix-blend-mode: screen; }
.gw-head-txt { flex: 1 1 auto; min-width: 0; }
.gw-name {
  font: 700 13.5px/1.1 'Inter', system-ui, sans-serif;
  letter-spacing: .04em; color: var(--gw-ink);
  text-transform: uppercase; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.gw-status {
  display: inline-flex; align-items: center; gap: 6px;
  margin-top: 3px; font-size: 11.5px; color: var(--gw-ink-soft); font-weight: 500;
}
.gw-status::before {
  content: ''; width: 7px; height: 7px; border-radius: 50%;
  background: #4ad26a; box-shadow: 0 0 7px #4ad26a;
}
.gw-close {
  flex-shrink: 0; width: 32px; height: 32px; border-radius: 9px;
  border: 1px solid var(--gw-border); background: rgba(255, 255, 255, 0.04);
  color: var(--gw-ink-soft); font-size: 20px; line-height: 1; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  padding: 0; box-sizing: border-box;
  transition: background .15s, color .15s;
}
.gw-close:hover { background: rgba(255, 255, 255, 0.1); color: #fff; }

/* Conversation : prend toute la place restante, SCROLL INTERNE */
.gw-conv {
  flex: 1 1 auto;
  min-height: 0;                /* indispensable pour que le scroll interne marche en flex */
  overflow-y: auto;
  overflow-x: hidden;
  padding: 14px 13px 6px;
  display: flex; flex-direction: column; gap: 10px;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
.gw-msg { display: flex; max-width: 100%; }
.gw-msg.is-user { justify-content: flex-end; }
.gw-bubble {
  max-width: 86%;
  padding: 9px 12px;
  border-radius: 14px;
  font: 400 13.5px/1.5 'Inter', system-ui, sans-serif;
  color: var(--gw-ink);
  word-wrap: break-word; overflow-wrap: break-word; word-break: break-word;
  white-space: pre-wrap;
}
.gw-msg.is-bot .gw-bubble {
  background: var(--gw-bot-bubble);
  border: 1px solid var(--gw-border);
  border-bottom-left-radius: 5px;
}
.gw-msg.is-user .gw-bubble {
  background: var(--gw-user-bubble);
  color: #fff; border-bottom-right-radius: 5px;
}
.gw-bubble a { color: var(--gw-accent-2); }
.gw-bubble strong { color: #fff; }
.gw-bubble ul { margin: 6px 0; padding-left: 18px; }
.gw-bubble code { background: rgba(0,0,0,.3); padding: 1px 5px; border-radius: 5px; font-size: 12px; }

/* Questions rapides (chips) — défilement horizontal si trop nombreuses */
.gw-chips {
  flex: 0 0 auto;
  display: flex; gap: 7px; flex-wrap: wrap;
  padding: 2px 1px 4px;
}
.gw-chips.is-scroll {
  flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px;
  -webkit-overflow-scrolling: touch; scrollbar-width: thin;
}
.gw-chip {
  flex: 0 0 auto;
  padding: 7px 12px; border-radius: 999px;
  border: 1px solid var(--gw-border); background: rgba(61, 169, 252, 0.08);
  color: var(--gw-ink); font: 600 12px/1 'Inter', system-ui, sans-serif;
  cursor: pointer; white-space: nowrap; transition: background .14s, border-color .14s;
}
.gw-chip:hover { background: rgba(61, 169, 252, 0.18); border-color: var(--gw-accent); }

/* Fenêtre d'info [VOIR] — repliée dans la conversation */
.gw-info {
  border: 1px solid var(--gw-border); border-radius: 12px;
  background: rgba(61, 169, 252, 0.06); overflow: hidden;
}
.gw-info-head {
  padding: 8px 12px; font: 700 12.5px/1.3 'Inter', sans-serif; color: var(--gw-accent-2);
  background: rgba(61, 169, 252, 0.1); border-bottom: 1px solid var(--gw-border);
}
.gw-info-body { padding: 10px 12px; font-size: 12.7px; line-height: 1.55; color: var(--gw-ink); }
.gw-info-body ul { margin: 5px 0; padding-left: 18px; }

/* Carte de confirmation d'action (rien d'automatique : Valider / Annuler) */
.gw-action {
  border: 1px solid rgba(212, 185, 140, 0.45); border-radius: 12px;
  background: rgba(212, 185, 140, 0.07); padding: 11px 12px;
}
.gw-action-title { font: 700 12.5px/1.3 'Inter', sans-serif; color: #e7c98a; margin-bottom: 4px; }
.gw-action-resume { font-size: 12.5px; color: var(--gw-ink); margin-bottom: 9px; white-space: pre-wrap; }
.gw-action-btns { display: flex; gap: 8px; flex-wrap: wrap; }
.gw-btn-ok {
  background: #2d7d46; color: #fff; border: none; border-radius: 999px;
  padding: 7px 15px; font: 700 12.5px/1 'Inter', sans-serif; cursor: pointer;
}
.gw-btn-ok:hover { filter: brightness(1.08); }
.gw-btn-cancel {
  background: transparent; color: var(--gw-ink-soft); border: 1px solid var(--gw-border);
  border-radius: 999px; padding: 7px 14px; font: 600 12.5px/1 'Inter', sans-serif; cursor: pointer;
}
.gw-action-msg { display: block; margin-top: 7px; font-size: 11.5px; }

/* Indicateur « écrit… » */
.gw-typing { display: inline-flex; gap: 4px; align-items: center; padding: 2px 0; }
.gw-typing span {
  width: 7px; height: 7px; border-radius: 50%; background: var(--gw-accent-2);
  animation: gw-bounce 1.2s infinite ease-in-out both;
}
.gw-typing span:nth-child(2) { animation-delay: .15s; }
.gw-typing span:nth-child(3) { animation-delay: .3s; }
@keyframes gw-bounce { 0%, 80%, 100% { transform: scale(.5); opacity: .5; } 40% { transform: scale(1); opacity: 1; } }

.gw-err {
  font-size: 12px; color: #ffb4b4; background: rgba(180, 40, 40, .14);
  border: 1px solid rgba(255, 120, 120, .3); border-radius: 9px; padding: 7px 10px;
}

/* ===== BARRE DE CHAT — toujours visible, jamais coupée ===== */
.gw-foot {
  flex: 0 0 auto;                 /* dernier élément flex → toujours visible en bas */
  border-top: 1px solid var(--gw-border);
  background: var(--gw-panel-bg-2);
  padding: 9px 10px;
  /* respecte la barre système (encoche / home bar iPhone, nav Android) */
  padding-bottom: calc(9px + var(--gw-safe));
}
.gw-chips-foot { margin-bottom: 8px; }   /* chips au-dessus de la barre */
.gw-form { display: flex; align-items: flex-end; gap: 8px; }
.gw-input {
  flex: 1 1 auto; min-width: 0;
  resize: none;
  max-height: 96px;               /* scroll interne au-delà, jamais d'expansion infinie */
  padding: 9px 12px;
  border-radius: 13px;
  border: 1px solid var(--gw-border);
  background: rgba(255, 255, 255, 0.05);
  color: var(--gw-ink);
  font: 400 14px/1.4 'Inter', system-ui, sans-serif;   /* 14px = pas de zoom auto iOS */
  outline: none;
}
.gw-input:focus { border-color: var(--gw-accent); }
.gw-input::placeholder { color: rgba(234, 242, 255, 0.4); }
.gw-send {
  flex: 0 0 auto;
  width: 42px; height: 42px; border-radius: 12px; border: none; cursor: pointer;
  /* night-cyan.css impose un padding aux button[type=submit] (sélecteur plus fort)
     qui écrasait l'icône à 0 de large → on force ici. */
  padding: 0 !important; box-sizing: border-box;
  background: linear-gradient(135deg, var(--gw-accent), #2e86c7);
  color: #fff; display: inline-flex; align-items: center; justify-content: center;
  transition: filter .15s, transform .1s;
}
.gw-send:hover { filter: brightness(1.1); }
.gw-send:active { transform: scale(.94); }
.gw-send:disabled { opacity: .5; cursor: default; }
/* l'icône flèche : on force la taille (un style global du site écrase sinon le width/height du SVG → icône à 0×0) */
.gw-send svg { width: 18px; height: 18px; display: block; flex: 0 0 auto; }

/* ============================================================
   RESPONSIVE
   ============================================================ */

/* Tablette / mobile : la nav basse existe (≤900px) → le lanceur passe AU-DESSUS */
@media (max-width: 900px) {
  .gw-launcher {
    bottom: calc(var(--gw-bottomnav) + var(--gw-safe) + 12px);
    right: 12px;
  }
}

/* Mobile portrait : le panneau devient une feuille en bas (sans manger tout l'écran) */
@media (max-width: 680px) {
  .gw-panel {
    left: 0; right: 0; bottom: 0;
    width: 100%;
    height: min(72svh, 560px);
    max-height: 88svh;
    border-radius: 18px 18px 0 0;
    border-bottom: none;
  }
  .gw-launcher { padding: 8px 14px 8px 8px; }
  .gw-launcher-orb { width: 34px; height: 34px; }
  .gw-head-orb { width: 36px; height: 36px; }
  .gw-chips { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
}

/* Très petit écran : on cache le libellé du lanceur, juste l'avatar + point */
@media (max-width: 380px) {
  .gw-launcher-txt { display: none; }
  .gw-launcher { padding: 7px; gap: 0; }
}

/* Mobile paysage (peu de hauteur) : panneau plus court, en-tête compact */
@media (max-height: 500px) and (orientation: landscape) {
  .gw-panel {
    height: 94svh; max-height: 94svh;
    width: min(420px, calc(100vw - 24px));
    left: auto; right: 10px; bottom: 6px;
    border-radius: 16px;
  }
  .gw-head { padding: 7px 10px; }
  .gw-head-orb { width: 30px; height: 30px; }
  .gw-name { font-size: 12px; }
  .gw-launcher { bottom: calc(var(--gw-safe) + 8px); }
  /* priorité à la barre de saisie : on masque les questions rapides du pied */
  .gw-chips-foot { display: none; }
}

/* Confort de lecture : respecte « réduire les animations » */
@media (prefers-reduced-motion: reduce) {
  .gw-launcher, .gw-panel, .gw-scrim { transition: none; }
  .gw-typing span { animation: none; }
}

/* === Partenaires (bouton « Voir plus d'options ») === */
.gw-partners-btn { align-self:flex-start; margin:2px 0; padding:7px 13px; border-radius:999px; border:1px solid rgba(249,168,38,.45); background:rgba(249,168,38,.14); color:#f9c66a; font:600 12.5px/1 'Inter',system-ui,sans-serif; cursor:pointer; }
.gw-partners-btn:hover { background:rgba(249,168,38,.24); }
.gw-partners { display:flex; flex-direction:column; gap:8px; }
.gw-pcard { display:flex; gap:10px; padding:9px; border-radius:12px; background:rgba(20,36,60,0.92); border:1px solid rgba(249,168,38,.35); }
.gw-pcard-img { width:70px; height:54px; border-radius:8px; object-fit:cover; flex-shrink:0; background:#0a1322; }
.gw-pcard-body { flex:1; min-width:0; }
.gw-pcard-type { font-size:9.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:#f9c66a; }
.gw-pcard-name { font-size:14px; font-weight:700; color:var(--gw-ink,#eaf2ff); }
.gw-pcard-loc { font-size:11.5px; color:var(--gw-ink-soft,rgba(234,242,255,.66)); }
.gw-pcard-desc { font-size:12px; color:var(--gw-ink-soft,rgba(234,242,255,.66)); margin-top:3px; }
.gw-pcard-offre { font-size:11.5px; color:#f9c66a; margin-top:3px; }
.gw-pcard-acts { display:flex; gap:6px; flex-wrap:wrap; margin-top:7px; }
.gw-pcard-btn { font-size:11.5px; padding:4px 9px; border-radius:999px; border:1px solid rgba(249,168,38,.4); background:rgba(249,168,38,.12); color:#f9c66a; text-decoration:none; }
.gw-pcard-btn:hover { background:rgba(249,168,38,.22); }