<!doctype html>
<html lang="{{ current_language }}" data-app-version="{{ APP_META.version }}">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="{{ site.site_name }}: estrategia espacial accesible en línea.">
  <title>{% block title %}{{ site.site_name }}{% endblock %} — {{ APP_META.name }}</title>
  <link rel="stylesheet" href="{{ url_for('static', filename='style.css', v=APP_META.version) }}">
  <link rel="stylesheet" href="{{ url_for('static', filename='server.css', v=APP_META.version) }}">
  <script src="{{ url_for('static', filename='i18n.js', v=APP_META.version) }}" defer></script>
</head>
<body class="server-page">
  <a class="skip-link" href="#main">Saltar al contenido principal</a>
  <header class="server-header">
    <div>
      <p class="eyebrow">ESTRATEGIA ESPACIAL EN LÍNEA</p>
      <a class="server-brand" href="{{ url_for('index') }}">{{ site.site_name }}</a>
    </div>
    {% if account %}
      <nav aria-label="Cuenta">
        <a href="{{ url_for('online_dashboard') }}">Mis universos</a>
        <a href="{{ url_for('online_reports') }}">Reportes</a>
        <a href="{{ url_for('online_privacy') }}">Cuenta y privacidad</a>
        {% if 'dashboard.view' in permissions %}<a href="{{ url_for('admin_dashboard') }}">Administración</a>{% endif %}
        <form method="post" action="{{ url_for('online_logout') }}">
          <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
          <button type="submit">Cerrar sesión de {{ account.username }}</button>
        </form>
      </nav>
    {% else %}
      <nav aria-label="Acceso">
        <a href="{{ url_for('online_login') }}">Iniciar sesión</a>
        <a href="{{ url_for('online_register') }}">Registrarse</a>
      </nav>
    {% endif %}
    <form method="post" action="{{ url_for('language_select') }}" class="language-switcher">
      <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
      <input type="hidden" name="next" value="{{ request.full_path }}">
      <label for="site-language">Idioma</label>
      <select id="site-language" name="language" onchange="this.form.submit()">
        {% for code, language in LANGUAGES.items() %}
        <option value="{{ code }}" {% if code == current_language %}selected{% endif %}>{{ language.native_name }}</option>
        {% endfor %}
      </select>
      <noscript><button type="submit">Aplicar</button></noscript>
    </form>
  </header>
  <main id="main" class="server-main" tabindex="-1">
    {% with messages = get_flashed_messages(with_categories=true) %}
      {% if messages %}<div class="flash-stack" aria-label="Mensajes del sistema">
        {% for category, message in messages %}
          <div class="notice notice-{{ category }}" role="{{ 'alert' if category == 'error' else 'status' }}">{{ message }}</div>
        {% endfor %}
      </div>{% endif %}
    {% endwith %}
    {% block content %}{% endblock %}
  </main>
  <footer class="server-footer">
    <nav aria-label="Información legal">
      <a href="{{ url_for('online_terms') }}">Condiciones</a>
      <a href="{{ url_for('online_privacy_notice') }}">Privacidad</a>
      <a href="{{ url_for('online_purchase_terms') }}">Compras digitales</a>
      <a href="{{ url_for('about_page') }}">Acerca de</a>
    </nav>
    <p>{{ APP_META.name }} {{ APP_META.version }} · {{ APP_META.copyright }}</p>
  </footer>
</body>
</html>
