/* ============================================ On Point Chatbot Widget ============================================ */ .chat-widget{position:fixed;bottom:1.5rem;right:1.5rem;z-index:10002;font-family:'General Sans', sans-serif}
.chat-toggle{position:relative;width:56px;height:56px;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.12);border-radius:50%;backdrop-filter:blur(12px);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.3s ease;font-size:1.3rem}
.chat-toggle:hover{background:rgba(255,107,107,0.12);border-color:rgba(255,107,107,0.3);transform:scale(1.05)}
.chat-toggle__close{display:none;font-size:1.1rem;color:#f0e6d3;font-weight:600}
.chat-toggle__pulse{position:absolute;inset:-4px;border-radius:50%;border:1px solid rgba(255,107,107,0.4);animation:chatPulse 2.5s ease-in-out infinite}
.chat-widget--open .chat-toggle__icon{display:none}
.chat-widget--open .chat-toggle__close{display:block}
.chat-widget--open .chat-toggle__pulse{display:none}
.chat-widget--open .chat-toggle{background:rgba(255,107,107,0.15);border-color:rgba(255,107,107,0.3)}
@keyframes chatPulse{0%, 100%{transform:scale(1);opacity:0.5}
50%{transform:scale(1.2);opacity:0}
}
.chat-window{position:absolute;bottom:68px;right:0;width:360px;max-height:500px;background:#18181c;border:1px solid rgba(255,255,255,0.1);border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,0.5);display:flex;flex-direction:column;overflow:hidden;opacity:0;visibility:hidden;transform:translateY(10px) scale(0.95);transition:all 0.3s cubic-bezier(0.16, 1, 0.3, 1)}
.chat-widget--open .chat-window{opacity:1;visibility:visible;transform:translateY(0) scale(1)}
.chat-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;background:#111114;color:#f0e6d3;border-bottom:1px solid rgba(255,255,255,0.08)}
.chat-header__info{display:flex;align-items:center;gap:0.75rem}
.chat-header__avatar{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:rgba(255,107,107,0.15);border:1px solid rgba(255,107,107,0.3);border-radius:10px;font-family:'Silkscreen', monospace;font-size:0.7rem;font-weight:400;color:#ff6b6b}
.chat-header__name{font-family:'Silkscreen', monospace;font-size:0.85rem;font-weight:400;color:#f0e6d3}
.chat-header__status{font-size:0.7rem;opacity:0.5;color:#4ecdc4}
.chat-header__close{background:none;border:none;color:#f0e6d3;font-size:1.1rem;cursor:pointer;opacity:0.4;transition:opacity 0.2s;padding:0.25rem}
.chat-header__close:hover{opacity:1}
.chat-messages{flex:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:0.75rem;min-height:280px;max-height:340px;background:#18181c}
.chat-message{display:flex;max-width:85%}
.chat-message--bot{align-self:flex-start}
.chat-message--user{align-self:flex-end}
.chat-message__bubble{padding:0.75rem 1rem;border-radius:16px;font-size:0.875rem;line-height:1.5;word-wrap:break-word}
.chat-message--bot .chat-message__bubble{background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.08);border-radius:16px 16px 16px 4px;color:rgba(255,255,255,0.7)}
.chat-message--user .chat-message__bubble{background:rgba(255,107,107,0.15);color:#f0e6d3;border:1px solid rgba(255,107,107,0.25);border-radius:16px 16px 4px 16px}
.typing-dots{display:inline-flex;gap:3px}
.typing-dots span{font-size:1.25rem;font-weight:700;animation:typingBounce 1.2s ease-in-out infinite;color:#4ecdc4}
.typing-dots span:nth-child(2){animation-delay:0.15s}
.typing-dots span:nth-child(3){animation-delay:0.3s}
@keyframes typingBounce{0%, 60%, 100%{transform:translateY(0)}
30%{transform:translateY(-4px)}
}
.chat-input{display:flex;align-items:center;gap:0.5rem;padding:0.75rem 1rem;border-top:1px solid rgba(255,255,255,0.08);background:#111114}
.chat-input input{flex:1;padding:0.6rem 0.75rem;border:1px solid rgba(255,255,255,0.1);border-radius:10px;font-family:inherit;font-size:0.875rem;outline:none;transition:border-color 0.3s;background:rgba(255,255,255,0.04);color:#f0e6d3}
.chat-input input::placeholder{color:rgba(255,255,255,0.3)}
.chat-input input:focus{border-color:rgba(78,205,196,0.4)}
.chat-input button{width:38px;height:38px;display:flex;align-items:center;justify-content:center;background:rgba(255,107,107,0.15);border:1px solid rgba(255,107,107,0.3);border-radius:10px;color:#ff6b6b;cursor:pointer;transition:all 0.3s}
.chat-input button:hover{background:rgba(255,107,107,0.25)}
.chat-messages::-webkit-scrollbar{width:4px}
.chat-messages::-webkit-scrollbar-track{background:transparent}
.chat-messages::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.1);border-radius:4px}
@media (max-width:480px){.chat-widget{bottom:1rem;right:1rem}
.chat-window{width:calc(100vw - 2rem);right:0;max-height:70vh}
}
@media (hover:hover){.chat-toggle, .chat-header__close, .chat-input button, .chat-input input{cursor:pointer}
}
@media (hover:none){.chat-toggle, .chat-header__close, .chat-input button, .chat-input input{cursor:pointer}
}