@extends('layouts.app')
@section('title', __('Billing settings'))

@section('content')
@if(session('status'))
    <div class="mb-4 px-4 py-2 rounded-lg bg-emerald-50 text-emerald-800 dark:bg-emerald-900/30 dark:text-emerald-200 text-sm">
        {{ session('status') }}
    </div>
@endif

@if($errors->any())
    <div class="mb-4 px-4 py-2 rounded-lg bg-rose-50 text-rose-800 dark:bg-rose-900/30 dark:text-rose-200 text-sm">
        {{ $errors->first() }}
    </div>
@endif

<div class="rounded-2xl border border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-900 shadow-sm p-5 sm:p-6 mb-4">
    <h1 class="text-xl sm:text-2xl font-semibold text-slate-900 dark:text-white">{{ __('Billing settings') }}</h1>
    <p class="text-sm text-slate-500 dark:text-slate-400 mt-2">
        {{ __('Configure how you bill your end users — pricing, payments, bank details and request workflow.') }}
    </p>
</div>

{{-- Tabs --}}
<div class="mb-4 flex flex-wrap gap-1 border-b border-slate-200 dark:border-slate-700">
    @foreach([
        'pricing'  => __('Pricing'),
        'workflow' => __('Workflow'),
        'gateways' => __('Payment gateways'),
        'bank'     => __('Bank transfer'),
    ] as $key => $label)
        <a href="{{ route('tenant.billing-settings.edit', ['tab' => $key]) }}"
           class="px-4 py-2 text-sm font-medium border-b-2 -mb-px transition
                  {{ $tab === $key
                      ? 'border-slate-900 dark:border-slate-100 text-slate-900 dark:text-white'
                      : 'border-transparent text-slate-500 dark:text-slate-400 hover:text-slate-700 dark:hover:text-slate-200' }}">
            {{ $label }}
        </a>
    @endforeach
</div>

@if($tab === 'pricing')
    <form method="POST" action="{{ route('tenant.billing-settings.pricing') }}"
          class="rounded-2xl border border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-900 shadow-sm p-5 sm:p-6 space-y-5">
        @csrf
        <h2 class="text-base font-semibold text-slate-900 dark:text-white pb-3 border-b border-slate-200 dark:border-slate-800">{{ __('Retail pricing') }}</h2>

        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
            <div>
                <label class="block text-xs font-semibold text-slate-700 dark:text-slate-200 mb-1">{{ __('Standard rate') }}</label>
                <div class="relative">
                    <input type="number" step="0.01" min="0" name="unit_price" required value="{{ old('unit_price', $pricing['unit_price']) }}"
                           class="w-full rounded-lg border border-slate-300 dark:border-slate-700 bg-slate-50 dark:bg-slate-950 px-3 py-2 pe-12 text-sm tabular-nums">
                    <span class="absolute end-3 top-1/2 -translate-y-1/2 text-xs text-slate-400 font-mono">{{ $pricing['currency'] }}</span>
                </div>
                <p class="mt-1 text-[11px] text-slate-500">{{ __('Charged to your end users per analysis.') }}</p>
            </div>
            <div>
                <label class="block text-xs font-semibold text-slate-700 dark:text-slate-200 mb-1">{{ __('Monthly minimum') }}</label>
                <div class="relative">
                    <input type="number" step="0.01" min="0" name="monthly_minimum" required value="{{ old('monthly_minimum', $pricing['monthly_minimum']) }}"
                           class="w-full rounded-lg border border-slate-300 dark:border-slate-700 bg-slate-50 dark:bg-slate-950 px-3 py-2 pe-12 text-sm tabular-nums">
                    <span class="absolute end-3 top-1/2 -translate-y-1/2 text-xs text-slate-400 font-mono">{{ $pricing['currency'] }}</span>
                </div>
                <p class="mt-1 text-[11px] text-slate-500">{{ __('0 = no floor.') }}</p>
            </div>
            <div>
                <label class="block text-xs font-semibold text-slate-700 dark:text-slate-200 mb-1">{{ __('Currency') }}</label>
                <input type="text" name="currency" maxlength="3" required value="{{ old('currency', $pricing['currency']) }}"
                       class="w-full rounded-lg border border-slate-300 dark:border-slate-700 bg-slate-50 dark:bg-slate-950 px-3 py-2 text-sm uppercase font-mono">
            </div>
            <div>
                <label class="block text-xs font-semibold text-slate-700 dark:text-slate-200 mb-1">{{ __('VAT rate') }}</label>
                <div class="relative">
                    <input type="number" step="0.01" min="0" max="100" name="vat_rate" required value="{{ old('vat_rate', $pricing['vat_rate']) }}"
                           class="w-full rounded-lg border border-slate-300 dark:border-slate-700 bg-slate-50 dark:bg-slate-950 px-3 py-2 pe-8 text-sm tabular-nums">
                    <span class="absolute end-3 top-1/2 -translate-y-1/2 text-xs text-slate-400">%</span>
                </div>
            </div>
        </div>

        <div class="pt-5 border-t border-slate-200 dark:border-slate-800">
            <h3 class="text-sm font-semibold text-slate-700 dark:text-slate-200 mb-2">{{ __('Per-user overrides') }}</h3>
            <p class="text-xs text-slate-500 mb-3">{{ __('Leave empty to use the standard rate.') }}</p>
            <div class="overflow-x-auto rounded-lg border border-slate-200 dark:border-slate-700">
                <table class="w-full text-sm">
                    <thead class="bg-slate-50 dark:bg-slate-800/60 text-[11px] uppercase tracking-wider text-slate-500 dark:text-slate-400">
                        <tr>
                            <th class="text-start px-4 py-2">{{ __('User') }}</th>
                            <th class="text-end px-4 py-2 w-40">{{ __('Override price') }}</th>
                        </tr>
                    </thead>
                    <tbody class="divide-y divide-slate-100 dark:divide-slate-800">
                        @forelse($users as $u)
                            @php $key = 'user_override_'.$u->id; $cur = $tenant->id ? \App\Models\TenantSetting::get($tenant->id, 'pricing', $key) : null; @endphp
                            <tr>
                                <td class="px-4 py-2">
                                    <div class="font-medium text-slate-900 dark:text-slate-100">{{ $u->name }}</div>
                                    <div class="text-[11px] text-slate-500">{{ $u->email }}</div>
                                </td>
                                <td class="px-4 py-2 text-end">
                                    <input type="number" step="0.01" min="0" name="user_overrides[{{ $u->id }}]"
                                           value="{{ $cur }}" placeholder="{{ number_format($pricing['unit_price'], 2) }}"
                                           class="w-32 rounded-md border border-slate-300 dark:border-slate-700 bg-slate-50 dark:bg-slate-950 px-2 py-1 text-xs text-end tabular-nums">
                                </td>
                            </tr>
                        @empty
                            <tr><td colspan="2" class="px-4 py-6 text-center text-xs text-slate-500">{{ __('No end users yet.') }}</td></tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>

        <div class="flex justify-end pt-3 border-t border-slate-200 dark:border-slate-800">
            <button class="px-4 py-2 rounded-lg bg-slate-900 dark:bg-slate-100 text-white dark:text-slate-900 text-sm font-semibold">{{ __('Save pricing') }}</button>
        </div>
    </form>

