{% extends "base.html" %}

{% block title %}Create Organization - LogThread{% endblock %}

{% block content %}
<div class="max-w-2xl mx-auto py-8 px-4">
    <h1 class="text-3xl font-bold mb-8">Create New Organization</h1>
    
    <div class="bg-white rounded-lg shadow p-6">
        <form method="post" action="/organizations">
            <div class="mb-4">
                <label for="name" class="block text-sm font-medium text-gray-700 mb-2">Organization Name</label>
                <input type="text" id="name" name="name" required 
                       class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
            </div>

            <div class="mb-4">
                <label for="slug" class="block text-sm font-medium text-gray-700 mb-2">URL Slug</label>
                <input type="text" id="slug" name="slug" required 
                       class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
                <p class="mt-1 text-sm text-gray-500">This will be used in your organization URL</p>
            </div>

            <div class="flex justify-end gap-4">
                <a href="/dashboard" class="px-4 py-2 text-gray-700 hover:text-gray-900">Cancel</a>
                <button type="submit" class="px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700">
                    Create Organization
                </button>
            </div>
        </form>
    </div>
</div>
{% endblock %}