@extends('layouts.app')

@section('title', 'Add payment mode')
@section('heading', 'Add offline payment mode')

@section('content')
    <x-card>
        <form action="{{ route('superadmin.offline-payment-modes.store') }}" method="post" class="max-w-md space-y-6">
            @csrf
            <div>
                <label for="name" class="block text-sm font-medium text-slate-700">Name <span class="text-red-500">*</span></label>
                <input type="text" name="name" id="name" value="{{ old('name') }}" required
                       class="mt-1 w-full rounded-lg border border-slate-300 px-3 py-2 focus:border-slate-500 focus:outline-none focus:ring-1 focus:ring-slate-500" placeholder="e.g. Bank Transfer">
                @error('name') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
            </div>
            <div>
                <label for="description" class="block text-sm font-medium text-slate-700">Description</label>
                <textarea name="description" id="description" rows="2" class="mt-1 w-full rounded-lg border border-slate-300 px-3 py-2 focus:border-slate-500 focus:outline-none focus:ring-1 focus:ring-slate-500">{{ old('description') }}</textarea>
                @error('description') <p class="mt-1 text-xs text-red-600">{{ $message }}</p> @enderror
            </div>
            <div class="flex gap-3">
                <button type="submit" class="rounded-lg bg-primary px-4 py-2 text-sm font-medium text-white">Create</button>
                <a href="{{ route('superadmin.offline-payment-modes.index') }}" class="rounded-lg border border-slate-300 px-4 py-2 text-sm font-medium text-slate-700 hover:bg-slate-50">Cancel</a>
            </div>
        </form>
    </x-card>
@endsection