{% extends "base.html" %}
{% set active_page = "settings_ssl" %}
{% set can_edit = current_user.has_permission('settings_ssl.edit') %}
{% block page_title %}SSL/TLS{% endblock %}
{% block page_sub %}<div class="topbar-sub">HTTPS-Verschlüsselung und HSTS für den nginx-Reverse-Proxy</div>{% endblock %}

{% block content %}
<div class="settings-grid" style="grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));">

  <div class="card card-pad">
    <div class="section-head" style="margin-bottom:16px;">
      <div>
        <h2 style="font-size:16px;">Zertifikat</h2>
        <div class="hint">Zertifikat + privater Schlüssel im PEM-Format. Automatische Ausstellung über Let's Encrypt ist für rein interne Instanzen (noch) nicht verfügbar — Upload eines vorhandenen (z.B. selbst ausgestellten oder von einer internen CA signierten) Zertifikats.</div>
      </div>
    </div>

    {% if cert_info %}
    <div class="detail-list" style="margin-bottom:18px;">
      <div class="detail-row"><span class="k">Subject</span><span class="v" style="text-align:right; word-break:break-all;">{{ cert_info.subject }}</span></div>
      <div class="detail-row"><span class="k">Aussteller</span><span class="v" style="text-align:right; word-break:break-all;">{{ cert_info.issuer }}</span></div>
      <div class="detail-row">
        <span class="k">Gültig bis</span>
        <span class="v">
          {{ cert_info.not_after.strftime('%d.%m.%Y') }}
          {% if cert_info.days_left < 0 %}
          <span class="pill offline" style="margin-left:6px;">abgelaufen</span>
          {% elif cert_info.days_left <= 30 %}
          <span class="pill unknown" style="margin-left:6px;">noch {{ cert_info.days_left }} Tage</span>
          {% else %}
          <span class="pill online" style="margin-left:6px;">noch {{ cert_info.days_left }} Tage</span>
          {% endif %}
        </span>
      </div>
    </div>
    {% else %}
    <p class="text-faint" style="font-size:12.5px; margin-bottom:18px;">Noch kein Zertifikat hinterlegt.</p>
    {% endif %}

    {% if can_edit %}
    <form method="post" enctype="multipart/form-data" style="margin-bottom:10px;">
      <div class="field">
        <label for="cert_file">Zertifikat (PEM, .crt/.pem)</label>
        <input type="file" name="cert_file" id="cert_file" accept=".pem,.crt,.cer" required>
      </div>
      <div class="field">
        <label for="key_file">Privater Schlüssel (PEM, unverschlüsselt)</label>
        <input type="file" name="key_file" id="key_file" accept=".pem,.key" required>
        <div class="field-hint">Ein passwortgeschützter Schlüssel wird abgelehnt — nginx könnte ihn beim Start ohnehin nicht ohne manuelle Passworteingabe laden.</div>
      </div>
      <button type="submit" name="upload_cert" value="1" class="btn btn-secondary btn-block">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 01-2 2H5a2 2 0 01-2-2v-4"/><path d="M17 8l-5-5-5 5"/><path d="M12 3v12"/></svg>
        Zertifikat + Schlüssel hochladen
      </button>
    </form>
    {% if cert_info and not ssl_enabled %}
    <form method="post" data-confirm="Hinterlegtes Zertifikat wirklich entfernen?" data-no-unsaved-guard>
      <button type="submit" name="remove_cert" value="1" class="btn btn-danger btn-block">Zertifikat entfernen</button>
    </form>
    {% elif cert_info %}
    <p class="text-faint" style="font-size:11.5px;">SSL muss zuerst deaktiviert werden, bevor das Zertifikat entfernt werden kann.</p>
    {% endif %}
    {% else %}
    <p class="text-faint" style="font-size:12.5px;">Für Upload/Entfernen fehlt das Recht „SSL/TLS ändern“.</p>
    {% endif %}
  </div>

  <div class="card card-pad">
    <div class="section-head" style="margin-bottom:16px;">
      <div>
        <h2 style="font-size:16px;">HTTPS aktivieren</h2>
        <div class="hint">Schaltet nginx auf Port 443 mit dem oben hinterlegten Zertifikat um. Port 80 leitet dann automatisch weiter, damit bestehende Lesezeichen/Links nicht ins Leere laufen.</div>
      </div>
    </div>

    {% if pending_ssl_token %}
    <div class="card-pad" style="background:var(--warning-dim); border-radius:var(--radius-sm); margin-bottom:16px;">
      <p style="margin:0 0 12px; font-size:13px;">
        Neue nginx-Konfiguration wurde angewendet. Wenn diese Seite gerade noch lädt, funktioniert die Verbindung —
        bitte bestätigen, bevor automatisch zurückgerollt wird (nach {{ ssl_revert_seconds }}s ohne Bestätigung).
      </p>
      <form method="post">
        <input type="hidden" name="confirm_ssl" value="{{ pending_ssl_token }}">
        <button type="submit" class="btn btn-primary">
          <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 6L9 17l-5-5"/></svg>
          Verbindung funktioniert — bestätigen
        </button>
      </form>
    </div>
    {% elif can_edit %}
    <form method="post"
          data-confirm="nginx-Konfiguration wirklich ändern? Falls die Verbindung danach abbricht, wird die vorherige Konfiguration automatisch nach {{ ssl_revert_seconds }} Sekunden wiederhergestellt.">
      <div class="field">
        <label class="switch-check" style="display:inline-flex; align-items:center; gap:8px;">
          <input type="checkbox" name="ssl_enabled" id="ssl_enabled_check" {% if ssl_enabled %}checked{% endif %} {% if not cert_info %}disabled{% endif %}>
          <span class="track"></span>
          <span>SSL/HTTPS aktivieren</span>
        </label>
        {% if not cert_info %}<div class="field-hint">Erst nach Hochladen eines Zertifikats verfügbar.</div>{% endif %}
      </div>
      <div class="field">
        <label class="switch-check" style="display:inline-flex; align-items:center; gap:8px;">
          <input type="checkbox" name="hsts_enabled" id="hsts_enabled_check" {% if hsts_enabled %}checked{% endif %} {% if not ssl_enabled %}disabled{% endif %}>
          <span class="track"></span>
          <span>HSTS (Strict-Transport-Security)</span>
        </label>
        <div class="field-hint">Weist Browser an, diese Instanz künftig NUR noch über HTTPS aufzurufen — auch bei einem späteren Zurückschalten auf HTTP bleibt das im Browser für die eingestellte Dauer (1 Jahr) bestehen. Nur aktivieren, wenn das Zertifikat dauerhaft gepflegt wird.</div>
      </div>
      <button type="submit" name="apply_ssl" value="1" class="btn btn-primary btn-block">
        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9 12l2 2 4-4"/><path d="M12 2l8 4v6c0 5-3.5 8.5-8 10-4.5-1.5-8-5-8-10V6z"/></svg>
        Anwenden
      </button>
    </form>
    {% else %}
    <p class="text-faint" style="font-size:12.5px;">Für das Aktivieren fehlt das Recht „SSL/TLS ändern“.</p>
    {% endif %}
  </div>

</div>
{% endblock %}

{% block scripts %}
<script>
document.addEventListener("DOMContentLoaded", () => {
    const sslCheck = document.getElementById("ssl_enabled_check");
    const hstsCheck = document.getElementById("hsts_enabled_check");
    if (sslCheck && hstsCheck) {
        sslCheck.addEventListener("change", () => {
            hstsCheck.disabled = !sslCheck.checked;
            if (!sslCheck.checked) hstsCheck.checked = false;
        });
    }
});
</script>
{% endblock %}