{% extends "layout.html" %}
{% set active = 'profile' %}
{% block page_title %}Profil – AzA Intern{% endblock %}
{% block content %}
<div class="page-header">
  <h2>Profil</h2>
</div>

<div class="hint-banner">
  Keine Patientendaten, API-Keys oder Passwörter in Notizen, Aufgaben oder Uploads speichern.
</div>

{% if message == 'profile_saved' %}
<div class="alert alert-success">Profil gespeichert.</div>
{% elif message == 'password_changed' %}
<div class="alert alert-success">Passwort erfolgreich geändert.</div>
{% elif message == 'password_mismatch' %}
<div class="alert alert-error">Neues Passwort und Bestätigung stimmen nicht überein.</div>
{% elif message == 'password_short' %}
<div class="alert alert-error">Neues Passwort muss mindestens 8 Zeichen haben.</div>
{% elif message == 'password_wrong' %}
<div class="alert alert-error">Aktuelles Passwort ist falsch.</div>
{% endif %}

<div class="grid-2">
  <div class="card">
    <h3>Mein Profil</h3>
    <p><strong>Benutzername:</strong> {{ profile.username }}</p>
    <p><strong>Rolle:</strong> {{ profile.role }}</p>
    <form method="post" action="/profile/update">
      <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
      <div class="form-group">
        <label for="display_name">Anzeigename</label>
        <input type="text" id="display_name" name="display_name" value="{{ profile.display_name or '' }}" maxlength="100">
      </div>
      <button type="submit" class="btn btn-primary">Profil speichern</button>
    </form>
  </div>

  <div class="card">
    <h3>Passwort ändern</h3>
    <form method="post" action="/profile/password">
      <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
      <div class="form-group">
        <label for="current_password">Aktuelles Passwort</label>
        <input type="password" id="current_password" name="current_password" required autocomplete="current-password">
      </div>
      <div class="form-group">
        <label for="new_password">Neues Passwort (min. 8 Zeichen)</label>
        <input type="password" id="new_password" name="new_password" required minlength="8" autocomplete="new-password">
      </div>
      <div class="form-group">
        <label for="new_password_confirm">Neues Passwort bestätigen</label>
        <input type="password" id="new_password_confirm" name="new_password_confirm" required minlength="8" autocomplete="new-password">
      </div>
      <button type="submit" class="btn btn-primary">Passwort ändern</button>
    </form>
  </div>
</div>
{% endblock %}