{% extends "base.html" %}

{% block title %}Configuração da Operação — {{ app_name }}{% endblock %}

{% block content %}
<div style="max-width: 800px; margin: 0 auto;">
    <div class="content-card">
        <div style="display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem; border-bottom: 1px solid #E2E8F0; padding-bottom: 1rem;">
            <div style="font-size: 2.5rem; background: #E3F2FD; padding: 0.5rem; border-radius: 12px;">⚙️</div>
            <div>
                <h2 style="color: #123B6D; font-weight: 800;">Configuração da Operação</h2>
                <p style="color: #5A6E85; font-size: 0.9rem;">Painel do DEV/Superadmin para implantação e parâmetros da campanha</p>
            </div>
        </div>

        <form method="POST" action="{{ url_for('campanhas.setup') }}">
            <h3 style="color: #1976D2; font-size: 1rem; font-weight: 700; margin-bottom: 1rem;">1. DADOS DA CAMPANHA / PROJETO</h3>
            
            <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1rem;">
                <div>
                    <label style="display: block; font-weight: 600; margin-bottom: 0.4rem; font-size: 0.85rem;">Nome da Campanha/Projeto</label>
                    <input type="text" name="nome" value="{{ campanha.nome if campanha else 'Projeto Manaus 2026' }}" required style="width: 100%; padding: 0.75rem; border: 1px solid #CBD5E1; border-radius: 6px;">
                </div>
                <div>
                    <label style="display: block; font-weight: 600; margin-bottom: 0.4rem; font-size: 0.85rem;">Candidato / Responsável</label>
                    <input type="text" name="candidato" value="{{ campanha.candidato if campanha else '' }}" required style="width: 100%; padding: 0.75rem; border: 1px solid #CBD5E1; border-radius: 6px;">
                </div>
            </div>

            <div style="display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1rem; margin-bottom: 1rem;">
                <div>
                    <label style="display: block; font-weight: 600; margin-bottom: 0.4rem; font-size: 0.85rem;">Cargo Disputado</label>
                    <input type="text" name="cargo" value="{{ campanha.cargo if campanha else 'Deputado Estadual' }}" required style="width: 100%; padding: 0.75rem; border: 1px solid #CBD5E1; border-radius: 6px;">
                </div>
                <div>
                    <label style="display: block; font-weight: 600; margin-bottom: 0.4rem; font-size: 0.85rem;">Município Principal</label>
                    <input type="text" name="municipio" value="{{ campanha.municipio if campanha else 'Manaus' }}" required style="width: 100%; padding: 0.75rem; border: 1px solid #CBD5E1; border-radius: 6px;">
                </div>
                <div>
                    <label style="display: block; font-weight: 600; margin-bottom: 0.4rem; font-size: 0.85rem;">Estado (UF)</label>
                    <input type="text" name="estado" value="{{ campanha.estado if campanha else 'AM' }}" required style="width: 100%; padding: 0.75rem; border: 1px solid #CBD5E1; border-radius: 6px;">
                </div>
            </div>

            <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.5rem;">
                <div>
                    <label style="display: block; font-weight: 600; margin-bottom: 0.4rem; font-size: 0.85rem;">Partido / Coligação</label>
                    <input type="text" name="partido_coligacao" value="{{ campanha.partido_coligacao if campanha else '' }}" style="width: 100%; padding: 0.75rem; border: 1px solid #CBD5E1; border-radius: 6px;">
                </div>
                <div>
                    <label style="display: block; font-weight: 600; margin-bottom: 0.4rem; font-size: 0.85rem;">Slogan Interno</label>
                    <input type="text" name="slogan" value="{{ campanha.slogan if campanha else 'Mobilização e Presença Territorial' }}" style="width: 100%; padding: 0.75rem; border: 1px solid #CBD5E1; border-radius: 6px;">
                </div>
            </div>

            <h3 style="color: #1976D2; font-size: 1rem; font-weight: 700; margin-bottom: 1rem;">2. METAS E PARÂMETROS OPERACIONAIS</h3>

            <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.5rem;">
                <div>
                    <label style="display: block; font-weight: 600; margin-bottom: 0.4rem; font-size: 0.85rem;">Meta Geral da Campanha (Cadastros)</label>
                    <input type="number" name="meta_total" value="{{ campanha.meta_total if campanha else 2500 }}" required style="width: 100%; padding: 0.75rem; border: 1px solid #CBD5E1; border-radius: 6px;">
                </div>
                <div>
                    <label style="display: block; font-weight: 600; margin-bottom: 0.4rem; font-size: 0.85rem;">Meta por Cadastrador (Padrão)</label>
                    <input type="number" name="meta_por_cadastrador" value="{{ campanha.meta_por_cadastrador if campanha else 25 }}" required style="width: 100%; padding: 0.75rem; border: 1px solid #CBD5E1; border-radius: 6px;">
                    <small style="color: #5A6E85;">Exemplo: 25, 50, 100 ou ilimitado (definido dinamicamente no banco).</small>
                </div>
            </div>

            <h3 style="color: #1976D2; font-size: 1rem; font-weight: 700; margin-bottom: 1rem;">3. ADMINISTRADOR PRINCIPAL DA OPERAÇÃO</h3>

            <div style="display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1rem; margin-bottom: 2rem;">
                <div>
                    <label style="display: block; font-weight: 600; margin-bottom: 0.4rem; font-size: 0.85rem;">Nome do Admin</label>
                    <input type="text" name="admin_nome" placeholder="Carlos Administrador" style="width: 100%; padding: 0.75rem; border: 1px solid #CBD5E1; border-radius: 6px;">
                </div>
                <div>
                    <label style="display: block; font-weight: 600; margin-bottom: 0.4rem; font-size: 0.85rem;">E-mail do Admin</label>
                    <input type="email" name="admin_email" placeholder="admin@campanha.com" style="width: 100%; padding: 0.75rem; border: 1px solid #CBD5E1; border-radius: 6px;">
                </div>
                <div>
                    <label style="display: block; font-weight: 600; margin-bottom: 0.4rem; font-size: 0.85rem;">Senha Inicial</label>
                    <input type="password" name="admin_senha" placeholder="••••••••" style="width: 100%; padding: 0.75rem; border: 1px solid #CBD5E1; border-radius: 6px;">
                </div>
            </div>

            <button type="submit" class="btn-primary-orange" style="width: 100%; justify-content: center; padding: 0.85rem;">
                SALVAR E CONCLUIR SETUP DA OPERAÇÃO
            </button>
        </form>
    </div>
</div>
{% endblock %}