/* =========================================================
   Assistant du site : bulle + fenêtre de discussion
   Couleurs : jetons du thème (clair / sombre automatiques)
   ========================================================= */
.chat-fab {
  position: fixed; right: max(var(--s2), env(safe-area-inset-right, 0px));
  bottom: calc(var(--s3) + 56px + 12px + env(safe-area-inset-bottom, 0px));
  z-index: calc(var(--z-nav) - 1);
  width: 56px; height: 56px; border-radius: 50%; border: 0; cursor: pointer;
  display: grid; place-items: center;
  background: var(--fg); color: var(--bg);
  box-shadow: 0 10px 30px -8px rgba(var(--shadow-rgb), .5);
  opacity: 0; transform: translateY(16px) scale(.9); pointer-events: none;
  transition: opacity var(--dur) var(--ease-out), transform var(--dur) var(--ease-out), background var(--dur-fast);
}
.chat-fab svg { width: 26px; height: 26px; }
.chat-fab.is-visible { opacity: 1; transform: none; pointer-events: auto; }
.chat-fab:hover { transform: scale(1.06); }
.chat-fab:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
body.menu-open .chat-fab { opacity: 0; pointer-events: none; }
/* Fenêtre ouverte : la bulle WhatsApp s'efface (le lien est dans la fenêtre) */
.chat-open .wa-fab { opacity: 0; pointer-events: none; }
.chat-open .chat-fab { bottom: calc(var(--s3) + env(safe-area-inset-bottom, 0px)); }

.chat {
  position: fixed; z-index: var(--z-nav);
  right: max(var(--s2), env(safe-area-inset-right, 0px));
  bottom: calc(var(--s3) + 56px + 12px + env(safe-area-inset-bottom, 0px));
  width: min(390px, calc(100vw - 2 * var(--s2)));
  height: min(600px, calc(100dvh - 56px - 6rem));
  display: flex; flex-direction: column;
  background: var(--surface); color: var(--fg);
  border: 1px solid var(--border); border-radius: 16px; overflow: hidden;
  box-shadow: 0 30px 80px -20px rgba(var(--shadow-rgb), .45), 0 8px 24px -12px rgba(var(--shadow-rgb), .3);
  font-family: var(--sans); font-size: .95rem; line-height: 1.5;
  opacity: 0; transform: translateY(12px) scale(.98); transform-origin: bottom right;
  transition: opacity var(--dur) var(--ease-out), transform var(--dur) var(--ease-out);
}
.chat[hidden] { display: none; }
.chat.is-in { opacity: 1; transform: none; }

