/* =============================================================================
   CMER&TI — site assistant
   =============================================================================
   Every colour below is a variable from base.css. The assistant inherits the
   wine palette rather than introducing one of its own, so a theme change still
   flows from a single file.
   ========================================================================== */

/* ------------------------------------------------------------- launcher */

.chat-launch{
  position:fixed; right:22px; bottom:80px;      /* clear of the back-to-top button */
  display:flex; align-items:center; gap:10px;
  height:52px; padding:0 20px 0 16px;
  background:var(--wine); color:#fff;
  border:0; border-radius:26px;
  font:600 14.5px/1 inherit; cursor:pointer;
  box-shadow:0 10px 26px rgba(122,20,66,.36);
  z-index:160;
  transition:transform .25s cubic-bezier(.2,.8,.2,1), background .2s ease, box-shadow .25s ease;
}
.chat-launch:hover{background:var(--wine-dark); transform:translateY(-2px); box-shadow:0 14px 32px rgba(122,20,66,.44)}
.chat-launch svg{width:22px; height:22px; flex:0 0 auto}
.chat-launch.is-hidden{opacity:0; visibility:hidden; transform:scale(.85)}

/* A slow pulse the first time, so the assistant is noticed without nagging. */
.chat-launch::before{
  content:""; position:absolute; inset:0; border-radius:inherit;
  border:2px solid var(--wine); opacity:0;
}
.chat-launch.is-new::before{animation:chatPulse 2.4s ease-out 3}
@keyframes chatPulse{
  0%{opacity:.7; transform:scale(1)}
  100%{opacity:0; transform:scale(1.35)}
}

/* ---------------------------------------------------------------- panel */

.chat-panel{
  position:fixed; right:22px; bottom:22px;
  width:min(410px, calc(100vw - 32px));
  height:min(620px, calc(100vh - 44px));
  display:flex; flex-direction:column;
  background:var(--surface);
  border:1px solid var(--line-wine); border-radius:14px;
  box-shadow:0 24px 60px rgba(28,10,20,.30);
  overflow:hidden; z-index:170;
  opacity:0; visibility:hidden; transform:translateY(16px) scale(.98);
  transition:opacity .24s ease, transform .24s cubic-bezier(.2,.8,.2,1), visibility 0s linear .24s;
}
.chat-panel.is-open{
  opacity:1; visibility:visible; transform:none;
  transition:opacity .24s ease, transform .24s cubic-bezier(.2,.8,.2,1), visibility 0s;
}

.chat-head{
  display:flex; align-items:center; gap:12px;
  padding:14px 16px; background:var(--wine); color:#fff; flex:0 0 auto;
}
.chat-head__dot{
  width:9px; height:9px; border-radius:50%; background:#7ee08a; flex:0 0 auto;
  box-shadow:0 0 0 3px rgba(126,224,138,.25);
}
.chat-head__t{font-weight:700; font-size:15px; line-height:1.2}
.chat-head__s{font-size:11.5px; opacity:.8; margin-top:2px}
.chat-head__x{
  margin-left:auto; background:none; border:0; color:#fff; cursor:pointer;
  width:32px; height:32px; border-radius:50%; display:grid; place-items:center;
  transition:background .18s ease;
}
.chat-head__x:hover{background:rgba(255,255,255,.18)}
.chat-head__x svg{width:17px; height:17px}

/* --------------------------------------------------------------- thread */

