@extends('layouts.app')

@section('title', 'Edit Rate Card')
@section('page-title', 'Edit Service 💰')

@section('content')
<div class="max-w-lg mx-auto">
    <div class="cat-card p-4 lg:p-8">
        <form action="{{ route('rate-cards.update', $rateCard) }}" method="POST" class="space-y-4">
            @csrf @method('PUT')
            <div>
                <label class="block text-sm font-semibold text-gray-700 mb-1">Service Name</label>
                <input type="text" name="service_name" value="{{ old('service_name', $rateCard->service_name) }}"
                       class="input-soft" required>
            </div>
            <div>
                <label class="block text-sm font-semibold text-gray-700 mb-1">Description</label>
                <textarea name="description" rows="2" class="input-soft resize-none">{{ old('description', $rateCard->description) }}</textarea>
            </div>
            <div class="grid grid-cols-2 gap-3">
                <div>
                    <label class="block text-sm font-semibold text-gray-700 mb-1">Platform</label>
                    <select name="platform" class="input-soft">
                        @foreach(['general','instagram','tiktok','youtube'] as $p)
                            <option value="{{ $p }}" {{ old('platform', $rateCard->platform) === $p ? 'selected' : '' }}>
                                {{ ucfirst($p) }}
                            </option>
                        @endforeach
                    </select>
                </div>
                <div>
                    <label class="block text-sm font-semibold text-gray-700 mb-1">Content Type</label>
                    <input type="text" name="content_type" value="{{ old('content_type', $rateCard->content_type) }}"
                           class="input-soft" placeholder="Reel, Story...">
                </div>
                <div>
                    <label class="block text-sm font-semibold text-gray-700 mb-1">Price</label>
                    <input type="number" name="price" value="{{ old('price', $rateCard->price) }}"
                           class="input-soft" min="0" step="100000">
                </div>
                <div>
                    <label class="block text-sm font-semibold text-gray-700 mb-1">Currency</label>
                    <select name="currency" class="input-soft">
                        <option value="IDR" {{ old('currency', $rateCard->currency) === 'IDR' ? 'selected' : '' }}>IDR</option>
                        <option value="USD" {{ old('currency', $rateCard->currency) === 'USD' ? 'selected' : '' }}>USD</option>
                    </select>
                </div>
                <div>
                    <label class="block text-sm font-semibold text-gray-700 mb-1">Price Unit</label>
                    <select name="price_unit" class="input-soft">
                        @foreach(['per_content','per_month','per_campaign'] as $unit)
                            <option value="{{ $unit }}" {{ old('price_unit', $rateCard->price_unit) === $unit ? 'selected' : '' }}>
                                {{ str_replace('_', ' ', ucfirst($unit)) }}
                            </option>
                        @endforeach
                    </select>
                </div>
                <div>
                    <label class="block text-sm font-semibold text-gray-700 mb-1">Sort Order</label>
                    <input type="number" name="sort_order" value="{{ old('sort_order', $rateCard->sort_order) }}"
                           class="input-soft" min="0">
                </div>
            </div>
            <div class="flex flex-col gap-2 pt-1">
                <label class="flex items-center gap-3 cursor-pointer py-1">
                    <input type="checkbox" name="is_negotiable" value="1"
                           {{ old('is_negotiable', $rateCard->is_negotiable) ? 'checked' : '' }}
                           class="w-4 h-4 accent-yellow-400">
                    <span class="text-sm text-gray-600">Price is negotiable</span>
                </label>
                <label class="flex items-center gap-3 cursor-pointer py-1">
                    <input type="checkbox" name="is_active" value="1"
                           {{ old('is_active', $rateCard->is_active) ? 'checked' : '' }}
                           class="w-4 h-4 accent-green-400">
                    <span class="text-sm text-gray-600">Active (show on public page)</span>
                </label>
            </div>
            <div class="flex flex-col sm:flex-row gap-3 pt-1">
                <button type="submit" class="btn-sakura flex-1 py-3">💾 Save Changes</button>
                <a href="{{ route('rate-cards.index') }}"
                   class="flex-1 py-3 text-center rounded-full border border-pink-200 text-gray-600 hover:bg-pink-50 font-semibold text-sm">
                    Cancel
                </a>
            </div>
        </form>
    </div>
</div>
@endsection