{% extends "base.html" %}
{% block title %}System Settings — TechDesk{% endblock %}

{% block content %}
<div class="page-header" style="margin-bottom:28px;">
  <div>
    <h1 class="page-title">System Settings</h1>
    <p class="page-subtitle">Manage application-wide configuration flags.</p>
  </div>
</div>

{% with messages = get_flashed_messages(with_categories=true) %}
  {% for cat, msg in messages %}
  <div class="alert alert-{{ cat }} alert-dismissible fade show" role="alert">
    {{ msg }}
    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
  </div>
  {% endfor %}
{% endwith %}

<div class="card" style="max-width:640px;">
  <div class="card-header" style="padding:16px 20px;border-bottom:1px solid var(--border);">
    <h5 class="mb-0" style="font-size:15px;font-weight:600;">
      <i class="bi bi-person-gear me-2"></i>User Registration
    </h5>
  </div>
  <div class="card-body" style="padding:20px;">
    <p style="font-size:13px;color:var(--muted);margin-bottom:20px;">
      When disabled, the <code>/auth/register</code> endpoint redirects all visitors to the login
      page with an informational message. Existing accounts and admin-created accounts are
      unaffected.
    </p>

    <form method="POST" action="{{ url_for('admin.settings') }}">
      <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">

      <div class="d-flex align-items-center justify-content-between p-3"
           style="border:1px solid var(--border);border-radius:10px;background:var(--surface);">
        <div>
          <div style="font-weight:600;font-size:14px;">
            <i class="bi bi-person-plus me-2"></i>Allow Self-Registration
          </div>
          <div style="font-size:12px;color:var(--muted);margin-top:3px;">
            Permits new employees to create their own accounts via the Register page.
          </div>
        </div>
        <div class="d-flex align-items-center gap-3" style="flex-shrink:0;margin-left:16px;">
          <span class="badge {% if registration_enabled %}bg-success{% else %}bg-secondary{% endif %}"
                style="font-size:11px;padding:5px 10px;">
            {{ 'Enabled' if registration_enabled else 'Disabled' }}
          </span>
          {% if registration_enabled %}
            <button type="submit" name="registration_enabled" value="0"
                    class="btn btn-sm btn-outline-danger"
                    onclick="return confirm('Disable self-registration? New users will not be able to sign up independently.')">
              <i class="bi bi-toggle-on me-1"></i>Disable
            </button>
          {% else %}
            <button type="submit" name="registration_enabled" value="1"
                    class="btn btn-sm btn-outline-success">
              <i class="bi bi-toggle-off me-1"></i>Enable
            </button>
          {% endif %}
        </div>
      </div>
    </form>
  </div>
</div>
{% endblock %}