.chat-log{
  flex:1 1 auto; overflow-y:auto; padding:16px;
  background:var(--surface-2); scroll-behavior:smooth;
}
.chat-msg{
  max-width:88%; margin:0 0 12px; padding:11px 14px;
  border-radius:14px; font-size:14px; line-height:1.6;
  animation:chatIn .3s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes chatIn{from{opacity:0; transform:translateY(8px)}to{opacity:1; transform:none}}

.chat-msg--bot{
  background:var(--surface); color:var(--ink);
  border:1px solid var(--line); border-bottom-left-radius:5px;
  margin-right:auto;
}
.chat-msg--me{
  background:var(--wine); color:#fff;
  border-bottom-right-radius:5px; margin-left:auto;
}
.chat-msg p{margin:0 0 8px}
.chat-msg p:last-child{margin-bottom:0}
.chat-msg a{color:var(--wine); font-weight:600; text-decoration:underline}
.chat-msg--me a{color:#fff}

.chat-more{
  font-size:11.5px !important; text-transform:uppercase; letter-spacing:.05em;
  color:var(--ink-3); margin-top:10px !important;
}
.chat-links{list-style:none; margin:6px 0 0; padding:0}
.chat-links li{margin:0 0 5px}
.chat-links a{
  display:block; padding:7px 11px; background:var(--wine-tint);
  border-radius:7px; font-size:13px; text-decoration:none; font-weight:600;
  transition:background .16s ease, transform .16s ease;
}
.chat-links a:hover{background:var(--line-wine); transform:translateX(2px)}

/* ------------------------------------------------------- external sources

   Deliberately unlike an institute answer: neutral grey rather than wine, a
   dashed rule, and a standing label. A visitor must never read a Wikipedia
   sentence as something the institute has stated. */

.chat-ext{
  margin:10px 0 0; padding:10px 12px;
  background:#f6f6f7; border:1px dashed #c9c9cf;
  border-radius:9px;
}
.chat-ext__tag{
  margin:0 0 6px !important;
  font-size:10.5px !important; font-weight:700;
  text-transform:uppercase; letter-spacing:.05em; color:#6b6b73;
}
.chat-ext p{font-size:13.2px; line-height:1.55; color:#3a3a42}
.chat-ext__cite{margin-top:7px !important; font-size:11.5px !important}
.chat-ext__cite a{color:#4a4a55; font-weight:600; text-decoration:underline}
.chat-ext__cite a:hover{color:var(--wine)}

/* Typing indicator */
.chat-typing{display:flex; gap:4px; align-items:center; padding:4px 2px}
.chat-typing i{
  width:7px; height:7px; border-radius:50%; background:var(--wine); opacity:.45;
  animation:chatDot 1.1s infinite ease-in-out;
}
.chat-typing i:nth-child(2){animation-delay:.16s}
.chat-typing i:nth-child(3){animation-delay:.32s}
@keyframes chatDot{
  0%,60%,100%{transform:translateY(0); opacity:.4}
  30%{transform:translateY(-5px); opacity:1}
}

/* ---------------------------------------------------------- suggestions */

.chat-chips{display:flex; flex-wrap:wrap; gap:6px; margin:2px 0 12px}
.chat-chip{
  background:var(--surface); border:1px solid var(--line-wine);
  color:var(--wine-dark); border-radius:999px;
  padding:7px 12px; font:600 12.5px/1.3 inherit; cursor:pointer; text-align:left;
  transition:background .16s ease, color .16s ease, transform .16s ease;
}
.chat-chip:hover{background:var(--wine); color:#fff; transform:translateY(-1px)}

/* ---------------------------------------------------------------- input */

.chat-form{
  display:flex; gap:8px; padding:12px; background:var(--surface);
  border-top:1px solid var(--line); flex:0 0 auto;
}
.chat-input{
  flex:1 1 auto; resize:none; min-height:42px; max-height:110px;
  padding:11px 13px; border:1px solid var(--line-wine); border-radius:10px;
  font:400 14px/1.45 inherit; color:var(--ink); background:var(--surface);
  transition:border-color .18s ease, box-shadow .18s ease;
}
.chat-input:focus{
  outline:0; border-color:var(--wine);
  box-shadow:0 0 0 3px rgba(122,20,66,.13);
}
.chat-send{
  flex:0 0 auto; width:42px; height:42px; align-self:flex-end;
  background:var(--wine); color:#fff; border:0; border-radius:10px;
  cursor:pointer; display:grid; place-items:center;
  transition:background .18s ease, transform .18s ease;
}
.chat-send:hover:not(:disabled){background:var(--wine-dark); transform:translateY(-1px)}
.chat-send:disabled{opacity:.45; cursor:not-allowed}
.chat-send svg{width:18px; height:18px}

.chat-foot{
  padding:0 12px 10px; font-size:11px; color:var(--ink-3);
  background:var(--surface); text-align:center; line-height:1.5;
}

/* --------------------------------------------------------------- mobile */

@media (max-width:520px){
  .chat-panel{
    right:0; bottom:0; width:100vw; height:100dvh;
    border-radius:0; border:0;
  }
  .chat-launch{right:16px; bottom:74px; height:48px; padding:0 16px 0 13px}
  .chat-launch__label{display:none}
  .chat-launch{padding:0; width:48px; justify-content:center}
}

@media (prefers-reduced-motion:reduce){
  .chat-panel,.chat-launch,.chat-msg,.chat-chip,.chat-links a,.chat-send{
    transition:none; animation:none;
  }
  .chat-typing i{animation:none}
  .chat-launch.is-new::before{animation:none}
}