{% extends "base.html" %}
{% from "macros.html" import format_size %}

{% block title %}Личный кабинет — PhotoHost{% endblock %}

{% block content %}
<section class="page-header">
    <div class="container">
        <h1 class="page-header__title">Личный кабинет</h1>
        <p class="page-header__subtitle">Привет, {{ current_user.username }}! Управляйте своими фотографиями.</p>
        <div class="page-header__actions">
            <a href="{{ url_for('folders.list_folders') }}" class="btn btn--primary">Мои папки</a>
            <a href="{{ url_for('cabinet.profile') }}" class="btn btn--ghost">Настройки профиля</a>
        </div>
    </div>
</section>

{% include "partials/alerts.html" %}

<section class="stats-bar">
    <div class="container stats">
        <div class="stat-card">
            <span class="stat-card__value">{{ total_photos }}</span>
            <span class="stat-card__label">ваших фото</span>
        </div>
        <div class="stat-card">
            <span class="stat-card__value">{{ format_size(total_size) }}</span>
            <span class="stat-card__label">занято места</span>
        </div>
        <div class="stat-card">
            <span class="stat-card__value">до {{ max_upload_mb }} МБ</span>
            <span class="stat-card__label">на файл</span>
        </div>
    </div>
</section>

<section id="upload" class="upload-section">
    <div class="container">
        <h2 class="section-title">Загрузить фото</h2>
        <form action="{{ url_for('main.upload') }}" method="post" enctype="multipart/form-data" class="upload-form" id="uploadForm">
            <div class="dropzone" id="dropzone">
                <input type="file" name="photo" id="photoInput" accept="image/png,image/jpeg,image/gif,image/webp,image/bmp" hidden>
                <div class="dropzone__icon">
                    <svg width="48" height="48" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5">
                        <path d="M12 16V4m0 0L8 8m4-4l4 4"/>
                        <path d="M20 16.5v1a2.5 2.5 0 01-2.5 2.5h-11A2.5 2.5 0 014 17.5v-1"/>
                    </svg>
                </div>
                <p class="dropzone__title">Перетащите фото сюда</p>
                <p class="dropzone__hint">или нажмите для выбора файла</p>
                <div class="dropzone__preview" id="preview" hidden>
                    <img id="previewImg" alt="Предпросмотр">
                    <span id="previewName"></span>
                </div>
            </div>
            <button type="submit" class="btn btn--primary" id="submitBtn" disabled>Загрузить</button>
        </form>
    </div>
</section>

{% if folders %}
<section class="gallery-section">
    <div class="container">
        <div class="gallery-header">
            <h2 class="section-title">Недавние папки</h2>
            <a href="{{ url_for('folders.list_folders') }}" class="btn btn--ghost btn--sm">Все папки</a>
        </div>
        <div class="folder-grid">
            {% for folder in folders %}
            <article class="folder-card">
                <div class="folder-card__icon">📁</div>
                <h3 class="folder-card__title">{{ folder.name }}</h3>
                <p class="folder-card__meta">{{ folder.photo_count }} фото</p>
                <a href="{{ url_for('folders.view_folder', folder_id=folder.id) }}" class="btn btn--ghost btn--sm">Открыть</a>
            </article>
            {% endfor %}
        </div>
    </div>
</section>
{% endif %}

<section class="gallery-section">
    <div class="container">
        <div class="gallery-header">
            <h2 class="section-title">Мои фото</h2>
            <span class="gallery-count">{{ total_photos }} фото</span>
        </div>
        {% with photos=photos, empty_title='У вас пока нет фото', empty_text='Загрузите первое изображение выше' %}
        {% include "partials/photo_gallery.html" %}
        {% endwith %}
    </div>
</section>
{% endblock %}