.chat-input-h5-container { padding: 8px 12px calc(12px + env(safe-area-inset-bottom)); background: var(--color-bg); width: 100%; z-index: 100; position: sticky; bottom: 0; } .chat-input-h5-attachments { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; } .chat-input-h5-attachment-tag { border-radius: 6px; padding: 4px 8px; } .chat-input-h5-image-item { position: relative; } .chat-input-h5-image { object-fit: cover; border-radius: 8px; border: 1px solid var(--color-border); } .chat-input-h5-image-close { position: absolute; top: -6px; right: -6px; width: 16px; height: 16px; display: flex; align-items: center; justify-content: center; } .chat-input-h5-image-close .anticon { font-size: 8px; } .chat-input-h5-toolbar { margin-bottom: 8px; overflow: hidden; position: relative; } .chat-input-h5-toolbar-scroll { display: flex; align-items: center; gap: 8px; overflow-x: auto; padding: 0 4px 4px; scrollbar-width: none; /* Firefox */ } .chat-input-h5-toolbar-scroll::-webkit-scrollbar { display: none; /* Chrome, Safari, Opera */ } .chat-input-h5-model-select { flex: 0 0 auto; min-width: 100px; max-width: 150px; } .chat-input-h5-toolbar-divider { width: 1px; height: 14px; background: var(--color-border); flex: 0 0 auto; margin: 0 4px; } .chat-input-h5-action-icon { flex: 0 0 auto; display: flex; align-items: center; gap: 4px; padding: 0 8px !important; color: var(--color-text-secondary) !important; font-size: 13px !important; } .chat-input-h5-action-icon .anticon { font-size: 16px; } .chat-input-h5-action-icon:disabled { opacity: 0.5; } .chat-input-h5-main { display: flex; align-items: center; gap: 8px; background: var(--color-surface); border-radius: 24px; padding: 6px 12px 6px 18px; border: 1px solid var(--color-border); box-shadow: 0px 4px 20px 0px #7DB8FF4A; } .chat-input-h5-upload-btn { padding: 4px; height: auto; } .chat-input-h5-upload-btn .anticon { font-size: 20px; color: var(--color-text-secondary); } .chat-input-h5-textarea { padding: 4px 0 !important; font-size: 16px !important; } .chat-main .chat-input-h5-textarea:focus { outline: none !important; box-shadow: none !important; } .chat-input-h5-actions { display: flex; align-items: center; gap: 4px; } .chat-input-h5-tool-btn { padding: 4px; height: auto; } .chat-input-h5-tool-btn .anticon { font-size: 20px; color: var(--color-text-secondary); } .chat-input-h5-main .ant-btn-variant-solid:disabled { border: 0; } /* 提及选择器样式 */ .chat-input-h5-mention-popover { position: fixed; z-index: 10000; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: 6px; box-shadow: 0 2px 8px rgba(0,0,0,0.15); max-height: 200px; overflow-y: auto; min-width: 150px; } .chat-input-h5-mention-empty { padding: 8px; color: var(--color-text-tertiary); } .chat-input-h5-mention-item { padding: 6px 10px; cursor: pointer; border-bottom: 1px solid var(--color-border); } .chat-input-h5-mention-item:last-child { border-bottom: none; } .chat-input-h5-mention-name { font-size: 14px; font-weight: 500; color: var(--color-text); }