{{--
    Application Settings — one form, five tabs, one Save.

    Every tab's fields live in the same <form> and post together to
    settings.update: a master editing Company has no reason to lose an
    in-progress edit to Notifications made in the same sitting. The tabs are
    pure client-side navigation (Bootstrap's Tab plugin, already bundled) —
    with JavaScript off every field is still in the DOM and the page is one
    long scroll instead of five short ones, which still works.
--}}
@extends('layouts.app')

@section('title', 'Settings')

@section('content')
    <x-page-header title="Settings" subtitle="Business configuration a master can change without a deploy." />

    @php
        $warrantyRecipients = implode("\n", $settings['warranty_alert_recipients'] ?? []);
    @endphp

    <form method="POST" action="{{ route('settings.update') }}" enctype="multipart/form-data" novalidate>
        @csrf
        @method('PUT')

        <ul class="nav nav-tabs ams-no-print" id="settingsTabs" role="tablist">
            <li class="nav-item" role="presentation">
                <button class="nav-link active" id="tab-company-btn" data-bs-toggle="tab" data-bs-target="#tab-company" type="button" role="tab" aria-controls="tab-company" aria-selected="true">
                    Company
                </button>
            </li>
            <li class="nav-item" role="presentation">
                <button class="nav-link" id="tab-general-btn" data-bs-toggle="tab" data-bs-target="#tab-general" type="button" role="tab" aria-controls="tab-general" aria-selected="false">
                    System Preferences
                </button>
            </li>
            <li class="nav-item" role="presentation">
                <button class="nav-link" id="tab-assets-btn" data-bs-toggle="tab" data-bs-target="#tab-assets" type="button" role="tab" aria-controls="tab-assets" aria-selected="false">
                    Assets &amp; Imports
                </button>
            </li>
            <li class="nav-item" role="presentation">
                <button class="nav-link" id="tab-notifications-btn" data-bs-toggle="tab" data-bs-target="#tab-notifications" type="button" role="tab" aria-controls="tab-notifications" aria-selected="false">
                    Notifications
                </button>
            </li>
            <li class="nav-item" role="presentation">
                <button class="nav-link" id="tab-security-btn" data-bs-toggle="tab" data-bs-target="#tab-security" type="button" role="tab" aria-controls="tab-security" aria-selected="false">
                    Security
                </button>
            </li>
        </ul>

        <div class="tab-content ams-tab-content">
            {{-- ----------------------------------------------------- Company --}}
            <div class="tab-pane fade show active" id="tab-company" role="tabpanel" aria-labelledby="tab-company-btn">
                <x-panel title="Company Information">
                    <div class="row g-3">
                        <div class="col-md-6">
                            <x-form.input name="company_name" label="Company Name" :value="$settings['company_name'] ?? null" required />
                        </div>
                        <div class="col-md-3">
                            <x-form.input name="contact_email" label="Contact Email" type="email" :value="$settings['contact_email'] ?? null" />
                        </div>
                        <div class="col-md-3">
                            <x-form.input name="contact_phone" label="Contact Phone" :value="$settings['contact_phone'] ?? null" />
                        </div>
                        <div class="col-12">
                            <x-form.textarea name="company_address" label="Company Address" :value="$settings['company_address'] ?? null" :rows="3"
                                help="Printed on exported reports. Written exactly as entered, line breaks included." />
                        </div>
                    </div>
                </x-panel>

                <x-panel title="Company Logo" subtitle="Shown in the sidebar in place of the default mark.">
                    <div class="d-flex align-items-center gap-3 mb-3">
                        @if ($settings['company_logo'] ?? null)
                            <img src="{{ Illuminate\Support\Facades\Storage::disk('public')->url($settings['company_logo']) }}"
                                 alt="Current company logo" class="ams-settings-logo-preview">
                        @else
                            <span class="ams-tile ams-tile--lg ams-tile--secondary" aria-hidden="true">
                                <i class="bi bi-image"></i>
                            </span>
                        @endif

                        <div class="min-width-0">
                            <x-form.file name="company_logo" label="Replace logo" accept=".png,.jpg,.jpeg,.svg" help="PNG, JPG or SVG, up to 2 MB." />
                        </div>
                    </div>

                    @if ($settings['company_logo'] ?? null)
                        <x-form.checkbox name="remove_company_logo" label="Remove the current logo and use the default mark" />
                    @endif
                </x-panel>
            </div>

            {{-- ------------------------------------------------ System Preferences --}}
            <div class="tab-pane fade" id="tab-general" role="tabpanel" aria-labelledby="tab-general-btn">
                <x-panel title="System Preferences">
                    <div class="row g-3">
                        <div class="col-md-6">
                            <x-form.input name="application_name" label="Application Name" :value="$settings['application_name'] ?? null" required
                                help="Shown in the browser title bar and the topbar." />
                        </div>
                        <div class="col-md-3">
                            <x-form.input name="default_currency" label="Currency" :value="$settings['default_currency'] ?? null" required
                                help="3-letter ISO code, e.g. INR." />
                        </div>
                        <div class="col-md-3">
                            <x-form.input name="pagination_per_page" label="Rows Per Page" type="number" :value="$settings['pagination_per_page'] ?? null" required />
                        </div>
                        <div class="col-md-4">
                            <x-form.input name="date_format" label="Date Format" :value="$settings['date_format'] ?? null" required
                                help="PHP date format, e.g. d M Y." />
                        </div>
                        <div class="col-md-4">
                            <x-form.input name="datetime_format" label="Date & Time Format" :value="$settings['datetime_format'] ?? null" required
                                help="PHP date format, e.g. d M Y, H:i." />
                        </div>
                        <div class="col-md-4">
                            <x-form.select name="timezone" label="Timezone" :options="$timezoneOptions" :selected="$settings['timezone'] ?? null" required
                                help="Governs every timestamp computed from the moment this is saved." />
                        </div>
                    </div>
                </x-panel>
            </div>

            {{-- --------------------------------------------------- Assets & Imports --}}
            <div class="tab-pane fade" id="tab-assets" role="tabpanel" aria-labelledby="tab-assets-btn">
                <x-panel title="Asset Tags" subtitle="Changes apply to the next asset created — existing tags are never rewritten.">
                    <div class="row g-3">
                        <div class="col-md-4">
                            <x-form.input name="asset_tag_prefix" label="Asset Tag Prefix" :value="$settings['asset_tag_prefix'] ?? null" required
                                help="e.g. AUM in AUM-LAP-0042." />
                        </div>
                        <div class="col-md-4">
                            <x-form.select name="asset_tag_scope" label="Numbering" required
                                :options="['per_category' => 'Restart per category', 'global' => 'Run globally']"
                                :selected="$settings['asset_tag_scope'] ?? null" />
                        </div>
                        <div class="col-md-4">
                            <x-form.input name="asset_tag_sequence_padding" label="Number Length" type="number" :value="$settings['asset_tag_sequence_padding'] ?? null" required
                                help="Digits the sequence is padded to." />
                        </div>
                    </div>
                </x-panel>

                <x-panel title="Import Settings">
                    <x-form.input name="import_max_rows" label="Import Row Cap" type="number" :value="$settings['import_max_rows'] ?? null" required
                        help="Maximum data rows accepted in one bulk-import file. Imports run synchronously — a very high cap risks a timeout on shared hosting." />
                </x-panel>
            </div>

            {{-- ---------------------------------------------------- Notifications --}}
            <div class="tab-pane fade" id="tab-notifications" role="tabpanel" aria-labelledby="tab-notifications-btn">
                <x-panel title="Warranty Reminder Settings" subtitle="The daily digest email — see App\Console\Commands\SendWarrantyExpiryDigest.">
                    <x-form.checkbox name="enable_warranty_emails" label="Send the daily warranty expiry digest"
                        :checked="(bool) ($settings['enable_warranty_emails'] ?? false)" />

                    <div class="row g-3 mt-1">
                        <div class="col-md-6">
                            <x-form.input name="warranty_alert_days" label="Alert Windows (days before expiry)"
                                :value="implode(', ', $settings['warranty_alert_days'] ?? [30, 15, 7])"
                                help="Comma-separated, e.g. 30, 15, 7." required />
                        </div>
                        <div class="col-md-6">
                            <x-form.textarea name="warranty_alert_recipients" label="Recipients" :rows="3"
                                :value="$warrantyRecipients"
                                help="One email per line, or comma-separated." />
                        </div>
                    </div>
                </x-panel>

                <x-panel title="Email Configuration" subtitle="The From header on outgoing mail. SMTP connection details stay in the server's .env file.">
                    <div class="row g-3">
                        <div class="col-md-6">
                            <x-form.input name="mail_from_name" label="From Name" :value="$settings['mail_from_name'] ?? null" />
                        </div>
                        <div class="col-md-6">
                            <x-form.input name="mail_from_address" label="From Address" type="email" :value="$settings['mail_from_address'] ?? null" />
                        </div>
                    </div>
                </x-panel>
            </div>

            {{-- -------------------------------------------------------- Security --}}
            <div class="tab-pane fade" id="tab-security" role="tabpanel" aria-labelledby="tab-security-btn">
                <x-panel title="Security">
                    <div class="row g-3">
                        <div class="col-md-6">
                            <x-form.input name="password_min_length" label="Minimum Password Length" type="number" :value="$settings['password_min_length'] ?? null" required
                                help="Cannot be set below the configured floor of 10." />
                        </div>
                        <div class="col-md-6">
                            <x-form.input name="audit_retention_months" label="Audit Log Retention (months)" type="number" :value="$settings['audit_retention_months'] ?? null" required
                                help="Routine entries older than this are pruned weekly. Custody events (assigned/returned/renewed) are always kept." />
                        </div>
                    </div>
                </x-panel>
            </div>
        </div>

        <div class="ams-form-actions">
            <button type="submit" class="btn btn-primary">
                <i class="bi bi-check2" aria-hidden="true"></i>Save Changes
            </button>
        </div>
    </form>
@endsection
