<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Кабинет — WB Feedback</title>
    <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}" />
</head>
<body>

<nav class="topbar">
    <div class="topbar__inner">
        <a href="{{ url_for('index') }}" class="topbar__brand">
            <img src="{{ url_for('static', filename='wb3.png') }}" class="topbar__logo-img" alt="WB">
            
        </a>
        <div class="topbar__nav">
            <a href="{{ url_for('index') }}" class="topbar__link">Отзывы</a>
            <a href="{{ url_for('cabinet') }}" class="topbar__link active">Кабинет</a>
            {% if current_user["is_admin"] %}
            <a href="{{ url_for('admin_panel') }}" class="topbar__link">Администратор</a>
            {% endif %}
        </div>
        <div class="topbar__user">
            <span class="topbar__username">{{ current_user["username"] }}</span>
            <a href="{{ url_for('logout') }}" class="btn-ghost">Выйти</a>
        </div>
    </div>
</nav>

<div class="page">

    <div class="page-header">
        <h1>Личный кабинет</h1>
        <p class="hint">Управляйте токенами магазинов Wildberries.</p>
    </div>

    {% if error_message %}
        <div class="alert alert-error">{{ error_message }}</div>
    {% endif %}
    {% if success_message %}
        <div class="alert alert-success">{{ success_message }}</div>
    {% endif %}

    <div class="cabinet-section">
        <div class="section-header">
            <h2>Сохранённые магазины</h2>
            {% if tokens %}
                <span class="badge">{{ tokens|length }}</span>
            {% endif %}
        </div>

        {% if tokens %}
            <div class="store-list">
                {% for token in tokens %}
                <div class="store-card {% if token.id == active_token_id %}store-card--active{% endif %}">
                    <div class="store-card__header">
                        <div class="store-card__icon">
                            <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"/><polyline points="9 22 9 12 15 12 15 22"/></svg>
                        </div>
                        <div class="store-card__info">
                            <div class="store-card__name">
                                {{ token.name }}
                                {% if current_user["is_admin"] and token.owner %}
                                    <span class="token-owner">({{ token.owner }})</span>
                                {% endif %}
                            </div>
                            {% if token.id == active_token_id %}
                                <span class="store-card__active-label">● Активен</span>
                            {% endif %}
                        </div>
                        <div class="store-card__actions">
                            {% if token.id != active_token_id %}
                            <form method="post" class="inline-form">
                                <input type="hidden" name="cabinet_action" value="select">
                                <input type="hidden" name="token_id" value="{{ token.id }}">
                                <button type="submit" class="btn-activate">Активировать</button>
                            </form>
                            {% endif %}
                            <form method="post" class="inline-form">
                                <input type="hidden" name="cabinet_action" value="check">
                                <input type="hidden" name="token_id" value="{{ token.id }}">
                                <button type="submit" class="secondary">Проверить токен</button>
                            </form>
                        </div>
                    </div>

                    <!-- Редактирование (скрытое по умолчанию) -->
                    <details class="store-card__edit">
                        <summary>Изменить данные</summary>
                        <form method="post" class="cabinet-form" style="margin-top:14px">
                            <input type="hidden" name="cabinet_action" value="edit">
                            <input type="hidden" name="token_id" value="{{ token.id }}">
                            <label>
                                Название магазина
                                <input type="text" name="name" required value="{{ token.name }}">
                            </label>
                            <label>
                                Токен API
                                <textarea name="token" rows="3" required>{{ token.token }}</textarea>
                            </label>
                            <div>
                                <button type="submit">Сохранить изменения</button>
                            </div>
                        </form>
                    </details>
                </div>
                {% endfor %}
            </div>
        {% else %}
            <div class="empty-state">Пока нет сохранённых магазинов.</div>
        {% endif %}
    </div>

    <div class="cabinet-section">
        <div class="section-header">
            <h2>Добавить магазин</h2>
        </div>
        <form method="post" class="cabinet-form">
            <input type="hidden" name="cabinet_action" value="add">
            <label>
                Название магазина
                <input type="text" name="name" required placeholder="Например, Основной аккаунт">
            </label>
            <label>
                Токен API
                <textarea name="token" rows="3" required placeholder="Вставьте токен Wildberries"></textarea>
            </label>
            <div>
                <button type="submit">Добавить магазин</button>
            </div>
        </form>
    </div>

</div>

<!-- Нижняя навигация (мобайл) -->
<nav class="bottom-nav">
    <a href="{{ url_for('index') }}" class="bottom-nav__item">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
            <path d="M9 5H7a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-2"/>
            <rect x="9" y="3" width="6" height="4" rx="1"/>
            <line x1="9" y1="12" x2="15" y2="12"/>
            <line x1="9" y1="16" x2="13" y2="16"/>
        </svg>
        Отзывы
    </a>
    <a href="{{ url_for('cabinet') }}" class="bottom-nav__item active">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
            <path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/>
            <circle cx="12" cy="7" r="4"/>
        </svg>
        Кабинет
    </a>
    {% if current_user["is_admin"] %}
    <a href="{{ url_for('admin_panel') }}" class="bottom-nav__item">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
            <path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/>
        </svg>
        Админ
    </a>
    {% endif %}
</nav>

</body>
</html>
