{% extends "base.html" %}

{% block title %}Meine Instanz{% endblock %}

{% block content %}
<section class="instance-head">
    <h1>Meine Instanzverwaltung</h1>
    <p>Hier sehen Sie ausschließlich Ihre zugewiesene Instanz und können diese direkt nutzen.</p>
</section>

<section class="instance-card">
    <h2>Instanzdaten</h2>
    {% if instance %}
        <p><strong>Schule:</strong> {{ instance.school_name }}</p>
        <p><strong>Subdomain:</strong> {{ instance.subdomain }}</p>
        <p><strong>Status:</strong> {{ instance.status }}</p>
        <p><strong>Zugang:</strong> <a href="https://{{ instance.domain }}" target="_blank" rel="noopener noreferrer">https://{{ instance.domain }}</a></p>
    {% elif pending_request %}
        <div style="background-color: #f8f9fa; border-left: 4px solid #007bff; padding: 1rem; margin-top: 1rem;">
            <p><strong>Ihre Instanz wird gerade eingerichtet!</strong></p>
            <p>Die Subdomain <em>{{ pending_request.subdomain }}</em> wird für Sie bereitgestellt. Dies kann einen kurzen Moment dauern.</p>
            <p>Bitte laden Sie diese Seite in ein paar Sekunden neu.</p>
            <button onclick="window.location.reload();" style="margin-top: 10px; padding: 8px 16px; cursor: pointer;">Seite neu laden</button>
        </div>
    {% else %}
        <p>Für Ihr Konto ist aktuell keine Instanz zugewiesen.</p>
        <p>Bitte wenden Sie sich an den Administrator, um eine Instanz zugewiesen zu bekommen.</p>
    {% endif %}
</section>

<style>
.instance-head { margin-bottom: 1rem; }
.instance-card {
    max-width: 780px;
    border: 1px solid #d8e1e8;
    border-radius: 14px;
    background: #ffffff;
    padding: 1rem;
}
.instance-card h2 { margin: 0 0 0.6rem; }
.instance-card p { margin: 0.28rem 0; }
</style>
{% endblock %}