Загрузка данных


Отличная идея! Это сделает интерфейс Axioma гораздо удобнее и современнее. 

Чтобы это реализовать, нам нужно изменить логику в шапке (хедере): если пользователь авторизован, клик по иконке профиля будет открывать модальное окно (как это сделано с настройками), а если нет — отправлять на регистрацию.

Вот пошаговый план реализации:

### 1. Изменяем ссылки в шапке (файл `index_copy.php`)
Найдите блок навигации и обновите условие PHP. Мы убираем прямую ссылку на профиль и вешаем `id`, чтобы перехватывать клик с помощью JavaScript.

```php
<div class="NAVnav">
    <a href="#section2">Портфолио</a>
    <a href="">О нас</a>
    <a href="index_copy.php">Главная</a>
    
    <?php if ($is_logged_in): ?>
        <a class="navimg" style="cursor: pointer;" id="openAccountsBtn"><img src="icons/icon-icons-profil-white.svg" alt="Профиль"></a>
        <a class="navimg" style="cursor: pointer;" id="openAccountsBtn2"><img src="icons/icon-icons-profil-white.svg" alt="Профиль"></a>
    <?php else: ?>
        <a class="navimg" href="register_copy.html"><img src="icons/icon-icons-profil-white.svg" alt="Регистрация"></a>
        <a class="navimg" href="register_copy.html"><img src="icons/icon-icons-profil-white.svg" alt="Регистрация"></a>
    <?php endif; ?>
    
    <a><img src="icons/icon-icons-nastroiki-white.svg" alt="Настройки" id="openModalBtn"></a>
</div>
```

### 2. Добавляем верстку модального окна
Вставьте этот HTML-код сразу после блока с модальным окном настроек (`#myModal`). Здесь мы добавим кнопку перехода в профиль, список аккаунтов и кнопку «Выйти».

```html
<div id="accountsModal" class="modal">
    <div class="modal-content">
        <button id="closeAccountsBtn" class="close-btn">&times;</button>
        <div class="modal-content-div">
            <h3>Ваши аккаунты</h3>
            
            <div class="accounts-list">
                <div class="account-item active">
                    <div class="account-info">
                        <div class="acc-avatar placeholder">A</div>
                        <div>
                            <h5>Основной аккаунт</h5>
                            <small class="neon-text">В сети</small>
                        </div>
                    </div>
                    <button class="btn-go" onclick="window.location.href='profil.php'">В профиль</button>
                </div>

                <div class="account-item">
                    <div class="account-info">
                        <div class="acc-avatar placeholder" style="background: #333;">C</div>
                        <div>
                            <h5>Компания ООО</h5>
                            <small>Офлайн</small>
                        </div>
                    </div>
                    <button class="btn-delete" title="Удалить аккаунт">&times;</button>
                </div>
            </div>

            <button class="btn-add-account" onclick="window.location.href='register_copy.html'">+ Добавить аккаунт</button>
            <button class="btn-logout" onclick="window.location.href='vendor/logout.php'">Выйти из системы</button>
        </div>
    </div>
</div>
```

### 3. Добавляем стили (в ваш `.css` файл)
Эти стили отлично впишутся в темную кибер-эстетику интерфейса:

```css
/* Стили для модалки аккаунтов */
.accounts-list {
    display: flex;
    flex-direction: column;
    gap: 15px;
    margin-bottom: 20px;
}
.account-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: rgba(255, 255, 255, 0.05);
    padding: 10px 15px;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    transition: 0.3s;
}
.account-item.active {
    border-color: #00ffcc; /* Тот самый неоновый цвет */
    box-shadow: 0 0 10px rgba(0, 255, 204, 0.1);
}
.account-info {
    display: flex;
    align-items: center;
    gap: 15px;
}
.acc-avatar.placeholder {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #00ffcc;
    color: #000;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    font-size: 1.2rem;
}
.btn-go {
    background: transparent;
    color: #00ffcc;
    border: 1px solid #00ffcc;
    padding: 5px 10px;
    border-radius: 4px;
    cursor: pointer;
    font-weight: bold;
}
.btn-go:hover {
    background: #00ffcc;
    color: #000;
}
.btn-delete {
    background: transparent;
    color: #ff4b4b;
    border: 1px solid transparent;
    border-radius: 4px;
    cursor: pointer;
    font-size: 1.5rem;
}
.btn-delete:hover {
    color: #ff0000;
}
.btn-add-account {
    width: 100%;
    padding: 10px;
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    border: 1px dashed rgba(255, 255, 255, 0.3);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
}
.btn-add-account:hover {
    background: rgba(255, 255, 255, 0.2);
    border-color: #00ffcc;
}
.btn-logout {
    margin-top: 15px;
    width: 100%;
    border: 1px solid #ff4b4b;
    color: #ff4b4b;
    background: transparent;
    padding: 10px;
    border-radius: 8px;
    cursor: pointer;
    transition: 0.3s;
}
.btn-logout:hover {
    background: #ff4b4b;
    color: #fff;
}
```

### 4. Добавляем логику JavaScript (в файл `modal.js`)
Нужно "научить" кнопки открывать и закрывать новое окно:

```javascript
// Получаем элементы нового модального окна
const accountsModal = document.getElementById('accountsModal');
const openAccountsBtn = document.getElementById('openAccountsBtn');
const openAccountsBtn2 = document.getElementById('openAccountsBtn2');
const closeAccountsBtn = document.getElementById('closeAccountsBtn');

// Проверяем, существуют ли кнопки (чтобы не было ошибок в консоли у неавторизованных)
if (openAccountsBtn) {
    openAccountsBtn.onclick = function() { accountsModal.style.display = "flex"; }
}
if (openAccountsBtn2) {
    openAccountsBtn2.onclick = function() { accountsModal.style.display = "flex"; }
}
if (closeAccountsBtn) {
    closeAccountsBtn.onclick = function() { accountsModal.style.display = "none"; }
}

// Добавляем закрытие нового окна при клике вне его области 
// (Дополняем существующую функцию window.onclick)
window.addEventListener('click', function(event) {
    if (event.target == accountsModal) {
        accountsModal.style.display = "none";
    }
});
```

### 5. Бонус: скрипт выхода (`vendor/logout.php`)
Поскольку мы добавили кнопку выхода, нам нужен простой скрипт, который будет "убивать" сессию, чтобы кнопка работала. Создайте файл `vendor/logout.php`:

```php
<?php
session_start();
session_unset(); // Удаляем все переменные сессии
session_destroy(); // Уничтожаем сессию
header('Location: ../index_copy.php'); // Перекидываем на главную
exit();
?>
```

**Обрати внимание:** Реальный функционал переключения и мультиаккаунтов потребует доработок в базе данных (связывать несколько ID с одним пользователем или использовать cookies), но визуально интерфейс будет работать и выглядеть круто уже сейчас!