@extends('layouts.admin-modern')

@section('title', 'Paramètres de paiement')
@section('page-title', 'Paramètres de paiement')

@section('content')
<div class="page-header">
    <h1 class="page-title">💳 Paramètres de paiement</h1>
    <p class="page-subtitle">Configurez les options de paiement</p>
</div>

@if(session('success'))
    <div class="mb-6 bg-green-50 border border-green-200 text-green-700 px-4 py-3 rounded-lg">
        <i class="fas fa-check-circle mr-2"></i>{{ session('success') }}
    </div>
@endif

<div class="card-base">
    <form action="{{ route('admin.settings.payments.update') }}" method="POST">
        @csrf
        @method('PUT')

        <div class="space-y-8">
            <!-- Général -->
            <div>
                <h3 class="font-semibold text-gray-900 mb-4">Paramètres généraux</h3>
                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Devise</label>
                        <select name="currency" class="w-full px-3 py-2 border border-gray-300 rounded-lg">
                            <option value="EUR" {{ ($paymentSettings['currency'] ?? 'EUR') == 'EUR' ? 'selected' : '' }}>EUR (€)</option>
                            <option value="USD" {{ ($paymentSettings['currency'] ?? '') == 'USD' ? 'selected' : '' }}>USD ($)</option>
                            <option value="MAD" {{ ($paymentSettings['currency'] ?? '') == 'MAD' ? 'selected' : '' }}>MAD (DH)</option>
                        </select>
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Retrait minimum (€)</label>
                        <input type="number" name="min_withdrawal" step="0.01" 
                            value="{{ $paymentSettings['min_withdrawal'] ?? 50 }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg">
                    </div>
                </div>
            </div>

            <!-- Stripe -->
            <div class="p-4 bg-purple-50 rounded-lg border border-purple-200">
                <div class="flex items-center justify-between mb-4">
                    <h3 class="font-semibold text-gray-900 flex items-center">
                        <i class="fab fa-stripe text-purple-600 mr-2 text-xl"></i> Stripe
                    </h3>
                    <label class="relative inline-flex items-center cursor-pointer">
                        <input type="checkbox" name="stripe_enabled" value="1" 
                            {{ ($paymentSettings['stripe_enabled'] ?? false) ? 'checked' : '' }}
                            class="sr-only peer">
                        <div class="w-11 h-6 bg-gray-200 rounded-full peer peer-checked:bg-purple-600 peer-checked:after:translate-x-full after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:rounded-full after:h-5 after:w-5 after:transition-all"></div>
                    </label>
                </div>
                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Clé publique</label>
                        <input type="text" name="stripe_key" value="{{ $paymentSettings['stripe_key'] ?? '' }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg" placeholder="pk_...">
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Clé secrète</label>
                        <input type="password" name="stripe_secret" placeholder="sk_..."
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg">
                    </div>
                </div>
            </div>

            <!-- PayPal -->
            <div class="p-4 bg-blue-50 rounded-lg border border-blue-200">
                <div class="flex items-center justify-between mb-4">
                    <h3 class="font-semibold text-gray-900 flex items-center">
                        <i class="fab fa-paypal text-blue-600 mr-2 text-xl"></i> PayPal
                    </h3>
                    <label class="relative inline-flex items-center cursor-pointer">
                        <input type="checkbox" name="paypal_enabled" value="1"
                            {{ ($paymentSettings['paypal_enabled'] ?? false) ? 'checked' : '' }}
                            class="sr-only peer">
                        <div class="w-11 h-6 bg-gray-200 rounded-full peer peer-checked:bg-blue-600 peer-checked:after:translate-x-full after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:rounded-full after:h-5 after:w-5 after:transition-all"></div>
                    </label>
                </div>
                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Client ID</label>
                        <input type="text" name="paypal_client_id" value="{{ $paymentSettings['paypal_client_id'] ?? '' }}"
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg">
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">Secret</label>
                        <input type="password" name="paypal_secret" placeholder="..."
                            class="w-full px-3 py-2 border border-gray-300 rounded-lg">
                    </div>
                </div>
            </div>

            <!-- Virement -->
            <div class="p-4 bg-green-50 rounded-lg border border-green-200">
                <div class="flex items-center justify-between">
                    <h3 class="font-semibold text-gray-900 flex items-center">
                        <i class="fas fa-university text-green-600 mr-2"></i> Virement bancaire
                    </h3>
                    <label class="relative inline-flex items-center cursor-pointer">
                        <input type="checkbox" name="bank_transfer_enabled" value="1"
                            {{ ($paymentSettings['bank_transfer_enabled'] ?? true) ? 'checked' : '' }}
                            class="sr-only peer">
                        <div class="w-11 h-6 bg-gray-200 rounded-full peer peer-checked:bg-green-600 peer-checked:after:translate-x-full after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:rounded-full after:h-5 after:w-5 after:transition-all"></div>
                    </label>
                </div>
            </div>
        </div>

        <div class="mt-6 flex justify-end">
            <button type="submit" class="px-6 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition">
                <i class="fas fa-save mr-2"></i> Enregistrer
            </button>
        </div>
    </form>
</div>
@endsection