@extends('layouts.app')

@section('title', 'SMS Templates')

@section('content')
@include('super-admin.partials.nav')

<x-page-header title="SMS Templates" subtitle="System and custom outbound SMS templates" icon="messages" icon-color="cyan">
    <x-slot:actions>
        <a href="{{ route('super-admin.sms.index') }}" class="btn-secondary btn-sm">Back to SMS Center</a>
    </x-slot:actions>
</x-page-header>

<div class="grid lg:grid-cols-2 gap-6">
    <form method="POST" action="{{ route('super-admin.sms.templates.store') }}" class="glass-card p-5 space-y-4">
        @csrf
        <h3 class="font-semibold">Create template</h3>
        <div>
            <label class="field-label">Name</label>
            <input type="text" name="name" class="field-input" value="{{ old('name') }}" required>
        </div>
        <div>
            <label class="field-label">Slug</label>
            <input type="text" name="slug" class="field-input" value="{{ old('slug') }}" required>
        </div>
        <div>
            <label class="field-label">Body</label>
            <textarea name="body" rows="4" class="field-input" required>{{ old('body') }}</textarea>
            <p class="text-xs text-themed-muted mt-1">Variables: @{{name}}, @{{company_name}}, @{{app_name}}</p>
        </div>
        <label class="flex items-center gap-2 text-sm"><input type="checkbox" name="is_active" value="1" class="rounded border-themed" checked> Active</label>
        <button type="submit" class="btn-primary btn-sm">Create</button>
    </form>

    <div class="space-y-4">
        @foreach ($templates as $template)
            <form method="POST" action="{{ route('super-admin.sms.templates.update', $template) }}" class="glass-card p-5 space-y-3">
                @csrf
                @method('PUT')
                <div class="flex items-center justify-between gap-2">
                    <p class="font-semibold">{{ $template->name }}</p>
                    <span class="badge-neutral text-xs">{{ $template->slug }}@if($template->is_system) · system @endif</span>
                </div>
                <input type="text" name="name" class="field-input" value="{{ old('name', $template->name) }}" required>
                <textarea name="body" rows="3" class="field-input" required>{{ old('body', $template->body) }}</textarea>
                <label class="flex items-center gap-2 text-sm"><input type="checkbox" name="is_active" value="1" class="rounded border-themed" @checked($template->is_active)> Active</label>
                <button type="submit" class="btn-secondary btn-sm">Save</button>
            </form>
        @endforeach
    </div>
</div>
@endsection