{% extends "base.html" %}

{% block title %}Login - {{ app_title|safe }}{% endblock %}

{% block content %}
<div class="login-container">
    {% if important_message %}
    <div class="admin-message important-message">
        <details>
            <summary>Information</summary>
            <p>{{ important_message }}</p>
        </details>
    </div>
    {% elif info_message %}
    <div class="admin-message info-message">
        <details>
            <summary>Information</summary>
            <p>{{ info_message }}</p>
        </details>
    </div>
    {% endif %}

    <div class="login-box">
        <h1>{{ app_title|safe }}</h1>

        {% if error %}
        <div class="error-message">{{ error }}</div>
        {% endif %}

        <form method="POST" action="{{ url_for('dash.login') }}">
            <div class="form-group">
                <label for="username">Username:</label>
                <input type="text" id="username" name="username" required autofocus>
            </div>

            <div class="form-group">
                <label for="password">Password:</label>
                <input type="password" id="password" name="password" required>
            </div>

            <button type="submit" class="btn-login">Login</button>
        </form>

        <div class="copyright-notice">
            <p>&copy; 2026 <a href="https://codeberg.org/rokor/flshbd" target="_blank" rel="noopener noreferrer">FlashBoard</a>. Unlicensed.</p>
        </div>
    </div>

    <div class="info-dropdown">
        <details>
            <summary>What is this?</summary>
            <p>FlashBoard is a centralized dashboard application that provides access to various tools and services through a clean, role-based interface.</p>
        </details>
    </div>
</div>
{% endblock %}