@extends('layouts.app')
@section('title', 'Settings')

@php
    $otpChannels = old('otp_channels', explode(',', $settings['otp_channels']));
    $hostChannels = old('notify_host_channels', array_filter(explode(',', $settings['notify_host_channels'])));
    $driver = old('sms_driver', $settings['sms_driver']);
@endphp

@section('content')
<div class="row g-3">
    <div class="col-lg-8">
        <form method="POST" action="{{ route('settings.update') }}" novalidate>
            @csrf @method('PUT')
            <div class="card mb-3">
                <div class="card-header bg-white fw-semibold"><i class="bi bi-building"></i> General &amp; OTP</div>
                <div class="card-body row g-3">
                    <div class="col-md-12">
                        <label class="form-label" for="company_name">Company name</label>
                        <input type="text" id="company_name" name="company_name" value="{{ old('company_name', $settings['company_name']) }}" class="form-control @error('company_name') is-invalid @enderror">
                        @error('company_name')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>
                    <div class="col-md-4">
                        <label class="form-label" for="otp_length">OTP length (digits)</label>
                        <input type="number" id="otp_length" name="otp_length" min="4" max="8" value="{{ old('otp_length', $settings['otp_length']) }}" class="form-control @error('otp_length') is-invalid @enderror">
                        @error('otp_length')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>
                    <div class="col-md-8">
                        <label class="form-label" for="otp_expiry_minutes">OTP validity (minutes)</label>
                        <input type="number" id="otp_expiry_minutes" name="otp_expiry_minutes" min="5" max="10080" value="{{ old('otp_expiry_minutes', $settings['otp_expiry_minutes']) }}" class="form-control @error('otp_expiry_minutes') is-invalid @enderror">
                        <div class="form-text">Counted from the scheduled time (or from issue time for walk-ins / past times).</div>
                        @error('otp_expiry_minutes')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>
                    <div class="col-md-6">
                        <label class="form-label d-block">Send visitor OTP via</label>
                        @foreach (['sms' => 'SMS', 'email' => 'Email'] as $k => $label)
                            <div class="form-check form-check-inline">
                                <input class="form-check-input" type="checkbox" name="otp_channels[]" value="{{ $k }}" id="otp_{{ $k }}" @checked(in_array($k, $otpChannels))>
                                <label class="form-check-label" for="otp_{{ $k }}">{{ $label }}</label>
                            </div>
                        @endforeach
                        @error('otp_channels')<div class="text-danger small">{{ $message }}</div>@enderror
                    </div>
                    <div class="col-md-6">
                        <label class="form-label d-block">Alert hosts via (in addition to in-app)</label>
                        @foreach (['sms' => 'SMS', 'email' => 'Email'] as $k => $label)
                            <div class="form-check form-check-inline">
                                <input class="form-check-input" type="checkbox" name="notify_host_channels[]" value="{{ $k }}" id="host_{{ $k }}" @checked(in_array($k, $hostChannels))>
                                <label class="form-check-label" for="host_{{ $k }}">{{ $label }}</label>
                            </div>
                        @endforeach
                    </div>
                </div>
            </div>

            <div class="card mb-3">
                <div class="card-header bg-white fw-semibold"><i class="bi bi-phone"></i> SMS provider</div>
                <div class="card-body row g-3">
                    <div class="col-12">
                        <label class="form-label" for="sms_driver">Driver</label>
                        <select id="sms_driver" name="sms_driver" class="form-select">
                            <option value="log" @selected($driver === 'log')>Log only (no credentials — record messages in SMS/Email Logs)</option>
                            <option value="twilio" @selected($driver === 'twilio')>Twilio</option>
                            <option value="http" @selected($driver === 'http')>Generic HTTP gateway (JSON POST)</option>
                        </select>
                    </div>
                    <div class="col-12 driver-twilio">
                        <div class="row g-3">
                            <div class="col-md-4">
                                <label class="form-label" for="twilio_sid">Account SID</label>
                                <input type="text" id="twilio_sid" name="twilio_sid" value="{{ old('twilio_sid', $settings['twilio_sid']) }}" class="form-control @error('twilio_sid') is-invalid @enderror">
                                @error('twilio_sid')<div class="invalid-feedback">{{ $message }}</div>@enderror
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" for="twilio_token">Auth token</label>
                                <input type="password" id="twilio_token" name="twilio_token" class="form-control" placeholder="{{ $settings['twilio_token'] ? '•••••• (saved)' : '' }}" autocomplete="new-password">
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" for="twilio_from">From number</label>
                                <input type="text" id="twilio_from" name="twilio_from" value="{{ old('twilio_from', $settings['twilio_from']) }}" class="form-control @error('twilio_from') is-invalid @enderror" placeholder="+15550001111">
                                @error('twilio_from')<div class="invalid-feedback">{{ $message }}</div>@enderror
                            </div>
                        </div>
                    </div>
                    <div class="col-12 driver-http">
                        <div class="row g-3">
                            <div class="col-12">
                                <label class="form-label" for="sms_http_url">Gateway URL</label>
                                <input type="url" id="sms_http_url" name="sms_http_url" value="{{ old('sms_http_url', $settings['sms_http_url']) }}" class="form-control @error('sms_http_url') is-invalid @enderror" placeholder="https://sms.example.com/api/send">
                                <div class="form-text">Receives a JSON POST with <code>api_key</code>, <code>sender</code>, <code>to</code>, <code>message</code>.</div>
                                @error('sms_http_url')<div class="invalid-feedback">{{ $message }}</div>@enderror
                            </div>
                            <div class="col-md-6">
                                <label class="form-label" for="sms_http_api_key">API key</label>
                                <input type="password" id="sms_http_api_key" name="sms_http_api_key" class="form-control" placeholder="{{ $settings['sms_http_api_key'] ? '•••••• (saved)' : '' }}" autocomplete="new-password">
                            </div>
                            <div class="col-md-6">
                                <label class="form-label" for="sms_http_sender">Sender ID</label>
                                <input type="text" id="sms_http_sender" name="sms_http_sender" value="{{ old('sms_http_sender', $settings['sms_http_sender']) }}" class="form-control">
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="card mb-3">
                <div class="card-header bg-white fw-semibold"><i class="bi bi-envelope"></i> Email</div>
                <div class="card-body">
                    <div class="form-check form-switch mb-2">
                        <input class="form-check-input" type="checkbox" role="switch" id="email_enabled" name="email_enabled" value="1" @checked(old('email_enabled', $settings['email_enabled']) == '1')>
                        <label class="form-check-label" for="email_enabled">Send emails</label>
                    </div>
                    <div class="small text-muted">
                        Current mailer: <code>{{ $mailer }}</code>.
                        @if (in_array($mailer, ['log', 'array']))
                            Emails are written to <code>storage/logs/laravel.log</code> and SMS/Email Logs. To deliver real email set <code>MAIL_MAILER=smtp</code> and the <code>MAIL_*</code> values in <code>.env</code>, then run <code>php artisan config:clear</code>.
                        @else
                            Emails are delivered through SMTP settings in <code>.env</code>.
                        @endif
                    </div>
                </div>
            </div>

            <div class="card mb-3">
                <div class="card-header bg-white fw-semibold"><i class="bi bi-shield-exclamation"></i> Duress code</div>
                <div class="card-body row g-3">
                    <div class="col-12 small text-muted">
                        A guard who is being forced to let someone in types this code into <strong>Verify OTP</strong>. The screen shows the normal
                        "Invalid OTP" message while admins are alerted silently by in-app notification, SMS and email.
                        Use the same number of digits as the OTP so it looks like any other code, and share it only with security staff.
                    </div>
                    <div class="col-md-6">
                        <label class="form-label" for="duress_code">Duress code</label>
                        <input type="password" id="duress_code" name="duress_code" inputmode="numeric" class="form-control @error('duress_code') is-invalid @enderror" placeholder="{{ $settings['duress_code'] ? '•••••• (saved)' : 'Not set' }}" autocomplete="new-password">
                        @error('duress_code')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>
                    @if ($settings['duress_code'])
                        <div class="col-md-6 d-flex align-items-end">
                            <div class="form-check">
                                <input class="form-check-input" type="checkbox" id="duress_code_clear" name="duress_code_clear" value="1">
                                <label class="form-check-label" for="duress_code_clear">Turn off the duress code</label>
                            </div>
                        </div>
                    @endif
                </div>
            </div>

            <div class="text-end"><button class="btn btn-primary"><i class="bi bi-save"></i> Save settings</button></div>
        </form>
    </div>

    <div class="col-lg-4">
        <div class="card">
            <div class="card-header bg-white fw-semibold"><i class="bi bi-send-check"></i> Send a test message</div>
            <div class="card-body">
                <form method="POST" action="{{ route('settings.test') }}">
                    @csrf
                    <div class="mb-2">
                        <select name="channel" class="form-select">
                            <option value="sms">SMS</option>
                            <option value="email">Email</option>
                        </select>
                    </div>
                    <div class="mb-2">
                        <input type="text" name="recipient" class="form-control @error('recipient') is-invalid @enderror" placeholder="Phone or email" required>
                        @error('recipient')<div class="invalid-feedback">{{ $message }}</div>@enderror
                    </div>
                    <button class="btn btn-outline-primary w-100">Send test</button>
                </form>
                <div class="small text-muted mt-2">Save settings first. The result appears in <a href="{{ route('notification-logs.index') }}">SMS / Email Logs</a>.</div>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script nonce="{{ Vite::cspNonce() }}">
    (function () {
        const sel = document.getElementById('sms_driver');
        const toggle = () => {
            document.querySelector('.driver-twilio').classList.toggle('d-none', sel.value !== 'twilio');
            document.querySelector('.driver-http').classList.toggle('d-none', sel.value !== 'http');
        };
        sel.addEventListener('change', toggle);
        toggle();
    })();
</script>
@endpush