@extends('layouts.admin')
@section('title', 'Tracking')
@section('content')
<h1 class="text-2xl font-bold mb-2">Tracking Pixels</h1>
<p class="text-sm text-gray-500 mb-6">Meta uses BOTH the browser Pixel and server-side CAPI with a shared event_id for deduplication — see app/Services/FacebookConversionService.php.</p>

<div class="grid md:grid-cols-2 gap-6">
    <form method="POST" action="{{ route('admin.tracking.update', 'meta') }}" class="bg-white rounded-xl shadow-sm p-6 space-y-3">
        @csrf
        <div class="flex justify-between items-center"><h2 class="font-semibold">Meta (Facebook Pixel + CAPI)</h2>
        <label class="flex items-center gap-2 text-sm"><input type="checkbox" name="is_active" value="1" {{ ($settings['meta']->is_active ?? false) ? 'checked' : '' }}> Enabled</label></div>
        <input name="pixel_id" placeholder="Pixel ID" value="{{ $settings['meta']->config['pixel_id'] ?? '' }}" class="w-full border rounded-lg px-3 py-2">
        <input name="capi_token" placeholder="Conversion API Access Token" value="{{ $settings['meta']->config['capi_token'] ?? '' }}" class="w-full border rounded-lg px-3 py-2">
        <input name="test_event_code" placeholder="Test Event Code (optional)" value="{{ $settings['meta']->config['test_event_code'] ?? '' }}" class="w-full border rounded-lg px-3 py-2">
        <input name="currency" placeholder="Currency (e.g. BDT)" value="{{ $settings['meta']->config['currency'] ?? 'BDT' }}" class="w-full border rounded-lg px-3 py-2">
        <button class="bg-brand text-white px-5 py-2 rounded-lg text-sm font-semibold">Save</button>
    </form>

    <form method="POST" action="{{ route('admin.tracking.update', 'ga4') }}" class="bg-white rounded-xl shadow-sm p-6 space-y-3">
        @csrf
        <div class="flex justify-between items-center"><h2 class="font-semibold">Google Analytics 4</h2>
        <label class="flex items-center gap-2 text-sm"><input type="checkbox" name="is_active" value="1" {{ ($settings['ga4']->is_active ?? false) ? 'checked' : '' }}> Enabled</label></div>
        <input name="measurement_id" placeholder="Measurement ID (G-XXXX)" value="{{ $settings['ga4']->config['measurement_id'] ?? '' }}" class="w-full border rounded-lg px-3 py-2">
        <button class="bg-brand text-white px-5 py-2 rounded-lg text-sm font-semibold">Save</button>
    </form>

    <form method="POST" action="{{ route('admin.tracking.update', 'google_ads') }}" class="bg-white rounded-xl shadow-sm p-6 space-y-3">
        @csrf
        <div class="flex justify-between items-center"><h2 class="font-semibold">Google Ads</h2>
        <label class="flex items-center gap-2 text-sm"><input type="checkbox" name="is_active" value="1" {{ ($settings['google_ads']->is_active ?? false) ? 'checked' : '' }}> Enabled</label></div>
        <input name="conversion_id" placeholder="Conversion ID" value="{{ $settings['google_ads']->config['conversion_id'] ?? '' }}" class="w-full border rounded-lg px-3 py-2">
        <button class="bg-brand text-white px-5 py-2 rounded-lg text-sm font-semibold">Save</button>
    </form>

    <form method="POST" action="{{ route('admin.tracking.update', 'gtm') }}" class="bg-white rounded-xl shadow-sm p-6 space-y-3">
        @csrf
        <div class="flex justify-between items-center"><h2 class="font-semibold">Google Tag Manager</h2>
        <label class="flex items-center gap-2 text-sm"><input type="checkbox" name="is_active" value="1" {{ ($settings['gtm']->is_active ?? false) ? 'checked' : '' }}> Enabled</label></div>
        <input name="gtm_id" placeholder="GTM-XXXX" value="{{ $settings['gtm']->config['gtm_id'] ?? '' }}" class="w-full border rounded-lg px-3 py-2">
        <button class="bg-brand text-white px-5 py-2 rounded-lg text-sm font-semibold">Save</button>
    </form>

    <form method="POST" action="{{ route('admin.tracking.update', 'tiktok') }}" class="bg-white rounded-xl shadow-sm p-6 space-y-3">
        @csrf
        <div class="flex justify-between items-center"><h2 class="font-semibold">TikTok Pixel</h2>
        <label class="flex items-center gap-2 text-sm"><input type="checkbox" name="is_active" value="1" {{ ($settings['tiktok']->is_active ?? false) ? 'checked' : '' }}> Enabled</label></div>
        <input name="pixel_id" placeholder="TikTok Pixel ID" value="{{ $settings['tiktok']->config['pixel_id'] ?? '' }}" class="w-full border rounded-lg px-3 py-2">
        <button class="bg-brand text-white px-5 py-2 rounded-lg text-sm font-semibold">Save</button>
    </form>

    <form method="POST" action="{{ route('admin.tracking.update', 'custom') }}" class="bg-white rounded-xl shadow-sm p-6 space-y-3">
        @csrf
        <div class="flex justify-between items-center"><h2 class="font-semibold">Custom Script</h2>
        <label class="flex items-center gap-2 text-sm"><input type="checkbox" name="is_active" value="1" {{ ($settings['custom']->is_active ?? false) ? 'checked' : '' }}> Enabled</label></div>
        <textarea name="script" rows="4" placeholder="<script>...</script>" class="w-full border rounded-lg px-3 py-2 font-mono text-xs">{{ $settings['custom']->config['script'] ?? '' }}</textarea>
        <button class="bg-brand text-white px-5 py-2 rounded-lg text-sm font-semibold">Save</button>
    </form>
</div>
@endsection