Интегрировать AI-чат в стиле OpenAI ChatGPT в существующий HTML-шаблон

# Краткое описание задания: Интеграция AI-чата

## 📋 Суть задачи

Необходимо создать полноценный чат-виджет в стиле OpenAI ChatGPT для сайта по продаже автозапчастей. Виджет должен заменить текущий простой input и обеспечить удобное общение пользователей с AI-консультантом.

## 🎯 Что нужно сделать

### 1. Верстка компонента
- Создать фиксированный виджет чата (правый нижний угол)
- Реализовать кнопку открытия/закрытия
- Сделать область с историей сообщений
- Добавить поле ввода с кнопкой отправки
- Стилизовать в стиле ChatGPT (зеленая тема)

### 2. Функционал
- Отправка сообщений по Enter или кнопке
- Разные стили для сообщений пользователя (справа, зеленые) и AI (слева, белые)
- Анимированный индикатор загрузки
- Автопрокрутка к последнему сообщению
- Сохранение истории в localStorage

### 3. Интеграция с API
- Использовать существующую библиотеку `behaviour-chat.min.js`
- Подключить все необходимые data-атрибуты
- Обработать потоковый вывод ответов (streaming)
- Добавить обработку ошибок с понятными сообщениями

### 4. Адаптивность
- **Десктоп**: Виджет 400x600px в углу
- **Планшет**: Виджет 380x550px
- **Мобильный**: Полноэкранный режим (100% экрана)

## 📦 Что нужно создать

### Файлы:
1. **chat.css** – все стили для чата (БЭМ-методология)
2. **chat-widget.js** – JavaScript логика (Vanilla JS, ES6+)
3. **README.md** – инструкция по подключению

### Модификация:
- **index.html** – заменить текущий простой input на новый виджет

## ⚙️ Технические требования

- **Язык**: Чистый JavaScript (ES6+), без фреймворков
- **Стили**: CSS3, БЭМ-именование классов
- **Браузеры**: Chrome 90+, Firefox 88+, Safari 14+, Edge 90+
- **Производительность**: Загрузка < 1 сек, отклик < 100ms
- **Доступность**: ARIA-атрибуты, навигация с клавиатуры

## 🎨 Дизайн

**Стиль**: OpenAI ChatGPT  
**Цвета**: Зеленая палитра (#10a37f основной)  
**Шрифт**: Системный (San Francisco, Segoe UI, Roboto)

### Состояния:
- Закрыт (только кнопка)
- Открыт с приветствием
- Диалог с историей
- Загрузка ответа
- Ошибка

## ✅ Обязательно (Must Have)

- ✓ Работающий чат с красивым UI
- ✓ Отправка/получение сообщений
- ✓ Индикатор загрузки
- ✓ Адаптив для всех устройств
- ✓ Интеграция с существующим API
- ✓ Обработка ошибок

## 🌟 Желательно (Should Have)

- ✓ Сохранение истории между сессиями
- ✓ Счетчик непрочитанных сообщений
- ✓ Плавные анимации
- ✓ Восстановление истории при перезагрузке

## 💎 Опционально (Nice to Have)

- Кнопка очистки истории
- Копирование текста сообщений
- Темная/светлая тема
- Экспорт истории в файл

## 📅 Сроки

**Общий срок**: 6 рабочих дней

- День 1-2: Верстка компонента
- День 3-4: JavaScript + интеграция API
- День 5: Тестирование и адаптив
- День 6: Правки и документация

## 📝 Результат

После выполнения задания вы предоставите:

1. **3 файла с кодом** (chat.css, chat-widget.js, модифицированный index.html)
2. **README.md** с инструкцией по установке и использованию
3. **Рабочий демонстрационный пример** на вашем хостинге или CodePen

## 📚 Что прилагается

К этому заданию приложено **полное техническое задание** с:
- Детальной спецификацией всех компонентов
- Примерами кода и структуры
- Описанием API и форматов данных
- Полными CSS-стилями
- Требованиями к accessibility
- Сценариями использования
- Критериями приемки

**Пожалуйста, внимательно изучите полное ТЗ перед началом работы!**

## ❓ Вопросы?

Если что-то непонятно или нужны уточнения – спрашивайте до начала работы. Лучше уточнить детали сразу, чем переделывать потом.

---
Полное описание тз во вложении, доступ к репозиторию предоставлю