/* * SPDX-FileCopyrightText: Hadad * SPDX-License-Identifier: Apache-2.0 */ .bubble { display: block; align-self: flex-start; background: #1f1f1f; color: #e8e8e8; border-radius: var(--bubble-radius); line-height: 1.5; white-space: normal; font-family: 'Inter', sans-serif; font-size: 0.95rem; position: relative; opacity: 0; animation: bubbleAppear 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards; margin: 0.75rem 0; overflow-wrap: break-word; word-break: break-word; vertical-align: middle; padding: 1rem 1rem; box-sizing: border-box; max-width: 100%; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); border: 1px solid rgba(255, 255, 255, 0.05); transition: all 0.3s ease; } .bubble:hover { box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); transform: translateY(-1px); } @keyframes bubbleAppear { to { opacity: 1; transform: translateY(0); } } .bubble-user { align-self: flex-end; background: #2b2b2b; color: #fff; border-bottom-right-radius: 0.5rem; box-shadow: none; } .bubble-assist { align-self: flex-start; background: transparent; border: none; box-shadow: none; }