@elseif($tab === 'workflow')
    <form method="POST" action="{{ route('tenant.billing-settings.workflow') }}"
          class="rounded-2xl border border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-900 shadow-sm p-5 sm:p-6 space-y-5">
        @csrf
        <h2 class="text-base font-semibold text-slate-900 dark:text-white pb-3 border-b border-slate-200 dark:border-slate-800">{{ __('Request workflow') }}</h2>

        <div>
            <label class="block text-xs font-semibold text-slate-700 dark:text-slate-200 mb-1">{{ __('User cancellation window (minutes)') }}</label>
            <input type="number" min="0" max="1440" name="request_cancellation_window_minutes" required
                   value="{{ old('request_cancellation_window_minutes', $workflow['request_cancellation_window_minutes']) }}"
                   class="w-32 rounded-lg border border-slate-300 dark:border-slate-700 bg-slate-50 dark:bg-slate-950 px-3 py-2 text-sm tabular-nums">
            <p class="mt-1 text-[11px] text-slate-500">{{ __('How long an end user can cancel a request after submitting it. Default 15 minutes.') }}</p>
        </div>

        <div class="grid grid-cols-1 sm:grid-cols-2 gap-3">
            <label class="flex items-start gap-2 p-3 rounded-lg border border-slate-200 dark:border-slate-700 cursor-pointer has-[:checked]:border-indigo-500 has-[:checked]:bg-indigo-50/40 dark:has-[:checked]:bg-indigo-900/20">
                <input type="hidden" name="notify_on_request" value="0">
                <input type="checkbox" name="notify_on_request" value="1" class="mt-0.5"
                       {{ ($workflow['notify_on_request'] ?? '1') === '1' ? 'checked' : '' }}>
                <span>
                    <span class="font-medium text-slate-800 dark:text-slate-100">{{ __('Email me on each new request') }}</span>
                    <span class="block text-[11px] text-slate-500 mt-0.5">{{ __('Sent to your notification email when an end user submits a request.') }}</span>
                </span>
            </label>
            <label class="flex items-start gap-2 p-3 rounded-lg border border-slate-200 dark:border-slate-700 cursor-pointer has-[:checked]:border-indigo-500 has-[:checked]:bg-indigo-50/40 dark:has-[:checked]:bg-indigo-900/20">
                <input type="hidden" name="notify_on_ai_ready" value="0">
                <input type="checkbox" name="notify_on_ai_ready" value="1" class="mt-0.5"
                       {{ ($workflow['notify_on_ai_ready'] ?? '1') === '1' ? 'checked' : '' }}>
                <span>
                    <span class="font-medium text-slate-800 dark:text-slate-100">{{ __('Email me when an analysis is ready') }}</span>
                    <span class="block text-[11px] text-slate-500 mt-0.5">{{ __('Sent when an analysis finishes and the result is awaiting your review.') }}</span>
                </span>
            </label>
        </div>

        <div class="flex justify-end pt-3 border-t border-slate-200 dark:border-slate-800">
            <button class="px-4 py-2 rounded-lg bg-slate-900 dark:bg-slate-100 text-white dark:text-slate-900 text-sm font-semibold">{{ __('Save workflow') }}</button>
        </div>
    </form>