.chat__head {
  display: flex; align-items: center; gap: .75rem;
  padding: .9rem 1rem; background: var(--dark); color: var(--on-dark);
}
.chat__avatar {
  flex: none; width: 40px; height: 40px; border-radius: 50%;
  display: grid; place-items: center;
  font-family: var(--serif); font-size: 1.15rem; font-style: italic; letter-spacing: .02em;
  border: 1px solid var(--on-dark-accent); color: var(--on-dark-accent);
}
.chat__who { flex: 1; min-width: 0; }
.chat__title { margin: 0; font-family: var(--serif); font-size: 1.3rem; font-weight: 500; line-height: 1.1; }
.chat__sub { margin: .15rem 0 0; font-size: .75rem; letter-spacing: .04em; color: var(--on-dark-muted); display: flex; align-items: center; gap: .4rem; }
.chat__sub i { width: 7px; height: 7px; border-radius: 50%; background: #5cc96b; box-shadow: 0 0 0 3px rgba(92, 201, 107, .2); }
.chat__reset, .chat__close {
  flex: none; border: 0; background: transparent; color: var(--on-dark); cursor: pointer;
  border-radius: 8px; min-height: 40px;
}
.chat__reset { width: 40px; display: grid; place-items: center; color: var(--on-dark-muted); }
.chat__reset svg { width: 19px; height: 19px; }
.chat__reset[hidden] { display: none; }
.chat__reset:hover { color: var(--on-dark); }
.chat__close { width: 40px; display: grid; place-items: center; }
.chat__close svg { width: 22px; height: 22px; }
.chat__close:hover, .chat__reset:hover { background: var(--line-dark); }
.chat__reset:focus-visible, .chat__close:focus-visible { outline: 2px solid var(--on-dark-accent); outline-offset: 1px; }

.chat__log {
  flex: 1; overflow-y: auto; overscroll-behavior: contain;
  padding: 1rem; display: flex; flex-direction: column; gap: .6rem;
  background: var(--bg);
}
.chat__msg { max-width: 86%; padding: .65rem .85rem; border-radius: 14px; overflow-wrap: anywhere; }
.chat__msg p { margin: 0; white-space: pre-line; }
.chat__msg p + p { margin-top: .5rem; }
.chat__msg--bot { align-self: flex-start; background: var(--surface); border: 1px solid var(--border); border-bottom-left-radius: 4px; }
.chat__msg--user { align-self: flex-end; background: var(--accent); color: var(--on-accent); border-bottom-right-radius: 4px; }
.chat__msg { animation: chatIn .35s var(--ease-out) both; }
@keyframes chatIn { from { opacity: 0; transform: translateY(6px); } }

.chat__cta { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: -.15rem; animation: chatIn .35s var(--ease-out) both; }
.chat__btn {
  display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: .5rem .9rem;
  border-radius: 999px; font: 600 .8rem/1.2 var(--sans); text-decoration: none; cursor: pointer;
  border: 1px solid var(--border); background: var(--surface); color: var(--fg);
  transition: transform var(--dur-fast), border-color var(--dur-fast);
}
.chat__btn:hover { transform: translateY(-1px); border-color: var(--accent); }
.chat__btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.chat__btn--solid { background: var(--fg); color: var(--bg); border-color: var(--fg); }
.chat__btn--wa::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: #25d366; margin-right: .45rem; }

.chat__typing { display: flex; gap: 4px; padding: .8rem .9rem; }
.chat__typing i { width: 7px; height: 7px; border-radius: 50%; background: var(--fg-muted); animation: chatDot 1.1s infinite ease-in-out; }
.chat__typing i:nth-child(2) { animation-delay: .15s; }
.chat__typing i:nth-child(3) { animation-delay: .3s; }
@keyframes chatDot { 0%, 80%, 100% { opacity: .25; transform: none; } 40% { opacity: 1; transform: translateY(-3px); } }

.chat__chips { display: flex; flex-wrap: wrap; gap: .4rem; padding: 0 1rem .75rem; background: var(--bg); }
.chat__chip {
  border: 1px solid var(--border); background: var(--surface); color: var(--fg);
  font: 500 .8rem/1.3 var(--sans); padding: .5rem .75rem; border-radius: 999px; cursor: pointer; text-align: left;
  min-height: 36px; transition: border-color var(--dur-fast), color var(--dur-fast);
}
.chat__chip:hover { border-color: var(--accent); color: var(--accent); }
.chat__chip:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.chat__form { display: flex; align-items: flex-end; gap: .5rem; padding: .75rem; border-top: 1px solid var(--border); background: var(--surface); }
.chat__form textarea {
  flex: 1; resize: none; min-height: 44px; max-height: 120px;
  font: 16px/1.4 var(--sans); color: var(--fg); background: var(--bg);
  border: 1px solid var(--border); border-radius: 12px; padding: .6rem .75rem;
}
.chat__form textarea::placeholder { color: var(--fg-muted); }
.chat__form textarea:focus { outline: 2px solid var(--accent); outline-offset: 0; border-color: transparent; }
.chat__send {
  flex: none; width: 44px; height: 44px; border: 0; border-radius: 12px; cursor: pointer;
  display: grid; place-items: center; background: var(--fg); color: var(--bg);
  transition: opacity var(--dur-fast), transform var(--dur-fast);
}
.chat__send svg { width: 22px; height: 22px; }
.chat__send:hover { transform: translateX(2px); }
.chat__send:disabled { opacity: .4; cursor: default; transform: none; }
.chat__send:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }

