@extends('layouts.app')
@section('title', __('Email Settings'))
@section('page-title', __('Email Settings'))
@section('page-subtitle', __('SMTP / BREVO / SendGrid configuration & test send.'))

@section('content')
@include('super-admin._nav')

<div x-data="{
    presets: {{ json_encode($presets) }},
    apply(name) {
        if (!this.presets[name]) return;
        document.querySelector('[name=host]').value = this.presets[name].host;
        document.querySelector('[name=port]').value = this.presets[name].port;
        document.querySelector('[name=encryption]').value = this.presets[name].encryption;
    }
}" class="space-y-6">

    {{-- Quick presets --}}
    <section class="card card-pad">
        <h2 class="text-base font-semibold mb-3">{{ __('Quick presets') }}</h2>
        <div class="flex flex-wrap gap-2">
            @foreach($presets as $name => $cfg)
                <button type="button" @click="apply('{{ $name }}')"
                        class="px-3 py-1.5 rounded-lg text-sm bg-slate-100 dark:bg-slate-800 hover:bg-brand-50 hover:text-brand-700 dark:hover:bg-brand-900/30 transition">
                    {{ ucfirst($name) }}
                </button>
            @endforeach
        </div>
    </section>

    <form method="POST" action="{{ route('super-admin.email.update') }}" class="grid grid-cols-1 lg:grid-cols-3 gap-6">
        @csrf

        <section class="card card-pad lg:col-span-2 space-y-5">
            <h2 class="text-base font-semibold">{{ __('Outgoing mail (SMTP)') }}</h2>

            <div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
                <div>
                    <label class="form-label">{{ __('Driver') }}</label>
                    <select name="driver" class="form-select">
                        @foreach(['smtp' => 'SMTP', 'log' => 'Log (debug)', 'array' => 'Array (test)'] as $v => $l)
                            <option value="{{ $v }}" @selected(old('driver', $settings['driver'] ?? 'smtp') === $v)>{{ $l }}</option>
                        @endforeach
                    </select>
                </div>
                <div>
                    <label class="form-label">{{ __('Encryption') }}</label>
                    <select name="encryption" class="form-select">
                        @foreach(['tls' => 'TLS', 'ssl' => 'SSL', 'none' => __('None')] as $v => $l)
                            <option value="{{ $v }}" @selected(old('encryption', $settings['encryption'] ?? 'tls') === $v)>{{ $l }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="sm:col-span-2">
                    <label class="form-label">{{ __('Host') }}</label>
                    <input name="host" value="{{ old('host', $settings['host'] ?? '') }}" class="form-input" placeholder="smtp-relay.brevo.com">
                </div>
                <div>
                    <label class="form-label">{{ __('Port') }}</label>
                    <input type="number" name="port" value="{{ old('port', $settings['port'] ?? 587) }}" class="form-input">
                </div>
                <div>
                    <label class="form-label">{{ __('Username') }}</label>
                    <input name="username" value="{{ old('username', $settings['username'] ?? '') }}" class="form-input" autocomplete="off">
                </div>
                <div class="sm:col-span-2">
                    <label class="form-label">{{ __('Password / API key') }}</label>
                    <input type="password" name="password" class="form-input" autocomplete="new-password"
                           placeholder="{{ !empty($settings['password']) ? '••••••••  ('.__('saved').')' : '' }}">
                    <p class="text-xs text-slate-500 mt-1">{{ __('Leave blank to keep the current value.') }}</p>
                </div>
                <div>
                    <label class="form-label">{{ __('From address') }}</label>
                    <input type="email" name="from_address" value="{{ old('from_address', $settings['from_address'] ?? '') }}" class="form-input">
                </div>
                <div>
                    <label class="form-label">{{ __('From name') }}</label>
                    <input name="from_name" value="{{ old('from_name', $settings['from_name'] ?? config('platform.name')) }}" class="form-input">
                </div>
            </div>

            <div class="flex justify-end">
                <button class="btn-primary"><x-icon name="check" class="w-4 h-4"/> {{ __('Save') }}</button>
            </div>
        </section>

        <aside class="card card-pad space-y-4 h-fit">
            <h2 class="text-base font-semibold">{{ __('Send test email') }}</h2>
            <p class="text-sm text-slate-500 dark:text-slate-400">{{ __('Sends a test using the saved configuration.') }}</p>
        </aside>
    </form>

    {{-- Test --}}
    <form method="POST" action="{{ route('super-admin.email.test') }}" class="card card-pad flex flex-col sm:flex-row gap-3 items-end">
        @csrf
        <div class="flex-1 w-full">
            <label class="form-label">{{ __('Recipient') }}</label>
            <input type="email" name="to" required class="form-input" placeholder="you@example.com">
            @error('to')<p class="form-error">{{ $message }}</p>@enderror
        </div>
        <button class="btn-secondary"><x-icon name="mail" class="w-4 h-4"/> {{ __('Send test email') }}</button>
    </form>
</div>
@endsection