<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>{{ page_title }}</title>
    <link href="{{url_for('static',filename='css/tailwind/output.css')}}" rel="stylesheet">
</head>

<body>
    <div class="container mx-auto">
        <div class="relative flex flex-1 flex-col items-center justify-center pb-16 pt-12">
            <div class="mb-16">
                {% include 'logo.html' %}
            </div>

            {% with messages = get_flashed_messages(with_categories=true) %}
            {% if messages %}
            {% for category, message in messages %}
            <div class="w-full max-w-sm mb-6 text-sm py-5 px-3 rounded-lg alert alert-{{ category }}">{{ message }}</div>
            {% endfor %}
            {% endif %}
            {% endwith %}

            {% block content %}
            <!-- Page specific content will be inserted here -->
            {% endblock %}

        </div>
    </div>
</body>

</html>