.chat__foot { margin: 0; padding: 0 .9rem .7rem; background: var(--surface); font-size: .7rem; line-height: 1.45; color: var(--fg-muted); }
.chat__foot a { color: var(--accent); font-weight: 600; }

/* Téléphone : plein écran */
@media (max-width: 600px) {
  .chat {
    inset: 0; width: 100%; height: 100%; height: 100dvh; border-radius: 0; border: 0;
    padding-top: env(safe-area-inset-top, 0px); padding-bottom: env(safe-area-inset-bottom, 0px);
    transform: translateY(24px); transform-origin: bottom center;
  }
  .chat__head { padding-top: .75rem; }
  .chat-open .chat-fab { opacity: 0; pointer-events: none; }
  .chat-open, .chat-open body { overflow: hidden; }
}

@media (prefers-reduced-motion: reduce) {
  .chat, .chat-fab, .chat__msg { transition: none; animation: none; }
  .chat__typing i { animation: none; opacity: .6; }
}

/* Clin d'œil pour Laetiso ❤️ */
.chat__msg--love { position: relative; background: linear-gradient(135deg, #8a4f2a, #c9976c) !important; color: #fff !important; }
.chat__heart { position: absolute; bottom: 30%; font-size: 18px; line-height: 1; pointer-events: none; opacity: 0;
  animation: chatHeart 2.4s ease-out forwards; }
@keyframes chatHeart {
  0% { transform: translateY(0) scale(.5); opacity: 0; }
  15% { opacity: 1; }
  100% { transform: translateY(-130px) scale(1.25) rotate(var(--r, 0deg)); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) { .chat__heart { display: none; } }
/* Clin d'œil pour Patrick : bulle « code » + pluie de code aux couleurs du site */
.chat__msg--dev { background: var(--dark) !important; color: var(--on-dark-accent) !important; border: 1px solid var(--accent-deco); box-shadow: 0 0 22px -8px var(--accent-deco); max-width: 100%; }
.chat__msg--dev pre { margin: 0; white-space: pre-wrap; word-break: break-word; font: .78rem/1.55 ui-monospace, "SFMono-Regular", Consolas, monospace; text-shadow: 0 0 8px rgba(224, 180, 140, .35); }
.chat__matrix { position: absolute; inset: 0; z-index: 5; pointer-events: none; transition: opacity .8s ease; }
/* Clin d'œil pour Margaux : bulle néon « turfu » + fusée qui décolle */
.chat__msg--turfu { position: relative; background: var(--dark) !important; color: var(--on-dark) !important; border: 1px solid var(--accent-deco); box-shadow: 0 0 26px -6px var(--accent-deco); }
.chat__msg--turfu p:first-child { font: 700 1.02rem/1.35 ui-monospace, "SFMono-Regular", Consolas, monospace; color: var(--on-dark-accent); text-shadow: 0 0 10px rgba(224, 180, 140, .45); letter-spacing: .01em; }
.chat__rocket { position: absolute; left: 14%; bottom: 8%; z-index: 6; pointer-events: none; font-size: 40px; line-height: 1; animation: chatLaunch 2.4s cubic-bezier(.55, 0, .75, .35) forwards; }
.chat__rocket b { display: block; font-weight: 400; transform: rotate(0deg); filter: drop-shadow(0 0 10px rgba(255, 170, 60, .8)); }
.chat__rocket::after { content: ""; position: absolute; left: 2px; top: 60%; width: 14px; height: 70px; border-radius: 50%; transform: rotate(45deg); transform-origin: top center; background: linear-gradient(#ffd27a, #ff6b2c 40%, rgba(255, 107, 44, 0)); filter: blur(2px); opacity: .9; animation: chatFlame .12s ease-in-out infinite alternate; }
@keyframes chatLaunch {
  0% { transform: translate(0, 0) scale(.9); opacity: 0; }
  12% { transform: translate(0, -4px) scale(1); opacity: 1; }
  25% { transform: translate(3px, -10px) scale(1); }
  100% { transform: translate(260px, -520px) scale(1.15); opacity: 1; }
}
@keyframes chatFlame { from { height: 52px; opacity: .75; } to { height: 78px; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .chat__rocket { display: none; } }