@elseif($tab === 'gateways')
    <form method="POST" action="{{ route('tenant.billing-settings.gateways') }}"
          class="rounded-2xl border border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-900 shadow-sm p-5 sm:p-6 space-y-6">
        @csrf
        <h2 class="text-base font-semibold text-slate-900 dark:text-white pb-3 border-b border-slate-200 dark:border-slate-800">{{ __('Stripe') }}</h2>
        <label class="flex items-center gap-2 text-sm">
            <input type="hidden" name="stripe_enabled" value="0">
            <input type="checkbox" name="stripe_enabled" value="1" {{ ($gateways['stripe_enabled'] ?? '0') === '1' ? 'checked' : '' }}>
            <span class="font-medium text-slate-800 dark:text-slate-100">{{ __('Enable Stripe payments on invoices') }}</span>
        </label>
        <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
            <div>
                <label class="block text-xs font-semibold text-slate-700 dark:text-slate-200 mb-1">{{ __('Publishable key') }}</label>
                <input type="text" name="stripe_publishable_key" value="{{ $gateways['stripe_publishable_key'] ?? '' }}"
                       placeholder="pk_…" class="w-full rounded-lg border border-slate-300 dark:border-slate-700 bg-slate-50 dark:bg-slate-950 px-3 py-2 text-sm font-mono">
            </div>
            <div>
                <label class="block text-xs font-semibold text-slate-700 dark:text-slate-200 mb-1">{{ __('Secret key') }}</label>
                <input type="password" name="stripe_secret_key" placeholder="{{ ! empty($gateways['stripe_secret_key']) ? '••••••••' : 'sk_…' }}"
                       autocomplete="new-password" class="w-full rounded-lg border border-slate-300 dark:border-slate-700 bg-slate-50 dark:bg-slate-950 px-3 py-2 text-sm font-mono">
                <p class="mt-1 text-[11px] text-slate-500">{{ __('Leave blank to keep the existing key. Encrypted at rest.') }}</p>
            </div>
        </div>

        <h2 class="text-base font-semibold text-slate-900 dark:text-white pt-3 pb-3 border-y border-slate-200 dark:border-slate-800">{{ __('PayPal') }}</h2>
        <label class="flex items-center gap-2 text-sm">
            <input type="hidden" name="paypal_enabled" value="0">
            <input type="checkbox" name="paypal_enabled" value="1" {{ ($gateways['paypal_enabled'] ?? '0') === '1' ? 'checked' : '' }}>
            <span class="font-medium text-slate-800 dark:text-slate-100">{{ __('Enable PayPal payments on invoices') }}</span>
        </label>
        <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
            <div>
                <label class="block text-xs font-semibold text-slate-700 dark:text-slate-200 mb-1">{{ __('Mode') }}</label>
                <select name="paypal_mode" class="w-full rounded-lg border border-slate-300 dark:border-slate-700 bg-slate-50 dark:bg-slate-950 px-3 py-2 text-sm">
                    <option value="sandbox" @selected(($gateways['paypal_mode'] ?? 'sandbox') === 'sandbox')>{{ __('Sandbox') }}</option>
                    <option value="live"    @selected(($gateways['paypal_mode'] ?? '') === 'live')>{{ __('Live') }}</option>
                </select>
            </div>
            <div>
                <label class="block text-xs font-semibold text-slate-700 dark:text-slate-200 mb-1">{{ __('Client ID') }}</label>
                <input type="text" name="paypal_client_id" value="{{ $gateways['paypal_client_id'] ?? '' }}"
                       class="w-full rounded-lg border border-slate-300 dark:border-slate-700 bg-slate-50 dark:bg-slate-950 px-3 py-2 text-sm font-mono">
            </div>
            <div>
                <label class="block text-xs font-semibold text-slate-700 dark:text-slate-200 mb-1">{{ __('Client secret') }}</label>
                <input type="password" name="paypal_client_secret" placeholder="{{ ! empty($gateways['paypal_client_secret']) ? '••••••••' : '' }}"
                       autocomplete="new-password" class="w-full rounded-lg border border-slate-300 dark:border-slate-700 bg-slate-50 dark:bg-slate-950 px-3 py-2 text-sm font-mono">
            </div>
        </div>

        <div class="flex justify-end pt-3 border-t border-slate-200 dark:border-slate-800">
            <button class="px-4 py-2 rounded-lg bg-slate-900 dark:bg-slate-100 text-white dark:text-slate-900 text-sm font-semibold">{{ __('Save payment gateways') }}</button>
        </div>
    </form>

