@extends('admin.layout')

@section('title', 'Promosi & Voucher')

@section('content')
<div class="space-y-6">
    <div class="flex justify-between items-center">
        <div>
            <h2 class="font-headline-lg text-3xl font-bold text-on-surface">Tambah Promo</h2>
            <p class="text-body-md text-on-surface-variant">Buat kampanye promo baru.</p>
        </div>
        <a href="{{ route('admin.promotions.index') }}" class="px-6 py-2.5 bg-surface-container text-on-surface rounded-xl font-label-lg hover:bg-surface-container-high transition-colors">
            Kembali
        </a>
    </div>

    <div class="bg-surface border border-outline-variant rounded-2xl p-6 shadow-sm max-w-4xl">
        <form action="{{ route('admin.promotions.store') }}" method="POST" class="space-y-6">
            @csrf
            
            <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                <!-- Name -->
                <div class="md:col-span-2">
                    <label class="block text-xs font-bold text-on-surface mb-1">Nama Promo *</label>
                    <input type="text" name="name" required class="w-full px-4 py-2.5 rounded-xl bg-surface-container-low border border-outline-variant text-sm focus:ring-1 focus:ring-primary" value="{{ old('name') }}" placeholder="Contoh: Diskon Pengguna Baru">
                    @error('name') <span class="text-xs text-error mt-1">{{ $message }}</span> @enderror
                </div>

                <!-- Code -->
                <div>
                    <label class="block text-xs font-bold text-on-surface mb-1">Kode Voucher (Kosongkan jika publik)</label>
                    <input type="text" name="code" class="w-full px-4 py-2.5 rounded-xl bg-surface-container-low border border-outline-variant text-sm focus:ring-1 focus:ring-primary uppercase" value="{{ old('code') }}" placeholder="Contoh: NEWBIE50">
                    @error('code') <span class="text-xs text-error mt-1">{{ $message }}</span> @enderror
                </div>
                
                <!-- Sponsor -->
                <div>
                    <label class="block text-xs font-bold text-on-surface mb-1">Sponsor Diskon *</label>
                    <select name="sponsor_type" required class="w-full px-4 py-2.5 rounded-xl bg-surface-container-low border border-outline-variant text-sm focus:ring-1 focus:ring-primary">
                        <option value="platform" {{ old('sponsor_type') === 'platform' ? 'selected' : '' }}>Platform Terapisku</option>
                        <option value="mitra" {{ old('sponsor_type') === 'mitra' ? 'selected' : '' }}>Mitra Terapis</option>
                    </select>
                </div>

                <!-- Discount Type & Value -->
                <div>
                    <label class="block text-xs font-bold text-on-surface mb-1">Tipe Diskon *</label>
                    <select name="discount_type" id="discount_type" required class="w-full px-4 py-2.5 rounded-xl bg-surface-container-low border border-outline-variant text-sm focus:ring-1 focus:ring-primary">
                        <option value="percentage" {{ old('discount_type') === 'percentage' ? 'selected' : '' }}>Persentase (%)</option>
                        <option value="fixed" {{ old('discount_type') === 'fixed' ? 'selected' : '' }}>Potongan Tetap (Rp)</option>
                    </select>
                </div>
                <div>
                    <label class="block text-xs font-bold text-on-surface mb-1">Nilai Diskon *</label>
                    <input type="number" name="discount_value" required min="0" class="w-full px-4 py-2.5 rounded-xl bg-surface-container-low border border-outline-variant text-sm focus:ring-1 focus:ring-primary" value="{{ old('discount_value') }}" placeholder="Contoh: 50 atau 20000">
                    @error('discount_value') <span class="text-xs text-error mt-1">{{ $message }}</span> @enderror
                </div>

                <!-- Max Discount -->
                <div>
                    <label class="block text-xs font-bold text-on-surface mb-1">Maksimal Diskon (Rp)</label>
                    <input type="number" name="max_discount_amount" min="0" class="w-full px-4 py-2.5 rounded-xl bg-surface-container-low border border-outline-variant text-sm focus:ring-1 focus:ring-primary" value="{{ old('max_discount_amount') }}" placeholder="Untuk diskon persentase">
                </div>

                <!-- Min Transaction -->
                <div>
                    <label class="block text-xs font-bold text-on-surface mb-1">Minimal Transaksi (Rp)</label>
                    <input type="number" name="min_transaction_amount" min="0" class="w-full px-4 py-2.5 rounded-xl bg-surface-container-low border border-outline-variant text-sm focus:ring-1 focus:ring-primary" value="{{ old('min_transaction_amount') }}">
                </div>

                <!-- Dates -->
                <div>
                    <label class="block text-xs font-bold text-on-surface mb-1">Berlaku Dari *</label>
                    <input type="datetime-local" name="start_date" required class="w-full px-4 py-2.5 rounded-xl bg-surface-container-low border border-outline-variant text-sm focus:ring-1 focus:ring-primary" value="{{ old('start_date') }}">
                    @error('start_date') <span class="text-xs text-error mt-1">{{ $message }}</span> @enderror
                </div>
                <div>
                    <label class="block text-xs font-bold text-on-surface mb-1">Berlaku Sampai *</label>
                    <input type="datetime-local" name="end_date" required class="w-full px-4 py-2.5 rounded-xl bg-surface-container-low border border-outline-variant text-sm focus:ring-1 focus:ring-primary" value="{{ old('end_date') }}">
                    @error('end_date') <span class="text-xs text-error mt-1">{{ $message }}</span> @enderror
                </div>

                <!-- Quota -->
                <div>
                    <label class="block text-xs font-bold text-on-surface mb-1">Batas Kuota Pemakaian</label>
                    <input type="number" name="quota" min="1" class="w-full px-4 py-2.5 rounded-xl bg-surface-container-low border border-outline-variant text-sm focus:ring-1 focus:ring-primary" value="{{ old('quota') }}" placeholder="Kosongkan jika tanpa batas">
                </div>

                <!-- Target User -->
                <div>
                    <label class="block text-xs font-bold text-on-surface mb-1">Target Pengguna *</label>
                    <select name="eligible_user_type" required class="w-full px-4 py-2.5 rounded-xl bg-surface-container-low border border-outline-variant text-sm focus:ring-1 focus:ring-primary">
                        <option value="all" {{ old('eligible_user_type') === 'all' ? 'selected' : '' }}>Semua Pengguna</option>
                        <option value="new_user" {{ old('eligible_user_type') === 'new_user' ? 'selected' : '' }}>Hanya Pengguna Baru</option>
                    </select>
                </div>

                <!-- Description -->
                <div class="md:col-span-2">
                    <label class="block text-xs font-bold text-on-surface mb-1">Syarat & Ketentuan (Deskripsi)</label>
                    <textarea name="description" rows="3" class="w-full px-4 py-2.5 rounded-xl bg-surface-container-low border border-outline-variant text-sm focus:ring-1 focus:ring-primary" placeholder="Syarat tambahan promo...">{{ old('description') }}</textarea>
                </div>
                
                <div class="md:col-span-2 flex items-center gap-2">
                    <input type="checkbox" name="is_active" id="is_active" checked class="rounded border-outline-variant text-primary focus:ring-primary">
                    <label for="is_active" class="text-sm font-bold text-on-surface cursor-pointer">Aktifkan promo ini sekarang</label>
                </div>
            </div>

            <div class="pt-4 border-t border-outline-variant">
                <button type="submit" class="px-8 py-3 bg-primary text-on-primary rounded-xl font-label-lg hover:bg-primary/90 transition-colors w-full md:w-auto">
                    Simpan Promo
                </button>
            </div>
        </form>
    </div>
</div>
@endsection