@extends('layouts.app')

@section('title', 'Editar perfil da arena — '.config('app.name'))

@section('content')
    {{--
        PADRÃO DE FORMULÁRIO. Os demais formulários devem seguir:

          page-head  →  um card por assunto (com <h2> no lugar de card-header)
                     →  barra de ações no fim, alinhada à esquerda

        Um card por assunto, e não um formulário gigante: agrupar por tema dá
        ao usuário onde descansar a vista e permite mexer numa parte sem
        reler o resto.
    --}}
    {{-- ESTA TELA SERVE A DOIS DONOS: o próprio da arena, em /perfil, e o
         operador da plataforma, editando qualquer arena pelo back-office.

         Por isso as URLs e os títulos entram por parâmetro, com o painel do
         cliente como padrão — quem já usava a tela não precisou mudar nada.
         Duplicar o formulário era a alternativa, e ele tem quase 200 linhas de
         campos: a segunda cópia divergiria no primeiro campo novo. --}}
    @php
        $action ??= route('organization.update');
        $backUrl ??= route('organization.show');
        $heading ??= 'Editar perfil da arena';
        $subheading ??= 'Dados que seus clientes enxergam.';

        // Campos que só a plataforma decide. Falso por padrão: o painel do
        // cliente nunca os renderiza, e o FormRequest tampouco os valida ali.
        $platformFields ??= false;
    @endphp

    <div class="page-head">
        <div>
            <h1 class="page-head__title">{{ $heading }}</h1>
            <p class="page-head__subtitle">{{ $subheading }}</p>
        </div>

        <a href="{{ $backUrl }}" class="btn btn-outline-secondary">
            <i class="bi bi-arrow-left me-1"></i> Voltar
        </a>
    </div>

    @include('partials.status')

    {{-- `enctype` é obrigatório: sem ele o navegador envia apenas os nomes dos
         arquivos, e logo e capa chegariam vazias sem erro nenhum. --}}
    <form method="POST" action="{{ $action }}" enctype="multipart/form-data">
        @csrf
        @method('PUT')

        <div class="card mb-4">
            <div class="card-body">
                <h2 class="h6 fw-semibold mb-3">Identidade visual</h2>

                <div class="row g-3">
                    <div class="col-md-6">
                        <label for="logo" class="form-label">Logo</label>
                        <input id="logo" type="file" name="logo" accept="image/jpeg,image/png,image/webp"
                               class="form-control @error('logo') is-invalid @enderror">
                        <div class="form-text">JPEG, PNG ou WebP, até 2 MB. Substitui a atual.</div>
                        @error('logo')<div class="invalid-feedback">{{ $message }}</div>@enderror

                        @if ($organization->getFirstMedia(App\Models\Organization::LOGO))
                            <img src="{{ $organization->getFirstMediaUrl(App\Models\Organization::LOGO) }}"
                                 alt="Logo atual" class="img-thumbnail mt-2" style="max-height: 6rem">
                        @endif
                    </div>

                    <div class="col-md-6">
                        <label for="cover" class="form-label">Imagem de capa</label>
                        <input id="cover" type="file" name="cover" accept="image/jpeg,image/png,image/webp"
                               class="form-control @error('cover') is-invalid @enderror">
                        <div class="form-text">JPEG, PNG ou WebP, até 5 MB. Substitui a atual.</div>
                        @error('cover')<div class="invalid-feedback">{{ $message }}</div>@enderror

                        @if ($organization->getFirstMedia(App\Models\Organization::COVER))
                            <img src="{{ $organization->getFirstMediaUrl(App\Models\Organization::COVER) }}"
                                 alt="Capa atual" class="img-thumbnail mt-2" style="max-height: 6rem">
                        @endif
                    </div>
                </div>
            </div>
        </div>

        <div class="card mb-4">
            <div class="card-body">
                <h2 class="h6 fw-semibold mb-3">Dados da arena</h2>

                <div class="row g-3">
                    <div class="col-md-7">
                        <label for="name" class="form-label">Nome da arena</label>
                        <input id="name" type="text" name="name" required
                               value="{{ old('name', $organization->name) }}"
                               class="form-control @error('name') is-invalid @enderror">
                        @error('name')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>

                    <div class="col-md-5">
                        <label for="document" class="form-label">CPF/CNPJ</label>
                        <input id="document" type="text" name="document" required
                               value="{{ old('document', $organization->formattedDocument()) }}"
                               data-mask="document"
                               class="form-control @error('document') is-invalid @enderror">
                        @error('document')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>

                    <div class="col-md-7">
                        <label for="email" class="form-label">E-mail comercial</label>
                        <input id="email" type="email" name="email"
                               value="{{ old('email', $organization->email) }}"
                               class="form-control @error('email') is-invalid @enderror">
                        <div class="form-text">Usado no contato com clientes. Não é o e-mail de acesso ao sistema.</div>
                        @error('email')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>

                    <div class="col-12">
                        <label for="description" class="form-label">Apresentação</label>
                        <textarea id="description" name="description" rows="4" maxlength="2000"
                                  class="form-control @error('description') is-invalid @enderror"
                        >{{ old('description', $organization->description) }}</textarea>
                        @error('description')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>
                </div>
            </div>
        </div>

        <div class="card mb-4">
            <div class="card-body">
                <h2 class="h6 fw-semibold mb-3">Endereço</h2>

                <p class="text-body-secondary small">
                    Opcional — mas se começar a preencher, informe ao menos CEP, logradouro,
                    bairro, cidade e UF. Endereço pela metade não localiza ninguém.
                </p>

                <div class="row g-3">
                    <div class="col-md-3">
                        <label for="zip_code" class="form-label">CEP</label>
                        <input id="zip_code" type="text" name="zip_code" inputmode="numeric"
                               value="{{ old('zip_code', $organization->formattedZipCode()) }}"
                               data-mask="zip"
                               {{-- A URL vem do servidor, com um marcador no
                                    lugar do CEP: assim o JavaScript não precisa
                                    montar caminho nenhum e a rota pode ser
                                    renomeada sem tocar no front-end. --}}
                               data-lookup-url="{{ route('organization.cep', ['cep' => '__cep__']) }}"
                               class="form-control @error('zip_code') is-invalid @enderror">
                        <div class="form-text">Preenche o endereço automaticamente.</div>
                        @error('zip_code')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>

                    <div class="col-md-7">
                        <label for="street" class="form-label">Logradouro</label>
                        <input id="street" type="text" name="street"
                               value="{{ old('street', $organization->street) }}"
                               class="form-control @error('street') is-invalid @enderror">
                        @error('street')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>

                    <div class="col-md-2">
                        <label for="number" class="form-label">Número</label>
                        <input id="number" type="text" name="number"
                               value="{{ old('number', $organization->number) }}"
                               class="form-control @error('number') is-invalid @enderror">
                        @error('number')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>

                    <div class="col-md-5">
                        <label for="complement" class="form-label">Complemento</label>
                        <input id="complement" type="text" name="complement"
                               value="{{ old('complement', $organization->complement) }}"
                               class="form-control @error('complement') is-invalid @enderror">
                        @error('complement')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>

                    <div class="col-md-7">
                        <label for="district" class="form-label">Bairro</label>
                        <input id="district" type="text" name="district"
                               value="{{ old('district', $organization->district) }}"
                               class="form-control @error('district') is-invalid @enderror">
                        @error('district')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>

                    <div class="col-md-9">
                        <label for="city" class="form-label">Cidade</label>
                        <input id="city" type="text" name="city"
                               value="{{ old('city', $organization->city) }}"
                               class="form-control @error('city') is-invalid @enderror">
                        @error('city')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>

                    <div class="col-md-3">
                        <label for="state" class="form-label">UF</label>
                        <select id="state" name="state" class="form-select @error('state') is-invalid @enderror">
                            <option value="">—</option>
                            @foreach ($states as $uf)
                                <option value="{{ $uf }}" @selected(old('state', $organization->state) === $uf)>{{ $uf }}</option>
                            @endforeach
                        </select>
                        @error('state')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>
                </div>
            </div>
        </div>

        @include('organization._phones')

        {{-- CARD SÓ DO BACK-OFFICE. Não é "campo avançado" escondido do dono da
             arena por estética: expiração é decisão comercial da plataforma,
             como `active` e `slug`. Deixá-la no formulário de perfil permitiria
             que a arena adiasse o próprio vencimento.

             Esconder no Blade é só a camada visível. Quem de fato barra são o
             UpdateOrganizationProfileRequest, que só valida `expires_at` quando
             a rota traz {organization}, e a gravação, que acontece fora da
             UpdateOrganizationProfile::FIELDS. --}}
        @if ($platformFields)
            <div class="card mb-4 border-warning-subtle">
                <div class="card-body">
                    <h2 class="h6 fw-semibold mb-1">Plataforma</h2>
                    <p class="text-body-secondary small mb-3">
                        Visível apenas no back-office. O administrador da arena não vê nem edita estes campos.
                    </p>

                    <div class="row g-3">
                        <div class="col-md-4">
                            <label for="expires_at" class="form-label">Data de expiração</label>
                            <input type="date" id="expires_at" name="expires_at"
                                   value="{{ old('expires_at', $organization->expires_at?->format('Y-m-d')) }}"
                                   class="form-control @error('expires_at') is-invalid @enderror" required>
                            @error('expires_at')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                            <div class="form-text">
                                Ainda não bloqueia o acesso — será usada quando o modelo de vendas for definido.
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        @endif

        <div class="d-flex gap-2">
            <button type="submit" class="btn btn-primary">Salvar alterações</button>
            <a href="{{ $backUrl }}" class="btn btn-outline-secondary">Cancelar</a>
        </div>
    </form>
@endsection