/* Asistente virtual — Grupo Jewato */
.jw-fab {
  position: fixed; right: max(1rem, env(safe-area-inset-right)); bottom: max(1rem, env(safe-area-inset-bottom)); z-index: 150;
  display: flex; align-items: center; gap: .6rem; height: 58px; padding: 0 1.25rem 0 1rem; border: 0; border-radius: 999px;
  background: var(--gold, #f2b705); color: #1a1400; font-weight: 600; font-size: .95rem; font-family: var(--sans, system-ui);
  box-shadow: 0 14px 40px -8px rgba(242, 183, 5, .55), 0 2px 0 rgba(255, 255, 255, .35) inset;
  transition: transform .35s cubic-bezier(.22, 1, .36, 1), box-shadow .3s; cursor: pointer;
}
.jw-fab:hover { transform: translateY(-3px) scale(1.02); }
.jw-fab svg { width: 24px; height: 24px; flex-shrink: 0; }
.jw-fab::before { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: 0 0 0 0 rgba(242, 183, 5, .6); animation: jwPulse 2.8s infinite; pointer-events: none; }
@keyframes jwPulse { 70% { box-shadow: 0 0 0 16px rgba(242, 183, 5, 0); } 100% { box-shadow: 0 0 0 0 rgba(242, 183, 5, 0); } }
.jw-fab.is-open { display: none; }

.jw-panel {
  position: fixed; right: max(1rem, env(safe-area-inset-right)); bottom: max(1rem, env(safe-area-inset-bottom)); z-index: 160;
  width: min(396px, calc(100vw - 2rem)); height: min(620px, calc(100dvh - 2rem));
  display: flex; flex-direction: column; overflow: hidden; border-radius: 22px;
  background: #0d1a13; color: #f1ede0; border: 1px solid rgba(241, 237, 224, .18);
  box-shadow: 0 40px 100px -20px rgba(0, 0, 0, .85);
  font-family: var(--sans, system-ui); font-size: .95rem; line-height: 1.5;
  opacity: 0; transform: translateY(24px) scale(.97); transform-origin: 100% 100%; visibility: hidden;
  transition: opacity .35s ease, transform .5s cubic-bezier(.22, 1, .36, 1), visibility 0s .5s;
}
.jw-panel.is-open { opacity: 1; transform: none; visibility: visible; transition-delay: 0s; }
.jw-head { display: flex; align-items: center; gap: .8rem; padding: .95rem 1rem; background: linear-gradient(135deg, #1f6b34, #123d1e); border-bottom: 1px solid rgba(241, 237, 224, .15); }
.jw-avatar { width: 40px; height: 40px; border-radius: 50%; background: #f2b705; color: #1a1400; display: grid; place-items: center; flex-shrink: 0; }
.jw-avatar svg { width: 22px; height: 22px; }
.jw-head b { display: block; font-weight: 600; font-size: 1rem; }
.jw-head small { display: flex; align-items: center; gap: .4rem; font-size: .75rem; color: #d3cdb8; }
.jw-head small::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #5ee08a; }
.jw-close { margin-left: auto; width: 36px; height: 36px; border-radius: 50%; border: 1px solid rgba(241, 237, 224, .25); background: transparent; color: inherit; cursor: pointer; display: grid; place-items: center; transition: background .25s; }
.jw-close:hover { background: rgba(255, 255, 255, .12); }
.jw-close svg { width: 16px; height: 16px; }
.jw-msgs { flex: 1; overflow-y: auto; padding: 1rem; display: flex; flex-direction: column; gap: .7rem; scroll-behavior: smooth; overscroll-behavior: contain; }
.jw-msg { max-width: 88%; padding: .7rem .9rem; border-radius: 16px; word-wrap: break-word; animation: jwIn .4s cubic-bezier(.22, 1, .36, 1); }
@keyframes jwIn { from { opacity: 0; transform: translateY(8px); } }
.jw-msg.bot { align-self: flex-start; background: #13241a; border: 1px solid rgba(241, 237, 224, .12); border-bottom-left-radius: 5px; }
.jw-msg.user { align-self: flex-end; background: #f2b705; color: #1a1400; border-bottom-right-radius: 5px; font-weight: 500; }
.jw-msg a { color: #f2b705; text-decoration: underline; text-underline-offset: 3px; }
.jw-msg.user a { color: #1a1400; }
.jw-typing { display: inline-flex; gap: 4px; padding: .85rem 1rem; }
.jw-typing i { width: 7px; height: 7px; border-radius: 50%; background: #8f9b8c; animation: jwDot 1.1s infinite ease-in-out; }
.jw-typing i:nth-child(2) { animation-delay: .15s; } .jw-typing i:nth-child(3) { animation-delay: .3s; }
@keyframes jwDot { 0%, 60%, 100% { transform: translateY(0); opacity: .5; } 30% { transform: translateY(-5px); opacity: 1; } }
.jw-chips { display: flex; flex-wrap: wrap; gap: .45rem; padding: 0 1rem .8rem; }
.jw-chip { border: 1px solid rgba(241, 237, 224, .25); background: transparent; color: #d3cdb8; border-radius: 999px; padding: .42rem .8rem; font-size: .8rem; cursor: pointer; font-family: inherit; transition: all .25s; }
.jw-chip:hover { border-color: #f2b705; color: #f2b705; }
.jw-form { display: flex; gap: .5rem; padding: .75rem; border-top: 1px solid rgba(241, 237, 224, .12); background: #0a140e; }
.jw-form input { flex: 1; min-width: 0; background: #13241a; border: 1px solid rgba(241, 237, 224, .2); border-radius: 999px; padding: .75rem 1rem; color: #f1ede0; font: inherit; }
.jw-form input:focus { outline: none; border-color: #f2b705; box-shadow: 0 0 0 3px rgba(242, 183, 5, .18); }
.jw-form button { width: 46px; height: 46px; border-radius: 50%; border: 0; background: #f2b705; color: #1a1400; cursor: pointer; display: grid; place-items: center; flex-shrink: 0; transition: transform .25s; }
.jw-form button:hover { transform: scale(1.06); }
.jw-form button:disabled { opacity: .5; cursor: default; }
.jw-form button svg { width: 20px; height: 20px; }
.jw-foot { text-align: center; font-size: .68rem; color: #8f9b8c; padding: 0 1rem .6rem; background: #0a140e; }
@media (max-width: 520px) {
  .jw-panel { right: 0; bottom: 0; width: 100vw; height: 100dvh; border-radius: 0; border: 0; }
  .jw-fab span { display: none; }
  .jw-fab { padding: 0; width: 58px; justify-content: center; }
}