<!doctype html>
<html lang="{{ lang }}">
<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <title>{{ t('brand') }}</title>
  <link rel="preconnect" href="https://fonts.googleapis.com" />
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
  <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600;700&family=Source+Sans+3:wght@400;500;600&display=swap" rel="stylesheet" />
  <link rel="stylesheet" href="{{ url_for('static', filename='styles.css') }}" />
</head>
<body>
  <header class="topbar">
    <div>
      <a class="brand" href="{{ url_for('welcome') if guest_name else url_for('landing') }}">{{ t('brand') }}</a>
    </div>
    <div class="toolbar">
      <form method="post" action="{{ url_for('set_lang', code='de') }}">
        <button class="btn btn-ghost" type="submit">DE</button>
      </form>
      <form method="post" action="{{ url_for('set_lang', code='en') }}">
        <button class="btn btn-ghost" type="submit">EN</button>
      </form>
      {% if guest_name %}
      <form method="post" action="{{ url_for('logout') }}">
        <button class="btn btn-ghost" type="submit">{{ t('logout') }}</button>
      </form>
      {% endif %}
    </div>
  </header>

  <main class="container">

    {% with messages = get_flashed_messages() %}
      {% if messages %}
        {% for message in messages %}
          <p class="flash">{{ message }}</p>
        {% endfor %}
      {% endif %}
    {% endwith %}

    {% block content %}{% endblock %}
  </main>

  <footer class="site-footer">
    <a href="{{ url_for('datenschutz') }}">{{ t('privacy') }}</a>
    <a href="{{ url_for('impressum') }}">{{ t('imprint') }}</a>
  </footer>
</body>
</html>
