{% extends "base.html" %}
{% block title %}Initial Setup // Synapse-Cortex{% endblock %}
{% block bare_content %}
<div class="min-h-screen flex items-center justify-center px-4">
  <div class="w-full max-w-md">
    <div class="text-center mb-6">
      <img src="/static/img/cortex-logo.webp" alt="Synapse-Cortex" class="h-24 w-auto mx-auto mb-3" />
      <div class="text-[10px] text-cortex-muted mt-1 tracking-widest font-display">INITIAL SYSTEM CONFIGURATION</div>
    </div>
    <div class="border border-cortex-border bg-cortex-panel rounded-md p-6 glow-blue">
      <div class="flex items-center gap-2 mb-4">
        <span class="w-2 h-2 rounded-full bg-accent-orange animate-pulse"></span>
        <span class="text-xs text-accent-orange uppercase tracking-wider">No global admin detected</span>
      </div>
      {% if error %}
      <div class="mb-4 text-xs border border-accent-red/40 bg-accent-red/10 text-accent-red px-3 py-2 rounded">{{ error }}</div>
      {% endif %}
      <form method="post" action="/setup" class="space-y-4 text-sm">
        <div>
          <label class="block text-xs text-cortex-muted mb-1 uppercase tracking-wider">Tenant Name</label>
          <input required name="tenant_name" type="text" placeholder="Acme Corporation"
                 class="w-full bg-cortex-panel2 border border-cortex-border rounded px-3 py-2 focus:outline-none focus:border-accent-blue focus:ring-1 focus:ring-accent-blue" />
        </div>
        <div>
          <label class="block text-xs text-cortex-muted mb-1 uppercase tracking-wider">Global Admin Name</label>
          <input required name="admin_full_name" type="text" placeholder="Jane Operator"
                 class="w-full bg-cortex-panel2 border border-cortex-border rounded px-3 py-2 focus:outline-none focus:border-accent-blue focus:ring-1 focus:ring-accent-blue" />
        </div>
        <div>
          <label class="block text-xs text-cortex-muted mb-1 uppercase tracking-wider">Admin Email</label>
          <input required name="admin_email" type="email" placeholder="admin@acme.com"
                 class="w-full bg-cortex-panel2 border border-cortex-border rounded px-3 py-2 focus:outline-none focus:border-accent-blue focus:ring-1 focus:ring-accent-blue" />
        </div>
        <div>
          <label class="block text-xs text-cortex-muted mb-1 uppercase tracking-wider">Admin Password</label>
          <input required name="admin_password" type="password" minlength="8" placeholder="&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;&bull;"
                 class="w-full bg-cortex-panel2 border border-cortex-border rounded px-3 py-2 focus:outline-none focus:border-accent-blue focus:ring-1 focus:ring-accent-blue" />
        </div>
        <button type="submit"
                class="w-full bg-accent-blue text-cortex-bg font-display font-bold uppercase tracking-wider text-xs py-2.5 rounded hover:bg-accent-blue-bright transition">
          Initialize System
        </button>
      </form>
    </div>
    <div class="text-center text-[10px] text-cortex-muted mt-4 font-display">SYNAPSE SUITE // CORTEX ITSM MODULE // v1.0.0</div>
  </div>
</div>
{% endblock %}