@extends('layouts.app')

@section('title', 'Payment Gateway Settings')

@section('content')
    <h1 class="text-2xl md:text-3xl font-semibold text-gray-800 dark:text-white mb-6">
        Payment Gateway Settings
    </h1>

    {{-- Security Warning Box --}}
    <div class="mb-6 p-4 rounded-md bg-yellow-50 dark:bg-yellow-900/50 border border-yellow-300 dark:border-yellow-700">
        <div class="flex">
            <div class="flex-shrink-0"><svg class="h-5 w-5 text-yellow-400 dark:text-yellow-300"
                    xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
                    <path fill-rule="evenodd"
                        d="M8.485 3.495c.673-1.167 2.357-1.167 3.03 0l6.28 10.875c.673 1.167-.17 2.625-1.516 2.625H3.72c-1.347 0-2.189-1.458-1.515-2.625L8.485 3.495zM10 6a.75.75 0 01.75.75v3.5a.75.75 0 01-1.5 0v-3.5A.75.75 0 0110 6zm0 9a1 1 0 100-2 1 1 0 000 2z"
                        clip-rule="evenodd" />
                </svg></div>
            <div class="ml-3">
                <h3 class="text-sm font-medium text-yellow-800 dark:text-yellow-200">Security Warning</h3>
                <div class="mt-2 text-sm text-yellow-700 dark:text-yellow-100">
                    <p>API keys and secrets are sensitive credentials. Use them cautiously.</p>
                </div>
            </div>
        </div>
    </div>

    {{-- Form Container --}}
    <div
        class="max-w-2xl bg-white dark:bg-gray-800 shadow-md rounded-lg p-6 md:p-8 border border-gray-200 dark:border-gray-700">

        <form method="POST" action="{{ route('admin.payments.update') }}" class="space-y-8">
            @csrf
            @method('PUT')

            {{-- Active Gateway Selection --}}
            <fieldset>
                <legend class="text-base font-medium text-gray-900 dark:text-white mb-2">Active Payment Gateway</legend>
                <p class="text-sm text-gray-500 dark:text-gray-400 mb-3">Select the primary payment gateway to use for
                    processing donations/orders.</p>
                <div class="flex flex-col sm:flex-row sm:items-center sm:space-x-6 space-y-3 sm:space-y-0">
                    {{-- Stripe Radio --}}
                    <div class="flex items-center">
                        <input id="active_stripe" name="active_payment_gateway" type="radio" value="stripe"
                            @checked(old('active_payment_gateway', $settings['active_payment_gateway']) === 'stripe') @disabled(!$settings['stripe_configured'])
                            class="h-4 w-4 border-gray-300 text-indigo-600 focus:ring-indigo-500 disabled:opacity-50 disabled:cursor-not-allowed">
                        <label for="active_stripe"
                            class="ml-2 block text-sm font-medium text-gray-700 dark:text-gray-300 {{ !$settings['stripe_configured'] ? 'opacity-50 cursor-not-allowed' : '' }}">
                            Stripe
                            @if (!$settings['stripe_configured'])
                                <span class="ml-1 text-xs text-yellow-600 dark:text-yellow-400">(Requires Setup)</span>
                            @else
                                <span class="ml-1 text-xs text-green-600 dark:text-green-400">(Configured)</span>
                            @endif
                        </label>
                    </div>
                    {{-- Till Radio --}}
                    <div class="flex items-center">
                        <input id="active_till" name="active_payment_gateway" type="radio" value="till"
                            @checked(old('active_payment_gateway', $settings['active_payment_gateway']) === 'till') @disabled(!$settings['till_configured'])
                            class="h-4 w-4 border-gray-300 text-indigo-600 focus:ring-indigo-500 disabled:opacity-50 disabled:cursor-not-allowed">
                        <label for="active_till"
                            class="ml-2 block text-sm font-medium text-gray-700 dark:text-gray-300 {{ !$settings['till_configured'] ? 'opacity-50 cursor-not-allowed' : '' }}">
                            Till Payments
                            @if (!$settings['till_configured'])
                                <span class="ml-1 text-xs text-yellow-600 dark:text-yellow-400">(Requires Setup)</span>
                            @else
                                <span class="ml-1 text-xs text-green-600 dark:text-green-400">(Configured)</span>
                            @endif
                        </label>
                    </div>
                </div>
                @error('active_payment_gateway')
                    <p class="mt-2 text-xs text-red-600">{{ $message }}</p>
                @enderror
            </fieldset>

            {{-- Stripe Section --}}
            <fieldset class="space-y-6 pt-6 border-t border-gray-200 dark:border-gray-600">
                <legend class="text-lg font-semibold text-gray-900 dark:text-white flex items-center space-x-2">
                    <span>Stripe Settings</span>
                    {{-- Status Badge --}}
                    @if (!$settings['stripe_configured'])
                        <span
                            class="text-xs font-normal px-2 py-0.5 rounded-full bg-yellow-100 text-yellow-800">Incomplete</span>
                    @elseif($settings['active_payment_gateway'] === 'stripe')
                        <span class="text-xs font-normal px-2 py-0.5 rounded-full bg-green-100 text-green-800">Active</span>
                    @else
                        <span class="text-xs font-normal px-2 py-0.5 rounded-full bg-gray-100 text-gray-600">Inactive</span>
                    @endif
                </legend>
                {{-- Stripe Publishable Key --}}
                <div>
                    <label for="stripe_key"
                        class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Publishable Key</label>
                    <input type="text" name="stripe_key" id="stripe_key"
                        value="{{ old('stripe_key', $settings['stripe_key'] ?? '') }}" placeholder="pk_test_..."
                        {{-- Restored full classes --}}
                        class="block w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm placeholder-gray-400 dark:placeholder-gray-500 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 @error('stripe_key') border-red-500 ring-1 ring-red-500 @enderror">
                    <p class="mt-1 text-xs text-gray-500 dark:text-gray-400">Your Stripe publishable API key.</p>
                    @error('stripe_key')
                        <p class="mt-1 text-xs text-red-600">{{ $message }}</p>
                    @enderror
                </div>
                {{-- Stripe Secret Key --}}
                <div>
                    <label for="stripe_secret"
                        class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Secret Key</label>
                    <input type="password" name="stripe_secret" id="stripe_secret" value=""
                        placeholder="{{ $settings['stripe_secret_set'] ? 'Set (Leave blank to keep)' : 'sk_test_...' }}"
                        {{-- Restored full classes --}}
                        class="block w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm placeholder-gray-400 dark:placeholder-gray-500 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 @error('stripe_secret') border-red-500 ring-1 ring-red-500 @enderror">
                    <p class="mt-1 text-xs text-gray-500 dark:text-gray-400">Your Stripe secret API key. Leave blank to keep
                        the current value.</p>
                    @error('stripe_secret')
                        <p class="mt-1 text-xs text-red-600">{{ $message }}</p>
                    @enderror
                </div>
                {{-- Stripe Webhook Secret --}}
                <div>
                    <label for="stripe_webhook_secret"
                        class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Webhook Signing
                        Secret</label>
                    <input type="password" name="stripe_webhook_secret" id="stripe_webhook_secret" value=""
                        placeholder="{{ $settings['stripe_webhook_secret_set'] ? 'Set (Leave blank to keep)' : 'whsec_...' }}"
                        {{-- Restored full classes --}}
                        class="block w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm placeholder-gray-400 dark:placeholder-gray-500 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 @error('stripe_webhook_secret') border-red-500 ring-1 ring-red-500 @enderror">
                    <p class="mt-1 text-xs text-gray-500 dark:text-gray-400">Your Stripe webhook signing secret. Leave blank
                        to keep the current value.</p>
                    @error('stripe_webhook_secret')
                        <p class="mt-1 text-xs text-red-600">{{ $message }}</p>
                    @enderror
                </div>
            </fieldset>

            {{-- Till Payments Section --}}
            <fieldset class="space-y-6 pt-6 border-t border-gray-200 dark:border-gray-600">
                <legend class="text-lg font-semibold text-gray-900 dark:text-white flex items-center space-x-2">
                    <span>Till Payments Settings</span>
                    {{-- Status Badge --}}
                    @if (!$settings['till_configured'])
                        <span
                            class="text-xs font-normal px-2 py-0.5 rounded-full bg-yellow-100 text-yellow-800">Incomplete</span>
                    @elseif($settings['active_payment_gateway'] === 'till')
                        <span class="text-xs font-normal px-2 py-0.5 rounded-full bg-green-100 text-green-800">Active</span>
                    @else
                        <span class="text-xs font-normal px-2 py-0.5 rounded-full bg-gray-100 text-gray-600">Inactive</span>
                    @endif
                </legend>
                {{-- Till Merchant ID --}}
                <div>
                    <label for="till_merchant_id"
                        class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Merchant ID</label>
                    <input type="text" name="till_merchant_id" id="till_merchant_id"
                        value="{{ old('till_merchant_id', $settings['till_merchant_id'] ?? '') }}"
                        placeholder="Your Till Payments Merchant ID" {{-- Restored full classes --}}
                        class="block w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm placeholder-gray-400 dark:placeholder-gray-500 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 @error('till_merchant_id') border-red-500 ring-1 ring-red-500 @enderror">
                    @error('till_merchant_id')
                        <p class="mt-1 text-xs text-red-600">{{ $message }}</p>
                    @enderror
                </div>
                {{-- Till API Key --}}
                <div>
                    <label for="till_api_key" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">API
                        Key</label>
                    <input type="text" name="till_api_key" id="till_api_key"
                        value="{{ old('till_api_key', $settings['till_api_key'] ?? '') }}"
                        placeholder="Your Till Payments API Key" {{-- Restored full classes --}}
                        class="block w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm placeholder-gray-400 dark:placeholder-gray-500 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 @error('till_api_key') border-red-500 ring-1 ring-red-500 @enderror">
                    @error('till_api_key')
                        <p class="mt-1 text-xs text-red-600">{{ $message }}</p>
                    @enderror
                </div>
                {{-- Till Secret --}}
                <div>
                    <label for="till_secret" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">API
                        Secret</label>
                    <input type="password" name="till_secret" id="till_secret" value=""
                        placeholder="{{ $settings['till_secret_set'] ? 'Set (Leave blank to keep)' : 'Your Till Payments API Secret' }}"
                        {{-- Restored full classes --}}
                        class="block w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm placeholder-gray-400 dark:placeholder-gray-500 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 @error('till_secret') border-red-500 ring-1 ring-red-500 @enderror">
                    <p class="mt-1 text-xs text-gray-500 dark:text-gray-400">Your Till Payments API secret. Leave blank to
                        keep the current value.</p>
                    @error('till_secret')
                        <p class="mt-1 text-xs text-red-600">{{ $message }}</p>
                    @enderror
                </div>
                {{-- Till Endpoint URL --}}
                <div>
                    <label for="till_endpoint" class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">API
                        Endpoint URL</label>
                    <input type="url" name="till_endpoint" id="till_endpoint"
                        value="{{ old('till_endpoint', $settings['till_endpoint'] ?? '') }}"
                        placeholder="e.g., https://api.tillpayments.com" {{-- Restored full classes --}}
                        class="block w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md shadow-sm placeholder-gray-400 dark:placeholder-gray-500 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm bg-white dark:bg-gray-700 text-gray-900 dark:text-gray-100 @error('till_endpoint') border-red-500 ring-1 ring-red-500 @enderror">
                    <p class="mt-1 text-xs text-gray-500 dark:text-gray-400">The base URL for the Till Payments API (Test
                        or Live).</p>
                    @error('till_endpoint')
                        <p class="mt-1 text-xs text-red-600">{{ $message }}</p>
                    @enderror
                </div>
            </fieldset>

            {{-- Submit Button --}}
            <div class="flex justify-end pt-4">
                <button type="submit"
                    class="inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500 transition duration-150 ease-in-out">
                    Save Settings
                </button>
            </div>
        </form>
    </div> {{-- End Form Container --}}
@endsection