/**
 * Chat Agent Component
 * @description Fixed chat agent button positioned at bottom right corner
 */

// Chat icon from Figma design
const chatIcon = 'https://www.figma.com/api/mcp/asset/34915bcc-807b-45a6-82a2-2806ff0d1d6b';

/**
 * ChatAgent component
 * @description Floating chat agent button matching Figma design exactly
 * @returns ChatAgent element
 */
export function ChatAgent() {
    return (
        <button
            className="fixed bottom-0 right-0 flex items-center justify-center gap-2 md:gap-3 px-4 py-3 md:px-8 md:py-6 rounded-tl-xl md:rounded-tl-3xl text-white shadow-[-4px_-3px_10px_0px_rgba(123,64,129,0.25)] transition-all hover:opacity-90 z-50 min-h-[44px]"
            style={{
                backgroundImage:
                    'linear-gradient(13.793546193113684deg, rgba(0, 27, 47, 1) 10.549%, rgba(6, 38, 168, 1) 30.146%, rgba(3, 154, 152, 1) 77.418%)',
            }}
            aria-label="Chat Agent"
        >
            <img
                src={chatIcon}
                alt="Chat"
                className="w-5 h-5 md:w-6 md:h-6 shrink-0"
            />
            <span className="text-[0.875rem] md:text-[1.25rem] font-medium leading-tight whitespace-nowrap text-center hidden md:inline">
                Chat Agent
            </span>
        </button>
    );
}