/* ============================================================
   La Dimora di San Giovanni — CHATBOT di assistenza
   Stessi token del sito (css/styles.css): avorio, inchiostro,
   oro tenue, rosa antico + font script/serif/sans.
   Widget fisso in basso a destra, sopra la mobile-bar su mobile.
   ============================================================ */

/* ---------- Bottone flottante ---------- */
.chat-fab{
  position:fixed;right:1rem;bottom:4.8rem;z-index:90;
  display:inline-flex;align-items:center;gap:.55rem;
  font-family:var(--font-sans);font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;
  background:linear-gradient(135deg,var(--ink),var(--ink-deep));color:var(--cream);
  border:1px solid rgba(217,199,160,.5);border-radius:999px;
  padding:.9rem 1.35rem;cursor:pointer;
  box-shadow:var(--shadow-lift);
  transition:transform .2s var(--ease),box-shadow .25s var(--ease),filter .25s var(--ease);
}
.chat-fab svg{width:20px;height:20px;fill:currentColor;flex:none}
.chat-fab:hover{transform:translateY(-2px);filter:brightness(1.15)}
.chat-fab .chat-fab-dot{
  position:absolute;top:-2px;right:-2px;width:14px;height:14px;border-radius:50%;
  background:var(--gold);border:2px solid var(--cream);
}
@media(min-width:860px){.chat-fab{bottom:1.4rem;right:1.4rem}}

/* ---------- Pannello chat ---------- */
.chat-panel{
  position:fixed;z-index:110;right:.8rem;left:.8rem;bottom:8.6rem;
  display:flex;flex-direction:column;overflow:hidden;
  max-height:min(68vh,560px);
  background:var(--paper);border:1px solid rgba(165,133,76,.45);border-radius:24px;
  box-shadow:var(--shadow-lift);
}
@media(min-width:640px){
  .chat-panel{left:auto;right:1.2rem;width:392px;bottom:5.6rem}
}
@media(min-width:860px){.chat-panel{bottom:5.8rem}}
.chat-panel[hidden]{display:none}

/* ---------- Testata ---------- */
.chat-head{
  display:flex;align-items:center;gap:.8rem;
  background:linear-gradient(135deg,var(--ink),var(--ink-deep));color:var(--cream);padding:.95rem 1.1rem;
}
.chat-head-avatar{
  width:42px;height:42px;flex:none;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-script);font-size:1.5rem;
  background:var(--gold);color:#fff;
}
.chat-head-text{min-width:0;flex:1}
.chat-head-name{font-family:var(--font-script);font-size:1.5rem;line-height:1.1;display:block}
.chat-head-status{
  font-family:var(--font-sans);font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;
  color:var(--gold-soft);display:flex;align-items:center;gap:.4rem;
}
.chat-head-status::before{
  content:"";width:8px;height:8px;border-radius:50%;background:#7fbf7f;flex:none;
}
.chat-head-close{
  flex:none;width:38px;height:38px;border-radius:50%;cursor:pointer;
  border:1px solid rgba(245,240,230,.4);background:transparent;color:var(--cream);font-size:1.3rem;line-height:1;
  transition:background .2s ease;
}
.chat-head-close:hover{background:rgba(245,240,230,.16)}

/* ---------- Messaggi ---------- */
.chat-log{
  flex:1;overflow-y:auto;padding:1rem .9rem;display:flex;flex-direction:column;gap:.7rem;
  background:var(--cream);scroll-behavior:smooth;
}
.chat-msg{max-width:88%;padding:.7rem .95rem;border-radius:16px;font-size:1.02rem;line-height:1.5}
.chat-msg.bot{
  align-self:flex-start;background:var(--paper);
  border:1px solid var(--line);border-bottom-left-radius:6px;
  box-shadow:var(--shadow-soft);
}
.chat-msg.user{
  align-self:flex-end;background:var(--ink);color:var(--cream);
  border-bottom-right-radius:6px;
}
.chat-msg p{margin:.35rem 0}
.chat-msg p:first-child{margin-top:0}
.chat-msg p:last-child{margin-bottom:0}
.chat-msg strong{font-weight:600}
.chat-msg .chat-room-img{
  width:100%;border-radius:12px;margin:.5rem 0;aspect-ratio:16/10;object-fit:cover;
}
.chat-msg ul{margin:.4rem 0;padding-left:1.2rem}
.chat-msg li{margin:.15rem 0}
.chat-typing{display:inline-flex;gap:4px;padding:.2rem 0}
.chat-typing span{width:7px;height:7px;border-radius:50%;background:var(--ink-soft);animation:chatBlink 1.1s infinite}
.chat-typing span:nth-child(2){animation-delay:.18s}
.chat-typing span:nth-child(3){animation-delay:.36s}
@keyframes chatBlink{0%,100%{opacity:.25}50%{opacity:1}}

/* ---------- Azioni dentro i messaggi ---------- */
.chat-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.6rem}
.chat-actions .btn{padding:.6rem 1.1rem;font-size:.68rem}
.chat-mini{
  font-family:var(--font-sans);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  border:1px solid var(--gold);background:transparent;color:var(--ink);
  border-radius:999px;padding:.5rem .95rem;cursor:pointer;
  transition:background .2s ease,color .2s ease;
}
.chat-mini:hover{background:var(--gold);color:#fff}

/* ---------- Quick reply ---------- */
.chat-quick{
  display:flex;gap:.5rem;overflow-x:auto;padding:.6rem .9rem;
  background:var(--cream);border-top:1px solid var(--line);
}
.chat-quick[hidden]{display:none}
.chat-quick .chat-mini{white-space:nowrap;flex:none}

/* ---------- Input ---------- */
.chat-form{
  display:flex;gap:.55rem;padding:.7rem .8rem;
  background:var(--paper);border-top:1px solid var(--line);
}
.chat-form input{
  flex:1;min-width:0;font-family:var(--font-sans);font-size:1rem;color:var(--ink);
  background:var(--cream);border:1px solid var(--line);border-radius:12px;padding:.75rem .9rem;
}
.chat-form button{
  flex:none;width:48px;height:48px;border-radius:50%;cursor:pointer;
  border:0;background:var(--ink);color:var(--cream);font-size:1.25rem;line-height:1;
  transition:background .2s ease,transform .2s ease;
}
.chat-form button:hover{background:#4a3d31;transform:translateY(-1px)}
.chat-note{
  font-family:var(--font-sans);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-soft);text-align:center;background:var(--paper);padding:0 .8rem .6rem;margin:0;
}

/* ---------- Rispetto per reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  .chat-log{scroll-behavior:auto}
  .chat-typing span{animation:none;opacity:.7}
}
