/* Chatbot Widget Styles - Cyber-Clean & Glassmorphism */
:root{ --neon-cyan: #00e5ff; --neon-green: #39ff14; --glass-bg: rgba(255, 255, 255, 0.1); --accent-red: #FF3366; }
.chatbot-widget-container{ position: fixed; bottom: 30px; right: 30px; z-index: 9999; font-family: 'Inter', sans-serif; }
.chatbot-button{ width: 60px; height: 60px; background: linear-gradient(135deg, var(--neon-cyan), var(--neon-green)); border-radius: 50%; display: flex; justify-content: center; align-items: center; cursor: pointer; box-shadow: 0 4px 15px rgba(57, 255, 20, 0.4); transition: transform 0.3s cubic-bezier(0.175,0.885,0.32,1.275), box-shadow 0.3s; position: relative; z-index: 10000; }
.chatbot-button:hover{ transform: scale(1.1); box-shadow: 0 0 25px rgba(57,255,20,0.6); }
.chatbot-panel{ display: none; position: absolute; bottom: 80px; right: 0; width: 350px; height: 500px; background: rgba(13,27,30,0.65); backdrop-filter: blur(15px); border: 1px solid rgba(0,229,255,0.2); border-radius: 20px; box-shadow: 0 15px 35px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.1); flex-direction: column; overflow: hidden; animation: RevealChat 0.5s ease forwards; transform-origin: bottom right; }
.chatbot-panel.open{ display: flex; }
@keyframes RevealChat{ 0%{ opacity:0; transform:scale(0.8) translateY(20px); } 100%{ opacity:1; transform:scale(1) translateY(0); } }
.chatbot-header{ background: rgba(0,0,0,0.4); padding: 15px 20px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid rgba(0,229,255,0.2); }
.chatbot-header .title{ color: var(--neon-cyan); font-weight: bold; font-size: 1.1rem; display: flex; align-items: center; gap: 8px; }
.chatbot-header .title .status-dot{ width: 8px; height: 8px; background: var(--neon-green); border-radius: 50%; box-shadow: 0 0 10px var(--neon-green); }
.chatbot-close{ color: rgba(255,255,255,0.6); cursor: pointer; font-size: 1.5rem; transition: color 0.3s; }
.chatbot-close:hover{ color: var(--accent-red); }
#chatbot-body{ flex: 1; overflow-y: auto; padding: 15px; display: flex; flex-direction: column; gap: 12px; }
#chatbot-body::-webkit-scrollbar{ width: 6px; }
#chatbot-body::-webkit-scrollbar-thumb{ background: rgba(0,229,255,0.3); border-radius: 3px; }
.message{ max-width: 85%; padding: 12px 15px; border-radius: 12px; font-size: 0.95rem; line-height: 1.4; word-wrap: break-word; animation: Reveal 0.3s ease; }
.message.bot{ align-self: flex-start; background: rgba(0,229,255,0.1); color: #fff; border-bottom-left-radius: 2px; border: 1px solid rgba(0,229,255,0.2); }
.message.user{ align-self: flex-end; background: linear-gradient(135deg, rgba(57,255,20,0.2), rgba(0,229,255,0.1)); color: #fff; border-bottom-right-radius: 2px; border: 1px solid rgba(57,255,20,0.3); }
.message strong{ color: var(--neon-cyan); }
.message a{ color: var(--neon-green); text-decoration: underline; }
.quick-replies{ display: flex; flex-direction: column; gap: 8px; margin-top: 5px; }
.quick-reply-btn{ background: rgba(255,255,255,0.05); border: 1px solid rgba(0,229,255,0.3); color: #fff; padding: 10px 15px; border-radius: 8px; cursor: pointer; font-size: 0.9rem; transition: all 0.2s; text-align: left; backdrop-filter: blur(5px); }
.quick-reply-btn:hover{ background: rgba(0,229,255,0.15); border-color: var(--neon-green); box-shadow: 0 0 10px rgba(57,255,20,0.2); transform: translateX(2px); }
.chatbot-input{ display: flex; padding: 15px; background: rgba(0,0,0,0.3); border-top: 1px solid rgba(0,229,255,0.2); gap: 10px; }
.chatbot-input input{ flex: 1; background: transparent; border: none; color: #fff; font-size: 0.95rem; outline: none; }
.chatbot-input input::placeholder{ color: rgba(255,255,255,0.4); }
.send-btn{ background: transparent; border: 1px solid var(--neon-cyan); color: var(--neon-cyan); padding: 8px 12px; border-radius: 8px; cursor: pointer; font-size: 1rem; transition: all 0.2s; }
.send-btn:hover:not(:disabled){ background: rgba(0,229,255,0.2); color: var(--neon-green); border-color: var(--neon-green); }
@media (max-width: 480px){ .chatbot-panel{ width: 90vw; right: -15px; height: 60vh; } }
