/* chat.css — estilos del asistente Ártico (extraídos de styles.css para el diseño nuevo) */
:root{--accent:#12b3d6;--accent-2:#3763ea;--shadow-lg:0 40px 80px -30px rgba(11, 36, 54, 0.4);--ease-bounce:cubic-bezier(0.34, 1.56, 0.64, 1);--warn:#d97a1f;--glass-border:rgba(255, 255, 255, 0.65);--radius-lg:28px;--ease-out:cubic-bezier(0.16, 1, 0.3, 1);--radius-md:18px;--bg-2:#dcedf5;--ink-soft:#1c3a4d;--ink-mute:#4d6a7a;--radius-pill:999px;--line:rgba(11, 36, 54, 0.12);--radius-sm:10px;--success:#1fae72;--ink:#0b2436;--paper:#ffffff;--display:"Sora", var(--sans)}
.chat-launcher { position: fixed; right: clamp(14px, 3vw, 28px); bottom: clamp(14px, 3vw, 28px); z-index: 800; width: 62px; height: 62px; border-radius: 50%; background: linear-gradient(135deg, var(--accent), var(--accent-2)); color: rgb(255, 255, 255); display: grid; place-items: center; box-shadow: var(--shadow-lg); transition: transform .35s var(--ease-bounce); }
.chat-launcher:hover { transform: scale(1.08); }
.chat-launcher .badge-new { position: absolute; top: -4px; right: -4px; width: 16px; height: 16px; border-radius: 50%; background: var(--warn); border: 2px solid rgb(255, 255, 255); }
.chat-panel { position: fixed; right: clamp(10px, 3vw, 28px); bottom: clamp(88px, 12vw, 108px); z-index: 810; width: min(392px, -20px + 100vw); height: min(600px, -140px + 100vh); background: rgba(255, 255, 255, 0.96); border: 1px solid var(--glass-border); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); display: grid; grid-template-rows: auto 1fr auto; overflow: hidden; transform: translateY(16px) scale(0.98); opacity: 0; pointer-events: none; transition: opacity .3s var(--ease-out), transform .3s var(--ease-out); }
.chat-panel.is-open { transform: none; opacity: 1; pointer-events: auto; }
.chat-header { display: flex; align-items: center; justify-content: space-between; gap: 0.6rem; padding: 1rem 1.1rem; background: linear-gradient(120deg, var(--accent), var(--accent-2)); color: rgb(255, 255, 255); }
.chat-header-id { display: flex; align-items: center; gap: 0.6rem; }
.chat-avatar { width: 34px; height: 34px; border-radius: 50%; background: rgba(255, 255, 255, 0.22); display: grid; place-items: center; }
.chat-header strong { display: block; font-size: 0.95rem; }
.chat-header small { display: block; font-size: 0.74rem; opacity: 0.85; }
.chat-header-actions { display: flex; gap: 0.3rem; }
.chat-icon-btn { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, 0.16); color: rgb(255, 255, 255); }
.chat-icon-btn:hover { background: rgba(255, 255, 255, 0.28); }
.chat-body { overflow-y: auto; padding: 1rem 1rem 0.4rem; display: grid; gap: 0.7rem; align-content: start; }
.chat-msg { max-width: 86%; padding: 0.65rem 0.9rem; border-radius: var(--radius-md); font-size: 0.9rem; line-height: 1.5; }
.chat-msg.bot { background: var(--bg-2); color: var(--ink-soft); justify-self: start; border-bottom-left-radius: 4px; }
.chat-msg.user { background: linear-gradient(120deg, var(--accent), var(--accent-2)); color: rgb(255, 255, 255); justify-self: end; border-bottom-right-radius: 4px; }
.chat-msg.typing { display: flex; gap: 4px; align-items: center; }
.chat-msg.typing span { width: 6px; height: 6px; border-radius: 50%; background: var(--ink-mute); animation: 1.1s ease-in-out 0s infinite normal none running typingBounce; }
.chat-msg.typing span:nth-child(2) { animation-delay: 0.15s; }
.chat-msg.typing span:nth-child(3) { animation-delay: 0.3s; }
.chat-suggestions { display: flex; flex-wrap: wrap; gap: 0.4rem; padding: 0px 1rem 0.6rem; }
.chat-chip { font-size: 0.78rem; padding: 0.4rem 0.75rem; border-radius: var(--radius-pill); background: var(--bg-2); color: var(--ink-soft); border: 1px solid var(--line); }
.chat-chip:hover { background: rgba(18, 179, 214, 0.14); color: var(--accent-2); }
.chat-footer { border-top: 1px solid var(--line); padding: 0.7rem; display: grid; grid-template-columns: 1fr auto; gap: 0.5rem; }
.chat-footer textarea { resize: none; max-height: 84px; padding: 0.65rem 0.9rem; border-radius: var(--radius-md); border: 1px solid var(--line); background: var(--bg-2); font-size: 0.9rem; }
.chat-send { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(135deg, var(--accent), var(--accent-2)); color: rgb(255, 255, 255); flex-shrink: 0; }
.chat-send[disabled] { opacity: 0.5; }
.chat-email-form { padding: 0.8rem 1rem 1rem; border-top: 1px solid var(--line); display: none; gap: 0.5rem; }
.chat-email-form.is-open { display: grid; }
.chat-email-form input { padding: 0.6rem 0.8rem; border-radius: var(--radius-sm); border: 1px solid var(--line); font-size: 0.86rem; }
.chat-email-form .row { display: flex; gap: 0.5rem; }
.chat-email-note { font-size: 0.74rem; color: var(--ink-mute); }
.chat-cta-inline { margin: 0.2rem 1rem 0.8rem; padding: 0.7rem 0.9rem; border-radius: var(--radius-md); background: rgba(31, 174, 114, 0.12); color: var(--success); font-size: 0.82rem; font-weight: 600; display: flex; align-items: center; gap: 0.5rem; }
.chat-cta-inline[hidden] { display: none; }
@keyframes typingBounce { 
  0%, 60%, 100% { transform: translateY(0px); opacity: 0.5; }
  30% { transform: translateY(-4px); opacity: 1; }
}
.chat-launcher .badge-new { position: absolute; top: -4px; right: -4px; width: 16px; height: 16px; border-radius: 50%; background: var(--warn); border: 2px solid rgb(255, 255, 255); }