@extends(template().'layout.master2')

@section('content2')
<div class="min-h-screen bg-gray-900 text-gray-100 px-6 py-12 flex flex-col items-center">
    
    <div class="max-w-3xl w-full mb-8 flex justify-between items-center">
        <h1 class="text-2xl font-bold text-white">{{ __('Confirm Withdrawal') }}</h1>
        <a href="{{ route('user.withdrawMethod') }}" class="flex items-center gap-2 text-gray-400 hover:text-orange-500 transition-colors">
            <i class="bi bi-arrow-left"></i> {{ __('Back') }}
        </a>
    </div>

    <div class="max-w-3xl w-full bg-gray-800 border border-gray-700 rounded-[2.5rem] overflow-hidden shadow-2xl">
        
        <div class="bg-gray-900/50 p-8 border-b border-gray-700 flex items-center justify-between">
            <div class="flex items-center gap-6">
                <div class="h-16 w-16 bg-orange-500/10 rounded-2xl flex items-center justify-center text-orange-500">
                    <i class="bi bi-shield-lock text-3xl"></i>
                </div>
                <div>
                    <h2 class="text-xl font-bold text-white">{{ __($method->name) }}</h2>
                    <p class="text-gray-400 text-sm">Balance: <span class="text-green-400">{{ number_format(auth()->user()->balance, 2) }} USD</span></p>
                </div>
            </div>
        </div>


        <form action="{{ route('user.withdraw.completed') }}" method="POST" class="p-8 space-y-8">
            @csrf
            <input type="hidden" name="method" value="{{ $method->id }}">

            <div class="bg-gray-900/30 p-6 rounded-3xl border border-gray-700/50">
                <label class="block text-sm font-medium text-gray-400 mb-4">{{ __('Amount to Withdraw') }}</label>
                <div class="relative">
                    <input type="number" step="any" name="amount" required
                           class="w-full bg-gray-900 border-gray-700 border rounded-2xl py-5 px-6 text-2xl font-bold text-white focus:ring-2 focus:ring-orange-500 outline-none transition-all"
                           placeholder="0.00">
                    <span class="absolute right-6 top-1/2 -translate-y-1/2 text-gray-500 font-bold text-xl">USD</span>
                </div>
            </div>

            <div class="space-y-6">
                <h3 class="text-lg font-semibold text-white flex items-center gap-2">
                    <span class="h-1 w-6 bg-orange-500 rounded-full"></span>
                    {{ __('Payment Details') }}
                </h3>
           <div class="grid grid-cols-1 gap-6">
    @php 
        // Strip HTML tags first, then explode by comma
        $cleanInstructions = strip_tags($method->withdraw_instruction);
        $fields = explode(',', $cleanInstructions); 
    @endphp

    @foreach($fields as $field)
        @php $fieldName = trim($field); @endphp
        
        @if(!empty($fieldName))
            <div>
                {{-- Use $fieldName here to keep the label and input name clean --}}
                <label class="block text-sm font-medium text-gray-400 mb-2">{{ $fieldName }}</label>
                <input type="text" name="details[{{ $fieldName }}]" required
                       class="w-full bg-gray-900 border-gray-700 border rounded-2xl py-4 px-5 text-white focus:ring-2 focus:ring-orange-500 outline-none transition-all">
            </div>
        @endif
    @endforeach
</div>
            </div>

            <div class="pt-6 border-t border-gray-700/50">
                <label class="block text-sm font-medium text-red-400 mb-2">{{ __('Security Transfer Code') }}</label>
                <input type="password" name="transfer_code" required
                       class="w-full bg-gray-900 border-red-900/30 border rounded-2xl py-4 px-5 text-white focus:ring-2 focus:ring-red-500 outline-none transition-all"
                       placeholder="Enter your 4-6 digit code">
                <p class="text-xs text-gray-500 mt-2 italic">Confirm this transaction with your private transfer code. Request your transfer code from support.</p>
            </div>

            <button type="submit" class="w-full py-4 text-center bg-orange-500 hover:bg-orange-600 text-white font-bold text-lg rounded-2xl shadow-lg transition-all active:scale-[0.98]">
                {{ __('Submit Withdrawal Request') }}
            </button>
        </form>
    </div>
</div>
@endsection