@extends('admin.layouts.app')

@section('title', 'Shipping Settings')

@section('content')
    <div class="mb-6">
        <h1 class="text-2xl font-bold text-white tracking-tight">Shipping Settings</h1>
        <p class="text-slate-400 mt-1">Configure shipping charges for different zones.</p>
    </div>

    @if(session('success'))
        <div
            class="mb-6 p-4 rounded-xl bg-emerald-500/10 border border-emerald-500/20 text-emerald-400 flex items-center gap-3">
            <i data-lucide="check-circle" class="w-5 h-5"></i>
            {{ session('success') }}
        </div>
    @endif

    <div class="glass-card rounded-2xl p-6 md:p-8">
        <form action="{{ route('admin.settings.shipping.update') }}" method="POST">
            @csrf

            <div class="mb-8 pb-4 border-b border-white/5">
                <h3 class="text-lg font-semibold text-white mb-1">Shipping Charges</h3>
                <p class="text-sm text-slate-400">Set the default shipping rates for your store.</p>
            </div>

            <div class="grid grid-cols-1 md:grid-cols-3 gap-8 mb-8">
                <!-- Local Shipping -->
                <div>
                    <label for="shipping_local_amount" class="block text-sm font-medium text-slate-300 mb-2">
                        Local Shipping Amount (₹)
                    </label>
                    <div class="relative">
                        <div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
                            <span class="text-slate-500 sm:text-sm">₹</span>
                        </div>
                        <input type="number" step="0.01" name="shipping_local_amount" id="shipping_local_amount"
                            value="{{ old('shipping_local_amount', $settings->shipping_local_amount ?? 0) }}"
                            class="bg-slate-900/50 border border-white/10 text-white text-sm rounded-xl focus:ring-blue-500 focus:border-blue-500 block w-full pl-8 p-2.5 transition-all"
                            placeholder="0.00">
                    </div>
                    <p class="mt-2 text-xs text-slate-500">Charge for local city deliveries.</p>
                </div>

                <!-- National Shipping -->
                <div>
                    <label for="shipping_national_amount" class="block text-sm font-medium text-slate-300 mb-2">
                        National Shipping (India) (₹)
                    </label>
                    <div class="relative">
                        <div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
                            <span class="text-slate-500 sm:text-sm">₹</span>
                        </div>
                        <input type="number" step="0.01" name="shipping_national_amount" id="shipping_national_amount"
                            value="{{ old('shipping_national_amount', $settings->shipping_national_amount ?? 0) }}"
                            class="bg-slate-900/50 border border-white/10 text-white text-sm rounded-xl focus:ring-blue-500 focus:border-blue-500 block w-full pl-8 p-2.5 transition-all"
                            placeholder="0.00">
                    </div>
                    <p class="mt-2 text-xs text-slate-500">Charge for pan-India deliveries.</p>
                </div>

                <!-- International Shipping -->
                <div>
                    <label for="shipping_international_amount" class="block text-sm font-medium text-slate-300 mb-2">
                        International Shipping (₹)
                    </label>
                    <div class="relative">
                        <div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none">
                            <span class="text-slate-500 sm:text-sm">₹</span>
                        </div>
                        <input type="number" step="0.01" name="shipping_international_amount"
                            id="shipping_international_amount"
                            value="{{ old('shipping_international_amount', $settings->shipping_international_amount ?? 0) }}"
                            class="bg-slate-900/50 border border-white/10 text-white text-sm rounded-xl focus:ring-blue-500 focus:border-blue-500 block w-full pl-8 p-2.5 transition-all"
                            placeholder="0.00">
                    </div>
                    <p class="mt-2 text-xs text-slate-500">Charge for international deliveries.</p>
                </div>
            </div>

            <div class="flex justify-end border-t border-white/5 pt-6">
                <button type="submit"
                    class="bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-6 rounded-xl transition-all shadow-lg shadow-blue-500/20 flex items-center gap-2">
                    <i data-lucide="save" class="w-4 h-4"></i>
                    Save Settings
                </button>
            </div>
        </form>
    </div>
@endsection