@else
    <form method="POST" action="{{ route('tenant.billing-settings.bank') }}"
          class="rounded-2xl border border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-900 shadow-sm p-5 sm:p-6 space-y-5">
        @csrf
        <h2 class="text-base font-semibold text-slate-900 dark:text-white pb-3 border-b border-slate-200 dark:border-slate-800">{{ __('Bank-transfer details') }}</h2>
        <p class="text-xs text-slate-500">{{ __('Shown verbatim on every end-user invoice for clients who pay by SEPA wire transfer.') }}</p>

        <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
            <div class="md:col-span-2">
                <label class="block text-xs font-semibold text-slate-700 dark:text-slate-200 mb-1">{{ __('Account holder') }}</label>
                <input type="text" name="account_holder" value="{{ $bank['account_holder'] ?? '' }}" maxlength="200"
                       class="w-full rounded-lg border border-slate-300 dark:border-slate-700 bg-slate-50 dark:bg-slate-950 px-3 py-2 text-sm">
            </div>
            <div>
                <label class="block text-xs font-semibold text-slate-700 dark:text-slate-200 mb-1">{{ __('IBAN') }}</label>
                <input type="text" name="iban" value="{{ $bank['iban'] ?? '' }}" maxlength="64" placeholder="BE68 5390 0754 7034"
                       class="w-full rounded-lg border border-slate-300 dark:border-slate-700 bg-slate-50 dark:bg-slate-950 px-3 py-2 text-sm font-mono uppercase">
            </div>
            <div>
                <label class="block text-xs font-semibold text-slate-700 dark:text-slate-200 mb-1">{{ __('BIC / SWIFT') }}</label>
                <input type="text" name="bic" value="{{ $bank['bic'] ?? '' }}" maxlength="32" placeholder="GKCCBEBB"
                       class="w-full rounded-lg border border-slate-300 dark:border-slate-700 bg-slate-50 dark:bg-slate-950 px-3 py-2 text-sm font-mono uppercase">
            </div>
            <div>
                <label class="block text-xs font-semibold text-slate-700 dark:text-slate-200 mb-1">{{ __('Bank name') }}</label>
                <input type="text" name="bank_name" value="{{ $bank['bank_name'] ?? '' }}" maxlength="200"
                       class="w-full rounded-lg border border-slate-300 dark:border-slate-700 bg-slate-50 dark:bg-slate-950 px-3 py-2 text-sm">
            </div>
            <div>
                <label class="block text-xs font-semibold text-slate-700 dark:text-slate-200 mb-1">{{ __('Payment reference template') }}</label>
                <input type="text" name="reference_template" value="{{ $bank['reference_template'] ?? ':invoice_number' }}"
                       maxlength="200" class="w-full rounded-lg border border-slate-300 dark:border-slate-700 bg-slate-50 dark:bg-slate-950 px-3 py-2 text-sm font-mono">
                <p class="mt-1 text-[11px] text-slate-500">{{ __('Use :invoice_number as a placeholder.') }}</p>
            </div>
            <div class="md:col-span-2">
                <label class="block text-xs font-semibold text-slate-700 dark:text-slate-200 mb-1">{{ __('Additional notes') }}</label>
                <textarea name="notes" rows="3" maxlength="500" class="w-full rounded-lg border border-slate-300 dark:border-slate-700 bg-slate-50 dark:bg-slate-950 px-3 py-2 text-sm">{{ $bank['notes'] ?? '' }}</textarea>
            </div>
        </div>

        <div class="flex justify-end pt-3 border-t border-slate-200 dark:border-slate-800">
            <button class="px-4 py-2 rounded-lg bg-slate-900 dark:bg-slate-100 text-white dark:text-slate-900 text-sm font-semibold">{{ __('Save bank details') }}</button>
        </div>
    </form>
@endif
@endsection