@extends('layouts.admin')

@section('title', 'Intégrations - Admin')

@section('content')
    <header class="mb-12">
        <h1 class="text-4xl sm:text-5xl font-black tracking-tight mb-2 text-slate-900">Intégrations</h1>
        <p class="text-slate-500 text-lg">Configure les clés API et providers.</p>
    </header>

     @if(!empty($migrationRequired))
         <div class="mb-8 p-5 bg-amber-50 border border-amber-100 rounded-2xl text-amber-800 font-medium flex items-center gap-3">
            <i class="fa-solid fa-triangle-exclamation"></i>
            <div>
                <div class="font-black">Migration requise</div>
                <div class="text-sm text-amber-700">Lance <span class="font-black">php artisan migrate</span> pour créer la table <span class="font-black">settings</span>.</div>
            </div>
        </div>
    @endif
 
     @if(session('success'))
         <div class="mb-8 p-5 bg-green-50 border border-green-100 rounded-2xl text-green-700 font-medium flex items-center gap-3">
            <i class="fa-solid fa-circle-check"></i>
            {{ session('success') }}
        </div>
    @endif

     @if($errors->any())
         <div class="mb-8 p-5 bg-red-50 border border-red-100 rounded-2xl text-red-700 font-medium">
            {{ $errors->first() }}
        </div>
    @endif

    <form method="POST" action="{{ route('admin.settings.integrations.store') }}" class="bg-white border border-slate-100 p-8 sm:p-10 rounded-3xl shadow-xl shadow-slate-200 space-y-10">
        @csrf

        <div>
            <div class="text-xs font-black uppercase tracking-widest text-slate-400 mb-4">Paiement (PayPal)</div>
            <div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
                <div>
                    <label class="block text-xs font-black uppercase tracking-widest text-slate-400 mb-2">Client ID</label>
                    <input name="integrations_paypal_client_id" value="{{ old('integrations_paypal_client_id', $settings['integrations_paypal_client_id'] ?? '') }}"
                           class="w-full px-5 py-4 bg-slate-50 border border-slate-100 rounded-2xl text-slate-900 font-medium focus:outline-none focus:ring-2 focus:ring-blue-500" />
                </div>
                <div>
                    <label class="block text-xs font-black uppercase tracking-widest text-slate-400 mb-2">Client Secret</label>
                    <input name="integrations_paypal_client_secret" value="{{ old('integrations_paypal_client_secret', $settings['integrations_paypal_client_secret'] ?? '') }}"
                           class="w-full px-5 py-4 bg-slate-50 border border-slate-100 rounded-2xl text-slate-900 font-medium focus:outline-none focus:ring-2 focus:ring-blue-500" />
                </div>
            </div>

             <div class="grid grid-cols-1 lg:grid-cols-2 gap-8 mt-8">
                 <div>
                    <label class="block text-xs font-black uppercase tracking-widest text-slate-400 mb-2">Mode</label>
                    @php $ppMode = old('integrations_paypal_mode', $settings['integrations_paypal_mode'] ?? 'sandbox'); @endphp
                    <select name="integrations_paypal_mode"
                            class="w-full px-5 py-4 bg-slate-50 border border-slate-100 rounded-2xl text-slate-900 font-medium focus:outline-none focus:ring-2 focus:ring-blue-500">
                        <option value="sandbox" {{ $ppMode === 'sandbox' ? 'selected' : '' }}>Sandbox</option>
                        <option value="live" {{ $ppMode === 'live' ? 'selected' : '' }}>Live</option>
                    </select>
                </div>
                <div>
                    <label class="block text-xs font-black uppercase tracking-widest text-slate-400 mb-2">Devise</label>
                    <input name="integrations_paypal_currency" placeholder="USD" value="{{ old('integrations_paypal_currency', $settings['integrations_paypal_currency'] ?? 'USD') }}"
                           class="w-full px-5 py-4 bg-slate-50 border border-slate-100 rounded-2xl text-slate-900 font-medium focus:outline-none focus:ring-2 focus:ring-blue-500" />
                </div>
            </div>
        </div>

         <div>
            <div class="text-xs font-black uppercase tracking-widest text-slate-400 mb-4">Paiement (Stripe)</div>
            <div class="grid grid-cols-1 lg:grid-cols-2 gap-8">
                <div>
                    <label class="block text-xs font-black uppercase tracking-widest text-slate-400 mb-2">Public key</label>
                    <input name="integrations_stripe_public_key" value="{{ old('integrations_stripe_public_key', $settings['integrations_stripe_public_key'] ?? '') }}"
                           class="w-full px-5 py-4 bg-slate-50 border border-slate-100 rounded-2xl text-slate-900 font-medium focus:outline-none focus:ring-2 focus:ring-blue-500" />
                </div>
                <div>
                    <label class="block text-xs font-black uppercase tracking-widest text-slate-400 mb-2">Secret key</label>
                    <input name="integrations_stripe_secret_key" value="{{ old('integrations_stripe_secret_key', $settings['integrations_stripe_secret_key'] ?? '') }}"
                           class="w-full px-5 py-4 bg-slate-50 border border-slate-100 rounded-2xl text-slate-900 font-medium focus:outline-none focus:ring-2 focus:ring-blue-500" />
                </div>
            </div>
        </div>

         <div>
            <div class="text-xs font-black uppercase tracking-widest text-slate-400 mb-4">Sessions live</div>
            <div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
                <div>
                    <label class="block text-xs font-black uppercase tracking-widest text-slate-400 mb-2">Provider</label>
                    <select name="integrations_live_provider"
                            class="w-full px-5 py-4 bg-slate-50 border border-slate-100 rounded-2xl text-slate-900 font-medium focus:outline-none focus:ring-2 focus:ring-blue-500">
                        @php $provider = old('integrations_live_provider', $settings['integrations_live_provider'] ?? 'zoom'); @endphp
                        <option value="zoom" {{ $provider === 'zoom' ? 'selected' : '' }}>Zoom</option>
                        <option value="jitsi" {{ $provider === 'jitsi' ? 'selected' : '' }}>Jitsi</option>
                    </select>
                </div>
                <div>
                    <label class="block text-xs font-black uppercase tracking-widest text-slate-400 mb-2">Zoom API key</label>
                    <input name="integrations_zoom_api_key" value="{{ old('integrations_zoom_api_key', $settings['integrations_zoom_api_key'] ?? '') }}"
                           class="w-full px-5 py-4 bg-slate-50 border border-slate-100 rounded-2xl text-slate-900 font-medium focus:outline-none focus:ring-2 focus:ring-blue-500" />
                </div>
                <div>
                    <label class="block text-xs font-black uppercase tracking-widest text-slate-400 mb-2">Zoom API secret</label>
                    <input name="integrations_zoom_api_secret" value="{{ old('integrations_zoom_api_secret', $settings['integrations_zoom_api_secret'] ?? '') }}"
                           class="w-full px-5 py-4 bg-slate-50 border border-slate-100 rounded-2xl text-slate-900 font-medium focus:outline-none focus:ring-2 focus:ring-blue-500" />
                </div>
            </div>

             <div class="mt-8">
                <label class="block text-xs font-black uppercase tracking-widest text-slate-400 mb-2">Jitsi domain</label>
                <input name="integrations_jitsi_domain" value="{{ old('integrations_jitsi_domain', $settings['integrations_jitsi_domain'] ?? '') }}" placeholder="meet.jit.si"
                       class="w-full px-5 py-4 bg-slate-50 border border-slate-100 rounded-2xl text-slate-900 font-medium focus:outline-none focus:ring-2 focus:ring-blue-500" />
            </div>
        </div>

         <div class="pt-2">
            <button type="submit" class="w-full py-4 bg-blue-700 hover:bg-blue-800 text-white font-black rounded-2xl transition-all shadow-xl shadow-blue-700/20">
                Enregistrer
            </button>
        </div>
    </form>
@endsection