<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{% if is_public %}Профиль {{ profile_user.username }}{% else %}Профиль{% endif %} - CS2 Simulator</title>
    <link rel="stylesheet" href="/static/css/style.css">
</head>
<body>
    <nav class="navbar">
        <div class="container">
            <a href="/" class="logo">🎮 CS2 Simulator</a>
            <div class="nav-links">
                {% if user %}
                <a href="/cases" class="nav-link">Кейсы</a>
                <a href="/contracts" class="nav-link">Контракты</a>
                <a href="/upgrade" class="nav-link">🆙 Апгрейд</a>
                <a href="/crash" class="nav-link">💥 Crash</a>
                <a href="/inventory" class="nav-link">Инвентарь</a>
                <a href="/activity" class="nav-link">📰 Лента</a>
                <a href="/achievements" class="nav-link">🏆 Достижения</a>
                <a href="/profile" class="nav-link">Профиль</a>
                <span class="user-balance">{{ "%.2f"|format(user.balance) }} ₽</span>
                <button onclick="toggleSound()" class="btn btn-outline" id="soundToggle" title="Звук">🔊</button>
                <button onclick="toggleSafeMode()" class="btn btn-outline" id="safeModeToggle" title="Режим записи">🎙️</button>
                <button onclick="logout()" class="btn btn-outline">Выйти</button>
                {% else %}
                <a href="/cases" class="nav-link">Кейсы</a>
                <a href="/contracts" class="nav-link">Контракты</a>
                <a href="/upgrade" class="nav-link">🆙 Апгрейд</a>
                <a href="/activity" class="nav-link">📰 Лента</a>
                <button onclick="toggleSafeMode()" class="btn btn-outline" id="safeModeToggle" title="Режим записи">🎙️</button>
                <a href="/login" class="btn btn-outline">Войти</a>
                <a href="/register" class="btn btn-primary">Регистрация</a>
                {% endif %}
            </div>
        </div>
    </nav>

    <main class="profile-container">
        <div class="container">
            <div class="profile-header">
                {% if is_public %}
                <div style="display:flex;align-items:center;gap:0.75rem;margin-bottom:0.5rem;">
                    <span style="background:var(--bg-card);padding:0.25rem 0.75rem;border-radius:20px;font-size:0.75rem;color:var(--text-secondary);border:1px solid var(--border-color);">👤 Публичный профиль</span>
                </div>
                <h1>👤 {{ profile_user.username }}</h1>
                <p class="profile-subtitle">Зарегистрирован {{ profile_user.created_at.strftime('%d.%m.%Y') }}</p>
                {% else %}
                <h1>👤 {{ user.username }}</h1>
                <p class="profile-subtitle">Добро пожаловать в ваш профиль</p>
                {% endif %}
            </div>
            
            <div class="stats-grid">
                <div class="stat-card">
                    <div class="stat-value">{{ total_items }}</div>
                    <div class="stat-label">Предметов в инвентаре</div>
                </div>
                <div class="stat-card">
                    <div class="stat-value">{{ cases_opened }}</div>
                    <div class="stat-label">Открыто кейсов</div>
                </div>
                <div class="stat-card">
                    <div class="stat-value">{{ contracts_completed }}</div>
                    <div class="stat-label">Выполнено контрактов</div>
                </div>
                {% if not is_public %}
                <div class="stat-card">
                    <div class="stat-value">{{ "%.2f"|format(user.balance) }} ₽</div>
                    <div class="stat-label">Баланс</div>
                </div>
                {% endif %}
            </div>
            
            <div class="profile-sections">
                <div class="section">
                    <h2>🏆 Ценные предметы</h2>
                    <div class="items-grid">
                        {% set target_items = valuable_items %}
                        {% for item in target_items %}
                        <div class="item-card rarity-{{ item.rarity|lower|replace(' ', '-') }}">
                            <div class="item-name">{{ item.market_hash_name }}</div>
                            <div class="item-details">
                                <span class="item-rarity">{{ item.rarity }}</span>
                                <span class="item-float">Float: {{ "%.4f"|format(item.float_value) }}</span>
                            </div>
                        </div>
                        {% else %}
                        <p class="empty-state">У {% if is_public %}этого пользователя{% else %}вас{% endif %} пока нет предметов.</p>
                        {% endfor %}
                    </div>
                </div>
                
                <div class="section">
                    <h2>📦 Последние открытия</h2>
                    <div class="history-list">
                        {% for opening in recent_openings %}
                        <div class="history-item">
                            <div class="history-icon">📦</div>
                            <div class="history-content">
                                <div class="history-title">{{ opening.item_name }}</div>
                                <div class="history-meta">
                                    <span class="rarity-{{ opening.rarity|lower|replace(' ', '-') }}">{{ opening.rarity }}</span>
                                    <span>Float: {{ "%.4f"|format(opening.float_value) }}</span>
                                    <span>{{ opening.opened_at.strftime('%d.%m.%Y %H:%M') }}</span>
                                </div>
                            </div>
                        </div>
                        {% else %}
                        <p class="empty-state">Пока нет открытий</p>
                        {% endfor %}
                    </div>
                </div>
                
                <div class="section">
                    <h2>🔄 Последние контракты</h2>
                    <div class="history-list">
                        {% for contract in recent_contracts %}
                        <div class="history-item">
                            <div class="history-icon">🔄</div>
                            <div class="history-content">
                                <div class="history-title">{{ contract.output_item_name }}</div>
                                <div class="history-meta">
                                    <span>Float: {{ "%.4f"|format(contract.output_float) }}</span>
                                    <span>Шанс: {{ "%.2f"|format(contract.probability) }}%</span>
                                    <span>{{ contract.created_at.strftime('%d.%m.%Y %H:%M') }}</span>
                                </div>
                            </div>
                        </div>
                        {% else %}
                        <p class="empty-state">Пока нет контрактов</p>
                        {% endfor %}
                    </div>
                </div>
            </div>
        </div>
    </main>

    <script>
        async function logout() {
            await fetch('/web/api/auth/logout', { method: 'POST' });
            window.location.href = '/';
        }
    </script>
    <script>
        function toggleSound() {
            const enabled = SoundManager.toggle();
            document.getElementById('soundToggle').textContent = enabled ? '🔊' : '🔇';
        }
        document.addEventListener('DOMContentLoaded', () => {
            const btn = document.getElementById('soundToggle');
            if (btn) btn.textContent = localStorage.getItem('sound_enabled') !== 'false' ? '🔊' : '🔇';
        });
    </script>
    <script src="/static/js/safemode.js"></script>
{% if user and not is_public %}{% include '_activity_sidebar.html' %}{% endif %}
</body>
</html>