.fusion_chat_panel { .fusion_chat_messages { max-height: 500px; min-height: 300px; } .fusion_chat_msg { word-break: break-word; animation: fusionFadeIn 0.25s ease; } .fusion_ai_msg { background: var(--o-view-background-color); border: 1px solid var(--o-border-color); border-radius: 0.75rem; } // Live thinking block .fusion_live_status { animation: fusionPulse 2s ease-in-out infinite; } .fusion_thinking_block { animation: fusionFadeIn 0.3s ease; } .fusion_rich_content { font-size: 0.9rem; line-height: 1.5; h3, h4, h5 { font-weight: 600; color: var(--o-main-color-5, inherit); } table { font-size: 0.85rem; } a { color: var(--o-action-color, var(--bs-link-color)); text-decoration: none; &:hover { text-decoration: underline; } } a.badge { font-size: 0.75rem; cursor: pointer; } code { font-size: 0.85em; } hr { border-color: var(--o-border-color); } ul, ol { margin-bottom: 0.25rem; } li { margin-bottom: 0.15rem; } strong { font-weight: 600; } } // Session picker dropdown .fusion_session_picker { flex-shrink: 0; .fusion_session_item { transition: background 0.15s ease; &:hover { background: rgba(var(--bs-body-color-rgb), 0.06); } } } // Conversation starters .fusion_starter.btn { font-size: 0.8rem; border-radius: 1rem; padding: 0.3rem 0.8rem; transition: all 0.15s ease; background: transparent; color: var(--bs-body-color); border-color: var(--o-border-color, var(--bs-border-color)); &:hover, &:focus, &:active { background: var(--o-action-color, #714B67) !important; color: #fff !important; border-color: var(--o-action-color, #714B67) !important; } } .fusion_chat_input { flex-shrink: 0; textarea { resize: none; font-size: 0.88rem; min-height: 42px; max-height: 120px; line-height: 1.5; // Vertically centre single-line placeholder padding: 0.5rem 0.75rem; &::placeholder { opacity: 0.5; } } // Wider send button .btn-primary { min-width: 52px; padding-left: 0.85rem; padding-right: 0.85rem; } // Paperclip button .btn-outline-secondary { border-right: none; } } .fusion_image_preview { animation: fusionFadeIn 0.2s ease; } .fusion_approval_row { td { vertical-align: middle; } &:hover { background: rgba(var(--bs-body-color-rgb), 0.04); } } // Collapsible tool calls log .fusion_tool_calls { summary { cursor: pointer; list-style: none; &::-webkit-details-marker { display: none; } &::before { content: "\f105"; // fa-angle-right font-family: FontAwesome; display: inline-block; width: 0.8em; font-size: 0.75rem; transition: transform 0.15s ease; } } &[open] > summary::before { transform: rotate(90deg); } code { color: var(--o-action-color, var(--bs-primary)); background: rgba(var(--bs-body-color-rgb), 0.04); padding: 0.1em 0.3em; border-radius: 0.2rem; } } // Reconciliation table styles .fusion_recon_table { border: 1px solid var(--o-border-color); border-radius: 0.375rem; overflow: hidden; background: var(--o-view-background-color); .table { font-size: 0.82rem; margin-bottom: 0; thead th { font-weight: 600; font-size: 0.78rem; white-space: nowrap; background: rgba(var(--bs-body-color-rgb), 0.03); border-bottom: 2px solid var(--o-border-color); } tbody tr { transition: background-color 0.15s ease; &:hover { background: rgba(var(--bs-body-color-rgb), 0.04); } } .fit-content { width: 1%; white-space: nowrap; } } .fusion_apply_amount { font-size: 0.8rem; padding: 0.15rem 0.35rem; background: transparent; border: 1px solid var(--o-border-color); color: inherit; text-align: right; &:focus { background: var(--o-view-background-color); border-color: var(--o-action-color, var(--bs-primary)); box-shadow: 0 0 0 0.15rem rgba(var(--bs-primary-rgb), 0.15); } } .fusion_recon_search { background: rgba(var(--bs-body-color-rgb), 0.02); } .fusion_search_results { position: absolute; left: 0.5rem; right: 0.5rem; top: 100%; z-index: 10; background: var(--o-view-background-color); border: 1px solid var(--o-border-color); border-radius: 0.375rem; box-shadow: 0 4px 12px rgba(var(--bs-body-color-rgb), 0.15); max-height: 200px; overflow-y: auto; .list-group-item { border: none; border-bottom: 1px solid var(--o-border-color); background: transparent; color: inherit; &:hover { background: rgba(var(--bs-primary-rgb), 0.06); } &:last-child { border-bottom: none; } } } .fusion_match_total { background: rgba(var(--bs-body-color-rgb), 0.02); } } // Interactive table styles .fusion_interactive_table { border: 1px solid var(--o-border-color); border-radius: 0.375rem; overflow: hidden; background: var(--o-view-background-color); .table { font-size: 0.85rem; margin-bottom: 0; thead th { font-weight: 600; font-size: 0.8rem; white-space: nowrap; background: rgba(var(--bs-body-color-rgb), 0.03); border-bottom: 2px solid var(--o-border-color); } tbody tr { transition: background-color 0.15s ease; &:hover { background: rgba(var(--bs-body-color-rgb), 0.04); } &.table-active { background: rgba(var(--bs-primary-rgb), 0.06); } } td { vertical-align: middle; } } .fit-content { width: 1%; white-space: nowrap; } // Row note input .fusion_row_note { font-size: 0.8rem; padding: 0.2rem 0.4rem; background: transparent; border: 1px solid var(--o-border-color); color: inherit; &:focus { background: var(--o-view-background-color); border-color: var(--o-action-color, var(--bs-primary)); box-shadow: 0 0 0 0.15rem rgba(var(--bs-primary-rgb), 0.15); } &::placeholder { opacity: 0.4; } } // Recommendation badges .badge { font-size: 0.7rem; font-weight: 500; padding: 0.2em 0.5em; } // Action bar at bottom .fusion_table_action_bar { background: rgba(var(--bs-body-color-rgb), 0.02); border-top: 1px solid var(--o-border-color); .btn-sm { font-size: 0.78rem; padding: 0.25rem 0.6rem; } } } } // ================================================================ // Animations // ================================================================ @keyframes fusionFadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } } @keyframes fusionPulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.7; } }