@extends('layouts.app')

@section('content')
<div class="modern-page-container">

    {{-- Header --}}
    <div class="page-header">
        <div class="page-header-content">
            <div class="page-title-section">
                <h1 class="page-title"><i class="bi bi-sliders me-2"></i>Configuração da Conta</h1>
                <p class="page-subtitle">Configure suas credenciais e preferências de publicação</p>
            </div>
            @if($user->plan)
                <span class="badge bg-primary fs-6 px-3 py-2">
                    <i class="bi bi-award me-1"></i>Plano: {{ $user->plan->name }}
                </span>
            @else
                <span class="badge bg-warning text-dark fs-6 px-3 py-2">
                    <i class="bi bi-exclamation-triangle me-1"></i>Sem plano atribuído
                </span>
            @endif
        </div>
    </div>

    @if(session('success'))
        <div class="alert alert-success alert-dismissible fade show mb-4">
            <i class="bi bi-check-circle me-2"></i>{{ session('success') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    @endif
    @if(session('info'))
        <div class="alert alert-info alert-dismissible fade show mb-4">
            <i class="bi bi-info-circle me-2"></i>{{ session('info') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    @endif
    @if(session('error'))
        <div class="alert alert-danger alert-dismissible fade show mb-4">
            <i class="bi bi-exclamation-circle me-2"></i>{{ session('error') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    @endif

    @if(isset($webmasterUsers) && $webmasterUsers->isNotEmpty())
        @include('admin.partials.webmaster-user-filter', [
            'webmasterUsers' => $webmasterUsers,
            'filteredUser'   => $filteredUser ?? null,
        ])
    @endif

    @php
        $setupHiddenUserId = (auth()->user()->isWebmasterOrAdmin() && $user->id !== auth()->id()) ? $user->id : null;
    @endphp

    {{-- SECAO 1 - PIPELINE: Monitoramento e Publicacao --}}
    <div class="form-card mb-4">
        <div class="form-section">
            <div class="section-header">
                <h3 class="section-title">
                    <i class="bi bi-activity me-2 text-primary"></i>Pipeline de Publicação
                </h3>
                <p class="section-description">
                    Controla as duas etapas do pipeline: leitura dos grupos e envio das ofertas
                </p>
            </div>

            @include('admin.setup.partials.pipeline-health', [
                'pipelineHealth' => $pipelineHealth,
                'user' => $user,
                'telegramConfig' => $telegramConfig,
            ])

            <div class="row g-3">
                {{-- Monitoramento --}}
                <div class="col-md-6">
                    <div class="p-3 rounded-3 border h-100" style="background:var(--background-secondary)">
                        <div class="d-flex justify-content-between align-items-start mb-2">
                            <div>
                                <p class="fw-semibold mb-0">
                                    <i class="bi bi-broadcast me-1 text-primary"></i>Monitoramento
                                </p>
                                <small class="text-muted">
                                    Leitura dos grupos Telegram, captura e processamento de URLs
                                </small>
                            </div>
                            @if($user->monitoring_active ?? true)
                                <span class="badge bg-success">Ativo</span>
                            @else
                                <span class="badge bg-secondary">Pausado</span>
                            @endif
                        </div>
                        <form action="{{ route('admin.setup.toggleMonitoring') }}" method="POST" class="mt-3">
                            @csrf
                            @if($setupHiddenUserId)<input type="hidden" name="user_id" value="{{ $setupHiddenUserId }}">@endif
                            <button type="submit"
                                    class="btn btn-sm w-100 {{ ($user->monitoring_active ?? true) ? 'btn-outline-warning' : 'btn-outline-success' }}">
                                <i class="bi bi-{{ ($user->monitoring_active ?? true) ? 'pause-circle' : 'play-circle' }} me-1"></i>
                                {{ ($user->monitoring_active ?? true) ? 'Pausar monitoramento' : 'Ativar monitoramento' }}
                            </button>
                        </form>
                    </div>
                </div>

                {{-- Publicação automática --}}
                <div class="col-md-6">
                    <div class="p-3 rounded-3 border h-100" style="background:var(--background-secondary)">
                        <div class="d-flex justify-content-between align-items-start mb-2">
                            <div>
                                <p class="fw-semibold mb-0">
                                    <i class="bi bi-send me-1 text-success"></i>Publicação Automática
                                </p>
                                <small class="text-muted">
                                    Envio automático das ofertas prontas para os destinos configurados
                                </small>
                            </div>
                            @if($telegramConfig->auto_publish ?? true)
                                <span class="badge bg-success">Ativa</span>
                            @else
                                <span class="badge bg-secondary">Pausada</span>
                            @endif
                        </div>
                        <form action="{{ route('admin.setup.saveTelegram') }}" method="POST" class="mt-3">
                            @csrf
                            {{-- Mantém os valores atuais, só troca o auto_publish --}}
                            <input type="hidden" name="api_id"             value="{{ $telegramConfig->api_id }}">
                            <input type="hidden" name="api_hash"           value="{{ $telegramConfig->api_hash }}">
                            <input type="hidden" name="phone"              value="{{ $telegramConfig->phone }}">
                            <input type="hidden" name="publish_with_image" value="{{ $telegramConfig->publish_with_image ? '1' : '0' }}">
                            <input type="hidden" name="auto_publish"       value="{{ ($telegramConfig->auto_publish ?? true) ? '0' : '1' }}">
                            <button type="submit"
                                    class="btn btn-sm w-100 {{ ($telegramConfig->auto_publish ?? true) ? 'btn-outline-warning' : 'btn-outline-success' }}"
                                    @unless($telegramConfig->isConfigured()) disabled title="Configure o Telegram primeiro" @endunless>
                                <i class="bi bi-{{ ($telegramConfig->auto_publish ?? true) ? 'pause-circle' : 'play-circle' }} me-1"></i>
                                {{ ($telegramConfig->auto_publish ?? true) ? 'Pausar publicação' : 'Ativar publicação' }}
                            </button>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>

    {{-- SECAO 2 - TELEGRAM --}}
    <div class="form-card mb-4">
        <div class="form-section">
            <div class="section-header">
                <h3 class="section-title">
                    <i class="bi bi-telegram me-2" style="color:#2AABEE"></i>Telegram
                </h3>
                <p class="section-description">
                    Credenciais da API e preferências de publicação via Telegram
                </p>
            </div>

            @include('admin.setup.partials.telegram-auth', [
                'telegramConfig' => $telegramConfig,
                'user' => $user,
                'tgStep' => $tgStep ?? null,
            ])

            <form action="{{ route('admin.setup.saveTelegram') }}" method="POST">
                @csrf
                @if($setupHiddenUserId)<input type="hidden" name="user_id" value="{{ $setupHiddenUserId }}">@endif

                <div class="row g-3">
                    <div class="col-sm-6 col-md-3">
                        <label class="field-label">API ID <span class="text-danger">*</span></label>
                        <input type="number" name="api_id"
                               class="form-input @error('api_id') is-invalid @enderror"
                               value="{{ old('api_id', $telegramConfig->api_id) }}"
                               placeholder="12345678" required>
                        @error('api_id')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>
                    <div class="col-sm-6 col-md-5">
                        <label class="field-label">API Hash <span class="text-danger">*</span></label>
                        <input type="text" name="api_hash"
                               class="form-input @error('api_hash') is-invalid @enderror"
                               value="{{ old('api_hash', $telegramConfig->api_hash) }}"
                               placeholder="abcdef1234567890..." required>
                        @error('api_hash')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>
                    <div class="col-sm-6 col-md-4">
                        <label class="field-label">Número de telefone <span class="text-danger">*</span></label>
                        <input type="text" name="phone"
                               class="form-input @error('phone') is-invalid @enderror"
                               value="{{ old('phone', $telegramConfig->phone) }}"
                               placeholder="+5511999999999" required>
                        @error('phone')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        <small class="text-muted">Formato internacional +55DDD...</small>
                    </div>
                </div>

                <hr class="my-4">
                <p class="fw-semibold small text-uppercase text-muted mb-3" style="letter-spacing:.05em">Preferências de publicação</p>
                <div class="row g-3">
                    <div class="col-sm-6">
                        <div class="form-check form-switch">
                            <input class="form-check-input" type="checkbox" name="auto_publish"
                                   id="auto_publish" value="1"
                                   {{ old('auto_publish', $telegramConfig->auto_publish ?? true) ? 'checked' : '' }}>
                            <label class="form-check-label" for="auto_publish">
                                <span class="fw-semibold">Publicação automática</span>
                                <span class="text-muted d-block small">O agendador publica as ofertas automaticamente</span>
                            </label>
                        </div>
                    </div>
                    <div class="col-sm-6">
                        <div class="form-check form-switch">
                            <input class="form-check-input" type="checkbox" name="publish_with_image"
                                   id="publish_with_image" value="1"
                                   {{ old('publish_with_image', $telegramConfig->publish_with_image ?? true) ? 'checked' : '' }}>
                            <label class="form-check-label" for="publish_with_image">
                                <span class="fw-semibold">Publicar com imagem</span>
                                <span class="text-muted d-block small">Envia a foto do produto junto com o texto</span>
                            </label>
                        </div>
                    </div>
                </div>

                <div class="mt-4">
                    <button type="submit" class="btn-modern btn-primary">
                        <i class="bi bi-save"></i><span>Salvar Telegram</span>
                    </button>
                </div>
            </form>
        </div>
    </div>

    {{-- SECAO 3 - MERCADO LIVRE --}}
    <div class="form-card mb-4">
        <div class="form-section">
            <div class="section-header">
                <h3 class="section-title">
                    <i class="bi bi-shop me-2" style="color:#FFE600;-webkit-text-stroke:1px #999"></i>
                    <span>Mercado Livre</span>
                </h3>
                <p class="section-description">
                    Tag de afiliado e cookie de sessão para geração de links curtos meli.la
                </p>
            </div>

            <form action="{{ route('admin.setup.saveAffiliate') }}" method="POST">
                @csrf
                <input type="hidden" name="amazon_affiliate_tag" value="{{ $user->amazon_affiliate_tag }}">

                <div class="row g-3">
                    <div class="col-sm-6">
                        <label class="field-label">Tag de Afiliado</label>
                        <input type="text" name="ml_affiliate_tag"
                               class="form-input @error('ml_affiliate_tag') is-invalid @enderror"
                               value="{{ old('ml_affiliate_tag', $user->ml_affiliate_tag) }}"
                               placeholder="Ex: suatag-20">
                        @error('ml_affiliate_tag')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>
                    <div class="col-sm-6 d-flex align-items-end">
                        <div class="p-2 rounded border w-100 text-center" style="background:var(--background-secondary)">
                            @if($user->ml_cookie)
                                <i class="bi bi-check-circle text-success me-1"></i>
                                <span class="small fw-semibold text-success">Cookie configurado</span>
                            @else
                                <i class="bi bi-x-circle text-danger me-1"></i>
                                <span class="small fw-semibold text-danger">Cookie não configurado</span>
                            @endif
                        </div>
                    </div>

                    <div class="col-12">
                        <label class="field-label">Cookie de Sessão ML</label>
                        <textarea name="ml_cookie" rows="3"
                                  class="form-control font-monospace small @error('ml_cookie') is-invalid @enderror"
                                  placeholder="Cole aqui o valor do header Cookie copiado do DevTools (F12 -> Network -> qualquer req ML -> Request Headers -> Cookie)">{{ old('ml_cookie') }}</textarea>
                        @error('ml_cookie')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        <small class="text-muted">
                            Necessário para gerar links <code>meli.la/...</code>. Expira em 30-90 dias.
                            @if($user->ml_cookie) Deixe em branco para manter o cookie atual. @endif
                        </small>
                    </div>
                </div>

                <div class="mt-4">
                    <button type="submit" class="btn-modern btn-primary">
                        <i class="bi bi-save"></i><span>Salvar Mercado Livre</span>
                    </button>
                </div>
            </form>
        </div>
    </div>

    {{-- SECAO 4 - AMAZON --}}
    <div class="form-card mb-4">
        <div class="form-section">
            <div class="section-header">
                <h3 class="section-title">
                    <i class="bi bi-cart4 me-2" style="color:#FF9900"></i>Amazon
                </h3>
                <p class="section-description">
                    Tag de afiliado Amazon Associates para rastreamento de comissões
                </p>
            </div>

            <form action="{{ route('admin.setup.saveAffiliate') }}" method="POST">
                @csrf
                <input type="hidden" name="ml_affiliate_tag" value="{{ $user->ml_affiliate_tag }}">
                {{-- Não sobrescreve ml_cookie ao salvar só a Amazon --}}
                <input type="hidden" name="ml_cookie" value="">

                <div class="row g-3">
                    <div class="col-sm-6">
                        <label class="field-label">Tag de Afiliado</label>
                        <input type="text" name="amazon_affiliate_tag"
                               class="form-input @error('amazon_affiliate_tag') is-invalid @enderror"
                               value="{{ old('amazon_affiliate_tag', $user->amazon_affiliate_tag) }}"
                               placeholder="Ex: suatag-20">
                        @error('amazon_affiliate_tag')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>
                </div>

                <div class="mt-4">
                    <button type="submit" class="btn-modern btn-primary">
                        <i class="bi bi-save"></i><span>Salvar Amazon</span>
                    </button>
                </div>
            </form>
        </div>
    </div>

    {{-- SECAO 5 - LINKS DE CUPOM --}}
    <div class="form-card mb-4">
        <div class="form-section">
            <div class="section-header">
                <h3 class="section-title">
                    <i class="bi bi-ticket-perforated me-2 text-warning"></i>Links de Cupom
                </h3>
                <p class="section-description">
                    Link da home com seu tag de afiliado — aparece como <strong>"Resgate aqui:"</strong> nos cupons que você publicar
                </p>
            </div>

            <form action="{{ route('admin.setup.saveAffiliate') }}" method="POST">
                @csrf
                @if($setupHiddenUserId)<input type="hidden" name="user_id" value="{{ $setupHiddenUserId }}">@endif

                <div class="row g-3">
                    <div class="col-12">
                        <label class="field-label">
                            <i class="bi bi-cart4 me-1" style="color:#FF9900"></i>Link Amazon
                        </label>
                        <input type="url" name="coupon_link_amazon"
                               class="form-input @error('coupon_link_amazon') is-invalid @enderror"
                               value="{{ old('coupon_link_amazon', $user->coupon_link_amazon) }}"
                               placeholder="https://amzn.to/...">
                        @error('coupon_link_amazon')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        <small class="text-muted">Link curto da home Amazon com seu tag de rastreamento</small>
                    </div>
                    <div class="col-12">
                        <label class="field-label">
                            <i class="bi bi-shop me-1" style="color:#FFE600;-webkit-text-stroke:1px #999"></i>Link Mercado Livre
                        </label>
                        <input type="url" name="coupon_link_mercadolivre"
                               class="form-input @error('coupon_link_mercadolivre') is-invalid @enderror"
                               value="{{ old('coupon_link_mercadolivre', $user->coupon_link_mercadolivre) }}"
                               placeholder="https://mercado.link/...">
                        @error('coupon_link_mercadolivre')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        <small class="text-muted">Link da home Mercado Livre com sua tag de afiliado</small>
                    </div>
                    <div class="col-12">
                        <label class="field-label">
                            <i class="bi bi-bag me-1 text-danger"></i>Link Shopee
                        </label>
                        <input type="url" name="coupon_link_shopee"
                               class="form-input @error('coupon_link_shopee') is-invalid @enderror"
                               value="{{ old('coupon_link_shopee', $user->coupon_link_shopee) }}"
                               placeholder="https://s.shopee.com.br/...">
                        @error('coupon_link_shopee')<div class="invalid-feedback">{{ $message }}</div>@enderror
                        <small class="text-muted">Link da home Shopee com seu ID de afiliado</small>
                    </div>
                </div>

                <div class="mt-4">
                    <button type="submit" class="btn-modern btn-primary">
                        <i class="bi bi-save"></i><span>Salvar Links de Cupom</span>
                    </button>
                </div>
            </form>
        </div>
    </div>

    {{-- SECAO 6 - WHATSAPP (apenas se plano permite) --}}
    @if($planAllowsWa || auth()->user()->isWebmasterOrAdmin())
    <div class="form-card mb-4">
        <div class="form-section">
            <div class="section-header">
                <h3 class="section-title">
                    <i class="bi bi-whatsapp me-2 text-success"></i>WhatsApp
                    @if($whatsappConfig->isConfigured())
                        <span class="badge bg-success ms-2 fs-6">
                            {{ $whatsappConfig->isUazapi() ? 'UazAPI' : 'Whapi' }}
                        </span>
                    @else
                        <span class="badge bg-secondary ms-2 fs-6">Não configurado</span>
                    @endif
                </h3>
                <p class="section-description">
                    Whapi ou UazAPI - escolha o provedor e teste a conexão
                </p>
            </div>

            @include('admin.setup.partials.whatsapp-config', [
                'whatsappConfig' => $whatsappConfig,
                'setupHiddenUserId' => $setupHiddenUserId ?? null,
            ])
        </div>
    </div>
    @endif

</div>
@endsection

@push('scripts')
<script>
(function () {
    const form = document.getElementById('whatsappSetupForm');
    const panelWhapi = document.getElementById('waPanelWhapi');
    const panelUazapi = document.getElementById('waPanelUazapi');

    function waProvider() {
        return form?.querySelector('input[name="provider"]:checked')?.value || 'whapi';
    }

    function toggleWaPanels() {
        const p = waProvider();
        panelWhapi?.classList.toggle('d-none', p !== 'whapi');
        panelUazapi?.classList.toggle('d-none', p !== 'uazapi');
    }

    form?.querySelectorAll('input[name="provider"]').forEach(r => {
        r.addEventListener('change', toggleWaPanels);
    });
    toggleWaPanels();

    document.getElementById('testWaBtn')?.addEventListener('click', function () {
        const btn = this;
        btn.disabled = true;
        btn.innerHTML = '<span class="spinner-border spinner-border-sm me-1"></span>Testando...';

        const params = new URLSearchParams(window.location.search);
        const url = '{{ route("admin.setup.testWhatsapp") }}' + (params.toString() ? '?' + params.toString() : '');

        fetch(url, { headers: { 'X-Requested-With': 'XMLHttpRequest' } })
            .then(r => r.json())
            .then(d => alert(d.success ? 'OK: ' + d.message : 'Erro: ' + d.message))
            .catch(() => alert('Erro ao testar conexão.'))
            .finally(() => {
                btn.disabled = false;
                btn.innerHTML = '<i class="bi bi-wifi"></i><span>Testar Conexão</span>';
            });
    });
})();
</script>
@endpush