/* =====================================================================
   assistant.css — Fetraco AI travel-assistant chat widget.
   Loaded on every page (after styles.css → reuses its :root tokens).
   Floating launcher + glass chat panel; full-screen on mobile.
   ===================================================================== */
.fai-fab{
  position:fixed; right:clamp(16px,3vw,28px); bottom:clamp(16px,3vw,28px); z-index:900;
  display:inline-flex; align-items:center; gap:10px; padding:13px 20px 13px 15px;
  border:0; cursor:pointer; border-radius:999px; font-family:var(--font-ui,Inter,sans-serif); font-weight:700; font-size:.95rem;
  color:#1a1407; background:linear-gradient(135deg,var(--gold,#c9a24b),var(--gold-soft,#e6c585));
  box-shadow:0 16px 38px -12px rgba(201,162,75,.75), 0 4px 12px rgba(0,0,0,.25);
  transition:transform .25s var(--ease,ease), box-shadow .25s, opacity .3s;
}
.fai-fab:hover{ transform:translateY(-3px); box-shadow:0 22px 44px -12px rgba(201,162,75,.9); }
.fai-fab svg{ width:24px; height:24px; }
.fai-fab__dot{ position:absolute; top:8px; right:12px; width:9px; height:9px; border-radius:50%; background:#25d366; box-shadow:0 0 0 3px rgba(37,211,102,.3); animation:faiPulse 2s ease-in-out infinite; }
@keyframes faiPulse{ 0%,100%{ box-shadow:0 0 0 3px rgba(37,211,102,.3);} 50%{ box-shadow:0 0 0 6px rgba(37,211,102,0);} }
.fai-fab.is-hidden{ opacity:0; pointer-events:none; transform:scale(.6); }

.fai{
  position:fixed; right:clamp(16px,3vw,28px); bottom:clamp(16px,3vw,28px); z-index:950;
  width:min(400px, calc(100vw - 32px)); height:min(640px, calc(100vh - 56px));
  display:flex; flex-direction:column; overflow:hidden; border-radius:22px;
  background:linear-gradient(180deg,#11201c,#0c0f0c); color:#f4efe6;
  border:1px solid rgba(230,197,133,.16);
  box-shadow:0 40px 80px -24px rgba(0,0,0,.7);
  font-family:var(--font-ui,Inter,sans-serif);
  opacity:0; transform:translateY(24px) scale(.98); pointer-events:none;
  transition:opacity .3s var(--ease,ease), transform .35s var(--ease,ease);
}
.fai.is-open{ opacity:1; transform:none; pointer-events:auto; }

.fai__head{ display:flex; align-items:center; gap:11px; padding:15px 16px; background:rgba(0,0,0,.25); border-bottom:1px solid rgba(255,255,255,.08); }
.fai__avatar{ flex:0 0 42px; height:42px; border-radius:50%; display:grid; place-items:center; background:linear-gradient(135deg,var(--gold,#c9a24b),var(--gold-soft,#e6c585)); overflow:hidden; }
.fai__avatar img{ width:100%; height:100%; object-fit:contain; padding:5px; }
.fai__id{ flex:1; min-width:0; line-height:1.2; }
.fai__id b{ font-family:var(--font-display,sans-serif); font-weight:700; font-size:1rem; display:block; }
.fai__id span{ font-size:.74rem; color:var(--gold-soft,#e6c585); display:inline-flex; align-items:center; gap:6px; }
.fai__id span::before{ content:""; width:7px; height:7px; border-radius:50%; background:#25d366; }
.fai__wa{ flex:0 0 auto; display:inline-grid; place-items:center; width:38px; height:38px; border-radius:50%; background:#25d366; color:#06371b; border:0; cursor:pointer; transition:transform .2s; }
.fai__wa:hover{ transform:scale(1.08); }
.fai__wa svg{ width:20px; height:20px; }
.fai__close{ flex:0 0 auto; width:34px; height:34px; border-radius:50%; border:0; cursor:pointer; background:rgba(255,255,255,.08); color:#f4efe6; display:grid; place-items:center; }
.fai__close:hover{ background:rgba(255,255,255,.16); }
.fai__close svg{ width:18px; height:18px; }

.fai__log{ flex:1; overflow-y:auto; padding:18px 16px 8px; display:flex; flex-direction:column; gap:12px; scroll-behavior:smooth; }
.fai__log::-webkit-scrollbar{ width:6px; } .fai__log::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.14); border-radius:6px; }
.fai-msg{ max-width:84%; padding:11px 14px; border-radius:16px; font-size:.92rem; line-height:1.5; white-space:pre-wrap; word-wrap:break-word; }
.fai-msg a{ color:var(--gold-soft,#e6c585); text-decoration:underline; }
.fai-msg--bot{ align-self:flex-start; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.06); border-bottom-left-radius:5px; }
.fai-msg--user{ align-self:flex-end; background:linear-gradient(135deg,var(--gold,#c9a24b),var(--gold-soft,#e6c585)); color:#1a1407; border-bottom-right-radius:5px; font-weight:500; }
.fai-typing{ align-self:flex-start; display:inline-flex; gap:5px; padding:13px 15px; background:rgba(255,255,255,.07); border-radius:16px; border-bottom-left-radius:5px; }
.fai-typing span{ width:7px; height:7px; border-radius:50%; background:var(--gold-soft,#e6c585); opacity:.5; animation:faiBlink 1.2s infinite; }
.fai-typing span:nth-child(2){ animation-delay:.2s; } .fai-typing span:nth-child(3){ animation-delay:.4s; }
@keyframes faiBlink{ 0%,60%,100%{ opacity:.3; transform:translateY(0);} 30%{ opacity:1; transform:translateY(-3px);} }

.fai-chips{ display:flex; flex-wrap:wrap; gap:8px; padding:2px 16px 6px; }
.fai-chip{ padding:8px 13px; border-radius:999px; border:1px solid rgba(230,197,133,.4); background:rgba(230,197,133,.08); color:var(--gold-soft,#e6c585); font-family:inherit; font-size:.84rem; font-weight:600; cursor:pointer; transition:background .2s, transform .15s; }
.fai-chip:hover{ background:rgba(230,197,133,.2); transform:translateY(-1px); }

.fai__foot{ padding:12px 14px 14px; border-top:1px solid rgba(255,255,255,.08); background:rgba(0,0,0,.2); }
.fai__form{ display:flex; gap:9px; align-items:flex-end; }
.fai__input{ flex:1; min-height:44px; max-height:120px; resize:none; padding:12px 14px; border-radius:14px; border:1px solid rgba(255,255,255,.14); background:rgba(255,255,255,.06); color:#f4efe6; font-family:inherit; font-size:.92rem; line-height:1.4; }
.fai__input:focus{ outline:none; border-color:var(--gold,#c9a24b); }
.fai__input::placeholder{ color:rgba(244,239,230,.45); }
.fai__send{ flex:0 0 44px; height:44px; border-radius:13px; border:0; cursor:pointer; background:linear-gradient(135deg,var(--gold,#c9a24b),var(--gold-soft,#e6c585)); color:#1a1407; display:grid; place-items:center; transition:transform .2s, opacity .2s; }
.fai__send:hover{ transform:translateY(-2px); } .fai__send:disabled{ opacity:.45; cursor:default; transform:none; }
.fai__send svg{ width:20px; height:20px; }
.fai__disclaimer{ margin:8px 2px 0; font-size:.68rem; color:rgba(244,239,230,.4); text-align:center; }

@media (max-width:560px){
  .fai{ right:0; bottom:0; width:100vw; height:100dvh; border-radius:0; border:0; }
  .fai-fab{ padding:13px; } .fai-fab__label{ display:none; }
}
@media (prefers-reduced-motion:reduce){ .fai,.fai-fab,.fai-fab__dot,.fai-typing span{ animation:none; transition:opacity .2s; } }
