.ai-chat-widget { position: fixed; right: 24px; bottom: 90px; z-index: 9999; font-family: inherit; }
.ai-chat-toggle { position: relative; width: 56px; height: 56px; border-radius: 50%; background: linear-gradient(135deg, #b10b18 0%, #d92f3d 100%); color: #fff; border: none; cursor: pointer; box-shadow: 0 6px 16px rgba(177, 11, 24, 0.35); display: flex; align-items: center; justify-content: center; transition: transform 0.2s ease, box-shadow 0.2s ease; }
.ai-chat-toggle:hover { transform: scale(1.08); box-shadow: 0 8px 20px rgba(177, 11, 24, 0.45); }
.ai-chat-toggle::after { content: ''; position: absolute; top: 4px; right: 4px; width: 10px; height: 10px; background: #10b981; border: 2px solid #fff; border-radius: 50%; z-index: 2; }
.ai-toggle-pulse { position: absolute; inset: 0; border-radius: 50%; background: rgba(217, 47, 61, 0.55); animation: ai-pulse 1.8s ease-out infinite; z-index: 0; }
@keyframes ai-pulse { 0% { transform: scale(1); opacity: 0.7; } 100% { transform: scale(1.6); opacity: 0; } }
.ai-toggle-icon { position: relative; z-index: 1; }
.ai-toggle-icon .ai-eye { transform-origin: center; animation: ai-blink-eye 4s infinite; }
@keyframes ai-blink-eye { 0%, 92%, 100% { transform: scaleY(1); } 94%, 96% { transform: scaleY(0.1); } }
.ai-chat-window { position: absolute; right: 0; bottom: 72px; width: 360px; height:70vh;max-height: 520px; background: #fff; border-radius: 14px; box-shadow: 0 12px 40px rgba(0, 0, 0, 0.18); display: flex; flex-direction: column; overflow: hidden; }
.ai-chat-header { background: linear-gradient(135deg, #b10b18 0%, #d92f3d 100%); color: #fff; padding: 14px 16px; display: flex; justify-content: space-between; align-items: center; }
.ai-chat-header-info { display: flex; align-items: center; gap: 10px; }
.ai-chat-avatar { width: 36px; height: 36px; border-radius: 50%; background: rgba(255, 255, 255, 0.22); display: flex; align-items: center; justify-content: center; }
.ai-chat-name { font-size: 15px; font-weight: 600; line-height: 1.2; }
.ai-chat-status { font-size: 11px; opacity: 0.9; margin-top: 2px; display: flex; align-items: center; gap: 4px; }
.ai-status-dot { width: 6px; height: 6px; background: #34d399; border-radius: 50%; display: inline-block; }
.ai-chat-close { background: transparent; border: none; color: #fff; cursor: pointer; padding: 4px; display: flex; align-items: center; justify-content: center; border-radius: 4px; }
.ai-chat-close:hover { background: rgba(255, 255, 255, 0.18); }
.ai-chat-body { flex: 1; overflow-y: auto; padding: 16px; background: #f7f8fa; }
.ai-chat-body::-webkit-scrollbar { width: 6px; }
.ai-chat-body::-webkit-scrollbar-thumb { background: #d1d5db; border-radius: 3px; }
.ai-chat-msg { display: flex; gap: 8px; margin-bottom: 14px; align-items: flex-start; }
.ai-msg-bot { justify-content: flex-start; }
.ai-msg-user { justify-content: flex-end; }
.ai-msg-avatar { width: 28px; height: 28px; border-radius: 50%; background: #b10b18; color: #fff; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.ai-msg-user .ai-msg-avatar { background: #6b7280; order: 2; }
.ai-msg-content { background: #fff; padding: 9px 12px; border-radius: 10px; max-width: 78%; font-size: 13px; line-height: 1.6; color: #333; word-wrap: break-word; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04); }
.ai-msg-user .ai-msg-content { background: #b10b18; color: #fff; white-space: pre-wrap; }
.ai-msg-bot .ai-msg-content > *:first-child { margin-top: 0; }
.ai-msg-bot .ai-msg-content > *:last-child { margin-bottom: 0; }
.ai-msg-bot .ai-msg-content p { margin: 0 0 6px 0; }
.ai-msg-bot .ai-msg-content ol, .ai-msg-bot .ai-msg-content ul { margin: 4px 0 6px 0; padding-left: 22px; }
.ai-msg-bot .ai-msg-content li { margin: 2px 0; line-height: 1.65; }
.ai-msg-bot .ai-msg-content li > ul, .ai-msg-bot .ai-msg-content li > ol { margin: 2px 0 4px 0; }
.ai-msg-bot .ai-msg-content h1, .ai-msg-bot .ai-msg-content h2, .ai-msg-bot .ai-msg-content h3, .ai-msg-bot .ai-msg-content h4, .ai-msg-bot .ai-msg-content h5, .ai-msg-bot .ai-msg-content h6 { margin: 8px 0 4px 0; font-weight: 600; line-height: 1.4; }
.ai-msg-bot .ai-msg-content h1 { font-size: 16px; }
.ai-msg-bot .ai-msg-content h2 { font-size: 15px; }
.ai-msg-bot .ai-msg-content h3 { font-size: 14px; }
.ai-msg-bot .ai-msg-content h4, .ai-msg-bot .ai-msg-content h5, .ai-msg-bot .ai-msg-content h6 { font-size: 13px; }
.ai-msg-bot .ai-msg-content strong { font-weight: 600; color: #1f2937; }
.ai-msg-bot .ai-msg-content em { font-style: italic; }
.ai-msg-bot .ai-msg-content code { background: rgba(0, 0, 0, 0.06); padding: 1px 5px; border-radius: 3px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px; color: #b10b18; }
.ai-msg-bot .ai-msg-content pre { background: #1f2937; color: #f3f4f6; padding: 8px 10px; border-radius: 6px; overflow-x: auto; margin: 6px 0; }
.ai-msg-bot .ai-msg-content pre code { background: transparent; padding: 0; color: inherit; font-size: 12px; }
.ai-msg-bot .ai-msg-content a { color: #b10b18; text-decoration: underline; }
.ai-msg-content.ai-typing::after { content: '▋'; display: inline-block; margin-left: 2px; animation: ai-blink 1s steps(1) infinite; color: #b10b18; }
@keyframes ai-blink { 50% { opacity: 0; } }
.ai-chat-footer { padding: 10px 12px; border-top: 1px solid #eee; background: #fff; display: flex; gap: 8px; align-items: flex-end; }
.ai-chat-footer textarea { flex: 1; border: 1px solid #e5e7eb; border-radius: 8px; padding: 8px 10px; resize: none; font-size: 13px; outline: none; font-family: inherit; max-height: 80px; line-height: 1.5; transition: border-color 0.2s; }
.ai-chat-footer textarea:focus { border-color: #b10b18; }
.ai-chat-send { background: #b10b18; color: #fff; border: none; border-radius: 8px; width: 36px; height: 36px; cursor: pointer; display: flex; align-items: center; justify-content: center; flex-shrink: 0; transition: background 0.2s; }
.ai-chat-send:hover:not(:disabled) { background: #8a0813; }
.ai-chat-send:disabled { background: #d1d5db; cursor: not-allowed; }
@media (max-width: 480px) {
  .ai-chat-window { position: fixed; width: calc(100vw - 24px); right: 12px; left: 12px; top: 12px; bottom: 80px; height: auto; max-height: none; }
}