@extends('admin.layouts.app')

@section('title', t('admin.mail_templates.title'))
@section('page_title', t('admin.mail_templates.title'))

@section('content')
<div class="space-y-6">
    @if(session('success'))
        <div class="bg-green-50 border border-green-200 text-green-700 px-4 py-3 rounded-md text-sm">{{ session('success') }}</div>
    @endif

    @forelse($grouped as $key => $templates)
        <div class="bg-white rounded-lg shadow-sm p-6" x-data="{ open: false }">
            <div class="flex items-center justify-between cursor-pointer" @click="open = !open">
                <h3 class="text-sm font-semibold text-gray-800">{{ $key }}</h3>
                <svg class="w-5 h-5 text-gray-400 transition-transform" :class="{ 'rotate-180': open }" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"/>
                </svg>
            </div>
            <div x-show="open" x-cloak class="mt-4 space-y-4">
                @foreach($templates as $tpl)
                    <form method="POST" action="{{ route('admin.mail-templates.update', $tpl) }}" class="border border-gray-200 rounded-lg p-4">
                        @csrf
                        @method('PUT')
                        <div class="flex items-center gap-2 mb-3">
                            <span class="text-xs bg-blue-100 text-blue-700 px-2 py-0.5 rounded">{{ $tpl->locale_code }}</span>
                            <label class="flex items-center gap-1 text-xs text-gray-500">
                                <input type="checkbox" name="is_active" value="1" {{ $tpl->is_active ? 'checked' : '' }} class="rounded border-gray-300 text-blue-600">
                                {{ t('admin.mail_templates.active') }}
                            </label>
                        </div>
                        <div class="mb-3">
                            <label class="block text-sm font-medium text-gray-700 mb-1">{{ t('admin.mail_templates.subject') }}</label>
                            <input type="text" name="subject" value="{{ $tpl->subject }}" class="w-full border border-gray-300 rounded-md px-3 py-2 text-sm" required>
                        </div>
                        <div class="mb-3">
                            <label class="block text-sm font-medium text-gray-700 mb-1">{{ t('admin.mail_templates.body') }}</label>
                            <textarea name="body" rows="6" class="w-full border border-gray-300 rounded-md px-3 py-2 text-sm font-mono" required>{{ $tpl->body }}</textarea>
                        </div>
                        @if($tpl->placeholders)
                            <p class="text-xs text-gray-400 mb-3">{{ t('admin.mail_templates.placeholders') }}: {{ implode(', ', $tpl->placeholders) }}</p>
                        @endif
                        <button type="submit" class="bg-blue-600 text-white px-3 py-1.5 rounded-md text-sm font-medium hover:bg-blue-700">{{ t('admin.common.save') }}</button>
                    </form>
                @endforeach
            </div>
        </div>
    @empty
        <div class="bg-white rounded-lg shadow-sm p-8 text-center text-gray-500 text-sm">{{ t('admin.mail_templates.no_templates') }}</div>
    @endforelse
</div>
@endsection